1. 프로젝트 개요

• 프로젝트명: How Do I Look?
• 목표: 사용자들이 자신의 패션 스타일을 공유하고, 다른 사용자들로부터 객관적인 평가(큐레이션)를 받으며 소통할 수 있는 커뮤니티 플랫폼을 구축하는 것을 목표로 합니다.
• 핵심 기능:
  • 스타일 공유: 사용자는 자신의 패션 사진과 설명을 포함한 '스타일' 게시물을 작성하고 공유할 수 있습니다.
  • 큐레이션 시스템: 다른 사용자의 스타일에 대해 트렌디함, 개성, 실용성 등 다각적인 평가를 제공하고 댓글로 소통합니다.
  • 랭킹 및 태그: 조회수, 큐레이션 점수를 기반으로 한 인기 스타일 랭킹과 주기적으로 업데이트되는 인기 태그 기능을 제공하여 사용자들의 참여를 유도합니다.
  • 유저 기능: 기존 명세서에서 스타일, 큐레이션, 코멘트에 각각 닉네임, 비밀번호가 있었는데 저희 프로젝트에서는 유저 기능을 분리하여 유저 별 스타일 목록, 유저의 큐레이션 수, 좋아요 수 등을 마이페이지를 통해 관리할 수 있습니다.

2. 담당한 작업

<aside> 💡

저는 프로젝트에서 백엔드 담당으로 스타일 API, 태그목록 및 랭킹 API, 유저 API, 미들 웨어 및 유틸 함수 작성, DB 스키마 부분 설계와 프로젝트 리팩토링, 배포를 담당해 수행했습니다.

</aside>

• 스타일 API
  • 스타일 목록, 상세 조회 기능 구현
  • 스타일 생성, 수정, 삭제 기능 구현
• 태그목록, 랭킹 베이스 API
  • 태그 목록 조회, 랭킹 시스템 베이스 API 작성
• 유저 API
  • 마이페이지 구현
    • 유저 정보 표시
    • 유저 정보 수정, 삭제 기능 구현
    • 프로필 이미지 설정 및 각 스타일, 큐레이션, 코멘트에 반영
    • 유저가 작성한 스타일 리스트 조회 기능 구현
  • JWT 인증 로직에 프론트 서버 쿠키 도입
    • 로그인을 통해 받은 JWT 토큰을 서버사이드와 브라우저 localStorage간의 공유를 위한 쿠키 도입
• 미들웨어 작성
  • errorHandler.js → 전역 에러 핸들러 작성 및 각 라우터 적용
  • hashing.js → 비밀번호 해싱 미들웨어를 통해 회원가입, 유저 정보 수정 시 해싱된 비밀번호 저장
  • ImagePreprocessor.js → 이미지 컬럼 전처리
• 유틸 함수 작성
  • VerifyPassword.js → 로그인, 유저정보 수정 시 해싱된 비밀번호 검증을 위한 유틸 함수 구현
  • imageUpload.js → 이미지 로컬 저장을 위한 multer 업로드 유틸 함수 구현
• DB 스키마 설계
  • 팀원들과 공동 작업
  • 스타일, 유저 테이블 설계
• 프로젝트 코드 구조 리팩토링
  • 기존 router - service 구조를 에러 핸들링과 역할 분리를 더 도입해 router - controller - service 구조로 리팩토링 진행
  • asyncHandler와 errorHander를 통해 서비스 함수들의 전역적인 에러 캐치와 핸들링 구조로 변경
• 프로젝트 배포
  • 프로젝트 배포 버전 브랜치 관리 및 배포 진행
  • render(백엔드, 프론트, DB) , vercel(프론트)

3. 기술적 성과

사용한 기술 스택

<aside> 💡

저는 프로젝트를 진행하면서 multer, bcrypt, zod, prisma, express.js 등을 사용했습니다.

</aside>

• bcrypt를 활용하여 유저 비밀번호를 해싱하여 저장하였고 검증 로직까지 구현했습니다.
• multer를 통해 백엔드 서버 로컬에 이미지를 업로드 하는 기능을 구현했습니다.

4. 문제점 및 해결 과정