💸 티태 | 티끌모아 부자되기 💸

🖥️ 프로젝트 개요

티끌모아 부자될 때 까지 함께 동행하는 가계부 자산 관리 플랫폼, 티태

단순한 가계부가 아닌, 미션 기반으로 소비 습관을 개선하는 챌린지형 자산관리 앱

• 가계부 기록에 경험치와 칭호 보상 시스템
• 챗봇과 통계로 사용자 맞춤 소비 피드백 제공
• 미션을 통해 절약을 챌린지처럼 즐기기
• 합리적 소비처를 알려주는 갓플(God Place) 기능
• 배포 URL: https://titae.vercel.app/

📆 개발 기간

2025.06.30 ~ 2025.07.31

🧑‍💻 프로젝트 팀원

이지윤	이현우	정지유	조정우	최연서
@wowlha	@manto123123123	@JINJIYU23	@mafornp	@CHOIYEONSEO

⚙ 기술 스택

Stack	Badge
Frontend
State Management
Data Fetching
Version Control
Co-Working Tool
Release Tool

🤖 역할 분담

이지윤

---

UI

• 헤더 퍼블리싱
• 전체 레이아웃 퍼블리싱
• 가계부 페이지 구성

기능

• 가계부 등록 / 수정 / 삭제
• 월간 가계부 내역 캘린더 출력
• 총수입, 총지출 출력
• 미로그인 유저 로그인 페이지로 리다이렉트
• 일별 가계부 내역 조회
• 네이버 OCR 연동 영수증 자동 입력
• gemini를 활용한 가계부 AI 챗봇

디자인

• Figma를 활용한 UI 디자인 및 기능 기획

ETC

• PO

이현우

---

UI

• 로그인/회원가입 페이지 구현
• 로그인 전 메인페이지 구현
• 스켈레톤 로딩, 다크모드, 반응형 레이아웃 구현

기능

• 로그인 및 회원가입 시스템 구현
  • 이메일/비밀번호 로그인: 사용자 입력값 유효성 검증 및 상태 관리(Zustand) 적용
  • 회원가입 로직 구현: 실명, 닉네임 중복 검사, 비밀번호 조건 검사, 이용약관 동의 등 단계별 유효성 처리
  • 이메일 인증 기능 구현: 인증 코드 발송/검증 로직 구현 및 사용자 피드백 처리 (toast, 에러메시지 등)
  • Zustand를 활용한 authStore, titleStore 등 상태관리 구현
  • 로그인 시 사용자 프로필 및 칭호 정보 API 호출 및 상태 반영 처리
• 메인페이지 구현
  • 비회원 메인 페이지: 절약 금액 통계, 챌린지 랭킹, 커뮤니티 소개, 챗봇 안내 등 다양한 섹션 구성
  • 프론트 애니메이션 효과 적용 (framer-motion)
  • CountUp.js로 절약 금액 시각화
  • 회원 전용 메인 페이지: 사용자의 닉네임 기반 통계 분석, 프로필 및 칭호 정보, 챌린지 진행 현황 표시

기획 및 디자인

• 전체 서비스 기획 참여
• Figma를 활용한 UI 설계 및 디자인

🍄 정지유

---

UI

• 유저페이지 구성
• 예외 처리 페이지 구성
• 스켈레톤과 다크모드 구현, 반응형 UI 구현

기능

• 마이 프로필 / 다른 유저 프로필

  • Next.js 14 App Router의 동적 라우팅 ([memberId])
  • Zustand + TanStack Query 기반 상태 및 서버 데이터 관리

• 프로필 수정 및 탈퇴

  • Cloudinary 연동 이미지 업로드 + 실시간 미리보기
  • Debounced 유효성 검사 + 서버 중복 체크
  • 닉네임, 비밀번호 수정 및 회원 탈퇴 처리

• 목표 설정 및 칭호 장착

  • TitleSwiper 컴포넌트를 통한 칭호 슬라이드 및 장착
  • 서버 상태 반영(refetch), 조건부 렌더링으로 성능 최적화

• 내 활동 (내가 쓴 글/내가 찜한 글/내가 찜한 갓플)

  • 무한 스크롤 (Intersection Observer) + 조건부 Query 활성화
  • 북마크 실시간 동기화 (Optimistic Update)
  • Top 버튼으로 페이지 상단 스크롤 기능

