프로젝트 소개

자신의 일대기를 기록하고 다른 사람들과 공유할 수 있는 커뮤니티 사이트입니다.

💡 [ Problem & Solution ]

문제

• SNS의 기능을 갖추고 있으면서 나의 인생 스토리를 시간 흐름에 맞게 기록할 수 있는 플랫폼이 있었으면 좋겠다.

해결

• 타임라인을 도입해서 연도별로 사용자의 기록을 관리할 수 있게 한다. SNS기능을 통해 다른 사람의 프로필과 게시글들을 살펴볼 수 있게 한다.

Members

팀장	팀원	팀원	팀원	팀원
김민우	갈미현	김유리	정충일	신승준

개발 일정

2023.01.09. ~ 2023.01.20.

Tech Stack

💪 언어 & 라이브러리

🔧 도구

폴더 구조

📦src
 ┣ 📂apis
 ┃ ┣ 📜auth.ts
 ┃ ┣ 📜follow.ts
 ┃ ┣ 📜getFollowUser.ts
 ┃ ┣ 📜instance.ts
 ┃ ┣ 📜notification.ts
 ┃ ┣ 📜search.ts
 ┃ ┣ 📜signup.ts
 ┃ ┣ 📜story.ts
 ┃ ┣ 📜userInfo.ts
 ┃ ┗ 📜userList.ts
 ┣ 📂assets
 ┃ ┗ 📂images
 ┃ ┃ ┗ 📜defaultImage.png
 ┣ 📂components
 ┃ ┣ 📂Follow
 ┃ ┃ ┣ 📜FollowEmpty.tsx
 ┃ ┃ ┣ 📜FollowModal.tsx
 ┃ ┃ ┣ 📜FollowerButton.tsx
 ┃ ┃ ┣ 📜FollowingButton.tsx
 ┃ ┃ ┗ 📜FollowingList.tsx
 ┃ ┣ 📂Home
 ┃ ┃ ┣ 📜NoResultBox.tsx
 ┃ ┃ ┣ 📜SearchForm.tsx
 ┃ ┃ ┣ 📜UserList.tsx
 ┃ ┃ ┗ 📜UserProfile.tsx
 ┃ ┣ 📂Message
 ┃ ┃ ┣ 📜MessageBubble.tsx
 ┃ ┃ ┗ 📜MessageInputForm.tsx
 ┃ ┣ 📂Notification
 ┃ ┃ ┣ 📜NotificationButton.tsx
 ┃ ┃ ┣ 📜NotificationList.tsx
 ┃ ┃ ┣ 📜NotificationMsg.tsx
 ┃ ┃ ┣ 📜TabContainer.tsx
 ┃ ┃ ┗ 📜TabItem.tsx
 ┃ ┣ 📂Profile
 ┃ ┃ ┣ 📜ImageForm.tsx
 ┃ ┃ ┣ 📜PasswordForm.tsx
 ┃ ┃ ┣ 📜ProfileModal.tsx
 ┃ ┃ ┗ 📜TextForm.tsx
 ┃ ┣ 📂SignIn
 ┃ ┃ ┣ 📜SignInForm.tsx
 ┃ ┃ ┗ 📜SignInLinks.tsx
 ┃ ┣ 📂SignUp
 ┃ ┃ ┣ 📜SignUpButton.tsx
 ┃ ┃ ┣ 📜SignUpInput.tsx
 ┃ ┃ ┗ 📜SignUpSelector.tsx
 ┃ ┣ 📂Story
 ┃ ┃ ┣ 📜CommentForm.tsx
 ┃ ┃ ┣ 📜CommentList.tsx
 ┃ ┃ ┣ 📜LikeButton.tsx
 ┃ ┃ ┣ 📜StoryComment.tsx
 ┃ ┃ ┗ 📜StoryInfo.tsx
 ┃ ┣ 📂StoryBook
 ┃ ┃ ┣ 📜Empty.tsx
 ┃ ┃ ┣ 📜FollowButton.tsx
 ┃ ┃ ┣ 📜Loading.tsx
 ┃ ┃ ┣ 📜StoriesByYear.tsx
 ┃ ┃ ┣ 📜StoryAddButton.tsx
 ┃ ┃ ┣ 📜StoryBookTitle.tsx
 ┃ ┃ ┗ 📜StoryCard.tsx
 ┃ ┣ 📂StoryEdit
 ┃ ┃ ┣ 📜DatePicker.tsx
 ┃ ┃ ┣ 📜ImageUpload.tsx
 ┃ ┃ ┣ 📜StoryEditForm.tsx
 ┃ ┃ ┗ 📜SubmitButton.tsx
 ┃ ┗ 📂shared
 ┃ ┃ ┣ 📜DarkModeSwitch.tsx
 ┃ ┃ ┣ 📜Header.tsx
 ┃ ┃ ┣ 📜ScrollToTop.tsx
 ┃ ┃ ┗ 📜SignInButton.tsx
 ┣ 📂constants
 ┃ ┣ 📜apiParams.ts
 ┃ ┣ 📜apiUrls.ts
 ┃ ┣ 📜auth.ts
 ┃ ┣ 📜colors.ts
 ┃ ┣ 📜errorMessages.ts
 ┃ ┣ 📜http.ts
 ┃ ┗ 📜routes.ts
 ┣ 📂contexts
 ┃ ┣ 📜DisplayModeContext.tsx
 ┃ ┗ 📜NotificationContext.tsx
 ┣ 📂hooks
 ┃ ┣ 📜useCheckAuthToken.ts
 ┃ ┣ 📜useComment.ts
 ┃ ┣ 📜useDebounce.ts
 ┃ ┣ 📜useFetchStories.ts
 ┃ ┣ 📜useFetchUser.ts
 ┃ ┣ 📜useGetFollow.ts
 ┃ ┣ 📜useGetFollower.ts
 ┃ ┣ 📜useInfiniteScroll.ts
 ┃ ┣ 📜useIntersectionObserver.ts
 ┃ ┣ 📜useIsOverByScroll.ts
 ┃ ┣ 📜useLazyLoadImage.ts
 ┃ ┣ 📜useLike.ts
 ┃ ┣ 📜useSearchForm.ts
 ┃ ┣ 📜useSignInForm.ts
 ┃ ┣ 📜useSignUpForm.ts
 ┃ ┣ 📜useStory.ts
 ┃ ┗ 📜useTimeoutFn.ts
 ┣ 📂interfaces
 ┃ ┣ 📜comment.ts
 ┃ ┣ 📜displayMode.ts
 ┃ ┣ 📜followList.ts
 ┃ ┣ 📜like.ts
 ┃ ┣ 📜message.ts
 ┃ ┣ 📜notification.ts
 ┃ ┣ 📜signUp.ts
 ┃ ┣ 📜story.ts
 ┃ ┗ 📜user.ts
 ┣ 📂pages
 ┃ ┣ 📜404.tsx
 ┃ ┣ 📜Chat.tsx
 ┃ ┣ 📜Home.tsx
 ┃ ┣ 📜Notification.tsx
 ┃ ┣ 📜Profile.tsx
 ┃ ┣ 📜SignIn.tsx
 ┃ ┣ 📜SignUp.tsx
 ┃ ┣ 📜Story.tsx
 ┃ ┣ 📜StoryBook.tsx
 ┃ ┣ 📜StoryEdit.tsx
 ┃ ┗ 📜follow.tsx
 ┣ 📂styles
 ┃ ┗ 📜GlobalStyle.tsx
 ┣ 📂utils
 ┃ ┣ 📜calcCreatedToCurrentTime.ts
 ┃ ┣ 📜getChangedIndex.ts
 ┃ ┣ 📜getF4FId.ts
 ┃ ┣ 📜helpers.ts
 ┃ ┣ 📜setUserListImageFirst.ts
 ┃ ┣ 📜signUpIsValid.ts
 ┃ ┣ 📜signUpValidate.ts
 ┃ ┣ 📜storage.ts
 ┃ ┣ 📜validationSearchForm.ts
 ┃ ┗ 📜validations.ts
 ┣ 📜App.tsx
 ┣ 📜main.tsx
 ┗ 📜vite-env.d.ts