FabricHub is my full-stack e-commerce clothing store built with Spring Boot and React. I've created a seamless shopping experience with modern UI, secure authentication, and powerful backend APIs!
Developed a sophisticated product browsing system with real-time filtering, pagination, and search capabilities.
Designed a scalable backend architecture with clear separation of concerns and optimized request handling:
graph TD
A[Client] -->|HTTP Request| B[API Gateway]
B --> C[Authentication Filter]
C --> D[Rate Limiting]
D --> E[Request Processing]
subgraph Controllers Layer
E --> F[Auth Controller]
E --> G[Product Controller]
E --> H[Cart Controller]
E --> I[Order Controller]
E --> J[User Controller]
E --> K[Admin Controller]
end
subgraph Service Layer
F --> L[Auth Service]
G --> M[Product Service]
H --> N[Cart Service]
I --> O[Order Service]
J --> P[User Service]
K --> Q[Admin Service]
end
subgraph Data Access Layer
L --> R[JPA Repository]
M --> R
N --> R
O --> R
P --> R
Q --> R
end
R --> S[(MySQL Database)]
%% Performance Optimizations
style M fill:#e6f3ff,stroke:#333
style R fill:#e6f3ff,stroke:#333
%% Caching Layer
M -->|Cache Miss| T[Caffeine Cache]
T -->|Cache Hit| M
T -->|Cache Miss| S
%% Performance Monitoring
E --> U[Performance Interceptor]
U -->|Metrics| V[Actuator Endpoints]
U -->|Logs| W[Application Logs]
Key Components:
- Controllers: Handle HTTP requests and responses
- Services: Implement business logic and caching
- Repositories: Data access with JPA
- Caching: Reduces database load with intelligent invalidation
- Monitoring: Real-time performance metrics and logging
✨ JWT Authentication - Built secure token-based user management with cookie storage
🛒 Smart Shopping Cart - Created real-time cart updates with quantity management
📦 Complete Order Lifecycle - Developed full order tracking from cart to delivery
⭐ Review & Rating System - Implemented customer feedback with product ratings
🔍 Advanced Product Search - Built multi-parameter filtering (category, price, color, brand)
📱 Responsive Design - Crafted modern UI with TailwindCSS and Material-UI
🔐 Admin Dashboard - Created comprehensive product and order management
🏪 Multi-level Categories - Designed hierarchical product organization
💳 Payment Integration - Prepared for Razorpay integration
🚚 Order Status Tracking - Built real-time order status updates
Created this stunning homepage that showcases the latest fashion trends with an intuitive navigation experience and powerful filtering capabilities.
The product listing page with real-time filtering capabilities, allowing users to refine their search by category, price range, color, and more.
Built a robust JWT-based authentication system with secure cookie management and user session handling.
What I implemented:
- User registration with validation
- Secure login with JWT tokens
- Cookie-based session management
Developed intelligent cart management with real-time updates, quantity control, and price calculations.
Features I built:
- Add/remove items with size selection
- Quantity management
- Real-time price calculation
- Cart persistence across sessions
Created a comprehensive review system allowing customers to share detailed feedback and ratings.
What I included:
- Product rating system
- Detailed text reviews
- User-specific review management
- Average rating calculations
Built complete user profile management with order history, address management, and personal information.
Designed a powerful admin interface for managing products, categories, and inventory with bulk operations.
Admin features I built:
- Product CRUD operations
- Category management
- Bulk product creation
- Order status management
- Inventory tracking
Developed a full order management system from placement to delivery with comprehensive status tracking.
Order features I implemented:
- Multi-step order process
- Address management
- Payment integration ready
- Order status updates (PLACED → CONFIRMED → SHIPPED → DELIVERED)
- Order cancellation
-
Core
- Java 21 - Latest LTS with modern features
- Spring Security - JWT authentication & CORS configuration
- Spring Data JPA - Advanced query methods and pagination
- Hibernate - ORM with second-level cache support
-
Performance
- Caffeine Cache - High-performance caching layer
- QueryDSL - Type-safe queries for complex filtering
- Database indexing - Optimized for frequent queries
-
Infrastructure
- MySQL - Production-ready database with connection pooling
- Maven - Dependency management and build automation
- Docker - Containerization ready
-
Monitoring & Docs
- Spring Boot Actuator - Health checks and metrics
- Micrometer - Application metrics
- Swagger/OpenAPI - Interactive API documentation
- Lombok - Reduced boilerplate code
-
Micrometer - Application metrics and monitoring
-
Actuator - Production-ready features
- Vite - Lightning-fast build tool and HMR
- TailwindCSS - Utility-first styling framework
- Material-UI - Professional React components
- Axios - Promise-based HTTP client
- React Router - Client-side routing with protected routes
- React Hook Form - Efficient form handling
- Implemented Caffeine cache with 10-minute TTL for product catalog and user sessions
- Cache invalidation on data updates to ensure consistency
- Size-based eviction policy (max 500 entries)
- Added indexes on frequently queried columns
- Optimized JOIN operations with proper fetching strategies
- Implemented pagination for large result sets
- Used batch processing for bulk operations
- Real-time API performance tracking
- Slow-query detection and logging
- Memory and CPU usage monitoring
- Endpoint-specific metrics for continuous optimization
- Java 21+
- Node.js 18+
- MySQL 8.0+
- Maven 3.6+
# Clone my repository
git clone https://github.com/yourusername/FabricHub.git
cd FabricHub/fabricHub
# Configure database
cp .env.example .env
# Update database credentials in .env
# Run the application
./mvnw spring-boot:run# Navigate to frontend directory
cd ../frontend
# Install dependencies
npm install
# Start development server
npm run dev# Update fabricHub/.env
DB_URL=jdbc:mysql://localhost:3306/fabrichub
DB_USER=your_username
DB_PASS=your_password
FRONTEND_URL=http://localhost:5173/POST /api/auth/register- User registrationPOST /api/auth/login- User login with JWTPOST /api/auth/logout- Secure logout
GET /api/public/products- Advanced product filteringGET /api/public/products/{id}- Product detailsGET /api/public/products/search- Multi-field search
GET /api/cart- Get user cartPOST /api/cart/add- Add item to cartPUT /api/cart/update- Update cart itemDELETE /api/cart/item/{id}- Remove cart item
POST /api/orders/create/new/{addressId}- Create orderGET /api/orders- Get user ordersGET /api/orders/{id}- Order details
POST /api/admin/products/create- Create productPOST /api/admin/products/create/max- Bulk product creationPUT /api/admin/products/{id}- Update productDELETE /api/admin/products/{id}- Delete product
POST /api/reviews- Create reviewGET /api/reviews/product/{id}- Get product reviewsPOST /api/ratings- Rate product
FabricHub/
├── fabricHub/ # Spring Boot Backend
│ ├── src/main/java/
│ │ └── com/geto/fabricHub/
│ │ ├── controller/ # REST Controllers (11 classes)
│ │ ├── service/ # Business Logic (27 classes)
│ │ ├── model/ # JPA Entities (16 classes)
│ │ ├── repo/ # Data Repositories (15 interfaces)
│ │ ├── dto/ # Data Transfer Objects (11 classes)
│ │ ├── config/ # Configuration Classes (5 classes)
│ │ ├── exception/ # Exception Handling (4 classes)
│ │ └── RunnerService/ # Data Seeders (3 classes)
│ ├── src/main/resources/
│ │ └── application.properties
│ ├── Dockerfile # Container configuration
│ ├── Procfile # Deployment configuration
│ └── pom.xml # Maven dependencies
├── frontend/ # React Frontend
│ ├── src/
│ │ ├── components/ # Reusable Components
│ │ ├── pages/ # Page Components
│ │ ├── context/ # React Context (Auth)
│ │ └── customer/ # Customer Features
│ ├── package.json # Node dependencies
│ └── vite.config.js # Vite configuration
└── screenshots/ # Project Screenshots
🔗 Frontend: http://localhost:5173
📚 API Docs: http://localhost:8080/swagger-ui.html
🔧 Backend: http://localhost:8080
I've made this project deployment-ready with:
- Docker: Containerized with Dockerfile
- Heroku: Procfile included for easy deployment
- Production: Environment-based configuration
Feel free to explore my code, learn from it, or use it as inspiration for your own projects!
If you have suggestions:
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
I'm a passionate developer who loves creating amazing user experiences and robust backend systems! This project showcases my full-stack development skills with modern technologies.
Skills I demonstrated:
- Full-stack development (Spring Boot + React(ai-driven))
- RESTful API design and implementation
- Database design and JPA relationships
- JWT authentication and security
- Modern frontend development with React 19
- Responsive UI design with TailwindCSS
- Docker containerization
- Production deployment readiness
- Spring Boot community for the amazing framework
- React team for the incredible frontend library
- Ai tools helping me create the frontend
- All the open-source contributors who made this possible
⭐ Star this repository if you found it helpful!