Project-Team2-WINE

0. Getting Started (시작하기)

$ npm run dev
$ npm run build
$ npm run

서비스 링크

1. Project Overview (프로젝트 개요)

• 프로젝트 이름: WHYNE
• 프로젝트 설명: 와인 추천 및 리뷰 서비스

2. Team Members (팀원 및 팀 소개)

강동욱	강동우	유주섭	이승환	정혜연
FE	FE	FE	FE	FE
GitHub	GitHub	GitHub	GitHub	GitHub

3. Key Features (주요 기능)

• 회원가입:

  • 회원가입 시 DB에 유저정보가 등록됩니다.

• 로그인:

  • 사용자 인증 정보를 통해 로그인합니다.

• 와인 목록 페이지:

  • 와인 검색 기능을 통해 와인을 검색할 수 있습니다.
  • 와인 검색 시 와인 이름, 와인 종류, 와인 가격, 와인 평점, 와인 리뷰 수 등을 확인할 수 있습니다.
  • 와인을 타입/가격/평점 순으로 필터링 할 수 있습니다.

• 와인 등록하기:

  • 이름, 가격, 원산지, 사진, 타입을 입력하여 와인을 등록할 수 있습니다.

• 와인 상세페이지:

  • 와인 정보 및 리뷰를 확인할 수 있습니다.
  • 리뷰를 추가할 수 있습니다.

• 내 프로필:

  • 내가 작성한 리뷰를 확인/수정/삭제 할 수 있습니다.

4. Tasks & Responsibilities (작업 및 역할 분담)

강동욱		와인목록, 와인등록모달 cards component
강동우		내 프로필 - 내가 등록한 와인, 삭제 모달 페이지 flavor, profile component
유주섭		회원가입/로그인 , 유저관리토큰 input, search, gnb component
이승환		와인 상세페이지, 리뷰모달 filter, dropdown component
정혜연		프로젝트 계획 정리 랜딩페이지, 내 프로필 - 내가 쓴 후기 default, global css component

5. Technology Stack (기술 스택)

5.1 Language

HTML5
CSS3
Javascript
Typescript

5.2 Frotend

React		18.3.1
Css_modules		6.1.12
Next.js		14.2.11

5.3 Cooperation

Git
Notion
Figma
Discord

6. Project Structure (프로젝트 구조)

PROJECT-TEAM2-WINE/
├── .next/                      # Next.js 빌드 결과물
├── node_modules/               # npm 패키지 모듈
├── public/                     # 정적 파일 저장소
│   ├── assets/                 # 정적 리소스 (예: 이미지, 아이콘 등)
│   ├── fonts/                  # 웹 폰트 저장소
├── src/                        # 소스 코드 디렉토리
│   ├── components/             # 재사용 가능한 컴포넌트
│   ├── libs/                   # 유틸리티 및 API 호출 관련 함수
│   ├── pages/                  # Next.js 페이지 폴더 (라우팅 처리)
│   │   ├── myprofile/          # 마이프로필 관련 페이지
│   │   ├── signin/             # 로그인 페이지
│   │   ├── signup/             # 회원가입 페이지
│   │   ├── wines/              # 와인 관련 페이지
│   │   ├── _app.tsx            # Next.js의 글로벌 설정 파일
│   │   ├── _document.tsx       # HTML 문서 구조 설정 파일
│   │   ├── index.tsx           # 메인 페이지
│   ├── styles/                 # 스타일 관련 파일 저장
│   │   ├── Landing.module.css  # 특정 컴포넌트 스타일
├── .env.local                  # 환경 변수 설정 파일
├── .gitignore                  # Git에서 제외할 파일 목록
├── eslint.config.mjs           # ESLint 설정 파일
├── next-env.d.ts               # Next.js 환경 타입 정의
├── next.config.ts              # Next.js 설정 파일
├── package-lock.json           # 종속성 버전 고정 파일
├── package.json                # 프로젝트 종속성 및 스크립트 정의
├── README.md                   # 프로젝트 개요 및 사용법 설명
└── tsconfig.json               # TypeScript 설정 파일

7. Development Workflow (개발 워크플로우)

브랜치 전략 (Branch Strategy)

우리의 브랜치 전략은 Git Flow를 기반으로 하며, 다음과 같은 브랜치를 사용합니다.

• Main Branch

  • 배포 가능한 상태의 코드를 유지합니다.
  • 모든 배포는 이 브랜치에서 이루어집니다.

• practice Branch

  • 최종 배포 브랜치 전, 마지막 점검 브랜치입니다.
  • 컨플릭 해결 및 테스트 코드 작성 후 배포 브랜치로 병합합니다.

• {name} Branch

  • 팀원 각자의 개발 브랜치입니다.
  • 모든 기능 개발은 이 브랜치에서 이루어집니다.

커밋 태그

• feat: 새로운 기능을 추가할 때 사용합니다.
  • 예: feat: add login functionality
• fix: 버그를 수정할 때 사용합니다.
  • 예: fix: correct issue with user registration
• docs: 문서와 관련된 변경사항 (README.md, API 문서 등).
  • 예: docs: update API documentation
• style: 코드의 스타일(포맷팅, 세미콜론 누락 등) 변경으로, 기능적 변화는 없는 경우.
  • 예: style: format code to improve readability
• refactor: 코드 리팩토링 (기능 변경 없이 코드 구조 개선).
  • 예: refactor: simplify user validation logic
• test: 테스트 코드의 추가 또는 수정.
  • 예: test: add tests for authentication module
• chore: 빌드, 도구 설정 등 기능적이지 않은 변경사항.
  • 예: chore: update dependencies
• perf: 성능 개선 관련 변경사항.
  • 예: perf: optimize database query performance
• build: 빌드 시스템이나 외부 종속성에 영향을 미치는 변경사항.
  • 예: build: update webpack configuration
• revert: 이전 커밋을 되돌릴 때 사용합니다.
  • 예: revert: revert commit abc123
• hotfix: 긴급하게 버그를 수정할 때 사용합니다.
  • 예: hotfix: fix critical login issue

커밋 이모지

== 코드 관련
📝	코드 작성
🔥	코드 제거
🔨	코드 리팩토링
💄	UI / style 변경

== 문서&파일
📰	새 파일 생성
🔥	파일 제거
📚	문서 작성

== 버그
🐛	버그 리포트
🚑	버그를 고칠 때

== 기타
🐎	성능 향상
✨	새로운 기능 구현
💡	새로운 아이디어
🚀	배포

커밋 예시

== ex1
✨Feat: "회원 가입 기능 구현"

SMS, 이메일 중복확인 API 개발

== ex2
📚chore: styled-components 라이브러리 설치