현대이지웰 풀스택 5회차 최종 프로젝트 회고 - MTYPE

2025. 10. 21. 23:28·project

📌프로젝트 개요

이번 프로젝트는 메신저를 연동한 선물하기 서비스 MTYPE을 개발하는 것이 목표였다.

팀은 총 3명으로 구성되었고, 프로젝트 기간은 7월 28일부터 10월 16일까지 약 2~3개월 정도 진행되었다.

기획 단계는 한 달 정도 소요되었고, 구현은 9월 1일부터 한달 반 정도 진행되었다.

 

나는 팀장으로 참여하였고 팀원 모두 프론트와 백엔드를 모두 구현했으며, 기능별로 개발을 진행했다.

 

📌맡은 기능

  • 카테고리 띄우기, 상품 목록, 상세 페이지
  • 네이버 쇼핑 API로 상품 데이터 수집
  • 메인 페이지, 랭킹, 결제
  • 선물 리스트, 선물함, 선물 만료 시 보안 문제 처리
  • 친구의 위시리스트 조회

📌 카테고리

기획 초기에는 카테고리를 자기 참조 방식의 계층형 구조로 설계했다.

카테고리를 클릭했을 때 UI 업데이트와 글씨 색 변화 등을 구현하기 어려워, depth 컬럼을 추가하여 클릭한 카테고리를 기준으로 부모와 자식 계층을 조회하도록 해결했다.

📌 상품 목록과 무한 스크롤

처음에는 상품 데이터가 적어 페이지 로딩 속도가 빠르게 느껴졌지만, 데이터가 많아지자 로딩 속도가 느려졌다.

이를 해결하기 위해 20개 단위로 불러오는 무한 스크롤을 구현했다. 

Slice를 사용하여 HTML에서 트리거가 보이면 다음 20개의 상품을 불러오는 API를 구현했으며,

데이터 로딩 시간을 눈에 띄게 줄일 수 있었다.

📌 상세 페이지와 SKU 옵션 구조

옵션 기능은 참고 사이트를 보고 사용자 편의성을 높이기 위해 구현했다.

상품마다 옵션 종류와 재고가 다르기 때문에 SKU 구조로 설계했다.

  • OPTION_CATEGORY_TB : 색상, 사이즈 등 옵션 그룹
  • OPTION_TB : 빨강, S 등 실제 선택지
  • PRODUCT_SKU_TB : 판매할 옵션과 재고 관리
  • SKU_OPTION_TB : SKU와 옵션 연결

이 구조 덕분에 옵션 추가자 재고 관리가 효율적으로 가능해졌다.

📌 선물하기 리스트와 선물함 구현

선물 리스트는 사용자가 2~3개의 선물을 담아 친구에게 전송하고, 친구가 선택하면 결제 후 전송하는 기능이다.

선물함은 수신자 정보 관리가 어려웠는데, 초기에는 카카오 ID와 UUID 혼용으로 문제가 발생했다.

결국 카카오 친구 피커에서 제공되는 카카오 ID를 활용하여 수신자 정보를 저장하고 받은 선물함 기능을 구현할 수 있었다.

📌 선물 만료 처리와 보안

선물 전송 후 3일 이내 선택하지 않으면 자동 거절되도록 TaskScheduler를 사용했다. 이는 Scheduler와 달리 선물 각각 마다 스케줄을 등록하여 동적으로 만료처리가 가능하다.

또한 보안을 위해 링크 접근을 제한했으며, 만료, 선택 완료, 결제 완료 시 재접속하지 못하도록 처리했다.

📌 회고와 배운 점

이번 프로젝트를 통해 원하는 기능을 구현하는 과정이 쉽지 않다는 것을 깨달았다.

중간에 팀원 퇴소라는 예상치 못한 어려움도 있었지만, 여러 기능을 무사히 구현하고 마무리할 수 있어 뿌듯했다.

 

보이는 기능 위주로 구현하다 보니 재고 동시성이나 성능 최적화는 충분히 하지 못했지만, 

교육과정 이후 이를 개선할 계획이다.

'project' 카테고리의 다른 글

[Spring boot & JPA] 계층형 카테고리 구현하기  (0) 2025.10.14
Intersection Observer API로 무한 스크롤 구현하기  (0) 2025.09.16
'project' 카테고리의 다른 글
  • [Spring boot & JPA] 계층형 카테고리 구현하기
  • Intersection Observer API로 무한 스크롤 구현하기
eun_log
eun_log
  • eun_log
    개발은
    eun_log
  • 전체
    오늘
    어제
    • 분류 전체보기 (75)
      • 코테 (17)
      • CS (6)
        • 자료구조, 알고리즘 (3)
        • 네트워크 (0)
        • 데이터베이스 (2)
        • 운영체제 (0)
      • frontend (32)
        • JavaScript (29)
        • html&css (1)
        • project_study (2)
      • backend (15)
        • Java (15)
      • project (3)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
    • 글쓰기
    • 관리
  • 링크

  • 공지사항

  • 인기 글

  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
eun_log
현대이지웰 풀스택 5회차 최종 프로젝트 회고 - MTYPE
상단으로

티스토리툴바