만날우정

만나는 날짜, 우리 정하자

2025.12 -

단체 약속 시 각자의 가능한 날짜를 모아, AI가 모두 참석 가능한 날짜·장소를 자동으로 추천해주는 서비스입니다.

현재 진행 중인 프로젝트입니다. PM 1명, 디자이너 1명, FE 1명, BE 1명으로 구성된 팀에서, 프론트엔드 개발자로 참여하고 있습니다.

💻 기술 스택

Next.js
TypeScript
TailwindCSS
Zustand
React Query
Jest
Playwright

🧩 구현 기능

1. 약속방 생성

  • 스와이퍼 기반의 약속 생성 및 참여 목록 조회 페이지 개발

  • react-hook-form 기반의 폼 및 날짜/장소 선택 컴포넌트 개발

  • 약속 및 내 정보 수정 바텀 시트 개

2. 약속방 초대 및 참여

  • 약속 링크 기반의 공유 기능 개발

  • Kakao.Share을 활용하여 템플릿 메시지 전송 기능 구현

  • 미참여한 사용자에 대한 약속 참여 페이지 개발

3. 약속 조율 - 날짜

  • 날짜별 가능/애매 여부 선택을 통한 투표 기능 구현

  • 날짜별 투표율에 따라 다른 색으로 구분한 투표 조회 캘린더 구현

  • 사용자 이름을 클릭하여 사용자 별 투표 상태 확인 기능 구현

  • 날짜 별 투표 현황 모달 개발

4. 약속 조율 - 장소

  • 장소 투표 기능 개발

  • Kakao Postcode API를 활용한 장소 등록 기능 구현

  • 장소 정보 조회 바텀시트 개발

  • Kakao Maps API를 활용한 장소 지도 표시 기능 구현

5. 약속 날짜 및 장소 확정

  • 마감일이 지난 약속에 대해, 날짜/장소 투표에 따른 결과 모달 표시 기능 개발

➕ 기타 내용

Toast, Confirm 컴포넌트 개발

  • 함수 호출을 통한 컴포넌트 표시 (toast(...toastOptions)). Confirm의 경우 Promise 기반으로 사용자 선택을 처리하도록 개선

데이터 수집을 위한 Google Tag Mananger 이벤트 전송

  • Google Tag Manager를 활용하여 주요 사용자 이벤트(페이지 진입, 버튼 클릭 등)를 전송하는 구조 구현

  • 향후 마케팅 및 UX 개선을 위한 데이터 기반 의사결정이 가능하도록 기반 마련

API 인증 로직 중앙화

  • API 호출 시 필요한 인증 처리 로직을 Next.js Route Handler 기반 Proxy로 통합

  • 쿠키 기반 토큰 자동 첨부 및 만료 시 재발급 후 재요청 흐름을 공통화