🎥 시연 영상

🏆 카카오 클라우드 스쿨 우수 프로젝트 수상

👨‍👨‍👧‍👧 팀원

Name	손병주 (팀장)	이현범	정솔리	정채윤
Profile	💯 우리들의 선장님 🧠 올라운더 🎨 그림으로 설명해요	🔑 인증/인가의 대가 😤 안되면 될때까지 🐯 헬스계의 티거	😇 매니징 천사 💡 아이디어 뱅크 👥 소통이 체질	💬 코드리뷰 공주 👀 Docs Hunter 👑 Git 마스터
Github	@byeongJoo05	@hb9397	@sollyj	@kkkwp

🧑‍💻 기술 스택

👉 Front-End

라이브러리📚

react
react-dom
react-multi-select-component
react-router
react-router-dom
react-scripts
react-toastify
react-youtube
axios
dotenv
openvidu-browser
emotion
material-ui
mui/material
styled-components

Go to Repository

👉 Back-End

Service단 라이브러리📚

spring-boot-starter-web
spring-boot-starter-mail
spring-boot-starter-data-redis
spring-boot-starter-validation
spring-cloud-starter-aws
spring-security-crypto
openvidu-java-client
lombok
json
jjwt

Go to Repository

Domain단 라이브러리📚

spring-boot-starter-web
spring-boot-starter-validation
spring-boot-starter-data-jpa
spring-boot-devtools
mariadb-java-client
json
lombok
querydsl

Go to Repository

👉 CI/CD

🎨 서비스 아키텍처

하이브리드 클라우드 아키텍처 적용

• 유저들의 정보 등이 담겨 있는 RDBMS와 이 DB에서 데이터를 전처리하는 도메인 로직만 가지고 있는 MusicQ-Domain WAS를 Private한 공간에 배치
• 실제 유저들에게 서비스를 제공할 배포환경에는 Client Server 와 서비스 로직을 가지고 있는 MusicQ-Service WAS를 배치
• WebRTC를 통한 비디오, 마이크 스트림을 위해 Openvidu Deployment Server를 배치
• AccessToken 관리를 위한 Redis Container 배치

🔌 EC2 포트정리

PORT	이름
443	HTTPS
80	HTTP - HTTPS 리다이렉트
8443	Openvidu
6379	Redis
3306	MariaDB
8080	Service Spring Boot - Kubernetes Service Object
81	Domain Spring Boot
3000	React - Kubernetes Service Object

♻️ 배포 플로우

CI

• FE, BE 레포지토리 Main 브랜치로 PR Merge가 되는 경우, Github Actions이 이를 감지하여 팀 계정 DockerHub로 Image를 Build 및 Push 한다. (Image Tag는 Commit ID로 설정)

CD

• Kubernetes Object 자동 배포를 위한 Manifest Repository에 yml 파일에 새로운 Docker Image를 삽입한다.
• ArgoCD를 이용하여 Manifest Repository를 Webhook 하여 자동화 배포를 시작한다.

📄 Wiki

기능 명세서

Git Convention

Code Convention

Class Diagram

회의록