Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/soumilaggarwal2003/mern-food-ordering-app-frontend

This is a full-stack MERN (MongoDB, Express.js, React.js, Node.js) web application project built using TypeScript. The project incorporates various features to facilitate food ordering and restaurant management.
https://github.com/soumilaggarwal2003/mern-food-ordering-app-frontend

auth0 expressjs mongodb nodejs reactjs shadcn-ui stripe tailwindcss typescript

Last synced: 4 days ago
JSON representation

Host: GitHub
URL: https://github.com/soumilaggarwal2003/mern-food-ordering-app-frontend
Owner: soumilaggarwal2003
Created: 2024-03-06T11:35:45.000Z (7 months ago)
Default Branch: main
Last Pushed: 2024-07-31T18:37:27.000Z (2 months ago)
Last Synced: 2024-09-26T17:04:39.468Z (9 days ago)
Topics: auth0, expressjs, mongodb, nodejs, reactjs, shadcn-ui, stripe, tailwindcss, typescript
Language: TypeScript
Homepage: https://mern-food-ordering-app-frontend-nj2c.onrender.com/
Size: 3.44 MB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# MERN Food Ordering Website
This is a full-stack MERN (MongoDB, Express.js, React.js, Node.js) web application project built using TypeScript. The project incorporates various features to facilitate food ordering and restaurant management.

# Features
**Responsive Design:** The website is fully responsive, ensuring a seamless experience across various devices and screen sizes.

**Pagination:** Enhanced user experience with pagination for browsing through multiple pages of content.

**Auth0 Integration:** Secure user authentication and authorization handled using Auth0.

**Stripe Payment Handling:** Secure payment processing via Stripe, allowing users to make payments for their orders.

**Restaurant Management:** Users can create and manage their restaurants, including menu items, cuisines, delivery charges, and restaurant images.

**Real-time Order Tracking:** Users can track the status of their orders in real-time, providing transparency and convenience.

**Filtering Options:** Users can apply filters such as cuisine type, delivery time, and delivery charges while searching for restaurants.

# Technologies Used
**MongoDB:** NoSQL database for storing application data.

**Express.js:** Web application framework for Node.js.

**React.js:** JavaScript library for building user interfaces.

**Node.js:** JavaScript runtime for server-side development.

**TypeScript:** Superset of JavaScript that adds static typing to the language.

**Auth0:** Authentication and authorization platform.

**Stripe:** Payment processing platform.
# Getting Started
**Prerequisites**

Node.js

npm or yarn

MongoDB

Auth0 account

Stripe account

# Installation

**1) Clone the repository:**

git clone https://github.com/soumilaggarwal2003/MERN-food-ordering-app-backend

**2) Install dependencies:**

npm install
**or**
yarn install

**3) Set up environment variables:**

Create a .env file in the root directory and add the following variables:

VITE_API_BASE_URL=

VITE_AUTH0_DOMAIN=

VITE_AUTH0_CLIENT_ID=

VITE_AUTH0_CALLBACK_URL=

**Run the development server:**

npm run dev
**or**
yarn dev

Open your browser and navigate to: http://localhost:3000

# Usage
Navigate to the hosted URL: https://mern-food-ordering-app-frontend-nj2c.onrender.com/

Create an account or log in using Auth0.

Browse restaurants, filter results, and place orders.

Manage your restaurant if you are a registered owner.

Track your order status in real-time.

# Acknowledgements

Auth0 Documentation

Stripe Documentation

React Documentation

Express.js Documentation

MongoDB Documentation

# Hosted URL:
https://mern-food-ordering-app-frontend-nj2c.onrender.com/

# Testing
Use the following card number for Stripe payment testing:

Card Number: 4000 0035 6000 0008