NexuStore

🏪What is NexuStore?

NexuStore is a modern e-commerce platform built with React and TypeScript. It demonstrates a complete shopping experience with 50+ products, advanced search, persistent cart, and checkout flow - all implemented frontend-only with mock data.

Open Source Project: This is a frontend demonstration using local storage and mock data. Perfect for learning modern React patterns and e-commerce UI/UX.

✨Features

• 50+ Products across 10 categories with detailed information
• Advanced Search with real-time filtering and suggestions
• Shopping Cart & Wishlist with persistent local storage
• Multi-step Checkout with form validation
• Mock Authentication with protected routes and user profiles
• Responsive Design optimized for all devices
• Modern UI built with shadcn/ui components
• TypeScript for full type safety

🛠️Technology Stack

Frontend

• React 18.3.3 - Modern React with hooks
• TypeScript 5.5.3 - Type-safe development
• Vite - Fast build tool and dev server
• React Router 6 - Client-side routing

💅UI & Styling

• Tailwind CSS 3.4.11 - Utility-first CSS
• shadcn/ui - High-quality React components
• Lucide React - Icon library
• Responsive Design - Mobile-first approach

State Management

• React Context API - Global state management
• Local Storage - Persistent cart and user data
• Mock Data - Static product catalog

🚀Getting Started

Prerequisites

• Node.js 18+
• npm or yarn
• Git

⚡Quick Start

# Clone the repository
git clone https://github.com/cjjutba/nexustore-ecommerce.git
cd nexustore

# Install dependencies
npm install

# Start development server
npm run dev

# Open http://localhost:8080

🏗️Build for Production

npm run build
npm run preview

Deploy Your Own

1. Fork this repository
2. Connect to Vercel/Netlify
3. Deploy with default settings
4. Enjoy your e-commerce demo!

🤝Contributing

We welcome contributions! This project is great for:

• Learning modern React patterns
• Practicing TypeScript
• Understanding e-commerce UI/UX
• Contributing to open source

How to Contribute

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Make your changes
4. Commit your changes (git commit -m 'Add amazing feature')
5. Push to the branch (git push origin feature/amazing-feature)
6. Open a Pull Request

🤝Ideas for Contributions

• Add new product categories
• Improve mobile responsiveness
• Add animations and transitions
• Implement new payment methods (UI)
• Add product reviews and ratings
• Improve accessibility features

👨‍💻Author

CJ Jutba - Full Stack Developer

• Portfolio: https://cjjutba.com/
• LinkedIn: https://www.linkedin.com/in/cjjutba/
• GitHub: https://github.com/cjjutba
• Email: hello@cjjutba.com

🙏Acknowledgments

• shadcn/ui for the beautiful component library
• Tailwind CSS for the utility-first CSS framework
• Lucide for the comprehensive icon set
• Vercel for seamless deployment