태그
React
TypeScript
tailwindcss
MongoDB
Express
Node.js
날짜
Sep 27, 2023 → Jan 31, 2024
포스팅
notion image
notion image
💡
MailBadara는 부산대학교 학생들을 위한 학과 홈페이지 뉴스레터 구독 서비스입니다.
 

👉🏻 서비스: https://pnu-mail-badara-cookiya.koyeb.app

서버 사양(프리티어) | 0.1 vCPU, 256MB RAM, 2GB Disk

👉🏻 깃허브: https://github.com/KimCookieYa/PNU_Mail_Badara

 
 

아키텍처


notion image
 

사용한 기술 스택


프론트엔드
  • TypeScript, React
  • Axios
  • tailwindcss
  • Eslint, Prettier
  • Koyeb
 
백엔드
  • TypeScript, Express
  • node-cron, nodemailer
  • MVC
  • MongoDB, mongoose
  • Redis

담당한 파트


기획, 디자인 담당, FE 개발, BE 개발
 
프론트엔드
  • 메인 페이지 UI 개발
  • 구독, 소개, 학과, 디테일, 내역 페이지
 
백엔드
  • REST API 개발
  • 입력된 메일의 유효성을 검증하기 위한 Verify 로직 구현
    • 이메일 제출 시, 이메일을 대기큐(Redis)에 집어넣고 해당 이메일로 검증 메일을 전송
    • 10분 이내에 검증 메일의 “확인” 버튼을 클릭했을 때, 대기큐에 존재한다면 Verify 완료
    • Verify 완료된 이메일만 유저DB(MongoDB)에 저장
  • 크롤링한 학과 게시물 데이터를 유저별로 인덱싱한 후 메일 전송 로직 구현
  • 동시에 모든 구독자를 대상으로 메일 전송 시 메모리 과부하로 프로세스가 죽는 문제 발생
    • JS 서버를 TypeScript로 migration하고 MVC 패턴을 도입하여 코드 로직을 효율적으로 개선
    • 서버 작업을 시간별로 분할하여 서버 부하를 낮춤으로써 프로세스 죽는 문제를 해결
    • 에러 해결 후 실사용자 2배 증가
  • Docker 배포 로직 작성
 

디자인


notion image
notion image
notion image
 
 

초기 디자인


notion image