nidhiG30 / swiggy-clone

Swiggy clone by Hiren 🚀 (ReactJS)

Swiggy is an Indian online food ordering and delivery platform. Founded in 2014, Swiggy is based in Bangalore and operates in 500 Indian cities as of September 2021.

How to get Started 🚀

There are two methods for getting started with this repo.

Familiar with Git ?

- https://github.com/hirenkvaghasiya/swiggy-clone-by-hiren.git
- npm install
- npm run start OR npm start

Not Familiar with Git ?

download the .zip file. Extract the contents of the zip file, then open your terminal, change to the project directory, and:

> cd swiggy-clone-by-hiren
> npm install
> npm run start OR npm start

Snap Shots 📷

Relevance Restaurants Data / Landing Page

Top Rated Restaurants Data (Filter)

Parcel JS

• Dev Build
• Local Server
• HMR = Hot Module Replacement
• File Watching Algorithm - written in C++
• Caching - Faster Builds
• Image Optimization
• Minification
• Bundling
• Compress
• Consistent Hashing
• Code Splitting
• Differential Bundling - support older browsers
• Diagnostic
• Error Handling
• HTTPs
• Tree Shaking - remove unused code
• Different dev and prod bundles

Swiggy Clone File Structure

• Header
  • Logo
  • Nav Items
• Body
  • Filter
  • Search
  • Restaurant Container
    • Restaurant Card
      • Img
      • Name of Restaurant, Star Rating, Cuisines, Delivery time, etc...
• Footer
  • Copyright
  • Links

Two types of Export/Import

• Default Export/Import

  • export default Component;
  • import Component from "path";

• Named Export/Import

  • export const Component;
  • import {Component} from "path";

React Hooks

(Normal JS utility functions)

• useState()
  • Superpowerful State Variables in react
• useEffect()