Update README.md

softeerbootcamp4th · Aug 26, 2024 · c4a3cb5 · c4a3cb5
1 parent 6c32266
commit c4a3cb5
Showing 1 changed file with 300 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 # <img width="60" src = "https://github.com/user-attachments/assets/d0e6ecb6-2e2f-4b65-b89d-36966a2b6693"/>   아반떼 N 소개 이벤트 
 
 
-<img width="1516" alt="image" src="https://github.com/user-attachments/assets/6b0aae70-6542-4b2a-a50c-509c7546be39">
+<img width="724" alt="image" src="https://github.com/user-attachments/assets/6b0aae70-6542-4b2a-a50c-509c7546be39">
 
 
 <br />
@@ -14,7 +14,7 @@
 <br />
 
 ## 🎬 시연 영상
-- https://www.youtube.com/watch?v=M3i2uMT2Smg
+- [Youtube](https://www.youtube.com/watch?v=M3i2uMT2Smg)
 
 
 <br />
@@ -32,11 +32,305 @@
 <br>
 
 
-## 팀원 구성
+## 🛠️ 기술 스택
+
+<div>
+<img src="https://img.shields.io/badge/Pnpm-F69220?style=for-the-badge&logo=Pnpm&logoColor=white"> 
+<img src="https://img.shields.io/badge/Vite-646CFF?style=for-the-badge&logo=Vite&logoColor=white">
+<img src="https://img.shields.io/badge/ESLint-4B32C3?style=for-the-badge&logo=ESLint&logoColor=white">
+</div>
+
+<div>
+<img src="https://img.shields.io/badge/React-61DAFB?style=for-the-badge&logo=React&logoColor=white">
+<img src="https://img.shields.io/badge/TypeScript-3178C6?style=for-the-badge&logo=TypeScript&logoColor=white">
+<img src="https://img.shields.io/badge/ReactQuery-FF4154?style=for-the-badge&logo=react-query&logoColor=white">
+<img src="https://img.shields.io/badge/Framer%20Motion-0055FF?style=for-the-badge&logo=Framer&logoColor=white">
+</div>
+
+<div>
+<img src="https://img.shields.io/badge/Firebase-DD2C00?style=for-the-badge&logo=Firebase&logoColor=white">
+<img src="https://img.shields.io/badge/Github%20Actions-2088FF?style=for-the-badge&logo=Github%20Actions&logoColor=white">
+</div>
+<br>
+
+
+## 👥 팀원 구성
 
 <div align="center">
 
-| **이태혁** | **박대원** | **유성욱** | **조도연** |
+| **FE** |**FE** | **BE** | **BE** |
 | :------: |  :------: | :------: | :------: |
-| **FrontEnd** |**FrontEnd** | **BackEnd** | **BackEnd** |
-| [<img src="https://github.com/user-attachments/assets/6257c825-6fa0-470c-b5d8-4ac05aa0f079" height = "150"> <br/> @thgee](https://github.com/thgee) |  [<img src="https://github.com/user-attachments/assets/4ccaa5ff-980d-4131-9c00-2d6bbb931f9c" height = "150"> <br/> @DaeWon9](https://github.com/DaeWon9) | [<img src="https://github.com/user-attachments/assets/ed06c75a-56ad-4c9c-a9c6-5b85c457cc08" height = "150"> <br/> @starwook](https://github.com/starwook)  |[<img src="https://github.com/user-attachments/assets/769ba7ab-91ab-492b-bb5c-686f7d4ef4ec"  height = "150"> <br/> @ysndy](https://github.com/ysndy) |
+| **이태혁** | **박대원** | **유성욱** | **조도연** |
+| [<img src="https://github.com/user-attachments/assets/6257c825-6fa0-470c-b5d8-4ac05aa0f079" height = "150" > <br/> @thgee](https://github.com/thgee) |  [<img src="https://github.com/user-attachments/assets/4ccaa5ff-980d-4131-9c00-2d6bbb931f9c" height = "150"> <br/> @DaeWon9](https://github.com/DaeWon9) | [<img src="https://github.com/user-attachments/assets/ed06c75a-56ad-4c9c-a9c6-5b85c457cc08" height = "150"> <br/> @starwook](https://github.com/starwook)  |[<img src="https://github.com/user-attachments/assets/769ba7ab-91ab-492b-bb5c-686f7d4ef4ec"  height = "150"> <br/> @ysndy](https://github.com/ysndy) |
+
+</div>
+
+<br>
+
+
+
+
+
+
+
+
+## 📖 페이지별 기능
+
+
+
+<br>
+
+### [추첨 이벤트]
+- 신규 유저가 로그인할 시 기본 3회 뽑기권이 지급되며 뽑기를 진행하면 추첨 이벤트에 자동 응모 처리됩니다. 
+- 생성된 URL을 공유하여 신규 유저가 가입하면 뽑기권을 얻을 수 있습니다.
+- 이벤트가 끝난 후 관리자의 일괄 추첨을 통해 1등부터 5등까지의 당첨자가 선정됩니다.
+- 모든 카테고리별 1개 이상의 파츠를 획득하면 아반떼 N 미니어처를 증정하며 이 또한 관리자의 추첨으로 진행됩니다.
+
+
+
+ | 추첨 이벤트 |
+|----------|
+| <img src="https://github.com/user-attachments/assets/809cea84-1d74-4049-b265-57909f179428" width = "700" /> |
+
+<br />
+
+### [파츠 뽑기]
+- 카드를 클릭해서 파츠를 뽑을 수 있습니다.
+- 가지고 있는 뽑기권이 소진되면 더이상 뽑기를 진행할 수 없습니다.
+
+| 파츠 뽑기 |
+|----------|
+| <img src="https://github.com/user-attachments/assets/f6bc38ad-360e-4413-8bf8-91f6b86f244a" width = "700" /> |
+
+<br />
+
+### [파츠 컬렉션]
+- 파츠뽑기에서 획득한 파츠들을 장착하여 아반떼를 커스텀 할 수 있습니다.
+- 카드에 마우스를 올리면, 장착된 파츠들을 한눈에 확인할 수 있습니다.
+
+| 파츠 컬렉션 |
+|----------|
+| <img src="https://github.com/user-attachments/assets/862a1785-c550-43ba-b984-fad3fc299b67" width = "700" /> |
+
+<br />
+
+### [기대평/공유]
+- 아반떼 N에 대한 기대평을 작성할 수 있습니다.
+- 기대평은 50자 이내로 작성하도록 설정하였습니다.
+- 내 컬렉션을 자랑 수 있는 공유링크를 복사할 수 있습니다.
+- 다른 사람이 공유링크로 접속하게 되면 내가 장착했던 파츠들을 구경할 수 있습니다.
+- 공유링크로 접속한 유저가 로그인을 하면 링크를 공유한 유저의 뽑기권이 1회 증가합니다.
+
+| 기대평/공유 |
+|----------|
+| <img src="https://github.com/user-attachments/assets/8540bbbc-5b05-4d0b-86e4-efcbde68f7ad" width = "700" /> |
+
+<br />
+
+### [선착순 이벤트]
+- 오전 10시가 되면 퀴즈가 공개됩니다.
+- 정답을 틀리게 되면 아반떼 N 소개 페이지로 이동하여 힌트를 찾아볼 수 있습니다.
+- 선착순 인원 안에 들었다면 당첨 상품과 함께 전화번호를 입력할 수 있는 페이지로 이동합니다.
+
+| 선착순 이벤트 |
+|----------|
+| <img src="https://github.com/user-attachments/assets/d519b9e7-823b-451d-977a-24ee0c63eb62" width = "700" /> |
+
+
+
+<br>
+
+
+
+
+
+
+## 📂 디렉토리 구조
+
+```
+packages
+    ├── admin
+    │   ├── public
+    │   │   ├── fonts
+    │   │   │   ├── pretendard
+    │   │   │   ├── pyeongChang
+    │   │   │   └── pyeongChangPeace
+    │   │   └── images
+    │   │       ├── favicon
+    │   │       ├── gnb
+    │   │       └── modal
+    │   └── src
+    │       ├── apis
+    │       │   ├── auth
+    │       │   ├── expectation
+    │       │   ├── orderEvent
+    │       │   └── partsEvent
+    │       ├── common
+    │       │   ├── components
+    │       │   │   ├── Button
+    │       │   │   ├── GlobalNavigationBar
+    │       │   │   │   └── GlobalNavs
+    │       │   │   ├── ModalContainer
+    │       │   │   │   └── modal
+    │       │   │   │       ├── AlertModal
+    │       │   │   │       ├── ConfirmModal
+    │       │   │   │       ├── GoolgleLoginModal
+    │       │   │   │       ├── ImageModal
+    │       │   │   │       └── PendingModal
+    │       │   │   └── Space
+    │       │   └── utils
+    │       ├── components
+    │       │   └── partsEvent
+    │       │       ├── ExpectationDataGrid
+    │       │       ├── MainEventDrawForm
+    │       │       ├── MiniatureEventDrawForm
+    │       │       ├── ParticipantDataGrid
+    │       │       ├── RewardInfo
+    │       │       └── WinnerDataGrid
+    │       ├── constants
+    │       └── pages
+    │           ├── Error
+    │           ├── orderEvent
+    │           │   ├── OrderEventGeneration
+    │           │   ├── OrderEventManagement
+    │           │   └── OrderEventWinnerManagement
+    │           └── partsEvent
+    │               ├── PartsEventDraw
+    │               ├── PartsEventGeneration
+    │               ├── PartsEventParticipantManagement
+    │               └── PartsEventWinnerManagement
+    ├── core
+    │   └── src
+    │       ├── apis
+    │       │   └── login
+    │       ├── contexts
+    │       ├── hooks
+    │       ├── providers
+    │       ├── theme
+    │       ├── types
+    │       │   ├── orderEvent
+    │       │   └── partsEvent
+    │       └── utils
+    └── service
+        ├── public
+        │   ├── fonts
+        │   │   ├── pretendard
+        │   │   ├── pyeongChang
+        │   │   └── pyeongChangPeace
+        │   ├── icons
+        │   └── images
+        │       ├── common
+        │       ├── demo
+        │       ├── favicon
+        │       ├── gnb
+        │       ├── main
+        │       ├── modal
+        │       ├── newCar
+        │       ├── og
+        │       ├── parts
+        │       ├── partsCollection
+        │       ├── pickEvent
+        │       │   ├── card
+        │       │   ├── joinInfo
+        │       │   └── prize
+        │       └── quiz
+        └── src
+            ├── apis
+            │   ├── expectation
+            │   ├── link
+            │   ├── lottery
+            │   ├── orderEvent
+            │   └── partsEvent
+            ├── common
+            │   ├── components
+            │   │   ├── Button
+            │   │   ├── CheckBox
+            │   │   ├── ClickInduceIcon
+            │   │   ├── ClipBoardButton
+            │   │   ├── Footer
+            │   │   ├── GlobalNavigationBar
+            │   │   │   ├── GlobalNavs
+            │   │   │   │   └── ExpirationTimer
+            │   │   │   └── MenuButton
+            │   │   ├── Marquee
+            │   │   ├── ModalContainer
+            │   │   │   ├── content
+            │   │   │   └── modal
+            │   │   │       ├── AlertModal
+            │   │   │       ├── ConfirmModal
+            │   │   │       ├── DescriptionModal
+            │   │   │       ├── GoolgleLoginModal
+            │   │   │       ├── NavigateModal
+            │   │   │       └── PendingModal
+            │   │   └── ScrollToTop
+            │   ├── hooks
+            │   ├── responsive
+            │   ├── styles
+            │   └── utils
+            ├── components
+            │   ├── main
+            │   │   ├── Banner
+            │   │   ├── EventCard
+            │   │   ├── EventPeriod
+            │   │   │   └── Timer
+            │   │   └── Expectation
+            │   ├── nQuizEvent
+            │   │   ├── NQuizReward
+            │   │   ├── NQuizSection
+            │   │   │   ├── NQuizAlternativeBody
+            │   │   │   ├── NQuizHeader
+            │   │   │   └── NQuizInput
+            │   │   └── NQuizTitle
+            │   ├── newCar
+            │   │   ├── NewCarInfo
+            │   │   ├── TracingCar
+            │   │   └── util
+            │   ├── partsCollection
+            │   │   ├── CustomCard
+            │   │   ├── PartsTab
+            │   │   │   └── PartsCard
+            │   │   └── PinContainer
+            │   │       └── Pin
+            │   │           └── WaveCircle
+            │   ├── partsPick
+            │   │   ├── PartsCard
+            │   │   └── PickTitle
+            │   ├── pickEvent
+            │   │   ├── CardCarousel
+            │   │   ├── JoinInfo
+            │   │   └── PrizeContainer
+            │   │       └── PrizeItem
+            │   └── share
+            │       └── PartsTab
+            │           └── PartsCard
+            ├── constants
+            └── pages
+                ├── Error
+                ├── Loading
+                ├── LotteryApplyInfo
+                ├── Main
+                ├── NQuizEvent
+                ├── NQuizEventWinnerApply
+                ├── NewCar
+                ├── PartsCollection
+                ├── PartsPick
+                ├── PickEvent
+                └── Share
+
+```
+
+
+
+
+
+<br>
+
+## 📜 이슈관리 및 문서
+
+-  [이슈관리](https://watermelon-clap.atlassian.net/jira/software/projects/CLAP/boards/1)
+-  [전체 회의록](https://bside.notion.site/4d152e2f240a4909bec05539d862008a?pvs=4)
+-  [FE 회의록](https://bside.notion.site/664ba9b6813e452aa375d68ca0cc693f?pvs=4)
+-  [트러블슈팅](https://bside.notion.site/3b23af17b4bf47d3a6b488212b1f8959?pvs=4)
+
+
+