프로덕트
참여 프로젝트
요기요 통합 체크아웃
요기요에서 주문과 결제 흐름을 설계하고, 앱과 웹을 연결하는 공통 SDK를 만들었습니다.
4단계로 나눈 공통 주문 흐름에 서로 다른 주문 방식을 모두 담음
- 기간
- 2023.04 ~ 2024.10
- 소속
- 주식회사 위대한상상
- 역할
- 체크아웃 설계와 공통 SDK 개발
- 핵심 기능
- 로봇 배달과 매장 식사처럼 주문 방식이 달라도, 같은 체크아웃에서 처리할 수 있게 했습니다.
- 작업과 결과
- 카카오톡 등 외부 파트너 연동에도 쓰인 사내 표준으로 자리 잡음
- Android와 iOS의 앱 연결을 공통 SDK로 통합
- 할인 적용 시점이 어긋나지 않도록 서버와 휴대폰의 수백 ms 시간차 보정
- 기술 스택
- Turborepo
- tsup
- Changesets
- NTP
- Vitest
배경
요기요 Customer Tribe에서 체크아웃과 프론트엔드 공통 인프라를 설계했습니다. 할인, 장바구니, 추천이 각각 다른 서비스여서, 주문 과정에서 데이터가 어긋나지 않도록 연결해야 했습니다.
앱과 웹을 연결하는 코드도 Android와 iOS가 달랐습니다. 프로젝트마다 플랫폼을 나누고 콜백을 처리하던 부분을 공통 SDK로 정리했습니다. 서버와 휴대폰의 시간차 때문에 할인 적용 시점이 달라지는 문제도 함께 다뤘습니다.
결정과 구현
- 통합 체크아웃: 다양한 주문 방식을 하나의 흐름으로 다루는 통합 체크아웃을 설계했습니다. 전역 Store 대신 Selector 기반 캐싱을 택해 서비스 간 데이터 의존성을 최소화했습니다.
- 주문 프로세스를 4단계 라이프사이클로 추상화하고, 흩어져 있던 유관 팀들을 제가 직접 설득해 합의까지 이끌었습니다.
- 로봇 배달 전용 주소 선택, 매장 식사 테이블 예약, 추천 메뉴의 데이터 흐름을 같은 구조 안에 흡수했습니다.
- 프론트엔드 공통 인프라(Customer-js, WebApp Client): 여러 팀이 함께 쓸 네이티브 통신 인터페이스를 설계하고, 팀 사이의 합의를 끌어냈습니다.
- 콜백 기반 네이티브 브릿지를 Promise로 감싸고, 송신과 수신 양쪽 상태를 함께 추적하는 Observer 패턴으로 하나의 인터페이스를 만들었습니다. 한쪽으로만 흐르는 발행-구독 방식보다 양방향 상태 추적이 콜백 흐름에 더 맞다고 판단했습니다.
- RequestManager로 비동기 통신과 콜백 제어를 안정화했고, Turborepo 모노레포에 tsup, Vitest, Changesets를 갖춰 빌드와 배포를 자동화했습니다.
- 체크아웃 최저가 보장제(BPR): NTP 기반 시간 동기화로 서버와 클라이언트 사이 수백 ms의 시간차를 보정해 할인 적용 시점을 맞췄습니다.
- 할인 연산 결과를 캐싱하고 필요한 항목만 그때그때 계산해 렌더링 부하를 줄였습니다. 6가지 이상의 주문 유효성 검사는 Middleware 계층으로 분리해 할인 계산과 검사의 책임을 나눴습니다.