• 비로그인 유저 접근 제한

  • sessionChecked 플래그로 로그인 여부 확인
  • 미로그인 시 로그인 페이지로 리다이렉트

• 다크 모드 및 반응형 UI

  • Tailwind CSS 기반 반응형 및 다크모드 감지
  • Next.js 쿠키로 테마 상태 유지
  • 컴포넌트 단위 스켈레톤 UI 적용

기획 및 디자인

• 전체 서비스 기획 참여
• Figma를 활용한 UI 기획 및 디자인
• 플로우 차트 제작

ETC

• 발표 자료 제작

조정우

---

UI

• 커뮤니티 페이지 구현
• 스켈레톤 로딩, 다크모드, 반응형 레이아웃 구현

기능

• 커뮤니티 구현
  • CRUD(게시글 작성, 목록 , 수정, 삭제)
  • 댓글구현 (댓글작성, 목록, 삭제)
  • 좋아요/ 북마크 기능(낙관적 업데이트)
  • 이미지 업로드 및 미리보기(cloudinary)
  • 무한스크롤
  • 인기글 목록 및 상세

기획 및 디자인

• 전체 서비스 기획 참여
• Figma를 활용한 UI 설계 및 디자인

ETC

• 발표 자료 정리

최연서

---

UI

• 갓플 찾기 페이지 구성 (검색, 필터, 마커, 상세 정보 등)
• 관리자 페이지 구성
• 로그인 후 메인페이지 UI 및 차트 구현(recharts 패키지 사용)
• 스켈레톤 로딩, 다크모드, 반응형 레이아웃 구현

기능

• 갓플 찾기 기능
  • 병렬 라우팅 구조 적용
  • 카카오맵 api 연동 및 마커 커스텀
  • 지역명 검색 및 카테고리 필터 기능 구현
  • 장소 상세 정보 조회 (홈페이지, 전화번호, 카카오맵 링크 연결)
  • 오늘의 인기 검색어 조회 기능 (상하 자동 스크롤 애니메이션 적용)
  • 검색 결과에 따른 다양한 마커 시각화 및 클릭 이벤트 처리
  • 장소 선택 시 예상 최소 금액 계산 기능
  • 갓플 북마크 등록/해제
• 관리자 페이지
  • 오늘의 방문자 수 및 신규 회원 가입자 수 확인 기능
  • 유저 관리 : 전체 유저 조회, 닉네임 검색, 차단, 페이지네이션
  • 장소 관리 : 전체 장소 조회/수정/삭제/추가, 카테고리 검색, 페이지네이션

기획 및 디자인

• 전체 서비스 기획 참여
• Figma를 활용한 UI 설계 및 디자인
• 플로우 차트 및 와이어프레임 제작

📁 폴더 구조

