https://github.com/anashany2193/mern-food-ordering-frontend
The frontend for the MERN Food Ordering app provides a seamless user experience for browsing restaurants, filtering by cuisine, managing cart items, and completing secure checkouts with Stripe. Integrated with Auth0 for authentication, it also supports order tracking and history.
https://github.com/anashany2193/mern-food-ordering-frontend
auth0 react react-dom react-node redix-ui sonner tailwind
Last synced: 3 months ago
JSON representation
The frontend for the MERN Food Ordering app provides a seamless user experience for browsing restaurants, filtering by cuisine, managing cart items, and completing secure checkouts with Stripe. Integrated with Auth0 for authentication, it also supports order tracking and history.
- Host: GitHub
- URL: https://github.com/anashany2193/mern-food-ordering-frontend
- Owner: AnasHany2193
- Created: 2024-10-22T18:14:46.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2024-10-31T01:42:06.000Z (12 months ago)
- Last Synced: 2025-03-30T14:12:27.021Z (7 months ago)
- Topics: auth0, react, react-dom, react-node, redix-ui, sonner, tailwind
- Language: TypeScript
- Homepage:
- Size: 20.4 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# MERN Food Ordering - Frontend 🍔🍕🍜
Welcome to the frontend repository for **MERN Food Ordering App**! This is the user interface of the platform, built with **React**, **React Router**, and **Auth0** for authentication. The app enables users to browse restaurants, search for cuisines, add items to the cart, and securely check out via Stripe.
## Project Overview 🎨
This frontend is designed to integrate with the backend API [here](https://github.com/AnasHany2193/mern-food-ordering-backend). Together, they offer a complete food ordering experience.
### Key Features 🌟
- **User Authentication**: Auth0 integration for seamless login and registration.
- **Restaurant Browsing**: Explore local restaurants, search and filter results.
- **Cart & Checkout**: Add items, review the cart, and check out with Stripe.
- **Order History**: Track previous orders and status in real time.
## Project Video 📹
## Setup Guide 🛠
### Prerequisites
- Node.js & npm
- Backend API (ensure [backend setup](https://github.com/AnasHany2193/mern-food-ordering-backend) is complete)
### Installation Steps
1. **Clone the repository**:
```bash
git clone https://github.com/AnasHany2193/mern-food-ordering-frontend.git
cd mern-food-ordering-frontend
```
2. **Install dependencies**:
```bash
npm install
```
3. **Configure Environment Variables**:
Create a `.env` file in the root with the following variables:
```plaintext
VITE_API_BASE_URL=http://localhost:7000
VITE_AUTH0_DOMAIN=
VITE_AUTH0_CLIENT_ID=
VITE_AUTH0_REDIRECT_URI=
VITE_AUTH0_AUDIENCE=
```
4. **Run the App**:
```bash
npm start
```
The app will be available at `http://localhost:3000`.
## Backend Setup 🌐
To complete the integration, ensure the backend setup is configured and running as detailed [here](https://github.com/AnasHany2193/mern-food-ordering-backend).
## Contributing 🤝
We welcome issues, pull requests, and feedback!