사진으로 운동 인증하고 달력으로 기록을 확인하며, 친구에게 “콕”으로 운동을 독려하고 쉬는 날을 설정할 수 있는 소셜 운동 앱입니다.
AI 기반 핵심 요약- KokKok은 운동 습관을 돕는 소셜 운동 앱으로, 사진 인증과 친구들의 운동 독려 기능을 제공한다
- 사용자가 지인들과 운동 기록을 공유하며 지속적인 운동 습관을 가질 수 있게 돕고, 다양한 탭과 기능을 통해 커뮤니티 소통과 상호작용이 가능하다
- 개발자는 홈 탭, 댓글창, 운동 인증 탭 등 각 부분의 개발에 집중하였고, 백엔드에는 Supabase를 적용하여 데이터 관리와 성능 최적화를 추구하였다.
ReactNativeExpoSupabseTypescriptTanstackQuerySentryJotaiNativewind
2024-09-17 ~ 2024-10-11
(개인 프로젝트)
개발 블로그에 블로그 기능과 포트폴리오를 추가한 웹사이트입니다. 백엔드 기술을 학습해 서버를 직접 배포했으며, 마크다운을 활용해 게시글을 작성할 수 있도록 구현했습니다.
AI 기반 핵심 요약- 개발 블로그 웹사이트는 Next.js의 서버 컴포넌트와 SSR을 활용하여 정적 콘텐츠를 효과적으로 관리하며, TanStack Query 기반의 클라이언트 캐싱으로 사용자 경험과 성능을 고려하였다.
- 마크다운 기반의 글 작성, 포트폴리오 관리, AI 요약, 검색, 이미지 업로드 등 개인 기록에 유용한 기능을 갖췄고, 서버와 클라이언트 캐싱 전략을 조합하여 페이지별 최적화도 이뤄냈다.
- 트러블슈팅에서는 초성 검색과 SSR 환경에서의 쿠키 인증 문제를 해결하여 성능과 기능을 개선했다.
TSReactNext.jsReact-queryZustandPrismaExpressJsPostgreSQLSupabase
2024-07-25 ~ 2024-08-30
(팀 프로젝트)
Checkmate는 업무를 세분화하고 목표 달성도를 시각화해 팀이 함께 성장할 수 있도록 돕는 투두리스트 기반 협업 툴입니다.
AI 기반 핵심 요약- 체크메이트는 팀 협업을 위한 작업 관리 서비스로, 할 일 세분화와 시각화, 초대 기능 등이 특징이다.
- Next.js의 SSR과 React Query의 캐싱을 활용하여 협업 도구로 개발되었으며, 공통 컴포넌트 설계와 시각적 UI로 사용자의 편의성을 높였다.
- 개발자는 프로젝트 기간 동안 소셜 로그인, 비밀번호 재설정 기능 등을 담당했으며, 서버 캐싱 문제 해결을 위해 React Query를 수정했다.
TypeScriptNext.jsZustandTanStack QueryTailwindCSSMongoDB Atlas
2024-06-22 ~ 2024-07-09
(팀 프로젝트)
Taskify는 칸반 보드를 활용하여 개인 및 팀이 효율적으로 일정과 작업을 관리할 수 있는 서비스입니다.
AI 기반 핵심 요약- Taskify는 칸반 보드를 사용하여 개인과 팀이 작업을 시각적으로 정리하고 관리할 수 있게 해주는 협업 도구이다.
- 이 프로젝트의 목표는 Next.js 프레임워크에 대한 지식을 늘리고, 협업 프로세스를 경험하는 것이며, 개발자는 사이드바와 내 대시보드 페이지를 개발했다.
- 사용자는 대시보드와 계정 페이지에 빠르고 쉽게 접근할 수 있으며, 즐겨찾기 기능을 통해 자주 사용하는 대시보드를 편리하게 확인할 수 있다.
TypeScriptNext.jsRedux ToolkitTanStack QueryReact Hook FormTailwind
2024-04-30 ~ 2024-05-17
(팀 프로젝트)
Fortune은 친구나 지인에게 익명으로 메시지를 보낼 수 있는 플랫폼입니다. 따뜻한 응원이나 속마음을 부담 없이 전할 수 있는 공간을 지향하며, React 기반의 팀 프로젝트로 개발되었습니다.
AI 기반 핵심 요약- 친구에게 익명으로 메시지를 보낼 수 있는 플랫폼인 'Fortune' 프로젝트에서, 나는 포스트 목록 페이지를 개발했다.
- 이 페이지는 React에서 무한 캐러셀 UI를 부드럽게 구현하고, URL을 통해 검색 결과를 공유하고 유지하는 기능을 담당했다.
- 우리 팀은 협업과 커뮤니케이션 방식을 개선하고, React를 처음 도입하여 학습하며, 4월 30일부터 5월 17일까지 프로젝트 목표를 달성했다.
JSReactstyled-components