토이 프로젝트 일지 9: 음악 스트리밍 마이크로 서비스 만들기

이미지
그림 1. 이벤트 스토밍 설계도 그림 2. 프론트엔드 페이지들 1. 시작 계기 플랫폼 비즈니스 교육에서 수행되는 1차 팀 경진대회에서 조장을 맡아서 구현하게 된 서비스다. 이 경진대회에서 1등으로 대상을 받게 되었다. 2. 프로젝트 개요 가. 프로젝트 소개 1. 프로젝트 유형: 팀 토이 프로젝트(총 8명) 2. 구현 서비스: 음악 스트리밍 서비스 3. 개발 환경: VS Code, Msaez 4. 활용기술     프론트앤드: React, MUI     백엔드:   Spring-Boot, JPA, MySQL     구조설계: MSA(E vent Driven Architecture) , CQRS,  SAGA,  Kafka, JWT     빌드 및 배포: EKS     협업: Slack, Trello, GitWiki 5. 개발 기간: 2024.01.16 ~ 2024.01.30 6. 담당 역할: 팀장(일정 관리, 작업 분배, 코드 평가 및 통합 작업, 프론트엔드, PPT 작성, 발표) 3. 프로젝트 구현 가. 팀 협업 및 역할 분담 그림 3. 팀 협업의 핵심요소 이 팀 프로젝트에서 제일 고민을 많이 했던 부분은 팀장을 포함해서 총 8명이나 되는 팀을 도대체 어떻게 해야 잘 운영할 수 있는지에 대한 문제였다. 거기에다 팀원들은 서로 시간이 맞지 않아서 오프라인으로 만나기도 힘들었기에 이 문제는 더욱 풀기 힘든 문제였었다. 하루 종일 이에 대해서 고민을 해본 결과, '요즘 우아한 개발'이라는 책을 참조해서 팀 협업을 위해서는 위의 4가지의 핵심 요소를 기반으로 설계해야 한다는 결론이 이르렀다. 그림 4. Trello로 활용한 '명확한 업무 분담 및 추적' 이렇게 팀원이 많을수록 개개인의 책임이 옅어져서 참여도가 떨어지게 될 것으로 생각해서 개개인에게 명확하게 업무를 분담시키고, 개개인의 업무를 철저하게 관리하는 것이 중요하다고 생각했다. 이를 위해서 에자일의 ...

토이 프로젝트 일지 8: 실시간 그룹 채팅 마이크로 서비스 만들기

이미지
  그림 1. 이벤트 스토밍 설계도 그림 2. 프론트엔드 페이지들 1. 시작 계기 플랫폼 비즈니스 교육에서 수행되는 개인 PBL(Project Based Learning)에 제출하기 위해서 구현한 서비스다. 마이크로 서비스상에서 통합된 사용자 인증을 위해서 게이트웨이를 통한 JWT 단일 인증 엔드 포인트 구현, 사용자 포인트에서 동기적인 서비스 제공을 유지하기 위해서 웹 소켓을 활용해 보는 것을 중점으로 두었다. 해당 기술들을 활용하는 데 있어서 그룹 채팅 서비스를 구현해 보는 것이 가장 적합해 보여서 해당 서비스를 채택하였다. 2. 프로젝트 개요 가. 프로젝트 소개 1. 프로젝트 유형: 개인 토이 프로젝트 2. 구현 서비스: 그룹 채팅 서비스 3. 개발 환경: VS Code, Msaez 4. 활용기술     프론트앤드: React, MUI     백엔드 A(User, Room, Message, File, Gateway) :  Spring-Boot, JPA, MySQL     백엔드 B(ExternalSystem): Flask     구조설계: MSA(E vent Driven Architecture) , CQRS,  SAGA,  Kafka, WebSocket, JWT     외부서비스: AWS S3     빌드 및 배포: EKS 5. 개발 기간: 2023.12.31 ~ 2024.01.09 3. 프로젝트 구현 가. 요구사항 분석 그림 3. 요구사항 분석 나. 이벤트 스토밍 설계 나-1. 주요 Bounded Context 그림 4. 이벤트 스토밍 Bounded Context(BC) 총 6개의 BC가 존재하며, 각각의 주요 기능 및 역할을 다음과 같다. user: 회원가입 및 RSA 기반 JWT 토큰 발급을 관리한다. file: 프로필 및 메세지에 사용되는 이미지 파일 메타정보를 관리한다. externalSystem: AWS ...

