A web application for a bicycle store that allows customers to browse products and add them to cart.
- Browse products by category
- Shopping cart functionality (without checkout processing)
- Real-time inventory tracking
- Responsive design for mobile and desktop
- Product quantity controls
- Complete admin panel (CRUD)
- Complete product management (Create, Read, Update, Delete)
- Category management
- Image uploads for products
- Variant and stock control
- Frontend: HTML, CSS, Vanilla JavaScript
- Backend: Node.js with Express
- Storage: JSON files
- Local storage for cart persistence
- Install dependencies:
npm install- Start the server:
npm start- Open your browser and navigate to:
http://localhost:3000
api/server.js- Express server setup and API endpointsapi/db.json- Products databaseapi/categories.json- Categories databaseapi/uploads/- Directory for uploaded imagesfrontend/index.html- Main store pagefrontend/admin.html- Admin panelfrontend/script.js- Store logicfrontend/admin.js- Admin panel logicfrontend/styles.css- Application styling
- Browse products using the category filters at the top of the page
- Click the plus/minus buttons to adjust product quantities
- Click "Add to Cart" to add items to your shopping cart
- Click the cart icon to view your cart
- Note: Checkout functionality is not implemented
- Access the admin panel by clicking "Admin Panel" at the top of the page
- Manage products: create, edit, and delete products
- Manage categories: create, edit, and delete categories
- Upload images for products
- Configure variants and stock levels
The application uses a simple Express server to serve static files and handle API requests. Product and category data are stored in JSON files for easy modification. The frontend uses vanilla JavaScript with no external dependencies for core functionality.
This project is licensed under the Apache License 2.0.