트리피는 여행자들이 자신의 여행기를 자유롭게 공유하고 다양한 경험을 소통하는 플랫폼입니다
사용자는 여행 중 경험한 에피소드, 감정, 추억을 글과 사진으로 기록하고 공유할 수 있습니다.
🔗 Web Page Link : https://www.trippy.or.kr
| Github | Discord | Notion | Figma |
|---|---|---|---|
 |
 |
Next.js
• 서버 사이드 렌더링(SSR)을 통해 성능과 SEO를 최적화했습니다.
• 동적 라우팅과 데이터 페칭을 활용해 유연한 페이지 구성을 구현했습니다.
React
• 컴포넌트 기반 구조를 통해 UI를 재사용 가능하게 설계하고 유지 보수성을 높였습니다.
• 상태 및 이벤트 관리를 효율적으로 처리하며 사용자 친화적인 인터페이스를 제공했습니다.
TypeScript
• 정적 타입 시스템을 도입하여 코드 안정성을 확보하고, 유지 보수성을 강화했습니다.
• 잠재적 오류를 사전에 방지하며, 생산성을 극대화했습니다.
Tailwind CSS
• 클래스 기반 스타일링으로 빠르고 유연한 UI 구현을 가능하게 했습니다.
• 커스터마이징 기능을 활용해 색상 팔레트와 테마를 프로젝트에 맞게 구성했습니다.
Zustand
• 가볍고 직관적인 상태 관리 라이브러리를 사용하여 부모-자녀 간의 상태를 효과적으로 관리했습니다.
• 상태 변경에 따른 렌더링 최적화를 통해 성능을 향상시켰습니다.
React Query
• 서버 상태 관리를 효율적으로 수행하며, 캐싱 및 비동기 데이터 페칭을 최적화했습니다.
• 데이터의 최신성을 유지하면서도 네트워크 요청을 줄여 사용자 경험을 개선했습니다.
React Hook Form
• 폼 데이터 관리를 단순화하고, 높은 성능과 유연한 검증 로직을 제공했습니다.
• 코드의 복잡도를 낮추고 유지 보수성을 향상시켰습니다.
Framer Motion
• 자연스럽고 다채로운 애니메이션을 추가하여 사용자 경험을 풍부하게 했습니다.
• 페이지 전환 및 컴포넌트 인터랙션을 부드럽게 구현했습니다.
| Message | 설명 |
|---|---|
| feat | 새로운 기능을 추가할 경우 |
| fix | 버그를 고친 경우 |
| design | CSS 등 사용자 UI 디자인 변경 |
| style | 코드 포맷변경, 세미콜론 누락, 코드수정이 없는 경우. |
| refactor | 프로덕션 코드 리펙토링할 경우 |
| comment | 필요한 주석 추가 및 변경 |
| docs | 문서를 수정한 경우 |
| test | 테스트 코드 작업을할 경우 |
| chore | 빌드 테스트 업데이트, 패키지 매니저를 설정하는 경우 |
| rename | 파일 혹은 폴더명을 수정하거나 옮기는 작업만 하는 경우 |
| remove | 삭제하는 작업만 수행한 경우 |
| init | 브랜치 초기화 및 초기셋팅 관련된 설정일 경우 |