❤ 쪼율링큐 JJOYURINGQ ❤

조유리 팬사이트

👨‍💻 팀원 소개

FRONTEND	BACKEND
최재훈, 조하현	최은섭

📅 프로젝트 기간

2025.03.20 ~ 2023.04.24 (총 5주)

🌟 프로젝트 개요

연예인 조유리의 팬 사이트 입니다.

✨ 프로젝트 핵심 기능

유저 관리 API

• 회원가입, 로그인, 이메일 인증, 닉네임 변경, 비밀번호 변경, 유저 역할 수정, 유저 조회

프로필 API

• 커리어 리스트와 콘서트 리스트 조회

앨범 API

• 앨범의 생성, 조회, 삭제 / 트랙 생성

굿즈 관리 API

• 굿즈의 생성, 조회, 수정, 삭제 및 페이지네이션

다이어리 API

• 다이어리 게시글과 댓글/대댓글의 생성, 조회, 수정, 삭제, 좋아요 및 페이지네이션

장바구니 Zustand / 로컬스토리지

• 장바구니 추가, 수정, 삭제

🔨 주요 기술

Programming Language

Frontend

Backend

💄 디자인 시안

🔗 피그마 링크

🔒 ERD

📄 API 명세서

🔗 Notion 링크

⚙️ 프로젝트 파일 구조

Front-end

├─ public
│ ├─ images
│ │ ├─ icon
│ │ │ ├─ facebookIcon.png
│ │ │ ├─ instagramIcon.png
│ │ │ ├─ spotifyIcon.png
│ │ │ ├─ tiktokIcon.png
│ │ │ ├─ xIcon.png
│ │ │ └─ youtubeIcon.png
│ │ ├─ diary1.png
│ │ ├─ jjoul.png
│ │ ├─ mainImg.jpg
│ │ └─ profile2.png
├─ script
│ ├─ install.sh
│ ├─ start.sh
│ └─ stop.sh
├─ src
│ ├─ api
│ │ ├─ diary
│ │ ├─ admin.ts
│ │ ├─ auth.ts
│ │ ├─ discography.ts
│ │ ├─ goods.ts
│ │ └─ profile.ts
│ ├─ app
│ │ ├─ (route)
│ │ │ ├─ admin
│ │ │ ├─ artist
│ │ │ ├─ cart
│ │ │ ├─ diary
│ │ │ ├─ discography
│ │ │ ├─ goods
│ │ │ ├─ login
│ │ │ ├─ mypage
│ │ │ └─ verifyemail
│ │ ├─ lib
│ │ │ └─ react-query
│ │ ├─ globals.css
│ │ ├─ layout.tsx
│ │ ├─ page.tsx
│ │ └─ subLayout.tsx
│ ├─ components
│ │ ├─ diaryPage
│ │ ├─ mainPage
│ │ ├─ errorAlert.tsx
│ │ ├─ footer.tsx
│ │ ├─ GoTopButton.tsx
│ │ ├─ headerNav.tsx
│ │ ├─ LoadingIndicator.tsx
│ │ └─ successAlert.tsx
│ ├─ constants
│ │ └─ apiUrl.ts
│ ├─ hooks
│ │ ├─ useFetchArticle.ts
│ │ ├─ useLikeHandler.ts
│ │ └─ useUserAuth.ts
│ ├─ store
│ │ ├─ authStore.ts
│ │ ├─ cartStore.ts
│ │ ├─ commentStore.ts
│ │ ├─ diaryLikeStore.ts
│ │ └─ diaryStore.ts
│ ├─ styles
│ │ ├─ diaryDetailStyles.ts
│ │ ├─ headerStyles.ts
│ │ ├─ slideStyles.css
│ │ └─ theme.ts
│ ├─ types
│ │ ├─ diaryMain.ts
│ │ ├─ iadmin.ts
│ │ ├─ ialertProp.ts
│ │ ├─ idiscography.ts
│ │ ├─ igoods.ts
│ │ └─ iprofile.ts
│ └─ utils
│ │ ├─ api.ts
│ │ ├─ formatTimeToKST.ts
│ │ ├─ scrollUtils.ts
│ │ └─ youtube.ts
├─ .env
├─ next.config.ts
├─ package-lock.json
├─ package.json
└─ tsconfig.json

Back-end

🗣 협업 환경

• Discord

• Github

  • 코딩 컨벤션을 준수하며 프로젝트를 진행하였습니다.
  • Merge Request를 요청하고 팀원들과 코드리뷰를 진행하였습니다.

• Figma

  • 웹 페이지의 디자인 와이어프레임, 시안을 제작하였습니다.