lime · About Yerim

1. 프로젝트 개요

LIME은 취미 관련 상품 구매 결정을 돕기 위해 개발된 서비스입니다.

취미 상품 구매는 일반 상품과 달리 구매자의 취미 경험과 전문성이 필요하며, 개인의 기호에 맞는 상품 조합을 고려해야 하는 경우도 있습니다. 이러한 요구를 충족시키기 위해, 다양한 전문성을 가진 사람들이 취미 상품에 대해 자유롭게 의견을 묻고 피드백을 받을 수 있는 플랫폼을 제공하고자 기획하게 되었습니다!

2. 기능 명세

홈 : 다양한 취미 상품과 투표에 대한 최신 정보를 제공하는 메인 페이지
소셜로그인 : 사용자 인증을 통해 개인화된 서비스를 제공하기 위한 기능
회원가입 : 새로운 사용자가 가입하여 서비스를 이용할 수 있도록 지원
아이템 생성/추가/조회/검색: 사용자가 새로운 아이템을 생성하고, 추가하며, 조회하고 검색할 수 있는 기능
찜 목록: 사용자가 관심 있는 아이템을 폴더별로 관리하고, 찜 목록을 조회하며, 폴더를 생성, 수정, 이동하는 기능
투표 생성/추가/조회: 사용자가 투표를 생성하고, 추가하며, 조회할 수 있는 기능
마이페이지: 사용자 개인 정보 및 활동 내역을 관리하는 페이지

3. 역할

프론트엔드 개발:

아이템 목록 페이지: 무한 스크롤 기능을 적용하여 사용자 경험을 개선
찜 목록 및 상세 페이지: 폴더 생성/삭제, 폴더 이동, 폴더 이름 수정 등의 기능을 개발
검색 기능: 사용자들이 원하는 취미 상품을 빠르게 찾을 수 있도록 구현
레이아웃 및 반응형 UI: 다양한 디바이스에서 일관된 사용자 경험을 제공하기 위해 반응형 UI 가이드라인을 설계 및 개발

4. 기술 선택 이유

Next.js 13: 최신 기능과 성능 최적화를 위해 선택. 서버사이드 렌더링(SSR)을 통해 초기 로딩 속도를 개선
React-Query: 데이터 패칭 및 캐싱을 효율적으로 처리하여 상태 관리의 복잡성을 줄이고, 개발 생산성을 높이기 위해 도입
Tailwind CSS: 일관된 스타일링과 재사용 가능한 컴포넌트 작성을 위해 선택. 스타일링 작업의 생산성을 높이고 유지보수를 용이하게 함

5. 성능 최적화

무한 스크롤: 아이템 목록 페이지에 무한 스크롤을 적용하여 초기 로딩 시간을 줄이고, 사용자 경험을 개선
서버사이드 렌더링: Next.js의 서버사이드 렌더링 기능을 활용하여 페이지 로딩 속도를 최적화
React-Query: 데이터 패칭 및 캐싱을 통해 네트워크 요청 수를 줄이고, 응답 속도를 개선

6. 회고

LIME 프로젝트는 백엔드 3명, 프론트엔드 2명, 디자이너 1명으로 구성하여 진행한 팀 프로젝트입니다.

주기적으로 한 시간 정도 온라인 회의를 통해 기획과 개발 진행 상황을 점검했고, Notion, Slack, Jira 등의 툴을 활용하여 커뮤니케이션을 진행했습니다.

초반에는 경력자로서 토이 프로젝트가 이직 준비에 큰 도움이 될지에 대한 의문이 있었습니다. 그러나 새로운 기술들을 적극적으로 사용해보는 기회로 삼고, 팀원들과의 협업 과정을 통해 많은 것을 배울 수 있을 것이라는 확신이 들어 프로젝트에 참여하게 되었습니다.

프론트엔드 개발자가 두 명뿐이었지만, 커밋 컨벤션과 브랜치 네이밍 규칙을 확실히 정하고 코드 리뷰 시스템을 도입하여 코드 품질을 높였습니다. 이전 회사에서는 코드 리뷰 시스템을 도입하는 것이 어려웠지만, 이번 프로젝트를 통해 코드 리뷰의 중요성을 체감할 수 있었습니다. 특히, Next.js 13버전과 React-Query를 실제로 사용해보면서 기술적 자신감을 얻었습니다.

이번 프로젝트는 단순한 토이 프로젝트를 넘어, 새로운 기술을 사용해보고 팀원들과의 협업을 통해 실무 능력을 향상시킬 수 있는 소중한 경험이었습니다. 이 경험을 바탕으로 앞으로도 계속해서 성장할 수 있을 것이라는 확신을 가지게 되었습니다. 😇