미리보기

하루가 맛있어지는 구독생활, 위잇

• 위잇은 직장인의 메뉴 선택, 비싼 점심값 고민을 해결해주는 점심 구독 서비스입니다.

  • 하루가 맛있어지는 구독생활, 위잇

• 자체 물류 센터, 배송 시스템

• 유저가 상품을 탐색하고 구매하는 과정 주로 개발하였습니다.

• 신메뉴 추가를 유연하게 할 수 있도록 개선하여 업무 리소스를 줄이고, 매출에 기여하였습니다.(일 평균 B2C 구독건수 160% 증가)

세상 모든 경험의 시작, 프립

• 프립은 크루(유저)와 호스트가 만나 경험을 하는 O2O 여가 액티비티 플랫폼입니다.

  • 프립(FRIP): 세상 모든 취미 여가의 시작

• 모놀리식 아키텍쳐에서 MSA로 전환하는데 기여하였습니다.

• 프립 서비스 백오피스를 Vue로 새로 구축하고 운영하였습니다.

• 프립의 상품, 배너, 기획전, 카테고리, 화면 요소 api를 운영하였습니다.

위잇 서비스에 전시상품 개념을 도입해 유저가 보는 상품의 조회 성능을 393.47 ms -> 110ms로 개선하였습니다.

✔️ Problem: 기존의 상품구조는 개별 상품과 재고 관리, 대표 이미지 등의 메뉴표를 구성하는 요소가 다른 테이블로 나누어져 있어 메뉴를 조회할때 다량의 JOIN이 발생하는 구조로 조회 성능이 좋지 않고, 상품 요소가 필요한 로직에 사용하는 쿼리가 매우 복잡해서 개발하는데 시간이 오래 걸렸습니다.

✔️ How: 역정규화를 사용해 전시에만 사용되는 컬럼을 모은 전시 테이블을 따로 만들고 원본 데이터가 어드민에서 변경되면 비동기적으로 전시 테이블을 갱신하여 하나의 테이블로 메뉴를 조회할 수 있도록 개선하였습니다.

✔️ Why: 뷰를 만들거나, 캐싱을 하는 것 만으로도 성능을 어느정도 개선할 수 있지만 근본적으로 개발의 불편함을 해소하는데 한계가 있었고 추후에 검색을 도입하거나, 리뷰 별점을 추가하는 등의 기능을 유연하게 추가할 수 있는 방법으로 개선하였습니다.

사용기술

• Python, Django, celery, redis

위잇의 카테고리, 기획전, LNB 기능을 개발하였습니다.

✔️ Problem: 카테고리 이전의 메뉴는 직관적으로 인지하기 어려운 구조로 카테고리 생성/수정 등의 관리 부재로 신메뉴를 추가할때마다 개발이 들어가야하는 구조였습니다.

✔️ How: 메뉴의 특성과 용도에 따른 카테고리화(점심, 가정식), 카테고리, LNB등 계층형 구조는 장고 MPTT 모듈 활용, 드물게 갱신되는 데이터이므로 캐시적용

✔️ Why: 장고 MPTT 모듈에서 제공하는 어드민으로 쉽고 빠르게 어드민을 구축할 수 있었고, 사용자가 가장 많이 조회하게 될 API이므로 장고의 캐시 프레임워크를 사용하였습니다.

사용기술

• Python, Django, celery, redis

위잇의 위잇박스(장바구니) 기능을 개발하였습니다.

✔️ Problem: 서비스의 특성상 한 달치 메뉴를 미리 시키는 경우가 많지만 장바구니 기능이 없어 무조건 한 번에 선택해서 구매해야하는 불편함이 있었습니다. 또한, 고객의 구매 여정을 확인할 수 있는 데이터가 없어 서비스 운영에 필요한 데이터가 필요했습니다.

✔️ How: 장바구니 아이템, 장바구니 아이템 변경 히스토리를 DB에 저장할 수 있도록 설계, 히스토리를 쌓거나 결제 후 장바구니에서 삭제하는 로직은 celery를 이용해 비동기로 수행되도록 개발하였습니다.

