Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts
A web app for pizza outlet with admin panel.
https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts
expressjs imagekit mantine-ui microfrontend mongodb nodemailer react react-hot-toast react-query redux typescript
Last synced: 2 days ago
JSON representation
A web app for pizza outlet with admin panel.
- Host: GitHub
- URL: https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts
- Owner: ashishkk22
- Created: 2023-05-19T13:59:50.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-09-15T12:59:17.000Z (over 1 year ago)
- Last Synced: 2024-11-10T22:13:34.350Z (2 months ago)
- Topics: expressjs, imagekit, mantine-ui, microfrontend, mongodb, nodemailer, react, react-hot-toast, react-query, redux, typescript
- Language: TypeScript
- Homepage: https://d91vylvrr1oaq.cloudfront.net/
- Size: 1.68 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Pizza Delivery Web App (Micro-Frontend) - MERN
### Demo Link
- Main App : https://d91vylvrr1oaq.cloudfront.net/
- Admin Panel : https://d1v43ctua56grx.cloudfront.net/### Signup Page
![Screenshot from 2023-06-05 12-14-02](https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts/assets/83124264/a01d557e-0334-4236-babe-75020a5202b2)
### Home Page
![Screenshot from 2023-06-05 12-14-34](https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts/assets/83124264/1bf5f510-b335-48e9-be82-b17a21803f0b)
### Admin Panel
![image](https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts/assets/83124264/ee697c47-c636-4612-9b50-dfb665289b6e)
### :space_invader: Tech Stack
Client
Server
Database
### Nx Graph
![graph (1)](https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts/assets/83124264/f632a761-0caf-4b13-ad42-2ba7f9353f2b)
### :dart: Features
- Basic signup and login functionalities with email OTP-based authentication.
- An admin panel allows administrators to manage coupons, products, and categories.
- Admins can accept orders and update their status.
- Image uploads are supported using ImageKit.
- Users can view their order history, receive live updates, and manage multiple addresse
### 📁 Project Structure
The project is using nx monorepo.
- **`apps`**: contains micro frontend apps with its host.
- **`lib`**: contains shared UI , react query client and redux store between micro fontend apps.
![image](https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts/assets/83124264/5d7cc732-3801-4946-996f-dcfe9d8ffedc)
### :key: Environment Variables
To run this project, you will need to add the following environment variables to your .env file. you can refer .env.example file for the references.
Variables
`NX_PORT_API`
`NX_MONGODB_URL`
`NX_IMAGE_KIT_URL`
`NX_IMAGE_KIT_PUBLIC_KEY`
`NX_IMAGE_KIT_PRIVATE_KEY`
`NX_EXPIRE_OTP`
`NX_GMAIL_PASS`
`NX_GMAIL_USER`
`NX_JWT_COOKIE_EXPIRES`
`NX_JWT_EXPIRE`
`NX_JWT_SECRET`
`NX_CLIENT_HOST`
`NX_CLIENT_ADMIN`
## :toolbox: Getting Started
### System Requirements
- git v2.13 or greater
- nodejs `14 || 16 || 18`
- npm v8.16.0 or greater
All of these must be available in your `PATH`. To verify things are set up
properly, you can run this:
```shell
git --version
node --version
npm --version
```
### :bangbang: Prerequisites
This project uses pnpm as package manager
```bash
npm install --global pnpm
```
### :running: Run Locally
Clone the project
```bash
https://github.com/ashishkk22/pizza-app-mern-microfrontend-ts.git
```
Go to the project directory
```bash
cd pizza-app-mern-microfrontend
```
Install dependencies and add the required environment variables in the .env (reference .env.example)
```bash
pnpm install
```
To start the host app in development run.
```bash
pnpm nx serve host --devRemotes="cart,shop,auth"
```
To start the admin app in development run.
```bash
pnpm nx serve admin --devRemotes="auth"
```
To start the server in development run
```bash
nx serve api
```
## :handshake: Contact
Ashish Kachhadiya - [email protected]