DevBazaar - Developer Marketplace 🚀

A modern, vibrant e-commerce platform designed specifically for developers. Built with the MERN stack and featuring stunning animations, interactive elements, and a seamless user experience.

✨ Features

🎨 Modern Design

• Glassmorphism UI with vibrant color palette
• Particle.js background with interactive floating dots
• Typewriter effect on hero section
• Custom cursor with trailing animation
• Dark/Light mode toggle
• Mobile-first responsive design

🚀 Interactive Elements

• Animated counters with emoji animations
• Live product search with autocomplete
• Cart fly-in animations from the right side
• Scroll-triggered animations (fade-in, slide-up, scale)
• Image zoom on hover for product cards
• Confetti animation on order completion
• Daily developer tips that rotate automatically

🛒 E-commerce Features

• Product catalog with categories (Digital & Physical)
• Shopping cart with real-time updates
• User authentication system
• Order management
• Stock tracking
• Search and filtering

⚡ Performance Optimizations

• Lazy loading for images and components
• Skeleton loaders for better UX
• Error boundaries for graceful error handling
• Optimized images with WebP support
• Mobile-responsive with touch-friendly interactions

🛠️ Tech Stack

Frontend

• React 18 - Modern React with hooks
• Tailwind CSS - Utility-first CSS framework
• React Router - Client-side routing
• Axios - HTTP client for API calls
• TSParticles - Interactive particle backgrounds
• Typewriter Effect - Animated text effects

Backend

• Node.js - JavaScript runtime
• Express.js - Web application framework
• MongoDB - NoSQL database
• Mongoose - MongoDB object modeling
• JWT - JSON Web Tokens for authentication
• bcrypt - Password hashing

🚀 Quick Start

Prerequisites

• Node.js (v14 or higher)
• MongoDB (local or Atlas)
• npm or yarn

Installation

1. Clone the repository

   git clone <repository-url>
   cd devbazaar

2. Install dependencies

   # Install root dependencies
   npm install
   
   # Install client dependencies
   cd client
   npm install
   
   # Install server dependencies
   cd ../server
   npm install

3. Set up environment variables

   # In server directory, create .env file
   cd server
   cp .env.example .env

   Configure your .env file:

   MONGODB_URI=mongodb://localhost:27017/devbazaar
   JWT_SECRET=your-secret-key
   PORT=5000

4. Start MongoDB

   # If using local MongoDB
   mongod

5. Seed the database (optional)

   cd server
   node src/seedDatabase.js

6. Start the development servers

   # Terminal 1: Start backend server
   cd server
   npm start
   
   # Terminal 2: Start frontend development server
   cd client
   npm start

7. Open your browser

   • Frontend: http://localhost:3000
   • Backend API: http://localhost:5000

📱 Mobile Support

DevBazaar is fully responsive and optimized for mobile devices:

• Touch-friendly buttons (44px minimum)
• Hamburger navigation menu
• Optimized font sizes and spacing
• Swipe gestures support
• Custom cursor disabled on mobile for better performance

🎯 Browser Support

• Chrome (recommended)
• Firefox
• Safari
• Edge

🤝 Contributing

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

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Built with ❤️ for the developer community
• Inspired by modern e-commerce platforms
• Special thanks to all contributors

📞 Support

For support, email support@devbazaar.com or join our Discord community.

---

Made with 💻 by developers, for developers 🚀