Merge pull request #451 from boostcampwm2023/dev

release v0.1.2
boostcampwm2023 · Dec 14, 2023 · 8f30116 · 8f30116
2 parents 75501e0 + a1a2257
commit 8f30116
Show file tree

Hide file tree

Showing 50 changed files with 3,236 additions and 700 deletions.
diff --git a/.github/workflows/blue-green-cd.yml b/.github/workflows/blue-green-cd.yml
@@ -28,6 +28,7 @@ jobs:
           echo "TURN_SERVER_NAME=${{ secrets.TURN_SERVER_NAME }}" >> .env
           echo "TURN_SERVER_USER=${{ secrets.TURN_SERVER_USER }}" >> .env
           echo "TURN_SERVER_PASSWORD=${{ secrets.TURN_SERVER_PASSWORD }}" >> .env
+          echo "SENTRY_DSN=${{ secrets.SENTRY_DSN }}" >> .env
           mkdir -p config/nginx/ssl/
           echo "${{ secrets.SSL_OPTIONS }}" > config/nginx/ssl/options-ssl-nginx.conf
           echo "${{ secrets.SSL_FULLCHAIN }}" > config/nginx/ssl/fullchain.pem
@@ -54,8 +55,8 @@ jobs:
       - name: Build & Push Docker Images (Blue & Green)
         run: |
           cd backend
-          docker-compose -f docker-compose.blue.yml build
-          docker-compose -f docker-compose.green.yml build
+          docker-compose -f docker-compose.blue.yml build --no-cache
+          docker-compose -f docker-compose.green.yml build --no-cache
           docker-compose -f docker-compose.blue.yml push
           docker-compose -f docker-compose.green.yml push
 

diff --git a/README.md b/README.md
@@ -1,73 +1,132 @@
-# 🐚 AI 타로 상담 플랫폼, 마법의 소라고둥
+<h1>
+    <div style="display:flex; gap: 10px; align-items: flex-start;">
+        <img width="26px" src="https://github.com/boostcampwm2023/web09-MagicConch/assets/78946499/9cd198bb-9692-48f1-82f0-2712fb643442">
+        <span>AI•실시간 화상 타로 상담 플랫폼, 마법의 소라고둥</span>
+    </div>
+</h1>
 
 <div align="center">
-    <img width="50%" src="https://i.namu.wiki/i/PL7LVIJzznngYB7q1QxX8rUe3HuW6VhR8pr0nErNhdRwXK2uoKY-Ssn_0feqOYo3JxNs7DUWp0eo88h_cD7iIaeV0jzpEZjRYuLaqrFRf6bVF0q1hKY-Veogwzfs58mOMT5FyNd_PCDDZ_EQr0LxHw.webp">
+    <img src="https://github.com/boostcampwm2023/web09-MagicConch/assets/70785620/86b4bc38-c65c-4e85-bcd3-69abfd12020c">
 </div>
 
-<br>
 
-## 프로젝트 소개
+<br>
 
