Case Study
DeliveryHub
4개 역할이 얽힐수록, 놓치는 부분이 생깁니다.
복잡한 시스템일수록 속도와 정확성은 충돌합니다. AI를 구조적으로 활용해 둘을 함께 잡습니다.
당신의 프로젝트에서도 그렇게 합니다.
4자 구조
고객이 주문하고, 매장이 준비하고, 라이더가 배달하고, 관리자가 전체를 조율합니다.
라이브 데모 ↗
매장Store Web
주문이 들어오면 매장이 가장 먼저 봅니다. 칸반 보드에서 접수·조리·완료를 한눈에 관리하고, 메뉴와 매출도 여기서 다룹니다.
라이브 데모 ↗
관리자Admin Web
라이더가 어디 있는지, 주문이 어디서 막혔는지. 지도 위에서 전체 시스템을 실시간으로 조율합니다.
라이브 데모 ↗
고객Customer App
매장을 고르고, 메뉴를 담고, 결제하고, 배달이 오는 길을 지도 위에서 봅니다.
라이브 데모 ↗
라이더Rider App
콜을 받고, 픽업하고, 배달합니다. GPS가 2초마다 위치를 보내 고객과 관리자 모두 현재 위치를 압니다.
Technical Highlights
이 시스템이 해결하는 것
실시간 배달 추적
주문한 음식이 지금 어디쯤인지, 고객 화면에 2초마다 업데이트됩니다. 고객 문의 전화가 줄어듭니다.
Socket.IORedis
자동 라이더 배정
주문이 들어오면 반경 3km 내 가장 가까운 라이더를 자동으로 찾아 배정합니다. 수작업 배차가 필요 없습니다.
PostGIS공간 쿼리
안전한 결제 흐름
결제 중 오류가 나면 자동으로 원래 상태로 복구됩니다. 돈이 빠지고 주문은 안 되는 사고가 없습니다.
Saga보상 트랜잭션
통합 관리 구조
관리자·매장·고객·라이더 4개 앱이 하나의 코드베이스에서 관리됩니다. 수정 사항이 전체에 즉시 반영됩니다.
Turborepo모노레포
Live Demo
직접 체험해 보세요
데모 계정으로 로그인하면 주문부터 배달 완료까지 전 과정을 체험할 수 있습니다.
Stack
기술 구성
Backend
- NestJS 11 + Fastify
- Prisma v7 + PostgreSQL
- PostGIS (공간 쿼리)
- Redis + ioredis
- Socket.IO + Redis Adapter
- Passport.js (JWT + OAuth)
- AWS S3 (이미지 업로드)
Frontend
- Next.js 16 (App Router)
- React Native 0.81 + Expo 54
- Tailwind CSS v4
- NativeWind v4
- Zustand
- shadcn/ui
- Leaflet (라이더 지도)
DevOps
- Turborepo 2.x
- pnpm 9.x Workspace
- TypeScript strict mode
- Railway (API 배포)
- Vercel (웹 배포)
- Docker (멀티스테이지)
- Sentry (에러 추적)
고객앱. 매장 웹. 라이더앱. 관리자 대시보드. 이 모든 걸 AI와 함께 설계했습니다.
꿈꾸는 프로젝트, 구현해 드리겠습니다.