ottogi's Introduction

👩‍💻스마일게이트 윈터 개발 캠프 2기 - Ottogi

Discord Clone을 목표로 개발을 진행한 Team Ottogi 입니다.

팀원	역할	설명
김현우	FRONT-END
허다은	FRONT-END
김수찬	BACK-END	WebRTC, 시그널링
박규현	BACK-END	커뮤니티, 상태관리
백종인	BACK-END	API Gateway, 유저, 채팅

Architecture 🚧

개발은 MSA 구조를 기반으로 진행되었으며 Spring Cloud와 Eureka를 활용하여 진행하였습니다.

Server List

Spring Cloud Gateway → API Gateway 및 JWT 인증 진행
유저(인증) 서버 → 유저 관련 로직 및 검증 진행
채팅 서버 → 클라이언트와 WebSocket으로 연결 및 채팅 발행을 담당
커뮤니티 서버 → 커뮤니티 및 커뮤니티 하위의 작업들에 대한 로직을 담당
상태관리 서버 → 유저들의 여러 상태를 관리하는 서버
미디어 서버 및 시그널링 서버 → WebRTC의 화상 기능을 활용하기 위한 서버

기술 스택 🎮

FRONT END 🔮

TypeScript
React
Zustand
React Query
Story Book

BACK END ♟️

JAVA
Spring FrameWork (JPA, Security, Cloud ..)
Java Script
Node JS

ETC 💽

MySQL
Redis
STOMP, WebSocket
RabbitMQ
AWS S3

주요 기능 🚀

회원가입 및 로그인
회원정보 변경
친구 추가 및 삭제
커뮤니티 생성 및 삭제
커뮤니티 정보 변경
친구간 1:1 DM 채팅
커뮤니티내 채널에서 단체 채팅

실행 화면 👨‍💻

영상 링크 : VIDEO

회원가입 및 로그인
- Google SMTP를 활용한 메일인증을 통하여 회원가입 진행

프로필 확인 및 변경
- 프로필 사진, 이름, 비밀번호, 자기소개 변경 가능

친구추가 기능 및 1:1 DM
- 메일을 통한 친구추가 가능
- 친구 수락 및 삭제 가능
- 친구 온/오프라인 여부 확인 가능
- 친구간 1:1 채팅 (DM) 가능

커뮤니티 생성
- 사진 및 이름 설정하여 커뮤니티 생성 가능

커뮤니티 초대 및 채팅
- 친구 목록에서 커뮤니티 초대 가능
- 채팅 메세지로 오는 초대로 가입 가능
- 커뮤니티 가입시 웰컴 메세지 전송
- 커뮤니티 멤버간 1:N 채팅 가능

ottogi's People

Contributors

Stargazers

Watchers

ottogi's Issues

FE + BE Cors 문제

프론트 서버에서 백엔드 서버로 접근하는데 cors 문제가 발생했다.

spring cloud gateway를 거쳐 서비스를 요청하는 로직이므로, gateway쪽에 설정을 해주어서 해결하였다

cloud:
  gateway:
    globalcors:
      cors-configurations:
        '[/**]':
          allowedOrigins: 'http://localhost:3000'
          allow-credentials: true
          allowedHeaders: '*'
          allowedMethods:
          - PUT
          - GET
          - POST
          - DELETE
          - OPTIONS
       default-filters:
        - DedupeResponseHeader=Access-Control-Allow-Origin Access-Control-Allow-Credentials