-<div style="display:flex; align-items: center; gap: 20px;">
-  <img width="15%" src="https://github.com/boostcampwm2023/web09-MagicConch/assets/78946499/9cd198bb-9692-48f1-82f0-2712fb643442">
-  <div>
-    <li>
-        <a href="https://season-broccoli-784.notion.site/Team-note-9d1bcc23f7ba463384fae13743f42c16?pvs=4">
-            팀 노트 ( Notion )
-        </a>
-    </li>
-    <li>
-        <a href="https://www.figma.com/file/mG05301Mt21mIKJsKfinQo/%EB%A7%88%EB%B2%95%EC%9D%98-%EC%86%8C%EB%9D%BC%EA%B3%A0%EB%91%A5?type=design&node-id=0%3A1&mode=design&t=l5EMlyi9zZUJd3K3-1">
-            디자인 ( Figma )
-        </a>    
-    </li>  
-    <li>
-        <a href="https://www.figma.com/file/0fv1lWfZ5W4zncvXAMTfh9/Component-%EC%84%A4%EA%B3%84?type=whiteboard&node-id=0%3A1&t=2VM3UFiJcQ14ggZO-1">
-            Component 설계 ( Figjam )
-        </a>
-    </li>  
-    <li>
-        <a href="https://github.com/orgs/boostcampwm2023/projects/19">
-            Project 관리 (GitHub Projects)
-        </a>
-    </li> 
-  </div>
+<div align=center>
+    <h2 style="text-align: center">
+        <div>🌠매력적인 애니메이션과 함께 즐기는🌠<br> 🔮AI•실시간 화상 타로 상담🔮</div>
+    </h2>
+    <div><b>"한 번쯤은 타로 점을 쳐보고 싶지만, 시간과 돈을 투자하면서 보긴 귀찮아..."</b></div>
+    <br>
+    <div>걱정하지 마세요!<br><b>AI 타로 상담사</b>와 함께 언제 어디서든 무료로 타로 상담을 즐길 수 있어요 💫 <br> 원하는 타로 상담사와 <b>실시간 화상 타로 상담</b>도 가능하답니다. <br> 고민이나 궁금증, 어떤 주제든 자유롭게 이야기해보세요 🌌</div>
+    <br>
+    <div>함께 나누는 이야기를 통해, 더 나은 미래를 상상하는 시간이 되길 바라요 🔮 <br> 생동적인 애니메이션과 함께, 당신만의 특별한 타로 체험을 즐겨보세요 ✨</div>
+    <br></br>
+    <div>
+        🔗 <a href="https://web09-magicconch.pages.dev">배포 링크</a>
+        &nbsp|&nbsp 
+        🎥 <a href="https://github.com/boostcampwm2023/web09-MagicConch/wiki/%EC%A3%BC%EC%9A%94-%EA%B8%B0%EB%8A%A5-%EB%B0%8F-%EC%8B%9C%EB%82%98%EB%A6%AC%EC%98%A4">주요 기능 및 시나리오</a>
+    </div>
+    <br/>
+    <div>
+        💡 <a href="https://github.com/boostcampwm2023/web09-MagicConch/wiki/%EA%B8%B0%ED%9A%8D%EC%84%9C">기획서</a>
+        &nbsp|&nbsp
+        📋 <a href="https://www.notion.so/Product-Backlog-88058d924740408a952ee52792adb375">백로그</a>
+        &nbsp|&nbsp
+        📚 <a href="https://season-broccoli-784.notion.site/8c30523a4b4d47039baf6fd5e7e90b2c?v=b39be6c6aa4e42089a8bb612404e9ab2">기술블로그</a>
+    </div>
+    <br/>
+    <div>
+        🗒️ <a href="https://season-broccoli-784.notion.site/Team-note-9d1bcc23f7ba463384fae13743f42c16?pvs=4">팀 노션</a>
+        &nbsp|&nbsp
+        🌐 <a href="https://github.com/boostcampwm2023/web09-MagicConch/wiki">위키</a>
+    </div>
+    <br>
+    <a href="https://hits.seeyoufarm.com"><img src="https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fboostcampwm2023%2Fweb09-MagicConch&count_bg=%238350C6&title_bg=%23555555&icon=github.svg&icon_color=%23E7E7E7&title=hits&edge_flat=false"/></a>
+    <br><br>
+    🔗 <a href="https://github.com/boostcampwm2023/web09-MagicConch?tab=readme-ov-file#%EC%9A%B0%EB%8B%B9%ED%83%95%ED%83%95-%EC%9D%B4%EC%8A%88-%ED%95%B4%EA%B2%B0%EA%B8%B0-">우당탕탕 이슈 해결기</a> 💦
 </div>
 
 <br>
 
-## 브랜치 전략
+## 시스템 아키텍처
+<div align="center">
+    <img src="https://github.com/boostcampwm2023/web09-MagicConch/assets/70785620/f3ad78e5-5fea-4bd8-a50e-022cf5122485" width="80%"/>
+</div>
 
