案例研究 The Chef Churrascaria Recife
一家位于马瑙斯的烤肉餐厅，从第一眼到下单。
- 客户
- The Chef Churrascaria Recife
- 类型
- 餐厅网站与点餐系统
- 角色
- 前端改造、后端与系统集成
- 年份
- 2026
01概览
The Chef Churrascaria Recife 的官网——这家烤肉餐厅于 2025 年在马瑙斯开业——与一个在线菜单和一套为店内服务新建的 API 打通：一个品牌贯穿三个项目，菜单数据来自真正的数据库。
02问题
餐厅需要一个对外的门面、一个顾客可以浏览的菜单，以及一套桌台与点单系统的雏形。手头的部件却各自独立：一个网站模板、一个带着另一家餐厅品牌的开源菜单应用，以及一个早已无法运行的学术点餐项目。
02方法
沿用已经可用的部分，补写缺失的部分。官网基于一个开源餐厅模板改造，菜单应用取自公开仓库并更换品牌，学术项目的业务领域则从零重写为一个新的后端，供两者共用。原作者均已在项目 README 中注明。
03构建
实际构建了什么
- 01
基于 Next.js 15 与 React 19 的官网，改造自一个开源餐厅模板（MIT）：葡萄牙语文案、餐厅自己的菜品与故事、绿色配色，以及一个可直接与餐厅发起 WhatsApp 对话的小组件。
- 02
为本系统全新编写的后端，采用 Node.js、Express、TypeScript 与 Prisma（SQLite）：管理员、服务员、厨房三种角色的用户，桌台单（comanda）与订单，订单状态从制作中到已出餐再到已送达，并由 JWT 认证、角色校验和 Zod 校验保护。
- 03
一套与菜单应用原有调用完全对应的目录 API，写入餐厅的真实菜单（picanha 牛臀肉、alcatra 牛腰肉、tambaqui 鱼排等），并复用官网自己的菜品照片。
- 04
系统集成：菜单应用通过环境变量接入新 API，文案从 “Bravus Burger” 改为 The Chef，两个前端互相链接——官网上有“Fazer Pedido”（下单）按钮，菜单页也能返回官网。
技术
- Next.js
- React
- TypeScript
- Tailwind CSS
- Vite
- styled-components
- Node.js
- Express
- Prisma
- SQLite
- Zod
- JWT
- Vercel
04体验
05当前状态
官网已部署在 Vercel 上线。菜单应用和 API 目前在本地运行；API 中已有桌台单和订单接口，但尚无对应界面，菜单应用的 logo 图片仍是原品牌。