✔️ Why: 장바구니 기능은 엄청난 성능을 요구하는 기능이 아니고, 사내에서 redash로 데이터를 모니터링하고 있으므로 기존에 사용하고 있던 RDB를 사용하였습니다. 또한, 히스토리를 쌓거나 장바구니 삭제 실패로 결제가 되는 일은 없어야 하므로 비동기로 개발하였습니다.

사용기술

• Python, Django,celery

위잇의 복잡한 구독 변경 정책을 관리하기 쉽도록 개선하였습니다.

✔️ Problem: 기존에는 구매한 구독을 변경할 수 있는 정책이 하드코딩돼있어 정책 변경할때마다 코드를 수정해줘야했습니다.

✔️ How: 구독 가능한 상품 하나마다 구독 변경 가능한 상품 매핑 테이블을 만들어 어드민으로 관리 가능하도록 수정하고 하드코딩 되어있어 복잡한 코드를 보기 쉽게 리팩토링하였습니다.

✔️ Why: 구독 상품이 외부 파트너사에서 공급 받는것이므로 상품마다 똑같은 정책을 적용해줄 수 없고, 앞으로 신규 구독 상품을 많이 추가할 계획이 있어 세세하게 변경 가능 여부를 설정가능한 설정 테이블을 만들어 세세한 정책을 적용할 수 있도록 하였습니다.

사용기술

• Python, Django

위잇 관리자 외부 스태프 권한을 추가하고, 외부 스태프가 큐레이션을 운영할 수 있는 기능 개발

✔️ Problem: 내부 MD가 큐레이션하는 메뉴가 아닌 외부 파트너사에서 큐레이션하고 운영하는 신규 구독 상품 라인업을 런칭하기 위해 외부 관리자 로그인, 접근 제한 기능 개발 필요

✔️ How: 장고 어드민이 User 모델의 auth_permissions를 장고 어드민에서 사용한다는 점을 이용해 User를 상속 받는 Staff 모델에서 custom으로 auth_permissions을 지정하고 User의 auth_permissions를 재정의하여 어드민에서 권한 체크를 자동으로 해주도록 개선하였습니다.

✔️ Why: 기존의 기능을 활용하지 않고는 어드민마다 has_change 등의 함수로 권한을 설정해야하는 번거로움이 있었는데 auth_permissions로 관리하게 되면 json 파일로 스태프 권한을 관리할 수 있어 권한 관리를 쉽게 할 수 있습니다.

사용기술

• Python, Django

위잇에 새로 추가되는 라인업을 따로 배송하기 위한 배송 분리 기능을 개발하였습니다.

✔️ Problem: 신규 구독 상품이 추가되면서 물류센터 이슈로 새로운구독 상품만 다른 패키지에 포장할 수 있는 새로운 기능이 필요

✔️ How: 앞으로 추가될 신규 상품을 고려해서 상품 속성에 배송 분리 flag를 추가하고, 패키지 생성 로직에 flag 여부로 상품의 합포장 여부를 판단하도록 수정하고 복잡한 코드를 개선하였습니다.

✔️ Why: 앞으로 추가된 구독 상품들이 많고, 물류센터에서 합포장할 수 있는 상품의 종류가 많지 않으므로 어느 상품이나 패키지를 분리할 수 있도록 개선하였습니다.

사용기술

• Python, Django

페이드 광고 외부 매체사에 제공할 상품 리스트를 배치로 생성하는 람다를 개발했습니다.

• Terraform으로 WAF, S3, CloudFront, Route53 설정
• 배치 작업으로 불필요한 호출 최소화

사용 기술

• Node.js, AWS Lambda, Terraform

프립 상품 페이지에서 구매 옵션을 선택하는 플로우를 개선하였습니다.

✔️ Problem: 기존에는 상품 상세 화면에서 다른 페이지로 넘어가서 일정/옵션 선택을 했었습니다. 그 경우 옵션을 선택하다가 상품 상세가 궁금하면 뒤로가서 확인하다가 초기화가 되어 다시 구매 옵션을 선택하는 번거로움이 있었습니다.

