Skip to content

SaketKothari/eatsy-webapp

Repository files navigation

eatsy-webapp

Eatsy is a dynamic and user-friendly restaurant directory application, designed to provide a seamless dining experience. Leveraging a robust set of modern technologies and best practices, this webapp offers an intuitive and visually appealing platform for users to discover, explore, and interact with restaurants.

CORS Chrome Extension

Features

  • React Component Reusability: ♻️ Maximize code reuse with modular React components.
  • Photo Gallery 📸: Display a gallery of restaurant images.
  • Integration with Third-Party Services 🚀: Connect to external APIs for additional data.
  • Design Restaurant Details Page: 🖼️ Create visually appealing restaurant information display.
  • Design Restaurant Shimmer component: 🌟 Develop loading skeleton for restaurant details.
  • Online status based on internet connection: 🌐 Show connection status for real-time updates.
  • Implement Lazy loading: ⏳ Optimize app performance with component loading on-demand.
  • Search: 🔍 Enable users to search for restaurants or specific information.
  • Config driven UI: ⚙️ Configure UI elements through settings or configuration files.
  • Code-splitting: 🧩 Improve performance by splitting code into smaller, loadable chunks.
  • Higher-order-component: 🔄 Reusable component logic for better code organization.
  • React-router-dom: 🚀 Navigate between components using React Router.
  • Live-api: 📡 Integrate real-time data updates using live API connections.
  • TailwindCSS: 🎨 Utilize utility-first CSS framework for styling components.
  • Parcel-bundler: 📦 Bundle and optimize assets for fast application loading.
  • Context-api: 🌍 Manage global state and share data across components.
  • React-testing-library: 🧪 Write tests for React components using testing library.
  • React-hooks: ⚛️ Utilize React's built-in hooks for state management.
  • Custom-hooks: 🛠️ Create custom reusable hooks for specific functionality.
  • Redux-toolkit: 🧰 Implement state management using Redux Toolkit.
  • Props-and-state-components: 📊 Pass data via props or manage local component state.

Installation Steps

You need to install the dependencies:

npm install

Available Scripts

In the project directory, you can run:

npm start

To run test-cases:

npm run test