Ghar Ka Swad β€” A Little Taste of Home

μž‘μ„±μž

μΉ΄ν…Œκ³ λ¦¬:

← ν”Όλ“œλ‘œ
DEV Community · Arnav Nair · 2026-08-16 개발(SW)

Arnav Nair

Frontend Challenge Perfect Landing Submission 🍲πŸ₯§

_# 🍲 Ghar Ka Swad β€” A Little Taste of Home

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

What I Built

I built Ghar Ka Swad, a modern and interactive landing page celebrating Indian comfort food and the memories associated with homemade meals.

The idea behind the project is simple: sometimes food is more than just food β€” it reminds us of home, family, and familiar moments.

The website lets users explore different comfort-food categories and discover dishes based on what they are craving.

✨ Features

  • πŸ› Indian comfort-food themed landing page
  • πŸ”₯ Interactive comfort-food picker
  • πŸ₯˜ Dynamic food cards
  • ⭐ Food ratings and pricing
  • ❀️ Favorite food interactions
  • πŸ“± Responsive design for desktop, tablet, and mobile
  • ✨ Smooth hover effects and animations
  • 🧭 Simple and intuitive navigation
  • β™Ώ Accessibility-focused interactive elements
  • 🎨 Warm, Indian-inspired visual design

Demo

🌐 Live Demo:

[ghar-ka-swad-liart.vercel.app]

Screenshots

🏠 Hero Section

πŸ₯˜ Food Menu

Journey

I wanted to create a project that connected frontend development with something personal and familiar.

I chose Indian comfort food because dishes such as dal, paratha, rajma chawal, paneer, and traditional sweets are strongly connected with memories of home.

One of the main features I focused on was the Comfort Food Picker. Instead of making the landing page completely static, I wanted users to interact with the experience and discover food based on their mood.

During development, I focused on:

  • Creating reusable React components
  • Managing interactive UI with React state
  • Building responsive layouts using CSS
  • Creating smooth animations and hover interactions
  • Improving accessibility
  • Maintaining a consistent visual design
  • Organizing the project into reusable components and data

I’m particularly proud of how the interactive food picker turns the landing page into more than just a collection of food images.

πŸ› οΈ Tech Stack

  • React
  • Vite
  • JavaScript
  • HTML5
  • CSS3

🎯 What I Learned

This challenge helped me improve my understanding of:

  • React component architecture
  • State-based UI interactions
  • Responsive CSS
  • Reusable components
  • User experience and visual hierarchy
  • Building a complete frontend project from scratch

πŸš€ Future Improvements

If I continue developing Ghar Ka Swad, I would like to add:

  • πŸ”Ž Food search and filtering
  • ❀️ Persistent favorite dishes
  • πŸ“– Individual recipe pages
  • 🌎 Regional Indian cuisine categories
  • πŸ›’ Online ordering
  • πŸŒ™ Dark mode
  • πŸ€– Personalized food recommendations

πŸ‘¨β€πŸ’» Author

Arnav Nair

GitHub: https://github.com/Arnavnair15

License

This project was created for educational purposes and for the DEV Frontend Challenge.

Made with ❀️ and a little taste of home. 🍲

μ›λ¬Έμ—μ„œ 계속 β†—

μΆ”μΆœ λ³Έλ¬Έ Β· 좜처: dev.to Β· https://dev.to/arnav_nair_d942880de6378a/ghar-ka-swad-a-little-taste-of-home-1ei3