포트폴리오 목록으로
웹사이트 포트폴리오
프랜차이즈 주문 플랫폼
TasteVille — F&B 프랜차이즈 온라인 주문 플랫폼
지점 선택부터 메뉴 옵션 선택, 쿠폰 적용, 픽업·배달 주문서, 주문 완료, 원탭 재주문까지 실제 주문 앱의 여정 전체가 동작하는 요식업 데모입니다. 세트·사이드·음료 옵션 모달, 지점별 영업시간·거리·품절 반영, 배달비·쿠폰 할인 계산, 별점·사진 필터 리뷰 패널까지 F&B 커머스 패턴을 담아 매장·배달 주문형 프랜차이즈 사이트에 그대로 응용할 수 있는 구성입니다.
Next.jsReactTypeScriptTailwindCSSFramer Motion
인터랙티브 프로토타입
https://example.com
TasteVille
프리미엄 버거
영업중서울 강남구 테헤란로 15210:00 ~ 22:001.2km
오늘의 추천
시그니처 버거 세트
트러플 소스 앵거스 패티 + 감자튀김 + 음료
₩19,900₩16,900
BEST
시그니처 버거
180g 앵거스 패티, 트러플 소스
₩12,900
이번 주 1,240개NEW
크리스피 치킨 버거
바삭한 치킨 패티, 매콤 스리라차
₩10,900
더블 치즈 버거
더블 패티, 체다 & 모짜렐라
₩14,900
BBQ 풀드포크 버거
12시간 훈연 풀드포크, 코울슬로
₩13,500
품절
구현 기능
카테고리 메뉴
인기·버거·사이드·음료·디저트 5개 카테고리 탭 전환
메뉴 옵션 모달
세트 업그레이드, 사이드·음료 변경, 수량 선택 후 담기
주문 완료 플로우
장바구니 → 픽업·배달 주문서 → 배달비·쿠폰 계산 → 주문 완료 화면
쿠폰 할인
FIRST3000 등 데모 쿠폰을 주문서에서 선택하면 합계에 즉시 반영
원탭 재주문
주문 완료 후 최근 주문 스트립에서 같은 구성을 한 번에 다시 담기
지점 정보
지점별 주소·영업시간·거리 표시, 지점 전환 시 품절 메뉴까지 반영
품절·베스트 상태
지점별 품절 비활성화와 주간 판매량 베스트 배지
리뷰 패널
평점 요약·리뷰 카드에서 열리는 전체 리뷰 — 별점·사진 필터와 도움돼요 반응
반응형
PC·모바일 각각에 최적화된 주문 UI