-- main(기본) - dev(개발) - feature branch
-- 이슈별로 브랜치 생성
-- 브랜치 네이밍 규칙
-  - `{FE/BE}/feature/{issue-number}-{feature-name}`
-  - `{FE/BE}/bugfix/{issue-number}-{bugfix-name}`
-  - `{FE/BE}/refactor/{issue-number}-{refactor-name}`
-- husky로 commit message 이슈 연결 자동화
-- PR merge 시, rebase merge
+<br>
+
+## 기술 스택
+<table>
+  <th>구분</th>
+  <th>기술 스택</th>
+  <tr>
+    <td align="center"><b>common</b></td>
+    <td>
+      <img src="https://img.shields.io/badge/typescript-%23007ACC.svg?style=flat&logo=typescript&logoColor=white" />
+      <img src="https://img.shields.io/badge/ESLint-4B3263?style=flat&logo=eslint&logoColor=white" />
+      <img src="https://img.shields.io/badge/Prettier-F7B93E?style=flat&logo=Prettier&logoColor=white" />
+      <img src="https://img.shields.io/badge/dotenv-ecd53f?style=flat&logo=dotenv&logoColor=white" />
+      <img src="https://img.shields.io/badge/Socket.io-black?style=flat&logo=socket.io&badgeColor=010101" />
+    </td>
+  </tr>
+  <tr>
+    <td align="center"><b>frontend</b></td>
+    <td>
+      <img src="https://img.shields.io/badge/React-%2320232a.svg?style=flat&logo=React&logoColor=%2361DAFB" />
+      <img src="https://img.shields.io/badge/React%20Query-FF4154?style=flat&logo=react%20query&logoColor=white" />
+      <img src="https://img.shields.io/badge/Zustand-000000?style=flat&logo=zustand&logoColor=white" />
+      <img src="https://img.shields.io/badge/TailwindCss-06B6D4.svg?style=flat&logo=tailwindcss&logoColor=white" />
+      <img src="https://img.shields.io/badge/WebRTC-DB4437.svg?style=flat&logo=WebRTC&logoColor=white" />
+    </td>
+  </tr>
+  <tr>
+    <td align="center"><b>backend</b></td>
+    <td>
+      <img src="https://img.shields.io/badge/nestjs-%23E0234E.svg?style=flat&logo=nestjs&logoColor=white" />
+      <img src="https://img.shields.io/badge/TypeORM-fe0902.svg?style=flat&logo=TypeORM&logoColor=white" />
+    </td>
+  </tr>
+  <tr>
+    <td align="center"><b>DB<b></td>
+    <td>
+      <img src="https://img.shields.io/badge/mysql-00758f.svg?style=flat&logo=mysql&logoColor=white" />
+    </td>
+  </tr>
+  <tr>
+    <td align="center"><b>CI/CD</b></td>
+    <td>
+      <img src="https://img.shields.io/badge/github%20actions-%232671E5.svg?style=flat&logo=githubactions&logoColor=white" />
+    </td>
+  </tr>
+  <tr>
+    <td align="center"><b>deployment</b></td>
+    <td>
+      <img src="https://img.shields.io/badge/Cloudflare-F38020?style=flat&logo=Cloudflare&logoColor=white" />
+      <img src="https://img.shields.io/badge/docker-%230db7ed.svg?style=flat&logo=docker&logoColor=white" />
+      <img src="https://img.shields.io/badge/nginx-%23009639.svg?style=flat&logo=nginx&logoColor=white" />
+      <img src="https://img.shields.io/badge/%20Naver%20Cloud%20Platform-03C75A?logo=naver&logoColor=white" />
+    </td>
+  </tr>
+</table>
 
 <br>
 
-## 업무 방식
+### 우당탕탕 이슈 해결기 💦
+> 타로 밀크티의 기술적 도전과 이슈 해결 기록
 
