Chore : 2차 배포

README.md

@@ -1,73 +1,136 @@
-# 홀리데이즈 HOLIDAYS
-
-## 멤버 구성
-### 이중한 (FE)
-- 로그인 / 회원가입 페이지 (소셜로그인, 비밀번호 찾기, 권한분기, 휴대폰/이메일 인정 )
-- 결제페이지
-- 랜딩페이지 제작
-- 메거진 페이지 제작
-- PWA (구글 플레이스토어 앱 배포,반응형 디자인)
-### 신재욱 (FE)
-- 마이페이지 (마이페이지 메인, 내가 만든 클래스, 내가 신청한 클래스, 위시리스트, 내 사랑방 리스트, 예약 관리, 회원 탈퇴)
-- 커뮤니티 페이지 (커뮤니티 리스트, 커뮤니티 작성, 커뮤니티 조회)
-- 클래스 페이지 (클래스 리스트)
+## 🏖 홀리데이즈 프로젝트 소개 🗂
+
+### 🏖 홀리데이즈는?
+> 점점 더 많은 사람들이 새로운 스킬을 배우고 개인적인 관심사를 탐구하기 위해  원데이클래스에 대한 수요가 증가하고 있습니다. 그러나 원데이클래스를 찾고 참여하기 위해서는 여러 가지 장벽이 존재하곤 합니다. HOLIDAYS는 이러한 장벽을 극복하고, 원데이클래스를 원하는 사람들에게 쉽게  접근 가능하고 매칭이 용이한 서비스를 제공하는 것을 목표로 합니다.
+
+<br />
+
+### 🚀 배포링크
+ [https://happyholidays.site](https://happyholidays.site)
+
+ <br />
+
+### 🧑🏻‍💻 기술스택
+
+- `Javascript`, `Typescript`, `React`, `Next.js`
+- `Recoil`,  `Axios`, `GraphQL`
+- `Emotion`
+- `AWS`
+
+<br />
+
+### 🗓 개발 기간 & 일정
+
+- 1차 : 2023.05 ~ 2023.06
+- 리팩토링 : 2023.06 ~ 2023.08
+
+<br />
+
+### 🔧 Installation
+
+```bash
+  yarn install
+```
+
+<br />
+
+### 🧑‍🤝‍🧑 팀원 소개
+#### 신재욱 (FE)
+- 커뮤니티 페이지, 회원관리 페이지, 원데이클래스 페이지(리스트)
 - 레이아웃 제작
-- FE git 관리
-- 발표자료 제작
-### 유시영 (FE)
-- 클래스 생성 및 조회 페이지(클래스 등록/수정/삭제, 카카오 지도 api, 이미지 업로드, 리뷰 등록/수정/삭제하기, 예약하기, 찜하기)
+- Git 관리
+#### 이중한 (FE)
+- 로그인 페이지, 결제 페이지, 랜딩페이지
+- PWA 배포
+#### 유시영 (FE)
+- 원데이클래스 페이지
 - AWS 배포
-- 노션 제작 및 관리
-- 회의록 작성
-## 기획의도
-점점 더 많은 사람들이 새로운 스킬을 배우고 개인적인 관심사를 탐구하기 위해 
-원데이클래스에 대한 수요가 증가하고 있습니다. 
+- 노션 관리
+
+<br />
+
+### 📌 프로젝트 기록
+
+|        일차          | 블로그 링크                                                                                                                                         |
+| :------------------:  | ------------------------------------------------------------------------------------------------------------------------------------------- |
+| 1일차 | [Team Project 1일차](https://velog.io/@sju4486/TIL-Team-Project-1%EC%9D%BC%EC%B0%A8) |
+| 2일차 | [Team Project 2일차](https://velog.io/@sju4486/TIL-Team-Project-2%EC%9D%BC%EC%B0%A8) |
+| 3일차 | [Team Project 3일차](https://velog.io/@sju4486/TIL-Team-Project-3%EC%9D%BC%EC%B0%A8) |
+| 4일차 | [Team Project 4일차](https://velog.io/@sju4486/TIL-Team-Project-4%EC%9D%BC%EC%B0%A8) |
+| 5일차 | [Team Project 5일차](https://velog.io/@sju4486/TIL-Team-Project-5%EC%9D%BC%EC%B0%A8) |
+| 6일차 | [Team Project 6일차](https://velog.io/@sju4486/TIL-Team-Project-6%EC%9D%BC%EC%B0%A8) |
+| 7일차 | [Team Project 7일차](https://velog.io/@sju4486/TIL-Team-Project-7%EC%9D%BC%EC%B0%A8) |
+| 8일차 | [Team Project 8일차](https://velog.io/@sju4486/TIL-Team-Project-8%EC%9D%BC%EC%B0%A8) |
+| 9일차 | [Team Project 9일차](https://velog.io/@sju4486/TIL-Team-Project-9%EC%9D%BC%EC%B0%A8)|
+| 10일차 | [Team Project 10일차](https://velog.io/@sju4486/TIL-Team-Project-10%EC%9D%BC%EC%B0%A8-yjod680s) |
+| 11일차 | [Team Project 11일차](https://velog.io/@sju4486/TIL-Team-Project-11%EC%9D%BC%EC%B0%A8) |
+| 12일차 | [Team Project 12일차](https://velog.io/@sju4486/TIL-Team-Project-12%EC%9D%BC%EC%B0%A8) |
+| 회고록 | [Team Project 회고록](https://velog.io/@sju4486/TIL-Team-Project-%ED%9A%8C%EA%B3%A0%EB%A1%9D) |
+| 리팩토링 회고록 | [Team Project 리팩토링 회고록](https://velog.io/@sju4486/Project-Team-Project-%EB%A6%AC%ED%8C%A9%ED%86%A0%EB%A7%81-%ED%9A%8C%EA%B3%A0) |
+
+<br />
+
+### 📝 화면 구성
+![스크린샷, 2023-07-13 19-02-53](https://github.com/mrpumpkin98/Reused_client/assets/114569429/0022329b-ddd8-4908-961d-4b2f2c4ea233)
+
+<br />
 
-그러나 원데이클래스를 찾고 참여하기 위해서는 여러 가지 장벽이 존재하곤 합니다. 
+### 📈ERD
+![Untitled](https://github.com/mrpumpkin98/Reused_client/assets/114569429/c32c9ae3-987a-4301-8d34-97d4450241bc)
 
-"HOLIDAYS"는 이러한 장벽을 극복하고, 원데이클래스를 원하는 사람들에게 쉽게 
-접근 가능하고 매칭이 용이한 서비스를 제공하는 것을 목표로 합니다.
+<br />
 
-## 기능 설명
+### 🎨 페이지 및 기능
 
-### 1. 다양한 원데이클래스 검색
- 다양한 분야의 원데이클래스를 한 곳에서 찾을 수 있는 플랫폼을 제공합니다. 사용자는 관심 있는 주제나 원하는 스킬을 검색하여 수강 가능한 원데이클래스를 찾을 수 있습니다.
+<br />
 
-### 2. 맞춤형 추천
- 사용자는 자신의 관심사, 선호하는 날짜와 시간, 예산 등을 입력하여 맞춤형 추천 원데이클래스를 받을 수 있습니다. 이를 통해 사용자는 자신의 요구에 맞는 원데이클래스를 더욱 쉽게 찾을 수 있습니다.
+#### 원데이클래스 List Page (Service / Area Category)
+> - Recoil 상태 관리 라이브러리를 사용하여 상태를 저장
+> - 특정 카테고리 클릭 시, Recoil 상태에서 해당 카테고리와 일치하는 데이터를 불러옵니다.
 
-### 3. 원데이클래스 등록
- "HOLIDAYS" 플랫폼을 통해 자신의 클래스를 등록할 수 있습니다. 강사는 클래스의 주제, 날짜, 장소, 수강생 수 등을 등록하여 자신의 클래스를 홍보하고 수강생을 모집할 수 있습니다.
+<br/>
 
-### 4. 매칭 시스템
- "HOLIDAYS"는 강사와 수강생을 매칭해주는 기능을 제공합니다. 강사는 자신의 클래스에 대한 신청을 받고, 수강생은 원하는 클래스에 신청할 수 있습니다. 시스템은 이를 기반으로 가장 적합한 매칭을 제안하여 수강생과 강사를 연결합니다.
+|         페이지           | 영상                                                                                                                                         |
+| :------------------:  | ------------------------------------------------------------------------------------------------------------------------------------------- |
+|  Service Category  | ![클래스 리스트(서비스 카테고리)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/dab9e020-d6fc-4795-8535-f12c76f44d98) |
+| Area Category | ![클래스 리스트(지 카테고리)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/77163812-208e-4401-9dcc-a29344cc0332) | 
+| Search | ![클래스 리스트(검색)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/6a673c74-3c10-4dff-b75d-92a3df1fc320)| 
 
-## 개발 기간
-2023년 5월 8일 ~ 2023년 5월 26일
 
-## 기술
-- HTML, CSS, JavaScript, TypeScript, React, Next.js, GraphQL, Rest-API
-- PWA, AWS, 도커
-- GIT
+<br/>
 
-## 구현 기능
+***
 
-![1](https://github.com/code-bootcamp/holidays_client/assets/114569429/c775f6c9-7caa-43ef-98fb-e3bd49218621)
+<br/>
 
-![2](https://github.com/code-bootcamp/holidays_client/assets/114569429/6508c1a4-f0d1-4d72-be04-ddd8bab3170b)
+#### 커뮤니티 (List / Detail / Comment / Write)
+> - TOAST UI Editor 3.0 라이브러리를 사용했습니다.
+> - 대표이미지 등록과 게시물작성시 필요한 이미지들을 자유롭게 등록할 수 있습니다.
+> - 작성한 제목과 내용은 게시물을 작성한 작성자만 수정이 가능합니다.
+> - 댓글 작성과 수정 시 apolloClient에서 제공하는 기능인 refetchQueries를 사용해서 즉각적으로 반영되도록 구현했습니다.
 
-![3](https://github.com/code-bootcamp/holidays_client/assets/114569429/093be5f4-af48-41f6-a4ce-06217c6481d1)
+<br/>
 
-![4](https://github.com/code-bootcamp/holidays_client/assets/114569429/41c07770-7ab5-4186-a5d3-fecf109c1989)
+|         페이지           | 영상                                                                                                                                         |
+| :------------------:  | ------------------------------------------------------------------------------------------------------------------------------------------- |
+|  Detail  | ![커뮤니티(디테일)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/04d04087-1574-47da-9b18-22791ad6a5fb) |
+| Comment | ![커뮤니티(댓글)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/5f790b2f-7c6e-4943-aa40-cb031400eae8) | 
+| Write | ![커뮤니티(작성)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/654de327-a292-43f6-b39a-63b13c0170ab)| 
+| Update | ![커뮤니티(수정)](https://github.com/code-bootcamp/holidays_client/assets/114569429/ca476e0e-548f-40f5-b92d-930467456414)| 
 
-![5](https://github.com/code-bootcamp/holidays_client/assets/114569429/dc609f7e-fdd1-4bba-9106-340dd9b6e2b3)
+<br/>
 
-![6](https://github.com/code-bootcamp/holidays_client/assets/114569429/bd5d40a4-94ab-4916-b765-7862a1465067)
+***
 
-![77](https://github.com/code-bootcamp/holidays_client/assets/114569429/eaeadde0-4343-423b-b3ea-5805dbf9e6a6)
+<br/>
 
-![8](https://github.com/code-bootcamp/holidays_client/assets/114569429/60695f6f-16bc-4cb3-924e-da7824ed79d7)
+#### 마이페이지 (Edit profile / View my page)
+> - 회원정보 수정시 핸드폰 인증을 받고, 인증번호가 확인되면 닉네임을 수정할 수 있도록 구현했습니다.
+> - 예약 승인 및 확인 조회: 마이페이지에서 예약에 대한 승인 상태나 확인 상태를 실시간으로 확인할 수 있습니다.
 
-![9](https://github.com/code-bootcamp/holidays_client/assets/114569429/2078d2ca-ec4b-4fa7-a371-a7bd8fd38ecb)
+<br/>
 
-![10](https://github.com/code-bootcamp/holidays_client/assets/114569429/be0c3bab-e3e3-4b2b-a680-c1d796939b90)
+|         페이지           | 영상                                                                                                                                         |
+| :------------------:  | ------------------------------------------------------------------------------------------------------------------------------------------- |
+|  Edit profile  | ![마이페이지(회원정보 수정)](https://github.com/mrpumpkin98/Reused_client/assets/114569429/2aa672ed-061f-46bd-96fd-3d84a48cad4b)|
+| List Page | ![마이페이지](https://github.com/mrpumpkin98/Reused_client/assets/114569429/69bbb872-d645-4562-a909-9574c2ba2eed) |