Fast React Pizza Co.

Fast React Pizza Co. 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.

Table of Contents

• Project Overview
• Project Functionality
• Features & Pages
• Screenshots
• Technologies Used
• Project Setup
• Contact

Project Overview

The 'Fast React Pizza Co.' 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.

Project Functionality

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.

Features & Pages

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.

Screenshots

Here are some screenshots of the application to give you a visual overview:

1. Homepage (/)

2. Pizza Menu (/menu)

3. Pizza Menu After Adding to Cart (/menu)

4. Cart (/cart)

5. Placing a New Order (/order/new)

6. Looking Up an Order (/order/:orderId)

Technologies Used

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.

Project Setup

To set up the project locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/yourusername/fast-react-pizza.git
   cd fast-react-pizza

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

   The application will be available at http://localhost:5173.

4. Building for production:

   npm run build

   This will create an optimized production build.

Contact

If you have any questions or feedback, feel free to reach out:

• 📧 Email: [email protected]
• 🌐 Portfolio: paulanik.com
• 💼 LinkedIn: LinkedIn Profile
• 📝 Dev.to: Dev.to Profile