diff --git a/README.md b/README.md
index 0781c09..fcdc921 100644
--- a/README.md
+++ b/README.md
@@ -1,23 +1,1081 @@
-# 🔒 Rule 
-다음과 같은 룰을 따릅니다.
-
-## 🔀 Git-Flow 
-- Github Projects를 이용하여 Issue를 관리합니다.
-- 각자의 feature branch에서 작업한 후, develop branch로 merge합니다.
-- {브랜치 종류}/{이슈 번호}/{내용} 순으로 작명합니다.
-- `ex) feature/#3/login`
-
-## 💬 Commit Convention
-|작업 태그|설명|
-|------|---|
-|`feat`|새로운 기능 추가 / 일부 코드 추가 / 일부 코드 수정 (리팩토링과 구분) / 디자인 요소 수정|
-|`fix`|버그 수정|
-|`refactor`|코드 리팩토링|
-|`style`|코드 의미에 영향을 주지 않는 변경사항 (코드 포맷팅, 오타 수정, 변수명 변경, 에셋 추가)|
-|`chore`|빌드 부분 혹은 패키지 매니저 수정 사항 / 파일 이름 변경 및 위치 변경 / 파일 삭제|
-|`docs`|문서 추가 및 수정|
-|`rename`|패키지 혹은 폴더명, 클래스명 수정 (단독으로 시행하였을 시)|
-|`remove`|패키지 혹은 폴더, 클래스를 삭제하였을 때 (단독으로 시행하였을 시)|
-
-- 이슈 번호를 붙여서 commit
-- `ex) #4 [feat] : 로그인 기능 구현`
+# 💠 나만의 조각을 찾아 브랜딩하는 공간, 셀피스(SELPIECE)
+> 셀피스는, 퍼스널 브랜딩의 초기 여정에서 겪는 명확한 방향 설정이 어려운 문제를 해결하기위한 솔루션입니다.
+>
+
+![1](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/10062d76-7829-4597-8201-83e385bf7920)
+![d23](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/8cd43206-5b8b-4cc0-9983-ddcbe5e0d3ba)
+
+
+<br>
+
+## 🕊️ 팀명
+
+### 팀명 : 쿨피스 (cool_ps)
+
+![팀원](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/d8b34c94-6e95-4e98-b0f2-fa106fefd094)
+
+
+### R&R
+<details>
+  <summary>저희는, RAIC 기법에 따라 아래와 같이 R&R 분배를 진행했습니다.</summary>
+  <br>
+  R (resposible) 실무 담당자 : 실제 업무를 수행하는 사람<br><br>
+  A (Accountable) 의사결정권자 : 업무 피드백 및 to-do 분배 등 의사 결정권을 갖는 사람<br><br>
+  C (Consulted) 업무 수행 조언자 : 업무에 대한 피드백을 수행하는 사람<br><br>
+  I (Informed) 결과 통보 대상자 : 업무의 진행 상태와 결과에 대한 보고를 받는 사람
+</details>
+    
+
+|  | 업무 내용 | 민선 | 민혜 | 수현 | 예림 | 민하 | 정민 | 민정 | 상호 |
+| --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
+| 공통 | 팀 운영 및 문화 관리 | RA | C | R | C | C | C | C | R |
+|  | 운영문서관리 | RA | RA | R | I | I | I | I | R |
+| 기획 | 가설 설정 및 실행  | RA | RA | R | R | R | R | R | R |
+|  | 고객 리서치 및 분석 | R | RA | A | A | I | I | I | I |
+|  | 핵심 기능 정의 및 flow 제작 | R | RA | C | C | C | C | C | C |
+|  | QA 관리 및 실행  | RA | R | R | R | R | R | R | R |
+|  | 사전 배포 및 데이터 관리 | RA | R | I | I | R | R | R | R |
+| 디자인  | 브랜드 스프린트 | RA | RA | RA | RA | R | R | R | R |
+|  | 화면 설계 및 와프 제작 | R | RA | RA | RA | I | I | I | I |
+|  | ui 디자인 | C | C | RA | RA | I | I | I | I |
+|  | ux 디자인 | C | C | RA | RA | I | I | I | I |
+| 개발  | 팀 업무 관리 | C | I | C | I | RC | RC | RC | AR |
+|  | API 구현 & 연동 | C | I | C | I | AR | AR | AR | AR |
+|  | 이슈점검, QA | I | R | I | I | AR | AR | AR | AR |
+
+> 저희 팀은 ‘나에 대한 근본적인 이해’에 대해 끊임없이 고민하고 싶은 팀원들이 모였습니다. 나를 이해하는 과정에서 치열하게 노력을 하고 있는 이들과 호흡하며 그들의 문제를 마주하다보면, 흥미로운 사업 아이템을 개발/발굴할 동인이 되리라 확신하여 아래와 같은 리서치를 진행했습니다.
+>
+
+<br>
+
+## **🔎 서비스 개발 배경**
+
+팀 쿨피스는 아이디어 선정 이전, 서로의 흥미를 파악하기위해 ‘넌 어떤 사람이야? 뭘 좋아해?’ 등의 질문에 대한 답변을 하고 서로를 알아가는 온보딩을 진행했습니다. 그러던 중, 저희는 선뜻 나의 흥미, 강점, 성향 등에 대한 답을 내리지 못한다는 것을 인지했습니다. 즉, 나조차도 나에 대해 잘 알고 있지 못하다는 것이었는데요, 저희의 시작은 바로 이 지점이었습니다. 
+
+왜 나는 나에 대해 잘 알지 못할까, 사용자들에게 나를 잘 알 수 있는 경험을 주는 건 어떨까 라는 생각으로 **서비스의 사용자들이 자신을 깊이 이해하며 살아가도록 돕는 것**을 저희 팀의 목표로 설정했습니다. 단, 이는 팀의 내적동기와 목표에 불과했기에 __관련하여 문제가 존재하는지, 서비스를 사용할만큼의 동인이 있는 문제인지에 대한 가설 실험을 진행했습니다.__
+
+![image](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/9787ef77-a763-4fe1-a9f6-a5865d579573)
+
+
+해당 실험을 통해 2030세대의 __자기이해에 대한 니즈__ 를 확인했지만, 그 니즈가 서비스를 사용할 동인을 가지는가에 대해서는 부정적이라는 결과를 도출했습니다.
+
+이에 따라 **`서비스 사용의 동인을 가지는, 자기이해에 대한 강력한 니즈를 가지는, 자기이해의 과정에서 ‘문제’를 겪고 있는 집단` 을  발굴하기 위해 IDI(n=26)와 성공한 퍼스널브랜더와의 전문가인터뷰를 설계/진행하며 2차 리서치를 진행했습니다.**
+
+![image](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/e0a9d8bd-9654-4d63-a414-67f08035492c)
+
+그 결과, __나로써 새로운 가치를 창출하고자하는 집단__ 은 자기이해에 대한 강력한 니즈와 그 과정에서 문제를 겪고 있다는 점을 발견했습니다. 그들은 공통적으로 ‘퍼스널 브랜딩’을 목적이자 목표로 하고 있었으며 이에 따라 저희는 ‘퍼스널 브랜딩’ 의 여정을 시작한 집단이 초기 설계 단계에서 겪는 문제를 해결할 수 있는 솔루션에 대해 고민하게 되었습니다.
+
+```csharp
+* 자기이해 *
+def) 자신의 성향과 강점, 수익 창출로의 연결이 가능한 전문성을 인지하는 것
+```
+
+> *퍼스널 브랜딩이란, 나만의 개성과 매력, 재능을 브랜드화하여 가치를 높이는 행위로 대표적인 퍼스널브랜더로는 ‘드로우앤드류’ , ‘노마드코더’ 등이 있으며 최근 SNS를 활용하여 수익화를 하는 행위가 대표적인 퍼스널 브랜딩의 결과로 볼 수 있습니다.*
+![퍼브](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/a78229d4-3f60-4968-8d36-c60d319cb309)
+
+
+  <details>
+    <summary><em>케이스 및 직군별 분류</em></summary>
+    <table>
+      <thead>
+        <tr>
+          <th style="width: 143px"><strong>유형</strong></th>
+          <th style="width: 703px"><strong>브랜딩 방식</strong></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>기업인</td>
+          <td>
+            • 소셜 미디어 활용 : LinkedIn을 통한 네트워킹 및 전문성 공유<br />
+            • 블로그 및 포트폴리오 : 자신의 전문성을 보여주는 블로그 작성<br />
+          </td>
+        </tr>
+        <tr>
+          <td>예술가 및 디자이너</td>
+          <td>
+            • 포트폴리오 웹사이트 : 작품 집필 및 디자인 스킬 공개<br />
+            • SNS 마케팅 : Instagram을 통한 자신의 스타일 전파<br />
+          </td>
+        </tr>
+        <tr>
+          <td>프리랜서</td>
+          <td>
+            • 개인 브랜드 로고 및 웹사이트 : 자신만의 로고와 웹사이트를 통해 브랜드 인식도 향상<br />
+            • 고객 리뷰 및 평가 공개 : 고객 만족도 및 신뢰도 증대<br />
+          </td>
+        </tr>
+        <tr>
+          <td>개발자</td>
+          <td>
+            • GitHub 및 Open Source 참여 : 자신의 코드를 공유하고 오픈 소스 프로젝트에 참여하여 전문성을 보여줌<br />
+            • 개인 블로그 및 튜토리얼 : 자신의 전문 분야에 대한 글쓰기 및 교육 콘텐츠 제작<br />
+            • 온라인 커뮤니티 활동 : Stack Overflow와 같은 커뮤니티에서 활발한 참여로 전문가로서의 명성 구축<br />
+          </td>
+        </tr>
+        <tr>
+          <td>기획자</td>
+          <td>
+            • 포트폴리오 제작 : 성공한 프로젝트 및 기획안을 정리하여 웹사이트에 공개<br />
+            • 네트워킹 이벤트 참여 : 업계 세미나나 모임을 통한 관계망 확장<br />
+            • 멘토링 및 강연 : 후배들에게 지도하거나 강연을 통해 경험과 지식 공유<br />
+            • 개인 블로그 : 개인 블로그나 사이트를 통한 자신의 전문 분야 글쓰기<br />
+            • 소셜 미디어 활용 : facebook, instagram, twitter 등을 통해 업게 동향 공유 및 인사이트 제공<br />
+          </td>
+        </tr>
+        <tr>
+          <td>마케터</td>
+          <td>
+            • 소셜 미디어 활용 : facebook, instagram 등을 통한 자신의 브랜드 구축. 트렌드와 시장 분석을 통한 컨텐츠 제작 및 공유<br />
+            • 케이스 스터디 및 웹세미나 진행 : 성공한 마케팅 케이스 공개 및 웹세미나를 통한 지식 전파<br />
+            • 개인 브랜드 캠페인 : 자신의 마케팅 능력을 보여주는 개인 브랜드 캠페인 실행<br />
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </details>
+
+<br />
+
+## ⚠️ **문제 & 솔루션**
+
+### 셀피스가 해결할 문제
+
+```csharp
+나를 브랜딩하여 세상에 알리고자 하는 집단이,
+퍼스널 브랜딩의 초기에 '나를 이해하는 과정' 에서 겪는 문제
+```
+
+<br>
+
+<aside>
+  
+✅ 퍼스널 브랜딩은 <strong>[인지-탐색-구축-확산-관리]</strong>의 과정을 거치며,<br>
+셀피스는 <strong>[인지-탐색-구축]</strong> 단계에서 겪는 어려움을 해결하고자 합니다.
+
+</aside>
+
+<br>퍼스널 브랜딩을 본격적으로 시작하고자 하는 사람들은, [인지-탐색-구축]의 과정에 해당되는 ‘자기이해’에 대한 강력한 동기와 문제를 가지고 있습니다. 그 중에서 저희가 해결하고자하는 문제는 다음과 같습니다. <br><br>
+
+**[1] 자기이해에 대한 어려움**
+
+퍼스널 브랜딩을 시작하는 단계에서, 자신을 정의하고 강점과 적성을 파악하는 데 어려움을 겪는다.
+
+- **나는 어떤 사람인지, 무엇을 잘하고, 무엇에 대한 열정이 있는지 파악하기 어렵다.**
+- **내가 어떤 브랜드를 구축해서 퍼스널 브랜딩을 성공시킬 수 있을지 모르겠다.**
+- **자신의 강점과 약점을 명확하게 알지 못하여 브랜드 방향 설정에 어려움을 겪는다.**
+- **타인과 차별화되는 자신만의 매력을 찾는데에 어려움이 있다.**
+
+<br>
+
+**[2] 자기이해와 퍼스널 브랜딩에 대한 이해 부족**
+
+퍼스널 브랜딩의 과정에서, 자기이해와 어떤 방법에 따라 나를 이해하고 퍼스널 브랜딩을 해야 실패하지 않을 수 있는지 모르겠다. 
+
+- **심층적으로 나의 전문성을 포지셔닝 하고싶은데, 그 방법을 모르겠다.**
+- **나와 유사한 방향성을 가진 사람들의 사례를 접하기 어렵다.**
+- **퍼스널브랜딩과 관련한 방대한 학습 자원이 산발적으로 존재해 한 곳에서의 탐색이 어렵다.**
+
+<br>
+
+### 셀피스가 제시하는 💡솔루션
+
+<aside>
+  
+🔥 퍼스널 브랜딩에 대한 니즈가 있는 집단이 브랜드 구축의 초기 단계에서 <strong>나의 정체성</strong>를 파악하고 확립하는 것을 도와준다.
+
+</aside>
+
+
+`1️⃣ 자기이해를 기반으로 한 정체성 확립`
+
+퍼스널 브랜딩 이전에, 나의 적성과 흥미 등 나를 더 잘 이해할 수 있도록 한다.
+- 간단한 과정을 통해, 자신의 흥미와 적성을 확인할 수 있다.
+- 내 흥미와 적성을 살린 브랜드 방향을 설정할 수 있다.
+- 타인과 차별화된 나만의 키워드를 확인하고, 정의한다.
+
+<br>
+
+`2️⃣ 브랜드 방향성 설정 및 정보 제공`
+
+퍼스널 브랜딩과 자기이해에 대한 교육 프로그램을 제공하여, 퍼스널브랜딩에 대한 정보 및 지식을 함양할 수 있도록 한다. 
+- 서비스에서 다 해소하지 못한 자기이해에 대한 니즈를 교육 프로그램 수강을 통해 달성한다.
+- 퍼스널 브랜딩과 관한 강의를 통해, 퍼스널 브랜딩을 더 잘할 수 있는 방법들을 학습한다.
+
+<br>
+
+## **📊 리서치 및 시장조사**
+
+### 1️⃣ 목표 시장 정의 : 왜 이 시장이 유의미한가
+
+셀피스는 퍼스널 브랜딩에 대한 여정을 시작한 집단 중에서, MVP를 통해 실제로 출시 알림 신청을 진행한 6.1% 의 전환율을 기반으로 초기 시장을 설정하였습니다. 저희는 시장 규모 및 니즈 확인을 자체 CVR 수치로 확인했으며 그 결과, 응답자 수 129명 중 21명 (6.1%)이 서비스 출시 알림을 신청했습니다.
+
+![Untitled](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/44b7af06-bd03-4087-ad41-61506c7169f3)
+
+
+### 2️⃣ 시장 성장 가능성 : 왜 이 시장이여만 하는가
+
+퍼스널 브랜딩이라는 용어에해서는 아직 다양한 정의가 존재하나, 플랫폼 사회화와 일의 패러다임 변화가 가속화되면서 퍼스널 브랜딩에 대한 시장의 관심도와 규모가 증가하고 있습니다. 저희는 해당 시장에서 고객들이 겪는 보다 뾰족한 문제를 발굴하여 해결함으로써, 퍼스널 브랜딩을 위한 자기이해 솔루션으로 거듭나고자 합니다.
+
+<details>
+<summary><h3>시장 전망 1_일의 패러다임 변화로 인한 성장가능성</h3></summary>
+<div markdown="1">
+
+<img width="40%" alt="쿨피스_ERD_2" src="https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/ec229f46-fc22-47f9-9fa7-89c100668b13">
+
+커리어의 기준이 기존의 조직 중심에서 개인 중심으로 나를 위해서 일하는 시대로 변하면서 스스로 전문적 역량을 길러 지속 가능한 수익을 창출하는 것이 중요해지고 있습니다. 더불어, 평생직장의 개념이 사라지고 새로운 직업이 생겨나면서 N잡러 등 짧고 다양한 직업으로의 전환을 통해 나만의 가치와 역량을 중심으로 업을 달성하는 주체로서의 일(work)로 변화하고 있습니다.
+
+이러한 흐름에 따라 자신의 가치관에 따라 이직을 하거나 기업/클라이언트에게 끊임없이 자신을 어필해야하는 상황에 놓이는, **즉 퍼스널 브랜딩을 해야만 하는 상황에 지속적으로 노출되는 케이스가 증가하고 있는 추세입니다.**
+
+</div>
+</details>
+
+
+<details>
+<summary><h3>시장 전망 2_플랫폼 시장의 성장 및 1인 기업의 등장</h3></summary>
+<div markdown="1">
+
+저희 팀은 다양한 플랫폼을 통해서 개인이 자신의 개성과 창의성을 수익으로 연결하는 게 가능해짐에 따라 앞으로는 회사에서 월급 받는 사람보다 플랫폼에서 정산받는 사람들이 더 많이 늘어날 전망을 포착했습니다. **즉, 나를 하나의 ‘브랜드 자산’으로 만들어 수익을 창출하는 케이스가 늘어나고 있습니다.**
+
+![Untitled (2)](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/f3411ead-63a2-46b2-a8e3-40f06031499f) | <img alt="Screenshot 2024-05-01 at 08 54 42" src="https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/41955a54-a354-4966-bc3a-c974ff1796cd">
+---|---|
+
+2021년 기준 1인미디어 산업의 총 매출은 약 2조 5천억원으로 집계되었으며, 그 중 광고(36%)와 영상제작 분야에서 높은 비율을 차지하고 있었습니다. 또한 디지털크리에이터의 전체의 64.5%가 자체 콘텐츠를 제작하고 있으며 부업으로 수행하고 있는 비율이 전체의 59.8%임을 확인할 수 있었습니다. 콘텐츠 장르의 경우, 라이프스타일(36.1%), 정보전달(30.7%)의 순으로 높은 비율을 차지하는 것으로 나타난 결과를 통해 1인미디어 산업이 **퍼스널 브랜딩의 주 수단으로서 개인의 정체성을 드러내는데 중요하게 작용할 것임을 시사하고 있으며, 저희는 이 지점에 주목하여 퍼스널 브랜딩 시장에 진입하고자 합니다.**
+
+</div>
+</details>
+
+<br>
+
+### 3️⃣ 기회 및 임팩트 예측 : 어떻게 더 잘 풀 수 있는가
+
+이 시장에서 셀피스는 ‘나를 브랜딩하여 세상에 알리고자 하는 집단이 퍼스널 브랜딩의 초기에 '나를 이해하는 과정' 에서 겪는 문제’를 ‘자기이해와 프로그램’을 통하여 해결할 것 입니다.
+
+#### 경쟁사 조사 및 차별성 도출
+
+![37](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/f804e34e-d862-48ef-810b-22514f87fe39)
+
+![경쟁사조사](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/87255791/96b8e61b-d34d-4bd8-8f5a-f6504d2474bb)
+
+<br>
+
+## **✔️ 서비스 핵심기능 및 소개**
+
+### 솔루션 가치 제안
+
+<aside>
+🔥 퍼스널 브랜딩에 대한 니즈가 있는 집단이 브랜드 구축의 초기 단계에서 **나의 정체성**를 파악하고 확립하는 것을 도와준다.
+
+</aside>
+
+`1️⃣ 자기이해를 기반으로 한 정체성 확립`
+
+자기이해_돌아보기, 정의하기를 통해 나의 정체성을 확립할 수 있게 돕는다.
+
+`2️⃣ 퍼스널 브랜딩을 위한 정보 및 교육 제공`
+
+프로그램을 통해, 퍼스널 브랜딩 / 자기이해와 관련된 강의를 수강하여 학습할 수 있도록 한다.
+
+`2️⃣ 브랜딩 방향성 구축 및 관리`
+
+마이페이지의 대시보드를 통해, 브랜딩의 방향성을 구축하고 관리할 수 있도록 한다. 
+자기이해_설계하기를 통해 방향성을 구축할 수 있다.
+
+### 기능설명
+
+<table>
+  <thead>
+    <tr>
+      <th style="width: 143px">기능</th>
+      <th style="width: 284px">설명</th>
+      <th style="width: 362px">의도</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td style="width: 143px">
+        <strong>돌아보기 Discover</strong>
+      </td>
+      <td style="width: 284px">
+        자기이해 페이지 내 테스트 중 하나로, 챗봇과의 대화를 통해 과거 나의 삶을 회고할 수 있는 기능<br />
+        → AI챗봇과의 채팅<br />
+        → 라이프디자인 기법을 기반으로 구성된질문<br />
+        → 4분면 시각화를 통한 자기이해<br />
+      </td>
+      <td style="width: 362px">
+        라이프디자인에 기반한, 챗봇과의 대화를 통해 <br />
+        회고에 사용자의 부담을 간소화 하면서도,<br />
+        자연스럽게 나를 이해할 수 있도록 함.<br />
+      </td>
+    </tr>
+    <tr>
+      <td style="width: 143px">
+        <strong>정의하기 Define</strong>
+      </td>
+      <td style="width: 284px">
+        자기이해 페이지 내 테스트 중 하나로, 홀랜드 검사 이론을 기반으로 설계된 질문과 태그형 답변 방식 제공<br />
+        → 테스트 결과 유형에 따른 조각 카드 시각화
+      </td>
+      <td style="width: 362px">
+        홀랜드 검사 이론을 기반으로, 가벼우면서도 유저에게 신뢰있는 방식으로 자기이해를 할 수 있도록 함.<br />
+        해당 기능을 통해 흥미, 적성 등을 파악할 수 있도록 함.<br />
+      </td>
+    </tr>
+    <tr>
+      <td style="width: 143px">
+        <strong>설계하기 Design</strong>
+      </td>
+      <td style="width: 284px">
+        자기이해 페이지 내 테스트 중 하나로, 내 브랜드의 방향성을 설정하는 기능<br />
+        → 분야 및 키워드 선택<br />
+        → 플랫폼 및 브랜드 가치 설정<br />
+      </td>
+      <td style="width: 362px">
+        간단한 방식으로, 퍼스널 브랜드의 방향성을 설정하고 셀피스에서 고유한 브랜드를 ‘디자인’ 하기위한 첫번째 스텝을 제공함.
+      </td>
+    </tr>
+    <tr>
+      <td style="width: 143px">
+        <strong>프로그램</strong>
+      </td>
+      <td style="width: 284px">
+        유저가 자기이해와 브랜딩을 보다 잘 할 수 있는 교육 콘텐츠 제공<br />
+        → 자기이해, 브랜딩으로 세분화된 추천<br />
+        → 자기이해, 퍼스널 브랜딩 관련 외부 프로그램 정보 상세 열람 및 신청 기능<br />
+      </td>
+      <td style="width: 362px">
+        카테고리를 3분야로 분할하여, 유저가 목적에 따라 추천 및 신청을 경험하도록 함.<br /><br />
+        [자기이해] 자기이해에 어려움과 깊은 고찰에 대한 갈망이 있는 유저의 페인포인트를 해결하기 위함.<br />
+        [브랜딩] 브랜드 방향성을 정하는 과정에서, 퍼스널브랜딩 분야에 대한 정보의 부재라는 페인포인트를 해결하기 위함.<br />
+      </td>
+    </tr>
+    <tr>
+      <td style="width: 143px">
+        <strong>마이페이지</strong>
+      </td>
+      <td style="width: 284px">
+        대시보드를 통해 유저의 활동을 시각화하고 개인 정보를 관리할 수 있는 기능<br />
+        → 나의 조각 유형 카드<br />
+        → 유형 진단 결과 그래프<br />
+        → 신청한 활동 목록<br />
+        → 정보 수정<br />
+        → 추천 콘텐츠 목록<br />
+      </td>
+      <td style="width: 362px">
+        셀피스 내에서 활동한 기록을 한 눈에 열람할 수 있도록 함.<br />
+        Define 테스트를 통해 도출된 조각 유형과 그에 대한 자세한 설명을 확인할 수 있으며, 기본정보를 수정할 수 있도록 함.<br />
+        추천 콘텐츠 목록을 통해 브랜드를 구축했지만, 유저가 브랜드를 관리하는 과정에서 겪는 어려움을 해결해줌.<br />
+      </td>
+    </tr>
+  </tbody>
+</table>
+
+### 서비스 블루프린트
+
+![블1](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/d22bbd6a-ebc7-44bc-89ba-bdc6118e2512)
+
+![블2](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/9f2ad9ea-3b1b-4e49-a04e-b35a190ae758)
+
+### Information Architecture
+
+![IA](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/10228c21-6734-47b0-b51a-363d39639699)
+
+
+### 기능명세서
+
+<table>
+            <thead>
+              <tr>
+                <th>구분</th>
+                <th>Depth 1</th>
+                <th>Depth 2</th>
+                <th>Depth 3</th>
+                <th>요구사항 상세 설명</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr>
+                <td>소셜로그인</td>
+                <td>1.소셜로그인_구글, 네이버, 카카오</td>
+                <td></td>
+                <td></td>
+                <td>
+                  소셜로그인 기능 ( 소셜로그인의 목적성에 맞게 버튼 누르자마자
+                  다른 큰 절차없이 로그인 될 수 있도록 구현 )<br />메인 →
+                  소셜로그인 버튼 입력시 기본동의만 진행하고 바로 소셜로그인 될
+                  수 있도록<br />
+                </td>
+              </tr>
+              <tr>
+                <td>기본정보</td>
+                <td></td>
+                <td>1.1. 기본정보 입력 - 필수</td>
+                <td></td>
+                <td>
+                  유저 기본 정보<br />1. 닉네임 : 중복안됨, 특수문자 입력불가<br />2.
+                  직업 <br />3. 관심분야 데이터 : 최대 3개 입력<br />
+                </td>
+              </tr>
+              <tr>
+                <td>기본정보2</td>
+                <td></td>
+                <td>1.2. 기본정보2 입력 - 필수</td>
+                <td></td>
+                <td>
+                  기본 이해도를 기반으로, 서비스내에서 자기이해를 할 수 있는
+                  기능을 다르게 제공하며 키워드를 입력받아 기본 알고리즘 세팅
+                  진행<br /><br />1. 스스로에 대한 이해도 : 1~100점까지 선택
+                  가능<br />2. 00님을 표현할 수 있는 키워드 : 최대 5개 입력<br />
+                </td>
+              </tr>
+              <tr>
+                <td>홈화면</td>
+                <td>1. 내 페르소나 묘사_로그인상태</td>
+                <td></td>
+                <td></td>
+                <td>
+                  마이데이터(내가 입력한 정보) 를 활용하여, 내가 어떤 사람인지
+                  보여주는 기능<br /><br />유저는 해당 기능을 통해, 내가 어떤 키워드를 가진 사람인지
+                    스스로를 납득시킵니다. <br /><br />[설명]<br /><br />1. 크리에이터 조각을 가진 민선님<br />2. 현재
+                  페르소나에서 나온 결괏값에 포함되는 키워드, 조각 노출<br /><br />[표기
+                  데이터]<br />1. 조각명<br />2. 닉네임<br />3. 키워드<br />-
+                  테스트 전 : 온보딩 시 입력한 5개 키워드 / - 테스트 후 : 테스트
+                  결과로 도출된 키워드 자동 배열<br />4. 조각 이미지<br />-
+                  테스트 전 : 물음표 조각 / 테스트 후 : 결과 조각<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>2. 맞춤형 경험 추천</td>
+                <td></td>
+                <td></td>
+                <td>
+                  마이데이터를 활용하여, 나에게 맞춤화된 경험을 추천하는 기능
+                  (최초 회원가입에서, 00님을 표현할 수 있는 키워드 &amp;
+                  관심분야를 기반으로)<br /><br />유저는 해당 기능을 통해, 나에게 적합한 새로운 경험을
+                    추천받을 수 있습니다.<br />1. 분야 필터<br />2. 이미지 키워드 필터<br />3. 필터
+                  새로고침<br />4. 경험 추천 미리보기<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>3. 맞춤형 프로그램 추천</td>
+                <td></td>
+                <td></td>
+                <td>
+                  자기이해를 위해, 자기이해와 관련된 세미나나 강연 등을
+                  추천해주는 기능<br />유저는 해당 기능을 통해, 나를
+                  이해하기위한 방법론을 학습할 수 있습니다.<br /><br />1. 형태
+                  필터 (온라인, 오프라인)<br />2. 금액 필터<br />3. 필터
+                  새로고침<br />4. 프로그램 미리보기<br />
+                </td>
+              </tr>
+              <tr>
+                <td>홈화면</td>
+                <td>비로그인 홈_랜딩 화면</td>
+                <td></td>
+                <td></td>
+                <td>
+                  랜딩페이지<br />마이데이터를 활용할 수 없기때문에 서비스의
+                  기능을 설명하는 랜딩페이지와 같은 역할을 합니다. <br />
+                </td>
+              </tr>
+              <tr>
+                <td>자기이해</td>
+                <td>1. 자기이해 홈</td>
+                <td></td>
+                <td></td>
+                <td>
+                  자기이해 홈은, 돌아보기 / 정의하기 / 설계하기로 이동할 수 있는
+                  페이지임과 동시에 나에 대한 이해를 보여주는 첫
+                  페이지입니다.<br />유저는 해당 기능을 통해, 퍼스널 브랜딩을
+                  위한 나를 이해하는 과정을 거치며 실제로 어떤 브랜딩을 할지
+                  설계하는 과정을 거칩니다.<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>2. 정의하기_Define</td>
+                <td>2.1. 정의 테스트 진행</td>
+                <td></td>
+                <td>
+                  현재 나는 어떤 선택을 하는 사람인지, 어떤 성격의 사람인지
+                  파악할 수 있도록 하는 기능<br />유저는 해당 기능을 통해, 나의
+                  성격, 흥미, 능력 등을 파악하여 나라는 사람을 설명할 수
+                  있습니다.<br /><br />[온보딩 테스트 방식_홀랜드 테스트 기반 ⇒
+                  조각카드 도출]<br />(feat. 조각카드 도출 로직 설명 참고)<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>2. 2. 정의 테스트 결과</td>
+                <td></td>
+                <td>
+                  유저는 총 8개의 조각 중 하나의 결과를 받습니다. 해당 조각에
+                  따라 내가 어떤 유형인지 확인할 수 있습니다.<br />1. 조각 앞면
+                  이미지 - 고정값<br />2. 조각 뒷면 이미지 - 고정 X (백엔드에서
+                  불러와야함)<br />1) 조각명<br />2) 내가 선택한 키워드<br />00형_ㅐㅐㅐ,000,xxx<br />3)
+                  같은 조각을 가진 브랜더 노출<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td>2.2.1. 이미지 저장</td>
+                <td>
+                  조각 카드 이미지가 저장되는 기능<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td>2.2. 2. 카카오로 공유</td>
+                <td>
+                  카카오톡으로 공유되는 기능 <br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>3. 돌아보기_Discover</td>
+                <td>3.1. 챗봇과 회고</td>
+                <td></td>
+                <td>
+                  챗봇과의 대화를 통해 나의 과거와 대화할 수 있도록 하는 기능<br />*챗봇의
+                  역할 : 나의 과거에 대해 물어보고 답변에 따라 그때의 감정이
+                  어땠는지 등을 물어보는 역할<br />과거 나는 주로 어떤
+                  모습이었는지, 내가 이전에 추구했던 모습들은 어땠는지 나와의
+                  대화를 통해 과거를 반성하고 돌아볼 수 있도록 하는 기능<br /><br />유저는 해당 기능을 통해, 내가 과거에는 어떤 사람이었는지,
+                    이러한 사람이었기때문에 이런행동을 했구나 등 나에 대한
+                    이해도를 높여갈 수 있습니다.<br /><br />1. 대화 주제 _ 건강,
+                    커리어, 사랑, 여가<br />2. 챗봇과 대화<br /><br />3. 대화 내용 자동 저장 (chat gpt 처럼)
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td>3.1. 1. 결과요약 미리보기</td>
+                <td>
+                  결과요약 미리보기<br />해당 기능을 통해, 채팅으로
+                    대화함으로써 가독성이 떨어지거나 한번에 그 결과를 볼 수 없는
+                    상황을 방지하여 질문과 질문에 따른 답변을 요약해서 볼 수
+                    있도록 하는 기능<br />1. 카테고리<br />2. 질문<br />3. 답변
+                    요약<br />4. 결과 보기<br
+                  />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>3. 2. 라이프 디자인 결과</td>
+                <td></td>
+                <td>
+                  1에서 대화한 내용을 기반으로, 4분면 속에 키워드를 나타나게
+                  하는 기능 (랜덤하게 키워드 도출)
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>4. 설계하기_Design</td>
+                <td></td>
+                <td></td>
+                <td>
+                  내가 설정한 이상향의 나를 확인할 수 있는 기능, 내가 되고 싶은
+                  이상향을 설정하여 더 나은 내가 되도록 유도하는 기능<br />
+                  <br />1. 나 설계하기<br />2. 내 포지셔닝 선택 <br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>3.1. 나 설계하기</td>
+                <td></td>
+                <td>
+                  진단테스트를 통해 추출된 키워드를 기반으로, 나를 이상적인 한
+                  문장으로 표현하는 기능<br />1. 분야 선택 <br />2. 키워드
+                  선택<br />3. 플랫폼 선택<br />4. 나 정의 ⇒ 나는 ---한 갓생
+                  유튜버이다<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>3.2. 내 포지셔닝 선택</td>
+                <td></td>
+                <td>
+                  나의 강점, 약점을 기반으로 4분면에 나를 위치시켜, 내가
+                  시장에서 브랜딩될 포지션을 선택하는 기능
+                </td>
+              </tr>
+              <tr>
+                <td>경험추천</td>
+                <td>홈</td>
+                <td></td>
+                <td></td>
+                <td>
+                  이상향 페르소나를 기반으로, 나를 브랜딩하여 효과적인 퍼스널
+                  브랜딩 전략을 수립할 수 있도록 새로운 경험을 추천하는 기능 (홈
+                  / 자기이해 / 브랜딩 / 콘텐츠)<br />1. 키워드 필터<br />2. 경험
+                  필터<br />3. 정렬 순서 설정<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>1.1. 경험 자세히보기</td>
+                <td></td>
+                <td></td>
+                <td>
+                  경험 추천에서 추천한 기능에 대한 상세 기능<br />1. 경험
+                  이름<br />2. 추천 게시자 : 서비스 or 유저네임<br />3. 추천
+                  키워드<br />4. 리뷰 <br />5. 신청하기<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td>1.1.4. 경험 리뷰</td>
+                <td>
+                  같은 경험을 해본, 다른 유저 (조각을 가진, 로그인한 상태) 가
+                  경험에 대한 코멘트를 남김으로써 해당 경험이 어떤 효용을
+                  가지는지 유저끼리 소통하는 기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td>1.1.5. 동참하기</td>
+                <td>
+                  동참하기 버튼을 통해 함께하고 싶은 경험을 다른 유저와 함께할
+                  수 있도록 하는 기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>1.2. 경험 게시하기</td>
+                <td></td>
+                <td>
+                  함께하고 싶은 경험을 게시하는 기능<br />1. 경험 이름<br />2.
+                  추천 키워드 설정<br />3. 모집 인원 입력<br />
+                </td>
+              </tr>
+              <tr>
+                <td>마이페이지</td>
+                <td>1. 프로필 정보</td>
+                <td></td>
+                <td></td>
+                <td>
+                  프로필의 기본정보를 관리하는 기능<br />1. 프로필사진 / 닉네임
+                  / 연결된 계정<br />2. 기본정보 1 수정<br />3. 기본정보 2
+                  수정<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>2. 내 페르소나 달성 대시보드</td>
+                <td></td>
+                <td></td>
+                <td>
+                  내가 설정한 이상향 페르소나에 얼마나 달성 중에 있는지
+                  대시보드의 형태로 보여주는 기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>2.1. Discover결과_ 내 조각 카드 열람</td>
+                <td></td>
+                <td>
+                  테스트를 통해 도출된 나의 조각카드를 열람해, 내 흥미와 적성을
+                  파악할 수 있는 기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>2. 2. Define결과_라이프디자인 결과 열람</td>
+                <td></td>
+                <td>
+                  챗봇과의 대화를 통해 도출된 라이프디자인 결과를 사분면으로
+                  확인할 수 있는 기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>2. 2. Design결과_내 페르소나 열람</td>
+                <td></td>
+                <td>
+                  설정한 내 페르소나, 브랜드의 방향성을 열람하고 수정하는 기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td></td>
+                <td>추천 브랜드 콘텐츠</td>
+                <td>
+                  내가 설정한 내 브랜드의 방향성 (= 내 페르소나) 에 맞는
+                  발행하면 좋을만한 콘텐츠의 주제, 플랫폼 등을 간단히 추천해주는
+                  기능
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>3. 신청한 프로그램</td>
+                <td></td>
+                <td></td>
+                <td>
+                  경험 추천에서 내가 ‘신청하기’를 누른 클래스들의 히스토리를
+                  목록으로 미리보기 기능<br />1. 썸네일 (사진, 제목, 활동
+                  분야)<br />2. 게시글 미리보기 노출 최대 3개<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td></td>
+                <td>3.1. 신청한 프로그램 자세히 보기</td>
+                <td></td>
+                <td>
+                  신청한 프로그램의 전체 목록을 열람할 수 있는 기능<br />1.
+                  프로그램 썸네일 (사진)<br />2. 프로그램 이름<br />3. 진행 기간
+                  (활동 일시)<br />4. 프로그램 카테고리<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>4. 정보 수정</td>
+                <td></td>
+                <td></td>
+                <td>유저의 정보를 수정할 수 있는 기능</td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>5. 탈퇴하기</td>
+                <td></td>
+                <td></td>
+                <td>
+                  탈퇴 및 유저 데이터 삭제<br />- 기존 활동 내역 및 정책 안내 →
+                  안내사항 확인 동의 체크박스 → 탈퇴하기<br />- 30일 뒤 계정
+                  삭제<br />
+                </td>
+              </tr>
+              <tr>
+                <td></td>
+                <td>6. 로그아웃</td>
+                <td></td>
+                <td></td>
+                <td></td>
+              </tr>
+            </tbody>
+          </table>
+
+
+<br>
+
+## **👀 서비스 타겟층 정의**
+
+![12](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/02cac044-9cc2-4480-91e2-abcf055e99b0)
+
+<br>
+
+> **타겟 유형 분류**
+> 
+
+<aside>
+    
+👩🏻‍🎓 **대학생, 무직자**
+
+- 퍼스널 브랜딩에 관심이 많지만, 어떻게 시작해야 할지 모르는 경우
+- 자신의 브랜드를 만들고 싶지만 관련 경험이나 지식이 부족한 경우
+- 나를 콘텐츠, 플랫폼화하여 금전적, 비금전적 가치를 창출하고 싶은 경우
+  
+</aside>
+
+<aside>
+    
+🧑🏻‍💼 **직장인, 프리랜서, 실직자**
+
+- 본업을 가지고 있으며, 퇴사/이직 후 경제활동을 준비하고 싶어하는 사람
+- 자신의 능력을 디지털 매체를 통해 알리고 싶은 사람
+- 현재 본인의 삶에 회의를 느껴 새로운 도전을 해보고 싶은 사람
+  
+</aside>
+
+<br>
+
+> **페르소나 & 유저 저니맵**
+> 
+
+![13](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/e90dfd23-bfc1-472c-a793-2057df2527b7)
+![남1](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/8a49d9ec-b527-4820-9c54-0ac6992d915a)
+
+![14](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/337ebf6b-8077-4e9b-8489-d2c78a63cc73)
+![박1](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/1145b5a6-0c79-48c6-a960-eebb3584ffd7)
+
+<br>
+
+## **📊 서비스 비즈니스 모델**
+
+![서비](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/5bfcc9b3-8ae2-442b-83a3-a8bd982eae56)
+
+<table>
+  <thead>
+    <tr>
+      <th>관련파트너 1</th>
+      <th>관련파트너 2</th>
+      <th style="width: 463px">내용</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>셀피스</td>
+      <td>유저</td>
+      <td>
+        셀피스는 서비스를 통해 유저가 궁극적으로 목표했던 ‘퍼스널 브랜드’를 구축할 수 있도록 돕습니다. 이에 따라 유저는 퍼스널 브랜딩 이전 ‘자기이해’ 에서 나아가 퍼스널 브랜딩과 관한 정보 습득, 학습 / 퍼스널 브랜딩 정체성 확립까지를 경험합니다. 그 과정에서 유료 컨텐츠나 컨설팅 프로그램을 유료 서비스화하여 (class 101과 유사한 비즈니스 로직) 프리미엄 구독제도를 도입하고자 합니다. <br /><br>
+        [프리미엄 구독 서비스 ]<br />
+        1. 페르소나 챗봇 도입을 통한 커스터마이징 기능<br />
+        2. 성격 유형 테스트(mbti 기반) 진행 기능<br />
+        3. 아카이빙 및 검사 결과 기록 저장기한 연장 : 60일 → 영구저장<br />
+        4. 브랜딩 관리를 위한 로드맵, 트래킹 툴 제공<br />
+        5. 1:1 맞춤형 컨설팅 연결<br />
+      </td>
+    </tr>
+    <tr>
+      <td>셀피스</td>
+      <td>기업 / 퍼스널브랜더</td>
+      <td>
+        서비스 확장 계획에 따라 추후 퍼스널 브랜드, 자기계발 등과 관한 기업, 성공한 퍼스널 브랜더와의 계약관계를 통해 ‘검증된 교육 컨텐츠’를 제공하고자 합니다. 이에 따라 셀피스의 이해관계자로는 유저 외에도 전문 퍼스널브랜더, 기업도 포함되며 이들은 유저에게 교육 프로그램을 제공하고, 교육프로그램 제공으로 인한 수익을 얻습니다.<br /><br>
+        추가적으로, 유료 유저에게는 1:1 맞춤형 퍼스널브랜딩 컨설턴트로써 컨설팅 세션을 제공합니다.<br />
+        1. 페이지 내 광고 배너<br />
+        2. 외부 퍼스널 브랜딩 강의 및 프로그램 파트너십<br />
+        3. 예비 브랜더 연결 및 수수료 수익<br />
+      </td>
+    </tr>
+  </tbody>
+</table>
+
+### 비즈니스 모델 캔버스
+
+![72](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/96829ad6-c450-4790-8132-c193713b515b)
+
+<br>
+
+## **🎨** 디자인 무드보드
+
+![24](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/e62b38ef-d88e-4a81-9fcb-3a483ce5aa05)
+
+![73](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/54a57fda-731b-4917-b65e-b64e7a9f4ed2)
+
+![74](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/77f14b28-c02f-40af-91a6-bb46805ac09e)
+
+![21](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/7298323f-8c6c-42c8-9143-403ce089afa9)
+
+![22](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/4b6ead9f-5f49-462a-a19d-7a0aff5f14bd)
+
+![76](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/bde2d9f5-8fbe-49bb-a23c-4073eeb2a8b2)
+
+![75](https://github.com/KUSITMS-29th-TEAM-D/29th_Semi_README/assets/113084292/b5c5b2e9-296d-4950-964c-c6e254308d76)
+
+<br>
+
+## **🌐 System Architecture**
+
+<img width="1136" alt="selpiece_아키텍처" src="https://github.com/KUSITMS-29th-TEAM-D/.github/assets/113084292/a9b2447b-fd13-40fe-82a8-ce143b2bf01f">
+
+### 프론트엔드
+
+a. Organization 레퍼지토리로Vercel 배포를 진행할 경우 유료 서비스를 이용해야 하기에, Fork Repository 배포용으로 활용함
+
+b. Git Flow 전략을 사용하여 각 로컬에서 개발을 진행한 후, Organization Main Brach로 Merge 진행
+
+c. Github Actions가 동작하여 Fork 레퍼지토리로 자동 동기화 진행
+
+d. Vercel 동작하며 배포 완료
+
+e. 추가적으로, Organization 레퍼지토리와 Slack을 연동하여 PR 또는 Merge가 완료되면 알림을 받을 수 있도록 함
+
+### 백엔드
+
+a. Git Flow 전략을 사용하여 각 로컬에서 개발을 진행한 후, Github Develop Branch에 Merge 진행
+
+b. Github Actions가 동작하여 build된 jar파일을 이미지화하여 NCP Container Registry에 Push
+
+c. NCP 서버에 접속한 후 이미지를 Pull 받아 컨테이너 생성 및 실행
+
+d. Nginx의 리버스 프록시를 새롭게 생성된 컨테이너로 변경하여 새로운 버전으로 배포 완료
+
+e. 기존 컨테이너 실행 종료
+
+<br><br>
+
+## **📜 ERD**
+
+<img width="1404" alt="image" src="https://github.com/KUSITMS-29th-TEAM-D/.github/assets/113084292/53b297da-61b7-48e3-b825-1552c8e404d0">
+
+<br><br>
+
+## **🛠️ Stacks**
+
+### **📘 Web/Android**
+
+  <img src="https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=react&logoColor=black"> <img src="https://img.shields.io/badge/Typescript-3178C6?style=flat-square&logo=typescript&logoColor=white"> <img src="https://img.shields.io/badge/Styled Components-DB7093?style=flat-square&logo=styled-components&logoColor=white"/> <img src="https://img.shields.io/badge/Vite-646CFF?style=flat-square&logo=vite&logoColor=white"> <img src="https://img.shields.io/badge/Recoil-3578E5?style=flat-square&logo=recoil&logoColor=white"> <img src="https://img.shields.io/badge/Axios-5A29E4?style=flat-square&logo=axios&logoColor=white"> <img src="https://img.shields.io/badge/Vercel-000000?style=flat-square&logo=vercel&logoColor=white">
+
+**`React`**
+- React로 UI 요소들을 컴포넌트로 분리하여 개발하여 컴포넌트의 재사용성을 용이하게 하고자 했습니다. 이를 통해, 코드 수정 및 유지보수를 효율적으로 할 수 있어 선정하게 되었습니다.
+- React의 다양한 라이브러리와 플러그인을 통해 개발 생산성을 향상시킬 수 있어 선정하게 되었습니다.
+- 무엇보다 빠르게 진행되어야 하는 밋업데이 프로젝트이기 때문에 프론트 개발 파트 모두가 능숙하고 빠르게 작업할 수 있는 React를 선정했습니다.
+  
+**`Typescript`** 
+- 타입 추가로 인해 안정적인 개발과 높은 수준의 코드 품질을 유지하여 컴파일 에러 예방, 손쉬운 디버깅을 가능하도록 하고자 선정하게 되었습니다.
+
+**`Styled Components`**  
+- Styled Components를 통해 컴포넌트 스타일링을 쉽게 구현하고 동적인 스타일, 조건부 스타일을 적용할 수 있어 선정하게 되었습니다.
+- CSS를 컴포넌트 기반으로 스타일을 정의하고 관리하여 컴포넌트 지향적인 스타일링 구현, 전역 스타일 충돌을 방지하고자 선정하게 되었습니다.
+- 특히, 이번 프로젝트의 경우 디자인 요소가 매우 중요하게 다뤄지고 있으며, 여러 가지 variant를 포괄할 수 있는 디자인 컴포넌트 제작에 Styled Components가 용이할 것 같아 선정하게 되었습니다.
+
+**`Vite`**  
+- 빠른 개발 속도와 번들링을 위해 선정하게 되었습니다.
+
+**`Recoil`**  
+- Recoil은 React를 위한 상태 관리 라이브러리이기 때문에, React의 기본적인 훅(hook)과 개념을 활용하여 상태 관리를 보다 쉽고 직관적으로 할 수 있어 선정하게 되었습니다.
+- 특히, 프론트 개발 파트 모두 사용할 수 있는 라이브러리였기 때문에 Recoil을 선정하게 되었습니다.
+
+**`Axios`**  
+- 크로스 브라우징 최적화로 브라우저 호환성이 뛰어나며, Javascript 내장 라이브러리인 fetch와 다르게 오래된 브라우저 지원 불가에 대한 걱정이 필요하지 않아 선정하게 되었습니다.
+- Promise 기반으로 만들어졌기 때문에 데이터를 다루기 편리합니다. 뿐만 아니라, 많은 기능을 제공하고 있어 요청과 응답을 보다 쉽게 다룰 수 있는 편의성이 있어 선정하게 되었습니다.
+
+**`Vercel`**
+- Vercel은 서버리스 아키텍쳐 기반으로, 사이트가 원활하게 작동하도록 모든 관리 작업을 처리합니다. 뿐만 아니라, CI/CD를 쉽게 설정할 수 있습니다. 따라서 개발자가 코드 개발 외적으로 관리해야 할 요소를 줄여줍니다.
+- CDN을 통해 전 세계 여러 위치에 제공하여 빠른 로딩 속도와 확장성을 제공합니다.
+
+<br>
+
+### **📗 Server**
+
+<img src="https://img.shields.io/badge/JDK 17-007396?style=flat-square&logo=openjdk&logoColor=white"> <img src="https://img.shields.io/badge/Spring boot 3.2.4-6DB33F?style=flat-square&logo=springboot&logoColor=white"> <img src="https://img.shields.io/badge/Gradle-02303A?style=flat-square&logo=gradle&logoColor=white"> <img src="https://img.shields.io/badge/Spring security-6DB33F?style=flat-square&logo=springsecurity&logoColor=white"> <img src="https://img.shields.io/badge/JWT-FC494A?style=flat-square&logo=jsonwebtokens&logoColor=white"> <img src="https://img.shields.io/badge/Redis-DC382D?style=flat-square&logo=redis&logoColor=white"> <img src="https://img.shields.io/badge/Hibernate-59666C?style=flat-square&logo=hibernate&logoColor=white"> <img src="https://img.shields.io/badge/MySQL-4479A1?style=flat-square&logo=mysql&logoColor=white"> <img src="https://img.shields.io/badge/Nginx-009639?style=flat-square&logo=Nginx&logoColor=white"> <img src="https://img.shields.io/badge/Docker-2496ED?style=flat-square&logo=Docker&logoColor=white"> <img src="https://img.shields.io/badge/Github Actions-2088FF?style=flat-square&logo=Github Actions&logoColor=white">
+
+**`Spring Boot`**
+- 두 팀원의 주 스택인 Spring Boot 프레임워크를 사용하여 백엔드 개발을 진행했습니다.
+- 설정이 간소화되어 있어 빠른 프로젝트 생성이 가능했고, 내장된 톰캣 서버로 간편한 애플리케이션 배포를 할 수 있었습니다.
+
+**`Gradle`**
+- Gradle 을 의존성 관리 및 빌드 도구로 선택하였습니다.
+- 다양한 플러그인 지원 덕분에 유연하게 프로젝트를 구성할 수 있었고, 빠르게 의존성을 추가하고 변경할 수 있어 시간 효율적인 부분에서 이점이 있다 판단하였습니다.
+  
+**`Spring Security`**
+- Spring Security의 다양한 인증 및 권한 부여 기능을 활용하여 보안을 강화했고, 사용자 인증 및 접근 제어를 구현하였습니다.
+- 특히, OAuth2.0 프로토콜을 통해 백엔드 측에서 대부분의 소셜 로그인 동작 과정을 구현하며 빠르게 로그인 과정을 개발할 수 있었습니다.
+- 또한 설정 부분에서 Spring Security와 다양한 config 파일을 통해 체계적으로 관리하였습니다.
+
+**`JPA(Hibernate)`**
+- JPA(Hibernate)는 객체와 관계형 데이터베이스 간의 매핑을 단순화하여 데이터베이스에 대한 복잡한 SQL 쿼리를 작성하지 않고도 데이터를 다룰 수 있게 도와주었습니다.
+- 프로그램 필터링과 같이 조금 더 복잡한 쿼리가 필요할 때는, JPQL을 사용하여 쿼리를 직접 정의하여 사용했습니다.
+
+**`MySQL`**
+- MySQL은 안정적이고 높은 성능을 제공하는 오픈 소스 관계형 데이터베이스 관리 시스템(RDBMS)으로, 대용량 데이터 처리와 트랜잭션 처리에 효과적이라는 장점이 존재합니다.
+- 백엔드 팀원 모두 주로 사용해 온 스택이었기에, 빠르고 문제 없이 DB 구축을 진행할 수 있었습니다.
+
+**`Redis & JWT & Cookie`**
+- Redis는 메모리 기반의 데이터 저장소로, 소셜 로그인 과정에서 Refresh Token을 저장하는 용도로 활용하였습니다.
+- JWT토큰 기반의 인증 방식을 사용하여, Access & Register & Refresh토큰을 발행하며 사용자 인증 및 권한 부여 & 등록 절차를 수행했습니다.
+- 액세스 토큰을 재발행 하는 경우에, 쿠키와 Redis에 각각 담긴 Refresh Token을 비교하여 맞는 경우에만 재발행 하였습니다.또한 토큰 탈취 시 악용을 방지하기 위해서, 재발행 이후에 Refresh Token도 새롭게 재발행 하여 저장했습니다.
+
+**`Nginx`**
+- HTTP 서버, 로드 밸런서, 리버스 프록시등 다양한 기능을 통해 트래픽을 새로운 버전의 애플리케이션으로 원활하게 전환할 수 있습니다.
+- 또한 SSL 지원, 접근 제어 기능을 통해 보안 설정에 유리합니다.
+- 리액트와의 연동을 위한 https 인증 및 블루그린 배포에 사용되었습니다.
+
+**`Docker & Docker Compose`**
+- CI/CD를 진행 할 때 실행 가능한 서버 애플리케이션을 Docker를 통해 컨테이너화 시켜 서버 환경에서 쉽게 실행할 수 있게 합니다.
+- 따라서 개발, 테스트, 배포를 빈번하게 해야 하는 밋업데이에서 각 환경 간의 일관성을 유지하고, 자동화를 쉽게 할 수 있습니다
+- 웹 서버, 데이터베이스와 같은 여러 개의 서비스를 단일 파일(docker-compose.yml)에서 관리할 수 있어, 각 서비스의 일관된 환경을 유지할 수 있습니다.
+
+**`Github Actions`**
+- Github에서 제공하는 CI/CD 프로세스입니다.
+- CI/CD는 Github Actions이외에 Jenkins와 같은 도구로도 구현이 가능하지만, 서버 구축에 많은 시간을 투자할 수 없는 밋업데이 특성상 클라우드 인스턴스가 추가로 필요한 기타 툴들에 비해 강점을 가지고 있다고 판단했습니다.
+- 또한 Github과의 완벽한 통합으로 설정과 관리가 쉽습니다.
+
+**`NCP(Naver Cloud Platform) & Object Storage`**
+- 확장성과 유연성을 바탕으로 다양한 인스턴스를 효율적으로 관리 및 배포할 수 있습니다.
+- 체계적인 가이드라인을 제공해 빠르고 정확하게 서버 구축이 가능합니다.
+- 또한 서비스에서 사용하는 Naver CLOVA Studio와 같은 Naver의 다른 서비스와의 통합이 용이합니다.
+- 데이터 무결성 및 복원력을 보장하고 초대용량 데이터를 저장할 수 있기에 활용하였습니다.
+   
+<br>
+
+### **🗣️ Co-working-Tool**
+
+<img src="https://img.shields.io/badge/GitHub-181717?style=flat-square&logo=github&logoColor=white"/> <img src="https://img.shields.io/badge/Slack-4A154B?style=flat-square&logo=slack&logoColor=white"/> <img src="https://img.shields.io/badge/Notion-000000?style=flat-square&logo=notion&logoColor=white"/> <img src="https://img.shields.io/badge/Figma-F24E1E?style=flat-square&logo=figma&logoColor=white"/> <img src="https://img.shields.io/badge/Postman-FF6C37?style=flat-square&logo=postman&logoColor=white"/>
+
+<br>
+
+## 🎥 시연 영상
+
+링크 : https://youtu.be/jgDSXNzTFo4
+
+<br>
+
+## 🔖 Naming Rules
+
+### **📘 Web/Android**
+
+- **컴포넌트명 (components)**
+    - **폴더명** : 컴포넌트랑 직접적인 폴더명은 PascalCase 사용
+    - **파일명** : PascalCase 사용
+- **함수명, 변수명, 이미지 파일명** : camelCase 사용
+- **상수명** : SNAKE_CASE 사용
+- **타입명** : PascalCase 사용
+
+### **📗 Server**
+
+- **패키지명** : 한 단어 소문자 사용 `Ex) service`
+- **클래스명** : 파스칼 케이스 사용 `Ex) JwtUtil`
+- **메서드명** : 카멜 케이스 사용, 동사로 시작  `Ex) getUserScraps`
+- **변수명** : 카멜 케이스 사용 `Ex) jwtToken`
+- **상수명** : 대문자 사용 `Ex) EXPIRATION_TIME`
+- **컬럼명** : 스네이크 케이스 사용 `Ex) users_id`
+
+<br>
+
+## **️🔏 Commit Convention**
+
+### **📘 Web/Android**
+
+- 형식: `태그: 커밋 내용 (#이슈번호)`
+
+### **📗 Server**
+- 이슈 번호 붙여서 커밋 `Ex) #4 [feat] : 로그인 기능 구현`
+- Body는 추가 설명 필요하면 사용
+
+### **📌 Type**
+
+| commit 명    | commit 뜻 |
+|-------------| --- |
+| `feat`      | 새로운 기능 추가 / 일부 코드 추가 / 일부 코드 수정 (리팩토링과 구분) / 디자인 요소 수정 |
+| `fix`       | 버그 수정 |
+| `refactor`  | 코드 리팩토링 |
+| `style`      | 코드 의미에 영향을 주지 않는 변경사항 (코드 포맷팅, 오타 수정, 변수명 변경, 에셋 추가) |
+| `chore`      | 빌드 부분 혹은 패키지 매니저 수정 사항 / 파일 이름 변경 및 위치 변경 / 파일 삭제 |
+| `docs`       | 문서 추가 및 수정 |
+| `rename`      | 패키지 혹은 폴더명, 클래스명 수정 (단독으로 시행하였을 시) |
+| `remove`      | 패키지 혹은 폴더, 클래스를 삭제하였을 때 (단독으로 시행하였을 시) |
+
+<br>
+
+## **🔀 Git Flow**
+
+- 생성한 이슈에 따라서 브랜치 생성 `Ex) feature/#4/login`
+
+| 브랜치 명 | 설명                                                     |
+|------|--------------------------------------------------------|
+| `main` | 소프트웨어 제품 배포하는 용도로 쓰는 브랜치                               |
+| `develop` | 개발용 default 브랜치로, 이 브랜치를 기준으로 feature 브랜치를 따고, 합치는 브랜치 |
+| `feat` | 단위 기능 개발용 브랜치                                          |
+| `fix`  | 단위 기능 개발 수정용 브랜치                                       |
+| `hotfix` | main branch에 배포 코드가 합쳐진 후, 버그 발생 시 긴급 수정하는 브랜치         |