토이 프로젝트 일지 7 : RedKiwi와 유사한 이벤트 스토밍 기반 마이크로 서비스 만들기

이미지
그림 1. 이벤트 스토밍 설계도 그림 2. 프론트엔드 페이지들 1. 시작 계기 플랫폼 비즈니스 교육에서 수행되는 LV2 개인 역량 평가에 제출하기 위해서 어떤 서비스를 만들지 생각하다가 내가 주로 사용하던 RedKiwi라는 영어 학습 앱과 유사한 서비스를 만들면 재밌을 것 같아서 시작했다. 2. 프로젝트 개요 가. 프로젝트 소개 1. 프로젝트 유형: 개인 토이 프로젝트 2. 구현 서비스: RedKiwi와 유사한 영어 학습 서비스 3. 개발 환경: VS Code, Msaez 4. 활용기술     프론트앤드: React, MUI     백엔드 A(Video, Subtitle, ExternalSystemProxy, ReadModel, Gateway) :  Spring-Boot, JPA, MySQL     백엔드 B(ExternalSystem): Flask     구조설계: MSA(E vent Driven Architecture) , CQRS,  SAGA,  Kafka, WebSocket     외부서비스: AWS S3, OpenAI Whisper, DeepL Translate, ChatGPT     빌드 및 배포: EKS 5. 개발 기간: 2023.11.26 ~ 2023.12.26 나. 프로젝트 목표 이벤트 스토밍을 활용해서 RedKiwi 유사 서비스를 개발해서 마이크로 서비스의 다양한 구현 패턴 원리와 관련 매커니즘에 대한 이해를 증진한다. 3. 프로젝트 구현 가. 요구사항 분석 그림 3. 요구사항 분석 RedKiwi 페이지로부터 다음과 같이 총 3개의 주요 요구사항들을 도출했다. 나. 이벤트 스토밍 설계 나-1. 주요 Bounded Context 그림 4. 이벤트 스토밍 Bounded Context(BC) 총 5개의 BC가 존재하며, 각각의 주요 기능 및 역할을 다음과 같다. video: 유저가 업로드한 비디오에 대한 메타정보들을 ...

토이 프로젝트 일지 6 : React/SpringBoot 기술 스택으로 코딩 테스트 서비스 만들기

이미지
그림 1. 프로그램 동작 화면 1. 시작 계기 대학교 4학년쯤에 취업 시기가 다가오면서 우연히 플랫폼 비즈니스 제1기 교육생 모집 관련 공고를 보게 되었는데 React, SpringBoot부터 시작해서 이벤트 스토밍, Kafka, Kubernetes 등 정말 많은 걸 다루는 것을 보고 흥미가 생겨서 지원하게 되었다. 들어보니 새로운 내용들이 많아서 즐겁게 들을 수 있었고 그쪽에서 LV1 개인 역량 평가라는 것을 했는데 주제가 LV1 교육에서 들었던 내용을 기반으로 프로그램을 작성해 보는 것이다. 이왕이면 LV1 평가뿐만 아니라 차후에 취업 포트폴리오에도 쓸 수 있게 제대로 만들어 보자는 마음으로 프로그램을 작성하였고, 다음과 같이 관련 일지를 작성하게 되었다. 2. 프로젝트 개요 가. 프로젝트 소개 1. 프로젝트 유형: 개인 토이 프로젝트 2. 구현 서비스: 백준, 코드포스와 유사한 코딩 테스트 서비스 3. 개발 환경: VS Code 4. 활용 기술     프론트엔드: React, MUI     백엔드: Spring-Boot, JPA, MySQL, Docker, JWT 5. 개발 기간: 2023.9.27 ~ 2023.11.12 나. 프로젝트 목표 React, Spring-Boot, Docker에 이르는 기술 스택들을 조화롭게 활용해서 실전에 가까운 서비스를 완성한다. 3. 프로젝트 구현 가. RSA 기반 JWT를 이용한 인증 로직 구현하기 그림 2. 로그인 페이지 그림 3. JWT 로그인 시퀸스 그래프 JWT를 이용한 로그인 및 인증 과정을 구현하는 것은 쉬운 일은 아니었다. Nest.js를 이용했을 때는 단순하게 JWT 로직 자체만 집중하면 되었는데 Spring인 경우에는 Spring Security와 연계해서 하려다 보니까 Spring Security에 있는 기존 로직을 상당히 수정하고 커스터마이징해야 했기 때문이다. 각 객체의 역할은 다음과 같다. * FrontEnd LocalStorage: React 컨텍스트에 저장을 ...