Noosh Grill Restaurant
Next.js site for a Fairfax halal restaurant — modular component architecture, GSAP animations, Google Places reviews with ISR, and Toast deep-links on every menu item.
Case Study
💡The Challenge
Noosh Grill needed a production-grade web presence that could handle live Google reviews, deep-link customers directly to menu items on Toast, and load fast on mobile — all while staying easy to maintain as the restaurant grew.
Key Challenges
- Building a typed data layer for 20+ menu items with individual Toast deep-link URLs per item
- Building a Google Places API integration with ISR, server-only boundaries, and static fallback
- Implementing a CSS marquee review strip with edge fades and prefers-reduced-motion support
- Creating a fully accessible menu modal (focus trap, scroll lock, aria-modal) in React
- Configuring Tailwind CSS v4 @theme tokens to match Noosh brand colors exactly
- Setting up Squarespace DNS with A record and CNAME pointing to Vercel
🎨The Solution
A Next.js 15 application built with the App Router and TypeScript, organized into 30+ React components across layout, sections, menu, reviews, and UI directories. GSAP 3.x with ScrollTrigger handles all scroll animations, gated behind gsap.matchMedia() for reduced-motion support. The review system integrates Google Places API with ISR (24hr revalidation) and falls back to curated static reviews with author-key deduplication. Every menu item modal includes a direct Toast deep-link, and a silent image preloader caches all food photos on page load for instant modal display.
Technologies & Approach
🚀The Result
nAll food photography is served through next/image, which automatically delivers AVIF/WebP formats with server-side optimization via sharp — cutting image payload significantly without any manual conversion. The CSS marquee review strip runs with no JavaScript, GPU-accelerated with edge fades. The menu modal system is fully accessible — focus trap, Escape-to-close, body scroll lock, aria-modal. Vercel auto-deploys from the main branch with Vercel Analytics tracking real user data. The site ranks for local halal dining searches and the Toast deep-link system has measurably shortened the path from visit to order.
Project Deliverables
Working with CreaDev Design was a smooth and positive experience from end to end. Yaser took the time to clearly explain the tools and capabilities available to us and guided us toward the right solutions. Our site is clean, easy to navigate, and does exactly what we needed - present our menu clearly, give customers an easy way to reach us, and connect them to online ordering. He made the process simple and genuinely put in the time and effort to help bring the site to life. Yaser is a true professional, solutions-oriented, and consistently timely throughout the entire project. We highly recommend him to anyone looking for a reliable and thoughtful developer.
Ready for Similar Results?
Let's talk about your project — no commitment, no pressure.