A responsive online car marketplace built with React, where users can browse premium automotive brands, explore products, manage their cart, and perform full CRUD operations — powered by Firebase Auth and a MongoDB backend.
- 🚗 Brand-Based Browsing — Explore vehicles by featured brands (Toyota, Ford, BMW, Mercedes, Tesla, Honda)
- 🔍 Product Details — View detailed specifications, pricing, and descriptions for each vehicle
- 🛒 Shopping Cart — Add products to your cart and manage selected items before checkout
- ➕ Add & Edit Products — Full CRUD operations to add new products or update existing ones in the database
- 🔐 Authentication — Register/Login via email-password or Google Sign-In using Firebase
- 🌗 Dark Mode — Toggle between light and dark themes for comfortable browsing
- 🎠 Image Carousel — Swiper-powered hero slider showcasing featured products
- 📊 Statistics Dashboard — Visual stats section displaying cars sold, subscribers, and inventory metrics
| Layer | Technologies |
|---|---|
| Frontend | React 18, React Router, TanStack Query, Tailwind CSS, DaisyUI |
| Auth | Firebase SDK (Email/Password + Google) |
| Backend | Node.js, Express.js |
| Database | MongoDB |
| UI/UX | Swiper.js, SweetAlert2, React Icons, Dark Mode Toggle |
| Build | Vite |
| Hosting | Firebase (Client) · Vercel (Server) |
- Node.js (v16+)
- npm or yarn
- Firebase project with Authentication enabled
# Clone the repository
git clone https://github.com/Rezwan66/auto-maniac-client.git
# Navigate to the project
cd auto-maniac-client
# Install dependencies
npm installCreate a .env.local file in the root directory with your Firebase configuration:
VITE_apiKey=your_firebase_api_key
VITE_authDomain=your_project.firebaseapp.com
VITE_projectId=your_project_id
VITE_storageBucket=your_project.appspot.com
VITE_messagingSenderId=your_sender_id
VITE_appId=your_app_idnpm run devThe app will be available at http://localhost:5173
src/
├── assets/ # Static assets (images, icons)
├── components/ # Reusable UI components
├── firebase/ # Firebase configuration
├── hooks/ # Custom React hooks
├── pages/ # Route-level page components
├── providers/ # Context providers (Auth, Theme)
├── routes/ # Route definitions & protected routes
└── utilities/ # Helper functions
- Server Repository: auto-maniac-server
- Live Site: auto-maniac.web.app