Waida Studio
A bakery is sold on appetite: the visitor should smell the croissants before they reach the menu. Deux is built around that — warm cream and chocolate-brown tones, big hand-drawn display type, scalloped edges, "freshly baked" badges that turn slowly and pastry photography that fills every section. Built on the Next.js 16 App Router with React 19 and TypeScript in strict mode, it ships 17 page templates covering 39 fully static pages, with a working online shop — an add-to-cart form on every product, two cart drawers, a validating checkout with store pickup or local delivery, and an order confirmation — and the menu, categories and blog driven by JSON and MDX files you edit directly. No CMS or backend required.
Whether you run an artisan bakery, a patisserie, a café with a takeaway counter, a cake studio or any small food brand that sells online as well as over the counter, Deux gives you every page the shop needs — a home page with menu tabs, a "Why Deux" tab set, offers, opening hours, testimonials, the newest posts and an FAQ, an about page with a story slider, a background video and the team, a tabbed menu, fifteen product pages, three category pages, seven full-length articles and a contact page with two store locations. Content lives in JSON and MDX files: re-price a croissant and it is re-priced on the menu, its category page, the home page and in the basket at once. Launch in hours.
Tech Stack
Next.js 16 — App Router, every page prerendered to static HTML at build time
React 19 — server components throughout, with small client islands for the basket and the interaction layer
TypeScript — strict mode, `npm run typecheck` clean
Hand-crafted CSS — one plain stylesheet driven by CSS custom properties, no utility framework and no build-time CSS pipeline
Self-hosted webfonts — Mouse Memoirs, Geist and Erica One as woff2, no third-party font requests at runtime
JSON and MDX content layer — the menu and categories as JSON, the articles as MDX with gray-matter frontmatter and a Markdown parser that renders into the design's own markup
Front-end shop — a React cart store in `localStorage`: add to cart, quantities, two cart drawers, checkout with a delivery choice and an order confirmation
Zero animation libraries — no jQuery, no GSAP, no Lenis: the split hero titles, the scroll reveals, the tabs, the sliders and the smooth wheel scroll are one TypeScript file
Included Pages and Templates
Core pages
Home with a split-line hero title, menu tabs by category, a review strip, offers, the "Why Deux" tabs with their progress bar, a running word strip, opening hours, a testimonials slider, the three newest articles and the FAQ
About with the mission, a story slider that autoplays to rest, a background video with a pause button, the counters and the team
Menu with a tab per category, each listing every item filed under it
Contact with a validating enquiry form and two store locations that light up one at a time
Menu and shop
15 product pages, each with its price, weight, texture, ingredients, an add-to-cart form and three suggested items
3 category pages: Breads, Pastries and Sweets
Checkout with store pickup or local delivery, a PayPal review page and an order confirmation that prints the order placed
Blog
Blog index with a featured article and 7 full-length articles, each with an author, a picture pair and share links
Utility pages
Style guide, instructions, licenses, changelog, a 401 password-protected page and a 404 page
17 page templates. 39 static pages.
Easy Content Editing
Everything you change lives in `src/content/`. Edit a file, rebuild, done.
`src/content/products.json` — the 15 items on the menu: the name, the description, the price, the picture, the weight, texture and ingredients, the category and the three suggested items
`src/content/categories.json` — the 3 categories
`src/content/blog/*.mdx` — the 7 articles: the title, category, dates, author, the card, banner and picture pair, and the body
Every card reads the item's own entry, so a re-priced croissant is re-priced on the menu, on its category page, on the home page and under every item that suggests it — and the add-to-cart form reads the entry too, so the basket charges what the page shows. File an item under a category and it appears under that tab and on that category's page by itself.
Article bodies are Markdown: section headings, smaller headings, lead lines and paragraphs, in three parts around the picture pair. A parser places each block inside the design's own markup, so the words stay editable and the layout stays exact. Reach past that grammar, or name a category or suggestion that does not exist, and the build stops and names the file.
Theming is one file. Every brand colour, font, spacing step and type size is a CSS custom property near the top of `public/assets/css/styles.css`. Change a value there and it propagates across every page.
Performance and SEO
Every page prerendered as static HTML, ready for a CDN
Per-page title, description and Open Graph and Twitter card metadata
Absolute share-image URLs so link previews resolve
Self-hosted fonts with `font-display: swap` and zero third-party requests
AVIF imagery with responsive `srcset` sizes, lazy-loaded below the fold
Semantic markup with one H1 per page, real buttons and landmarks
Keyboard-reachable menus, ARIA tabs with arrow-key support, labelled sliders and cart dialogs, and FAQ questions built on real buttons
Full `prefers-reduced-motion` support, and readable with JavaScript off
Deployment
Deploys to Netlify (`netlify.toml` included), Vercel, Cloudflare Pages or any host that runs a Next.js build. `npm run build` prerenders every page; there is no server, no database and no API to configure.
What You Get
The complete Next.js 16 project source
17 page templates covering 39 static pages
15 products, 3 categories and 7 articles as editable JSON and MDX
A working front-end cart, checkout and order confirmation
The original stylesheet, self-hosted webfonts and background video
Full HTML documentation
Changelog and third-party license file
Requirements
Node.js 20 or newer
npm 10 or newer, or pnpm, yarn or bun