-- `월-목` `10시-19시` 코어타임에 정해진 장소에서 `대면`으로 작업한다.
-- 최대한 코어타임 내에만 활동하기를 지향한다.
-- 이슈 해결 시에 바로 PR을 날리고 `코드 리뷰`를 요청한다.
-- 코드 리뷰는 `일관성`, `가독성`, `컨벤션 확인`, `코드의 이해`를 목표로 한다.
-- 당일 PR은 당일 리뷰를 목표로 한다.
-- 코드 리뷰 단계적 코멘트를 적용한다.
-  - ⚠️ : 꼭 반영해줘 (버그/성능이슈 포함!!)
-  - ❓: 질문!
-  - 👍 : 각종 칭찬,,,
-  - ✨ : 코드 스타일 통일하자??
-  - 💬 : 그냥 comment
-- `18시`까지 PR을 날리지 못하면, 그 이유에 대해서 함께 `회고`한다.
-- `18시-19시`에는 그 날의 이슈를 공유하고, `문서화`를 하는 시간을 갖는다.
+- [[BE] 야 너두 무중단 배포 할 수 있어](https://github.com/boostcampwm2023/web09-MagicConch/wiki/%EC%95%BC-%EB%84%88%EB%91%90-%EB%AC%B4%EC%A4%91%EB%8B%A8-%EB%B0%B0%ED%8F%AC-%ED%95%A0-%EC%88%98-%EC%9E%88%EC%96%B4)
+- [[FE] 인터랙티브 웹: 카드 애니메이션](https://github.com/boostcampwm2023/web09-MagicConch/wiki/%EC%9D%B8%ED%84%B0%EB%9E%99%ED%8B%B0%EB%B8%8C-%EC%9B%B9:-%EC%B9%B4%EB%93%9C-%EC%95%A0%EB%8B%88%EB%A9%94%EC%9D%B4%EC%85%98)
+- [[FE/BE] UX를 위해 AI 채팅 반응 속도를 84.87%까지 개선한 방법 😎](https://github.com/boostcampwm2023/web09-MagicConch/wiki/UX%EB%A5%BC-%EC%9C%84%ED%95%B4-AI-%EC%B1%84%ED%8C%85-%EB%B0%98%EC%9D%91-%EC%86%8D%EB%8F%84%EB%A5%BC-84.87%25%EA%B9%8C%EC%A7%80-%EA%B0%9C%EC%84%A0%ED%95%9C-%EB%B0%A9%EB%B2%95-%F0%9F%98%8E)
 
 <br>
 
-## 🔮🥛 타로 밀크티: 팀원
+## 🔮🥛 타로 밀크티 소개
+> 타로 밀크티는 **FE 3명 & BE 1명** 으로 구성되어 있어요!!
+> 
+> 인원 불균형을 해결하기 위해 FE 팀원들의 ✨ **풀스택 도전** ✨이 담겨 있어요~ 덕분에 BE 팀원은 처음 해보는 배포와 인프라를 성공적으로 마칠 수 있었습니다 🥰
+> 
+> 자세한 담당 업무는 [여기](https://github.com/boostcampwm2023/web09-MagicConch/wiki/팀-소개)를 확인해주세요 👍  
 
 <table>
   <th>J027</th>

diff --git a/backend/config/nginx/default.conf b/backend/config/nginx/default.conf
@@ -7,20 +7,6 @@ server {
         root /var/www/certbot;
     }
 
-    location /turn {
-        proxy_pass http://coturn-server:3478;
-        proxy_redirect default;
-        proxy_set_header Host $host;
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_set_header X-Forwarded-Proto $scheme;
-        proxy_set_header X-Forwarded-Host $server_name;
-
-        proxy_http_version 1.1;
-        proxy_set_header Upgrade $http_upgrade;
-        proxy_set_header Connection "upgrade";
-    }
-
     location /signal {
         proxy_pass http://signal-blue:3001;
         proxy_redirect default;
@@ -62,20 +48,6 @@ server {
     include /etc/letsencrypt/options-ssl-nginx.conf;
     ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
 
-    location /turn {
-        proxy_pass http://coturn-server:3478;
-        proxy_redirect default;
-        proxy_set_header Host $host;
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_set_header X-Forwarded-Proto $scheme;
-        proxy_set_header X-Forwarded-Host $server_name;
-
-        proxy_http_version 1.1;
-        proxy_set_header Upgrade $http_upgrade;
-        proxy_set_header Connection "upgrade";
-    }
-
     location /signal {
         proxy_pass http://signal-blue:3001;
         proxy_redirect default;

diff --git a/backend/deploy.sh b/backend/deploy.sh
@@ -9,7 +9,7 @@ run_docker() {
 
   DOCKER_COMPOSE_FILE="docker-compose.$RUN_TARGET.yml"
 
-  echo "<<< Run docker compose : $DOCKER_COMPOSE_FILE" >> $DEBUG_LOG
+  echo "<<< Run docker compose : $DOCKER_COMPOSE_FILE" > $DEBUG_LOG
 
   docker-compose -f "$DOCKER_COMPOSE_FILE" pull
   docker-compose -f "$DOCKER_COMPOSE_FILE" up -d

diff --git a/backend/docker-compose.blue.yml b/backend/docker-compose.blue.yml
@@ -18,6 +18,7 @@ services:
       - X_NCP_CLOVASTUDIO_API_KEY=${X_NCP_CLOVASTUDIO_API_KEY}
       - X_NCP_APIGW_API_KEY=${X_NCP_APIGW_API_KEY}
       - PORT=3000
+      - SENTRY_DSN=${SENTRY_DSN}
     expose:
       - "3000"
     volumes:
@@ -35,16 +36,6 @@ services:
     expose:
       - "3001"
 
-  coturn-server:
-    image: "coturn/coturn"
-    container_name: "coturn-server"
-    environment:
-      - TURN_SERVER_NAME=${TURN_SERVER_NAME}
-      - TURN_SERVER_USER=${TURN_SERVER_USER}
-      - TURN_SERVER_PASSWORD=${TURN_SERVER_PASSWORD}
-    expose:
-      - "3478"
-
   nginx:
     container_name: "nginx-reverse-proxy"
     build:
@@ -56,7 +47,6 @@ services:
     depends_on:
       - was-blue
       - signal-blue
-      - coturn-server
       - certbot
     volumes:
       - /var/log/nginx:/var/log/nginx

diff --git a/backend/docker-compose.green.yml b/backend/docker-compose.green.yml
@@ -18,6 +18,7 @@ services:
       - X_NCP_CLOVASTUDIO_API_KEY=${X_NCP_CLOVASTUDIO_API_KEY}
       - X_NCP_APIGW_API_KEY=${X_NCP_APIGW_API_KEY}
       - PORT=3002
+      - SENTRY_DSN=${SENTRY_DSN}
     expose:
       - "3002"
     volumes:
@@ -35,16 +36,6 @@ services:
     expose:
       - "3003"
 
-  coturn-server:
-    image: "coturn/coturn"
-    container_name: "coturn-server"
-    environment:
-      - TURN_SERVER_NAME=${TURN_SERVER_NAME}
-      - TURN_SERVER_USER=${TURN_SERVER_USER}
-      - TURN_SERVER_PASSWORD=${TURN_SERVER_PASSWORD}
-    expose:
-      - "3478"
-
   nginx:
     container_name: "nginx-reverse-proxy"
     build:
@@ -56,7 +47,6 @@ services:
     depends_on:
       - was-green
       - signal-green
-      - coturn-server
       - certbot
     volumes:
       - /var/log/nginx:/var/log/nginx

diff --git a/backend/signal/package-lock.json b/backend/signal/package-lock.json
diff --git a/backend/signal/package.json b/backend/signal/package.json
@@ -27,7 +27,7 @@
     "@nestjs/platform-express": "^10.0.0",
     "@nestjs/platform-socket.io": "^10.2.10",
     "@nestjs/websockets": "^10.2.10",
-    "@tarotmilktea/human-socketio-event": "^2.0.1",
+    "@tarotmilktea/human-socketio-event": "^2.0.2",
     "reflect-metadata": "^0.1.13",
     "rxjs": "^7.8.1",
     "socket.io": "^4.7.2",