DEV Community

Cover image for Ghorer Thali: Homestyle Comfort Food Landing (DEV Frontend Challenge)
Md. Fardin Khan
Md. Fardin Khan

Posted on Edited on

Ghorer Thali: Homestyle Comfort Food Landing (DEV Frontend Challenge)

Frontend Challenge Perfect Landing Submission 🍲đŸĨ§

This is a submission for Frontend Challenge - Comfort Food Edition, Perfect Landing.

What I Built

āϘāϰ⧇āϰ āĻĨāĻžāϞāĻŋ (Ghorer Thali) is a fictional home-kitchen landing page rooted in South Asian comfort food I love: Peshawari meat (namkeen-style light broth with bone, potato, and whole pepper), beef curry, and chicken biryani.

The brand is meant to feel like walking into a family table in Old Dhaka, not a glossy food-delivery app. The first viewport leads with the restaurant name as the hero signal, one headline, one supporting line, and two CTAs over a full-bleed food image. Atmosphere comes from saffron and chili accents, film-grain warmth, and traditional Bengali craft motifs: Alpona (floor art medallions, rosettes, diamonds, corners) and Nakshi Kantha running-stitch lines woven through labels, tabs, Visit details, and the footer.

Below the hero:

  • A short story about slow cooking and patience, framed with alpona corners and a nakshi vine
  • An interactive menu with underline tabs, dish photos (including my own Peshawari photo), descriptions, and prices in BDT
  • A visit section for Islampur Road, Chawkbazar, with soft craft washes behind the address block

The full page is available in Bangla and English via a language toggle, with the choice remembered in localStorage. Accessibility basics are there too: skip link, semantic sections, focus styles, and prefers-reduced-motion.

Stack: Vite + React + TypeScript + plain CSS (design tokens, SVG ornaments, no heavy UI kit)

Live site: https://ghorer-thali.vercel.app/

Demo

Frontend Challenge — Comfort Food Edition

Folder Prompt Brand
css-art/ CSS Art āϘāϰ⧇āϰ āĻĨāĻžāϞāĻŋ — āĻĒ⧇āĻļā§‹āϝāĻŧāĻžāϰāĻŋ āĻŽāĻžāĻ‚āϏ, āĻŦāĻŋāϰāĻŋāϝāĻŧāĻžāύāĻŋ, āĻ—āϰ⧁āϰ āĻ•āĻžāϰāĻŋ
landing/ Perfect Landing āϘāϰ⧇āϰ āĻĨāĻžāϞāĻŋ (Vite + React + TS)



Journey

I started from the Perfect Landing brief and picked dishes that feel like home, then shaped a brand around them instead of forcing a generic restaurant template.

Decisions I’m glad I made:

  1. Bangla as the default language. Comfort food is cultural. If the kitchen is “āϘāϰ⧇āϰ āĻĨāĻžāϞāĻŋ,” the UI should speak that first, with English as a guest option.
  2. Honest Peshawari context. Early drafts used the wrong kind of grilled-meat imagery. I replaced it with my own photo and rewrote the copy for namkeen-style broth, bones, and potatoes.
  3. Tradition as craft, not decoration stuck on last. Alpona and Nakshi motifs are reusable SVG pieces sitting in the design system, then placed carefully so the brand and food stay louder than the ornaments. A later pass tightened alignment: quieter where it crowded type, louder on the hero so the craft actually reads against the photo.
  4. Keep the craft in CSS. Tokens, clear sections, intentional motion (hero drift, steam, ember glow, scroll reveals, menu panel transitions) without a design-system maze.

Small details sell the theme: Old Dhaka location, ā§ŗ pricing, dish-specific alt text, and clean Bangla/English reading flow.

What’s next

  • A small recipe or “how we cook dum” section
  • Real map embed for the Chawkbazar location
  • Stronger image optimization for the hero and menu photos

Built with modern frontend tools and careful iteration on content and visuals. Thanks for the challenge. Now I’m hungry again.

Top comments (0)