📦src
 ┣ 📂api
 ┃ ┣ 📜accountApi.ts
 ┃ ┣ 📜admin.ts
 ┃ ┣ 📜boardApi.ts
 ┃ ┣ 📜godplaces.ts
 ┃ ┣ 📜notification.ts
 ┃ ┣ 📜profile.ts
 ┃ ┗ 📜supabase.ts
 ┣ 📂app
 ┃ ┣ 📂(sidebar)
 ┃ ┃ ┣ 📂accountbook
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂admin
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂board
 ┃ ┃ ┃ ┣ 📂write
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂[postId]
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂community
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂godplaces
 ┃ ┃ ┃ ┣ 📂[region]
 ┃ ┃ ┃ ┃ ┣ 📂@results
 ┃ ┃ ┃ ┃ ┃ ┣ 📂detail
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┣ 📂@search
 ┃ ┃ ┃ ┃ ┃ ┣ 📜default.tsx
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂profile
 ┃ ┃ ┃ ┣ 📂[memberId]
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┗ 📜layout.tsx
 ┃ ┣ 📂findid
 ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📂findpassword
 ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📂login
 ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📂signup
 ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📜globals.css
 ┃ ┣ 📜layout.tsx
 ┃ ┣ 📜not-found.tsx
 ┃ ┣ 📜page.tsx
 ┃ ┗ 📜_provider.tsx
 ┣ 📂assets
 ┃ ┣ 📂coloredBox
 ┃ ┣ 📂icons
 ┃ ┣ 📂mainpage
 ┣ 📂components
 ┃ ┣ 📂accountbook
 ┃ ┃ ┣ 📜AccountAdd.tsx
 ┃ ┃ ┣ 📜AiChat.tsx
 ┃ ┃ ┣ 📜Calander.tsx
 ┃ ┃ ┣ 📜Calculator.tsx
 ┃ ┃ ┣ 📜CardMenu.tsx
 ┃ ┃ ┣ 📜Category.tsx
 ┃ ┃ ┣ 📜CategoryButton.tsx
 ┃ ┃ ┣ 📜ListArea.tsx
 ┃ ┃ ┣ 📜ListCard.tsx
 ┃ ┃ ┣ 📜ListCardSkeleton.tsx
 ┃ ┃ ┣ 📜MobileCardMenu.tsx
 ┃ ┃ ┣ 📜mobileTitae.tsx
 ┃ ┃ ┣ 📜Page.tsx
 ┃ ┃ ┣ 📜TalkBalloon.tsx
 ┃ ┃ ┣ 📜TiTaeProfile.tsx
 ┃ ┃ ┗ 📜TiTaeTalkBalloon.tsx
 ┃ ┣ 📂admin
 ┃ ┃ ┣ 📜AddModifyModal.tsx
 ┃ ┃ ┣ 📜Button.tsx
 ┃ ┃ ┣ 📜ManageStores.tsx
 ┃ ┃ ┣ 📜ManageUsers.tsx
 ┃ ┃ ┣ 📜StoreCard.tsx
 ┃ ┃ ┣ 📜TodayStats.tsx
 ┃ ┃ ┗ 📜UserCard.tsx
 ┃ ┣ 📂board
 ┃ ┃ ┣ 📜ChallengeSeleteBox.tsx
 ┃ ┃ ┣ 📜CommentList.tsx
 ┃ ┃ ┣ 📜CommunityTab.tsx
 ┃ ┃ ┣ 📜PopularPostList.tsx
 ┃ ┃ ┣ 📜PostItem.tsx
 ┃ ┃ ┣ 📜PostItemSkeleton.tsx
 ┃ ┃ ┣ 📜PostWriteForm.tsx
 ┃ ┃ ┗ 📜TopButton.tsx
 ┃ ┣ 📂common
 ┃ ┃ ┣ 📜AnalysisSkeleton.tsx
 ┃ ┃ ┣ 📜Icon.tsx
 ┃ ┃ ┣ 📜Images.tsx
 ┃ ┃ ┣ 📜MobileMenu.tsx
 ┃ ┃ ┣ 📜Modal.tsx
 ┃ ┃ ┣ 📜NotificationBox.tsx
 ┃ ┃ ┣ 📜ProgressBar.tsx
 ┃ ┃ ┣ 📜SideBar.tsx
 ┃ ┃ ┗ 📜TotalAmount.tsx
 ┃ ┣ 📂findid
 ┃ ┃ ┗ 📜findidbox.tsx
 ┃ ┣ 📂findpassword
 ┃ ┃ ┗ 📜findpassword.tsx
 ┃ ┣ 📂godplaces
 ┃ ┃ ┣ 📂common
 ┃ ┃ ┃ ┗ 📜BookmarkButton.tsx
 ┃ ┃ ┣ 📂detail
 ┃ ┃ ┃ ┣ 📜DetailBox.tsx
 ┃ ┃ ┃ ┣ 📜DetailButton.tsx
 ┃ ┃ ┃ ┣ 📜DetailButtonDiv.tsx
 ┃ ┃ ┃ ┣ 📜DetailCard.tsx
 ┃ ┃ ┃ ┣ 📜DetailCardSkeleton.tsx
 ┃ ┃ ┃ ┣ 📜DetailsItem.tsx
 ┃ ┃ ┃ ┣ 📜DetailTopInfo.tsx
 ┃ ┃ ┃ ┣ 📜FestivalDetails.tsx
 ┃ ┃ ┃ ┣ 📜LibraryDetails.tsx
 ┃ ┃ ┃ ┗ 📜StoreDetails.tsx
 ┃ ┃ ┣ 📂map
 ┃ ┃ ┃ ┣ 📜BeautySalonMarkers.tsx
 ┃ ┃ ┃ ┣ 📜ChineseRestaurantMarkers.tsx
 ┃ ┃ ┃ ┣ 📜CustomMarker.tsx
 ┃ ┃ ┃ ┣ 📜FestivalMarkers.tsx
 ┃ ┃ ┃ ┣ 📜HotelMarkers.tsx
 ┃ ┃ ┃ ┣ 📜JapaneseRestaurantMarkers.tsx
 ┃ ┃ ┃ ┣ 📜KoreanRestaurantMarkers.tsx
 ┃ ┃ ┃ ┣ 📜LaundryMarkers.tsx
 ┃ ┃ ┃ ┣ 📜LibraryMarkers.tsx
 ┃ ┃ ┃ ┣ 📜MapBox.tsx
 ┃ ┃ ┃ ┣ 📜useKaKaoLoader.ts
 ┃ ┃ ┃ ┗ 📜WesternRestaurantMarkers.tsx
 ┃ ┃ ┣ 📂search
 ┃ ┃ ┃ ┣ 📜CategoryBox.tsx
 ┃ ┃ ┃ ┣ 📜CategoryItem.tsx
 ┃ ┃ ┃ ┣ 📜Search.tsx
 ┃ ┃ ┃ ┣ 📜SearchBox.tsx
 ┃ ┃ ┃ ┣ 📜SearchListBox.tsx
 ┃ ┃ ┃ ┣ 📜SearchListCard.tsx
 ┃ ┃ ┃ ┗ 📜SearchListCardSkeleton.tsx
 ┃ ┃ ┣ 📜EstimationBox.tsx
 ┃ ┃ ┣ 📜EstimationContainer.tsx
 ┃ ┃ ┗ 📜HotLocation.tsx
 ┃ ┣ 📂GoogleLoginCallbackPage
 ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📂Googlepage
 ┃ ┃ ┣ 📂google
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┗ 📂googleauth
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📂layout
 ┃ ┃ ┣ 📜box.tsx
 ┃ ┃ ┣ 📜coloredBox.tsx
 ┃ ┃ ┣ 📜LayoutClient.tsx
 ┃ ┃ ┗ 📜splitBox.tsx
 ┃ ┣ 📂login
 ┃ ┃ ┣ 📜GoogleLoginBox.tsx
 ┃ ┃ ┣ 📜loginbox.tsx
 ┃ ┃ ┗ 📜SignupButton.tsx
 ┃ ┣ 📂main
 ┃ ┃ ┣ 📜Analysis.tsx
 ┃ ┃ ┣ 📜AuthorizedMain.tsx
 ┃ ┃ ┣ 📜BarChartClient.tsx
 ┃ ┃ ┣ 📜GoalAnalysis.tsx
 ┃ ┃ ┣ 📜HalfYearAnalysis.tsx
 ┃ ┃ ┣ 📜IconDiv.tsx
 ┃ ┃ ┣ 📜PieChartClient.tsx
 ┃ ┃ ┣ 📜SpendingAnalysis.tsx
 ┃ ┃ ┣ 📜SpendingAnalysisItem.tsx
 ┃ ┃ ┣ 📜SpendingGraph.tsx
 ┃ ┃ ┗ 📜UnAuthorizedMain.tsx
 ┃ ┣ 📂profile
 ┃ ┃ ┣ 📜Button.tsx
 ┃ ┃ ┣ 📜DefaultProfile.tsx
 ┃ ┃ ┣ 📜EditProfile.tsx
 ┃ ┃ ┣ 📜Empty.tsx
 ┃ ┃ ┣ 📜GoalSkeleton.tsx
 ┃ ┃ ┣ 📜Mission.tsx
 ┃ ┃ ┣ 📜MissionSkeleton.tsx
 ┃ ┃ ┣ 📜MissionTabs.tsx
 ┃ ┃ ┣ 📜MyThreads.tsx
 ┃ ┃ ┣ 📜Profile.tsx
 ┃ ┃ ┣ 📜ProfileSkeletion.tsx
 ┃ ┃ ┣ 📜SetGoal.tsx
 ┃ ┃ ┣ 📜SetGoalModal.tsx
 ┃ ┃ ┣ 📜ThreadsTab.tsx
 ┃ ┃ ┣ 📜ThreadsTabSkeleton.tsx
 ┃ ┃ ┣ 📜TitleSwiper.tsx
 ┃ ┃ ┗ 📜TitleSwiperSkeleton.tsx
 ┃ ┗ 📂signup
 ┃ ┃ ┗ 📜signup.tsx
 ┣ 📂css
 ┃ ┣ 📜CustomCalender.css
 ┃ ┣ 📜CustomDatePicker.css
 ┃ ┗ 📜TitleSwiper.module.css
 ┣ 📂data
 ┃ ┣ 📜categories.json
 ┃ ┣ 📜goalData.ts
 ┃ ┣ 📜iconMap.ts
 ┃ ┣ 📜missionData.ts
 ┃ ┗ 📜test.json
 ┣ 📂hooks
 ┃ ┗ 📜useDebounce.ts
 ┣ 📂lib
 ┃ ┣ 📂auth
 ┃ ┃ ┗ 📜useAuthStore.ts
 ┃ ┣ 📂helper
 ┃ ┃ ┣ 📜getGodplaceMarkersByCategory.ts
 ┃ ┃ ┗ 📜getLabel.ts
 ┃ ┗ 📂utils
 ┃ ┃ ┣ 📜convertGodplacesBookmarkType.ts
 ┃ ┃ ┗ 📜getImageUrl.ts
 ┣ 📂services
 ┃ ┣ 📜authService.ts
 ┃ ┗ 📜mainService.ts
 ┣ 📂stores
 ┃ ┣ 📜accountStore.ts
 ┃ ┣ 📜authStore.ts
 ┃ ┣ 📜godplacesStore.ts
 ┃ ┗ 📜titleStore.ts
 ┗ 📂types
 ┃ ┣ 📜admin.ts
 ┃ ┣ 📜boardType.ts
 ┃ ┣ 📜category.ts
 ┃ ┣ 📜godplaces.ts
 ┃ ┣ 📜payData.ts
 ┃ ┗ 📜userType.ts

