Pizza Now is a fictional pizza delivery service where users can order pizzas online for delivery to their homes. This project is a simple front-end application built using React, designed to allow customers to browse a dynamic pizza menu, add items to their cart, and place orders with minimal user input.
The Pizza Now application was developed to provide a seamless experience for users to order pizzas from a dynamic menu, without the need for user accounts or login. The application allows users to add multiple pizzas to their cart, provide necessary delivery details, and place their order. Additionally, users have the option to mark their order as "priority" for an extra charge. This README file provides a comprehensive overview of the project, including its functionality, features, and setup instructions.
The application includes the following functionality:
- Menu Loading: The pizza menu is dynamically loaded from an API, allowing for easy updates to the menu items.
- Order Placement: Users can add pizzas to their cart and place an order by providing their name, phone number, and delivery address. GPS location can also be provided to assist with delivery.
- Cart Management: Users can view and manage the contents of their cart before placing an order.
- Priority Orders: Users can mark their order as a "priority" for an additional 20% of the cart price, even after the order has been placed.
- Order Confirmation: Each order is assigned a unique ID, which is displayed to the user for future reference.
The application is divided into the following key features and corresponding pages:
| Feature Categories | Necessary Pages |
|---|---|
| User | 1. Homepage (/) |
| Menu | 2. Pizza menu (/menu) |
| Cart | 3. Cart (/cart) |
| Order | 4. Placing a new order (/order/new) |
| Order | 5. Looking up an order (/order/:orderId) |
- Homepage (
/): The landing page where users start their journey. - Pizza Menu (
/menu): A dynamic list of available pizzas where users can browse and add items to their cart. - Cart (
/cart): A summary page displaying the pizzas selected by the user, with options to modify the cart before proceeding to checkout. - Placing a New Order (
/order/new): A form where users input their delivery details and confirm their order. - Looking Up an Order (
/order/:orderId): A page that allows users to retrieve and view the details of their previous orders using their unique order ID.
The project utilizes the following technologies and tools:
React 18: The core library for building the user interface.
Vite: A fast build tool that offers a great development experience.
React Router: Used for managing routing and navigation between different pages.
Tailwind CSS: A utility-first CSS framework for styling the application.
Redux: For managing the application's UI state.
React Query: For managing remote state and handling server communication.
To set up the project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/yourusername/Pizza-Now.git cd Pizza-Now -
Install dependencies:
npm install
-
Start the development server:
npm run dev
The application will be available at
http://localhost:5173.
Check out the live version of "Pizza Now" here.