A restaurant point-of-sale concept expressed through a responsive marketing website, motion-led UI, and a server-side contact form.
Mise is a portfolio implementation for a fictional food-and-beverage software brand. It combines a Next.js marketing site, reusable page sections, interactive motion, supporting information pages, and a Resend-backed contact endpoint.
Scope: the public code contains the marketing experience and contact API. It does not contain a working POS, operator dashboard, authentication system, or database-backed order management. Product claims and customer-brand examples on the website belong to the fictional concept.
- Modular homepage sections for features, solutions, pricing, testimonials, and FAQs.
- Responsive navigation, animated interactions, and motion utilities.
- Contact form with server-side required-field/email validation and error responses.
- Supporting pages for documentation, integrations, security, status, and policies.
- Metadata routes for social images, sitemap, and robots.
- A Vercel Blob asset manifest and a separate Remotion video composition.
- Playwright scenarios for the homepage, supporting pages, and contact flow.
- Type checking, linting and the production build run on every Vercel deploy.
Use Node.js 24 and pnpm 10.
git clone https://github.com/chrstphrpond/mise.git
cd mise
pnpm install --frozen-lockfile
pnpm devOpen localhost:3000. Images referenced in the hosted asset manifest need network access.
The site can run without email credentials. Without RESEND_API_KEY, the contact endpoint logs the submitted payload locally and returns a development-mode response; no email is sent. Use fictional contact details when testing.
For email-enabled development, configure RESEND_API_KEY in your own Doppler project, then run:
doppler setup
doppler run -- pnpm devThe sender and recipient are currently constants in the contact route, not environment-variable settings. Review and replace those addresses for your own deployment before enabling delivery. Do not commit credentials.
pnpm typecheck
pnpm lint
pnpm build
pnpm exec playwright install chromium
pnpm test:e2eEvery Vercel deploy, preview and production, runs pnpm typecheck, pnpm lint and pnpm build (buildCommand in vercel.json), so a failing check blocks the deploy. Playwright runs locally: it starts a local development server by default. Keep email credentials unset for local smoke tests to avoid sending real messages.
The GitHub Actions workflow in .github/workflows/ci.yml runs the same checks plus Playwright. It is switched off for now, so the Vercel build is the gate.
| Location | What to review |
|---|---|
| src/components/sections | Reusable marketing sections |
| src/components/visuals | Tilt, scrolling, and brand visuals |
| src/app/api/contact/route.ts | Validation, email delivery, and error handling |
| src/lib/blob-manifest.ts | Hosted asset references |
| tests/e2e | Browser-level smoke tests |
| .github/workflows/ci.yml | GitHub Actions pipeline, including Playwright (switched off) |
| remotion | Video composition source |
Next.js 16 · React 19 · TypeScript · Tailwind CSS 4 · Motion · Lenis · Resend · Vercel Blob · Playwright · Remotion
This is a portfolio marketing site, not production restaurant infrastructure. The visual design is adapted from Arsakami's Imapos Webflow template, and some of its imagery still carries Imapos branding. The contact endpoint would need further production hardening, including abuse prevention and an appropriate data-handling policy, before use with real customer enquiries.