🔍 주요 기능

메인페이지(비로그인)
- 서비스 사용자의 절약 액수, 20대 평균 지출액과 티태 이용자 평균 지출액 통계그래프 제공 - 티태 상위 사용자 제공 - 티태 주요 서비스 정보 제공

메인페이지(로그인)
- 로그인한 유저 맞춤형 분석 대시보드 제공

로그인 페이지
로그인 페이지

회원가입 페이지
회원가입 페이지

가계부 페이지
- 총수입 총지출 정보 제공 - 달력을 통한 한달간의 일일 수입, 지출 내역 표기 - 일일 가계부 내역 열람 가능 - 네이버 OCR을 통한 가계부 내역 자동 입력 - 가계부 내역 추가, 수정, 삭제 기능 제공 - 가계부 기입 내용을 기반으로 한 AI 챗봇 기능 제공

갓플 페이지
- 서울시 착한가게 검색 서비스 - 카카오맵과 연계되어 가게 위치 지도 서비스 제공 - 해당 가게 상세정보 제공 - 카카오맵 상세정보, 전화 연결 기능 제공

커뮤니티 페이지
- 나만 아는 가게, 챌린지, 자유게시판 탭을 통한 해당 탭의 목적에 맞는 커뮤니티 기능 제공 - 챌린지 기능과 연계된 유저 참여 기능 적용 - 자유 게시판을 통한 유저간의 자유로운 소통 - 인기글 기능을 통한 현재 티태 커뮤니티 트렌드 제공 - 게시글 이미지 삽입 기능

