DriveHub is a complete full-stack CarShop & Management Web Application that supports seamless user and admin experiences. It features robust authentication, product and order management, and a secure checkout system integrated with a payment gateway. Admins can manage inventory, users, and orders, while users enjoy browsing, purchasing, and tracking vehicles with ease. The system also offers a clean, responsive UI and role-based dashboards for distinct functionalities.

• Live
• backend Repo

• Email/password-based authentication

• JWT-based token system for session security

• Password hashing with bcrypt

• Role-based access: User & Admin

• Home Page: Banner, featured products, promotional section, and footer

• All Products Page: Search, filter, and dynamic listings

• Product Details Page: Detailed view with Buy Now option

• About Page: Platform introduction

• Checkout Page: Place orders securely with stock validation

• Dashboard Access:

• Admin Dashboard:

• Manage Users

• Manage Products

• Manage Orders

• User Dashboard:

• View Order History

• Profile management & password update

• Integrated with SurjoPay or compatible payment gateway

• Seamless, secure payment process

• Admins can add, update, or delete product listings

• Stock updates automatically upon order placement

• Integrated SurjoPay (or similar gateway) for seamless payments. 📦 Product & Order Management.

• Responsive Design: Fully mobile-optimized
• Modern UI: Tailwind CSS + Shadcn
• User-Friendly: Simple forms, clean navigation, dark mode ready.

• Fully responsive and optimized for all devices. 🔄 Error Handling & Loading States

• Friendly error messages for login, registration, and order issues.

• Spinners and toasts for better user experience. 🔗 API Features

• Pagination for product and order listings.

• Authentication middleware to secure private routes.

React.js, Redux, Ant Design, Sonner (for notifications). Routing: React Router Dom

Node.js, Express.js MongoDB Mongoose Nodemailer JWT

src/
├── assets/           # Images, icons, logos, etc.
├── components/       # Reusable UI components
├── pages/            # All route pages (Home, Dashboard, etc.)
├── redux/            # Redux slices & store setup
├── routes/           # App route definitions (protected/private)
├── schema/           # Validation schemas (zod/yup)
├── types/            # TypeScript types and interfaces
├── utils/            # Helper 


├── App.jsx           # Root app 

├── index.css         # Global CSS & 

└── main.tsx          # Entry point (ReactDOM render)

1. Clone the Repository

https://github.com/nafis200/DriveHub-_frontend?tab=readme-ov-file
cd DriveHub-_frontend

2. Install Dependencies

npm install

3. Set Up env varriables

Create a .env.local file in the root directory and add the following line

NEXT_PUBLIC_BASE_API=http://localhost:5000

4. Run the Development Server

npm run dev

Nafis Ahamed📧 Email: [email protected]🌐 Portfolio: https://portfoliouser.vercel.app/