🍕 Pizzanova

A delightful pizza-ordering SPA built with React, Vite, Tailwind, and Redux Toolkit. Users can browse a pizza menu, add to cart, checkout, and track their orders fast and simple!

---

🚀 Project Overview

Pizzanova is a modern, responsive single-page application that simulates a real pizza ordering experience.

It demonstrates:

• Scalable feature-based architecture
• React Router loaders & actions for data flows
• Redux Toolkit for global state
• Seamless API integration and UX enhancements like geolocation-based address autofill

---

🧰 Tech Stack

Core Technologies

• React 19
• Vite
• Redux Toolkit
• React Router
• Tailwind CSS

Tooling

• ESLint & Prettier for code quality
• API Integration with:
  • Pizza API (react-fast-pizza-api.jonas.io)
  • Reverse geocoding API

---

🧱 Architecture

The app is organized by features: menu, cart, user, and order, each containing its own components and logic.

Key Concepts

• Router loaders/actions → Fetch & mutate server data declaratively
• Redux slices → Clear state isolation for cart and user
• Service layer → API interactions encapsulated in /services

This keeps UI components clean, reusable, and maintainable.

---

✨ Features

• ✔ Browse full pizza menu
• ✔ Add/update/remove items in cart
• ✔ Automatic address suggestion from geolocation
• ✔ Create and track orders via order ID
• ✔ Persist user name globally across pages
• ✔ Clean UI and responsive layout

---

📦 Installation & Setup

1️⃣ Clone the repository

git clone https://github.com/SamerYaserr/Pizzanova.git
cd Pizzanova

2️⃣ Install dependencies

npm install

3️⃣ Run development server

npm run dev

---

📂 Folder Structure

Pizzanova/
├─ index.html
└─ src/
   ├─ main.jsx
   ├─ App.jsx
   ├─ store.js
   ├─ index.css
   ├─ utils/
   │  └─ helpers.js
   ├─ services/
   │  ├─ apiRestaurant.js
   │  └─ apiGeocoding.js
   ├─ features/
   │  ├─ menu/
   │  ├─ cart/
   │  ├─ order/
   │  └─ user/
   └─ ui/