마이 프로필	목표 설정

다른 유저 프로필	획득한 칭호 슬라이드 및 장착 기능

내가 찜한 글 북마크 반영	내가 찜한 갓플 북마크 반영

프로필 이미지 수정	닉네임, 비밀번호 수정

다크모드, 반응형 UI	기능 설명
	- 유저별 프로필 조회 - 내가 쓴 글, 내가 찜한 글, 내가 찜한 갓플 조회 - 획득한 칭호 슬라이드로 확인 - 칭호 장착 기능 - 유저별 목표 조회 및 설정 - 프로필 이미지, 닉네임, 비밀번호 수정 기능 제공 - 유저별 챌린지 목록 조회 - 회원 탈퇴

🎉 프로젝트 후기

• 이지윤
  처음으로 프론트엔드끼리만이 아닌 백엔드 팀원분들과 함께 개발하는 프로젝트로, 백엔드 팀원분들과 소통이 부족하여 어려움을 겪기도 하였습니다. 초반 기획이 뒤집어지며 예정보다 기획과 디자인에 많은 시간이 들어가 개발에 시간이 부족할 것이 우려되었지만 팀원 분들의 많은 노력 덕분에 기한 내에 완성할 수 있었습니다. 백엔드 관련 지식이 없는 탓에 백엔드 팀원분들과 팀장님께서도 많이 답답하셨을 텐데 믿고 함께해주셔서 정말 감사했습니다. 또한 부족한 PO와 함께하며 늦은 시간까지도 기한 내에 개발을 완료하기 위해 같이 밤새가며 작업하신 프론트엔드 팀원분들께도 감사의 인사를 전하고 싶습니다. 이번 프로젝트를 계기로 프로젝트를 진행함에 있어 소통이 중요하다는 것을 다시 한번 깨달을 수 있었고, 팀원 분들께 많은 것을 배우며 함께 성장할 수 있는 계기가 되어 정말 기뻤습니다. 또한 최종 프로젝트를 진행하며 처음으로 진행했던 프로젝트를 돌아볼 기회가 있었는데, 부트캠프를 통해 처음 프론트엔드 개발을 배우기 시작한 시기에 비해 많이 성장했다는 것을 느낄 수 있었습니다. 다시 한번 팀원분들께 감사하다는 말을 전하고 싶습니다.

