Home

리팩토링 팀 빌딩

목표

리팩토링 프로젝트는 대규모 시스템을 전제로 아키텍쳐와 성능 개선에 초점을 맞춰 진행합니다.

• 모노레포 도입과 SonarQube 기반 정적 분석을 통해 코드 안정성을 향상시키고 컴포넌트의 단일 책임 원칙을 고려한 재구성으로 프론트엔드의 재사용성을 강화
• 아키텍처 측면에서는 Redis 마이그레이션과 MSA 구조 전환, Kafka 기반 메시지 큐 시스템 도입을 통해 시스템 확장성을 개선
• 성능 최적화를 위해 React Profiler, Lighthouse, K6, Grafana 등 다양한 측정 도구를 활용하여 프론트엔드와 백엔드의 성능을 정량적 분석

계획

Week1(프로젝트 세팅, 아키텍처 설계)

• CI/CD 세팅
• 성능 측정
• 아키텍처 설계
• Sonar Qube 세팅 해보기
  • https://mangkyu.tistory.com/229
• 프론트엔드 성능 측정 툴 써보기
  • https://devocean.sk.com/blog/techBoardDetail.do?page=&boardType=undefined&query=&ID=166147&searchData=&subIndex=&searchText=&techType=&searchDataSub=&searchDataMain=&comment=#none
  • react profiler 성능 측정
    • https://keinn51.tistory.com/19

Week2(모노레포, 파트별 리팩토링)

• 공통 | 모노 레포 반영
  • shared 내에 디자인 시스템, 공유 타입(ex. Dto 등)을 넣어서 사용할 수 있도록
  • Turborepo 필요한 지 확인 → 필요하면 적용
• FE | 컴포넌트 리팩토링
  • 컴포넌트 별로 최소 단위로 있는 지 체크 → 분리하기
  • 로직과 뷰를 분리할 수 있는 지 체크 해보기
• FE | 테스트 코드
  • 스토리 기반 컴포넌트 별 테스트 코드 작성
  • 커스텀 훅 별로 테스트 코드 작성하기
• BE | 아키텍처 리팩토링
  • 도메인 별 결합도 최소화
  • 인메모리 활용하는 부분 Redis 마이그레이션
• BE | PUB/SUB 적용해보기
  • Redis Pub/Sub or Kafka(해보고싶어용)
    • Rxjs를 활용하여 구현
• BE | 테스트 코드

Week3(MSA, 성능 개선 측정, 도전 해볼만한 거)

• BE | MSA로 분리해보기
  • Nest 자체에서 제공해주는 기능을 응용해도 좋을 듯함
  • 채팅, 퀴즈 생성, 퀴즈 진행 등등 나눠서 관리할 수 있도록 하기
• FE | 외부 상태 관리 라이브러리 달아보기(?)
• FE | URL 상태관리를 한다면(?) 에 대해서 고민해보기
• FE | 성능 측정(이전과 비교하기)
• BE | 성능 측정(이전과 비교하기)

그라운드룰

탄력적 코어타임

일정

• 1주차는 일단 공식 일정 대로 진행 하기
• 2~3주차는 일단 준현님, 현민님 일정 나오는 거 보고

모각글

• 토요일 오전 10시

개발 일지

• TIL 모아두는 용도로 활용
• https://www.notion.so/jacky0831/173f1897cdf580b8977dc9b2ad69d040

스크럼

• 1주차는 13시에 스크럼 가볍게
• 2~3주차는 일정 보고

기타

• 일정 있으면 미리 공유해주기
• 의견은 있으면 확실히 공유해주기