Intermediate · Case Study

Tandoor Restaurant

A restaurant website that drives real bookings.

Official website for Tandoor Kitchen — showcasing the menu, story, ambience, and location with Google Maps integration, online reservation flow, and a performance-optimised build that loads instantly on mobile.

Next.jsGoogle Maps APITypeScript

Live Demo

The Problem

What needed solving.

Most restaurant websites are either bloated WordPress sites that load in 8 seconds or static HTML pages with a broken contact form. Neither converts hungry browsers into actual diners. A restaurant's website has one job: get people through the door.

The Solution

How I solved it.

A Next.js restaurant site with a full menu browser, photo gallery, embedded Google Maps, online table reservation form with email confirmation, and a Lighthouse score above 95 — built to rank well locally and convert fast.

Features

What it does.

Full Menu Browser

Complete menu with sections (starters, mains, desserts, drinks), item descriptions, prices, dietary tags, and high-quality food photography.

Google Maps Integration

Embedded Google Maps with the restaurant location pinned — one tap for directions from any device, with a 'Get Directions' deep link for native navigation apps.

Online Reservation

Table booking form with date, time, party size, and special requests — confirmation sent via email using Brevo's transactional email API.

Photo Gallery

Optimised food and ambience photo gallery using Next.js Image for automatic WebP conversion and lazy loading — fast even on mobile 4G.

System Architecture

How it's built.

FrontendNext.js + TypeScriptSSG menu and gallery pages, ISR for specials

MapsGoogle Maps APIEmbedded map with location pin and directions

EmailBrevo APIReservation confirmation emails

DeploymentVercelEdge CDN, image optimisation, custom domain

Technology Stack

Frontend

Next.jsTypeScript

Integration

Google Maps API

Brevo

Deployment

Vercel

Challenges & Solutions

Real problems, real fixes.

Challenge

Google Maps embed causing Lighthouse performance score to drop below 90.

Solution

Replaced the inline embed with a lightweight map placeholder that loads the full Maps iframe only on click — identical UX, no performance impact until user interaction.

Challenge

Reservation form submissions occasionally not sending confirmation emails.

Solution

Added request idempotency keys on the Brevo API call and a retry with exponential backoff — submissions now retry up to 3 times before failing gracefully.

Demo & Screenshots

See it live.

Homepage with menu preview and reservation CTA

Full menu browser with food photography

Explore the full source code and documentation.

Live Demo ← All Projects