• 이현우
  처음으로 백엔드와 함께 개발을 진행하다보니 다사다난한 상황도 많았고 다함께 성장하는게 느껴졌습니다. 마지막까지 다들 힘내주셔서 프로젝트 마무리 할 수 있엇습니다.

• 정지유
  프로젝트를 진행하는 동안 우여곡절도 많았지만, 끝까지 해낼 수 있어서 뜻깊은 시간이었습니다. 제공된 API만 사용하는 것이 아니라, 백엔드 팀과 협업하면서 필요한 데이터를 요청하고 수정해 나가는 과정이 쉽지는 않았지만, 마치 실무를 미리 경험해보는 느낌이 들어 뿌듯했습니다. 이번 프로젝트는 Next.js 환경에서 진행되어 SSR과 CSR의 차이를 체감할 수 있었고, 그만큼 프론트엔드 개발에 대한 이해도도 한층 깊어졌습니다. 앞으로도 부족한 부분을 꾸준히 다듬어 더 좋은 개발자로 성장할 수 있도록 노력하겠습니다. 모두 고생 많으셨습니다!

• 조정우
  이번 프로젝트를 통해 초기 기획의 중요성을 깊이 느낄 수 있었으며, 원활한 커뮤니케이션이 프로젝트 전반에 얼마나 큰 영향을 주는지도 함께 경험할 수 있었습니다. 무엇보다도 팀원 모두가 끝까지 힘을 모아준 덕분에 무사히 마무리할 수 있었고, 함께해 준 동료들에게 진심으로 감사드립니다.

• 최연서
  기획을 구체화하고 필요한 기능을 명확히 문서화하는 것이 얼마나 중요한지 절실히 느꼈습니다. 특히 백엔드 및 다른 팀원들과 원활하게 협업하기 위해 소프트 스킬을 고민하고 발전시킬 수 있었던 뜻깊은 시간이었습니다. 백엔드와의 협업 과정에서 목 서버를 활용해 API를 임시로 연동하고, 이후 실제 서버 API와 연결하는 과정을 거치며 Swagger 사용에도 익숙해졌습니다. 또한 개발 전에 API 명세서를 꼼꼼히 확인해 누락된 부분을 미리 점검하면 개발 기간을 줄일 수 있다는 점도 깨달았습니다.

  더불어, 응답 형식이 변경될 경우를 대비해 백엔드 측에 사전 공유를 요청하는 것이 중요하다는 것도 알게 되었고, 이러한 소통이 개발 효율성과 정확도에 큰 영향을 미친다는 것을 체감했습니다. 무엇보다 끝까지 함께한 팀원분들께 감사드립니다. 함께해서 즐겁게 프로젝트 마무리할 수 있었던것 같습니다.