✔️ How: 상품 상세화면에서 바로 옵션을 선택가능하게 개선하였습니다. 유저가 쉽고 빠르게 선택할 수 있게 구매 가능한 가장 빠른 일정 또는 대표 옵션을 조회할 수 있도록 GraphQL DataLoader를 사용해서 Product타입에 추가하고, 캐싱을 적용하였습니다.

✔️ Why: 상품을 리스트로 불러올때 발생할 수 있는 N + 1 문제를 방지하기 위하여 DataLoader를 적용하였고, 상품 상세 페이지는 조회가 많이 되므로 캐싱을 추가하였습니다.

사용 기술

• Spring Boot, Kotlin, JPA, GraphQL, Redis, Kafka

• 프립서비스의 핵심 도메인인 상품 api 운영 / 개발
  • 상품 검수 플로우를 개선하였습니다.
  • 상품 오픈 예약 기능을 추가하였습니다.
  • Redis를 사용해 상품 조회 성능을 개선하였습니다.
  • 테스트 코드를 작성하여 새로운 기능을 빠르게 추가할 수 있도록 개선하였습니다.
  • 상품 운영관련 인입되는 호스트/유저 문의를 처리하였습니다.
• 프립 배너, 기획전 등의 화면요소 api, 상품 목록 api 운영 / 개발

사용 기술

• Spring Boot, Kotlin, JPA, GraphQL, Redis, Kafka

MSA구조로 전환하면서 어드민도 새로 개발하기로 하였고, 어드민 초기 세팅부터 공동 컴포넌트, 상품 관련 메뉴, 예약 관리 메뉴등을 개발하였습니다.
어드민을 직접만들면서 상품 도메인에 대해 더 배울 수 있었고 어떻게 하면 사용자에게 좋은 경험을 줄 수 있는지 배울 수 있었습니다.

사용기술

• Vue.js

기존 모놀리식 코드에서 배너 서비스를 분리해서 새로 개발하는데 기여하였습니다. 슬롯이라는 개념을 도입해 배너의 위치, 사이즈 관리를 편하게 할 수 있도록 개선하였습니다. 또한 단위 테스트, 통합 테스트를 작성하여 프로그램의 안정성을 높였습니다.

✔️ Problem: 배너의 위치, 이미지 사이즈를 따로 관리하고 있지 않아 배너 이미지 사이즈를 변경할시 이전버전과 현재버전의 호환성 문제 발생

✔️ How: 슬롯 개념을 도입해서 위치, 사이즈를 서버에서 관리할 수 있게 개선하였습니다.

✔️ Why: 기존 api에서는 이미지만 관리하는 형식이라 신규 버전에서 새로운 위치에 배너를 추가하거나, 기존 배너의 이미지 사이즈를 변경하기 힘드므로, 슬롯 개념을 도입해 서버에서 위치, 사이즈를 관리하면 하위 버전과 신규 버전 모두 정상적으로 배너를 노출할 수 있습니다.

사용기술

• Node.js, Typescript, Redis, Kafka, GraphQL

한국해양대학교 학생, 직원들을 타겟으로 만든 유틸리티 앱(현재 다운로드 수 5000명 이상)입니다.
버스, 식단, 학사 일정, 공지사항, 학교의 날씨까지 한 눈에 확인할 수 있습니다.

• 서버 개발에 참여하였고 학교 홈페이지의 정보를 크롤링해서 한 눈에 볼 수 있도록 만든 서비스입니다.
• 어떻게 하면 최소한의 운영비로 서비스를 유지할 수 있을지 연구해 가며 Firebase CloudFunction -> AWS Lambda -> AWS EC2 로 스택 전환을 하였습니다.
• 빠른 배포를 위해 Git Action 을 사용하여 빌드 -> 테스트 -> 배포 파이프라인을 구성하였습니다.
• 데이터를 모니터링할 수 있도록 새로운 버전을 준비 중입니다.

사용기술

• Node.js, AWS EC2, AWS Lambda, Firebase CloudFunction, Git Action