Skip to content

bottle-note/bottle-note-frontend

Repository files navigation

Group 236 (3)

Tech Stack

  • Next.js 14
  • React 18
  • TanStack Query v5
  • Zustand v4
Image 1 Image 4 Image 3 Image 2

bottle note

📄 *내 입맛에 딱 맞는 한병을 찾아가는 여정노트

보틀노트는 위스키 애호가들이 모여 서로의 의견을 공유하고, 더욱 즐겁고 유익한 시음 경험을 할 수 있도록 도와줍니다.
위스키에 대한 열정을 함께 나눠보세요! 쉽고 편리하게 위스키 평가와 리뷰를 공유할 수 있어요!


🥃 위스키 별점 및 리뷰 작성

위스키를 시음한 후 별점을 부여하고, 상세한 리뷰를 작성해 보세요!
맛, 향, 느낌 등 다양한 측면을 기록하고 공유할 수 있습니다.
가격을 입력하고, 시음한 장소를 태그하여 좋은 경험한 장소를 기록해 보는건 어때요?

🥃 위스키 정보 및 리뷰 보기

위스키의 상세 정보와 다른 사용자의 리뷰를 쉽게 확인할 수 있습니다.
다양한 의견을 통해 다른 사람들이 위스키를 어떻게 평가했는지 알 수 있고
새로운 위스키를 시도해볼 수 있어요!

🥃 찜하기 기능으로 위스키 목록 관리

관심 있는 위스키를 찜하기 기능을 통해 목록에 추가하고
찜한 위스키 목록을 통해 나만의 위스키 컬렉션을 만들 수 있어요!

🥃 다른 유저와 팔로우 및 별점 보기

다른 사용자를 팔로우하여 그들의 별점과 리뷰를 볼 수 있어요!
나의 팔로워들은 어떤 평가를 했을까요?
팔로워가 나와 취향이 비슷하다면, 내 입맛에 맞는 새로운 위스키를 알 수 있을지도?

🥃 나의 평가 및 별점 기록 관리

내가 평가한 위스키와 부여한 별점을 한눈에 볼 수 있어요!
나만의 위스키 평가 기록을 통해 나의 취향을 분석하고 다음 시음을 계획해보세요!


보틀노트는 위스키 애호가들이 모여 서로의 의견을 공유하고
더욱 즐겁고 유익한 시음 경험을 할 수 있도록 도와줍니다.

boton


🤖 AI 개발 도구 가이드

이 프로젝트는 AI 코딩 도구(Claude Code, Cursor)를 위한 설정이 포함되어 있습니다.

지원 도구

도구 설정 파일 설명
Claude Code CLAUDE.md, .claude/commands/ 프로젝트 컨텍스트 및 슬래시 커맨드
Cursor .cursorrules 코딩 규칙 및 스타일 가이드

Claude Code 슬래시 커맨드

프로젝트에서 Claude Code 실행 후 아래 커맨드를 사용할 수 있습니다:

커맨드 설명 사용 예시
/review 코드 리뷰 /review src/hooks/useToast.ts
/test 테스트 코드 작성 /test useModalStore
/fix 버그 분석 및 수정 /fix TypeError: Cannot read...
/refactor 코드 리팩토링 /refactor useAuth
/component 컴포넌트 생성 /component ReviewCard
/hook 커스텀 훅 생성 /hook useBookmark
/store Zustand 스토어 생성 /store cart
/api API + Query 훅 생성 /api review
/page Next.js 페이지 생성 /page whiskey/[id]

사용 방법

Claude Code

# 프로젝트 폴더에서 Claude Code 실행
claude

# 슬래시 커맨드 사용
> /hook useWishlist
> /review

Cursor

  • 프로젝트를 열면 .cursorrules가 자동으로 적용됩니다
  • AI에게 코드 작성 요청 시 프로젝트 패턴에 맞는 코드가 생성됩니다

파일 구조

📁 프로젝트 루트
├── CLAUDE.md              # 프로젝트 컨텍스트 (기술 스택, 폴더 구조, 코드 패턴)
├── .cursorrules           # Cursor IDE 규칙
└── .claude/commands/      # 슬래시 커맨드 정의
    ├── review.md
    ├── test.md
    ├── fix.md
    ├── refactor.md
    ├── component.md
    ├── hook.md
    ├── store.md
    ├── api.md
    └── page.md

커스텀 커맨드 추가하기

.claude/commands/ 폴더에 마크다운 파일을 추가하면 새 커맨드가 생성됩니다:

<!-- .claude/commands/my-command.md -->
$ARGUMENTS 에 대해 작업해주세요.

작업 지시사항...

/my-command 인자 형태로 사용 가능

$ARGUMENTS는 커맨드 뒤에 입력한 텍스트로 치환됩니다.

About

bottle note frontend

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 7