Products
Team projects
Yogiyo unified checkout
At Yogiyo, I designed the ordering and checkout flow and built a shared SDK for communication between the app and web.
4Stages in one shared order flow that carries every order type
- Period
- 2023.04 ~ 2024.10
- Organization
- Wonderful Imagination Inc. (Yogiyo)
- Role
- Checkout architecture and shared SDK
- Key features
- I made it possible to handle different order types, including robot delivery and dining in, through the same checkout.
- Work and results
- Became the internal standard, also used for partner integrations such as KakaoTalk
- Android and iOS app communication unified in a shared SDK
- Server and phone clock offsets of hundreds of milliseconds corrected to align discount timing
- Tech stack
- Turborepo
- tsup
- Changesets
- NTP
- Vitest
Context
In Yogiyo’s Customer Tribe, I designed checkout and shared frontend infrastructure. Discounts, the cart, and recommendations ran as separate services, so I had to connect them without letting their data fall out of sync during an order.
Android and iOS also used different code to connect the app and web. I brought the platform-specific branches and callbacks into a shared SDK, and addressed server and phone clock differences that affected when discounts applied.
Decisions and implementation
- Unified checkout: I designed a unified checkout that handles many ways of ordering as one flow. I chose Selector-based caching over a global store to keep data dependencies between services to a minimum.
- I abstracted the order process into a four-stage lifecycle and personally persuaded the scattered teams involved until they agreed.
- I folded robot-delivery address selection, in-store table reservations, and the recommended-menu data flow into the same structure.
- Shared frontend infrastructure (Customer-js and WebApp Client): I designed a native communication interface for several teams to share and brought the teams to agreement on it.
- I wrapped the callback-based native bridge in Promises and abstracted it into one interface with an Observer pattern that tracks both sending and receiving state. I judged that two-way state tracking fit callback flows better than one-way publish-subscribe.
- A RequestManager stabilized asynchronous communication and callback control, and a Turborepo monorepo with tsup, Vitest, and Changesets automated builds and deployments.
- Checkout best price guarantee (BPR): NTP-based time sync corrected gaps of several hundred milliseconds between server and client to align when discounts applied.
- I cached discount results and calculated only the items needed at the time, which reduced rendering load. I moved six or more order validation checks into a middleware layer, separating their responsibility from discount calculation.