🛒 NextShop - Online Shopping Platform

A full-stack e-commerce platform built using a microservices architecture with Spring Boot backend and Next.js frontend. The platform provides a complete online shopping experience including product browsing, shopping cart, order management, and secure payment processing via Stripe.

✨ Features

Customer Features

🔐 User Authentication - Secure registration and login with JWT
📦 Product Catalog - Browse products with search and category filters
🛒 Shopping Cart - Add, update, and remove items
📋 Order Management - Track order history and status
💳 Secure Payments - Stripe integration for card payments
👤 User Profile - Manage account and change password

Admin Features

📊 Dashboard - Overview of orders and products
📦 Product Management - Full CRUD with image upload
📋 Order Management - View and update order statuses
👥 User Management - View registered users

Technical Features

🏗️ Microservices Architecture - Scalable and maintainable
🔍 Service Discovery - Netflix Eureka for dynamic service registration
🚪 API Gateway - Centralized routing and security
🐳 Containerized - Docker and Docker Compose ready
📝 API Documentation - Swagger/OpenAPI integration

🏗️ Architecture

High-Level System Architecture

📊 View Interactive Diagram (Mermaid)

flowchart TB
    subgraph Client["🌐 Client Layer"]
        Browser["Browser"]
        Mobile["Mobile App"]
    end

    subgraph Frontend["📱 Frontend (Next.js 13.5)"]
        NextApp["Next.js Application"]
        Components["React Components"]
        Services["API Services"]
    end

    subgraph Gateway["🚪 API Gateway Layer"]
        APIGateway["API Gateway<br/>(Spring Cloud Gateway)"]
        SecurityFilter["JWT Security Filter"]
    end

    subgraph Discovery["🔍 Service Discovery"]
        Eureka["Netflix Eureka<br/>Service Registry"]
    end

    subgraph Microservices["⚙️ Microservices Layer"]
        AuthService["Auth Service<br/>(JWT Token Management)"]
        UserService["User Service<br/>(User Management)"]
        ProductService["Product Service<br/>(Product Catalog)"]
        PaymentService["Payment Service<br/>(Orders, Cart, Payments)"]
    end

    subgraph Databases["🗄️ Data Layer"]
        MongoDB[(MongoDB<br/>Products, Users, Cart, Orders)]
        PostgreSQL[(PostgreSQL<br/>Payment Transactions)]
    end

    subgraph External["☁️ External Services"]
        Stripe["Stripe API<br/>(Payment Processing)"]
    end

    Browser --> NextApp
    Mobile --> NextApp
    NextApp --> APIGateway
    
    APIGateway --> SecurityFilter
    SecurityFilter --> AuthService
    APIGateway --> UserService
    APIGateway --> ProductService
    APIGateway --> PaymentService
    
    AuthService -.->|Register| Eureka
    UserService -.->|Register| Eureka
    ProductService -.->|Register| Eureka
    PaymentService -.->|Register| Eureka
    
    UserService --> MongoDB
    ProductService --> MongoDB
    PaymentService --> MongoDB
    PaymentService --> PostgreSQL
    PaymentService --> Stripe
    
    APIGateway -.->|Discover| Eureka

Microservices Communication

📊 View Interactive Diagram (Mermaid)

flowchart LR
    subgraph MS["Microservices"]
        direction TB
        SD["🔍 Service Discovery<br/>Port: 8761"]
        GW["🚪 API Gateway<br/>Port: 9000"]
        AS["🔐 Auth Service<br/>Port: 8084"]
        US["👤 User Service<br/>Port: 8083"]
        PS["📦 Product Service<br/>Port: 8080"]
        PY["💳 Payment Service<br/>Port: 8085"]
    end

    GW --> SD
    AS --> SD
    US --> SD
    PS --> SD
    PY --> SD

🔧 Technology Stack

Backend

Technology	Version	Purpose
Java	17	Programming Language
Spring Boot	3.3.4	Core Framework
Spring Cloud	2023.0.3	Microservices Infrastructure
Spring Cloud Gateway	2023.0.3	API Gateway
Netflix Eureka	2023.0.3	Service Discovery
Spring Security	3.3.4	Authentication & Authorization
Spring Data MongoDB	3.3.4	MongoDB Integration
Spring Data JPA	3.3.4	PostgreSQL Integration
Flyway	Latest	Database Migrations
Stripe Java SDK	22.4.0	Payment Processing
SpringDoc OpenAPI	2.6.0	API Documentation
Lombok	Latest	Boilerplate Reduction
Maven	3.x	Build Tool

Frontend

Technology	Version	Purpose
Next.js	13.5.1	React Framework
React	18.2.0	UI Library
TypeScript	5.2.2	Type-Safe JavaScript
Tailwind CSS	3.3.3	Styling
Radix UI	Various	Accessible Components
React Hook Form	7.53.0	Form Management
Zod	3.23.8	Schema Validation
Axios	1.7.8	HTTP Client
Stripe React	2.8.1	Payment UI
Recharts	2.12.7	Data Visualization
Lucide React	0.446.0	Icons

DevOps & Infrastructure

Technology	Purpose
Docker	Containerization
Docker Compose	Container Orchestration
GitHub Actions	CI/CD Pipeline
MongoDB	NoSQL Database
PostgreSQL	Relational Database

🔌 Microservices

1. Service Discovery (Netflix Eureka)

Port: 8761

Central service registry that enables dynamic service discovery and load balancing.

2. API Gateway

Port: 9000

Single entry point for all client requests with JWT validation, routing, and CORS handling.

3. Auth Service

Port: 8084

Endpoint	Method	Description
`/api/auth/token`	POST	Generate JWT token
`/api/auth/validate`	POST	Validate JWT token

4. User Service

Port: 8083

Endpoint	Method	Description
`/api/user/register`	POST	Register new user
`/api/user/login`	POST	User login
`/api/user/change-password`	POST	Change password
`/api/user/all`	GET	Get all users

5. Product Service

Port: 8080

Endpoint	Method	Description
`/api/v1/products`	POST	Create product
`/api/v1/products`	GET	Get all products
`/api/v1/products/{id}`	GET	Get product by ID
`/api/v1/products/{id}`	PUT	Update product
`/api/v1/products/{id}`	DELETE	Delete product
`/api/v1/products/categories`	GET	Get categories
`/api/v1/products/search`	GET	Search products

6. Payment Service

Port: 8085

Cart Endpoints

Endpoint	Method	Description
`/api/v1/cart/{userId}`	POST	Add to cart
`/api/v1/cart/{userId}`	GET	Get cart
`/api/v1/cart/{userId}`	DELETE	Clear cart
`/api/v1/cart/{userId}/{productId}`	DELETE	Remove item

Order Endpoints

Endpoint	Method	Description
`/api/v1/orders`	POST	Create order
`/api/v1/orders`	GET	Get all orders
`/api/v1/orders/{id}`	GET	Get order by ID
`/api/v1/orders/user/{userId}`	GET	Get user orders
`/api/v1/orders/{id}/status`	PUT	Update status
`/api/v1/orders/{id}`	DELETE	Cancel order

Payment Endpoints

Endpoint	Method	Description
`/api/v1/payments/create`	POST	Create payment
`/api/v1/payments/{id}`	GET	Get payment
`/api/v1/payments/{id}/status`	PUT	Update status
`/api/v1/payments/{id}/confirm`	POST	Confirm payment
`/api/v1/payments/{id}/cancel`	POST	Cancel payment

🚀 Getting Started

Prerequisites

Java 17 or higher
Node.js 18 or higher
Docker and Docker Compose
Maven 3.x
MongoDB (or use Docker)
Stripe Account (for payments)

Installation

1. Clone the Repository

git clone https://github.com/yourusername/ead-project.git
cd ead-project

2. Start Infrastructure Services

cd microservices-backend
docker-compose up -d mongodb

3. Start Backend Services

Start services in this order:

# Terminal 1 - Service Discovery
cd service-discovery
./mvnw spring-boot:run

# Terminal 2 - Auth Service
cd auth-service
./mvnw spring-boot:run

# Terminal 3 - User Service
cd user-service
./mvnw spring-boot:run

# Terminal 4 - Product Service
cd product-service
./mvnw spring-boot:run

# Terminal 5 - Payment Service
cd payment-service
./mvnw spring-boot:run

# Terminal 6 - API Gateway
cd api-gateway
./mvnw spring-boot:run

4. Start Frontend

cd microservices-frontend
npm install
npm run dev

5. Access the Application

Frontend: http://localhost:3000
API Gateway: http://localhost:9000
Eureka Dashboard: http://localhost:8761
Swagger UI: http://localhost:9000/swagger-ui.html

Environment Variables

Create .env file in microservices-frontend:

NEXT_PUBLIC_API_URL=http://localhost:9000
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=your_stripe_publishable_key

Configure Stripe in payment-service/src/main/resources/application.properties:

stripe.api.key=your_stripe_secret_key

📚 API Documentation

API documentation is available via Swagger UI once the services are running:

Product Service: http://localhost:8080/swagger-ui.html
Payment Service: http://localhost:8085/swagger-ui.html
User Service: http://localhost:8083/swagger-ui.html
Auth Service: http://localhost:8084/swagger-ui.html

📁 Project Structure

ead-project/
├── microservices-backend/
│   ├── api-gateway/              # Spring Cloud Gateway
│   │   └── src/main/java/
│   │       └── config/           # Security & routing config
│   │
│   ├── auth-service/             # Authentication Service
│   │   └── src/main/java/
│   │       ├── controller/       # REST endpoints
│   │       ├── dto/              # Data transfer objects
│   │       └── util/             # JWT utilities
│   │
│   ├── user-service/             # User Management
│   │   └── src/main/java/
│   │       ├── controller/       # REST endpoints
│   │       ├── model/            # User entity
│   │       ├── repository/       # Data access
│   │       └── service/          # Business logic
│   │
│   ├── product-service/          # Product Catalog
│   │   └── src/main/java/
│   │       ├── controller/       # REST endpoints
│   │       ├── dto/              # Request/Response DTOs
│   │       ├── model/            # Product entity
│   │       ├── repository/       # MongoDB repository
│   │       └── service/          # Business logic
│   │
│   ├── payment-service/          # Cart, Orders & Payments
│   │   └── src/main/java/
│   │       ├── controller/       # Cart, Order, Payment APIs
│   │       ├── dto/              # Data transfer objects
│   │       ├── model/            # Cart, Order, Payment entities
│   │       ├── repository/       # Data repositories
│   │       └── service/          # Business logic
│   │
│   ├── service-discovery/        # Netflix Eureka Server
│   │
│   ├── docker-compose.yml        # Container orchestration
│   └── pom.xml                   # Parent POM
│
└── microservices-frontend/
    ├── app/                      # Next.js App Router
    │   ├── admin/               # Admin pages
    │   ├── auth/                # Login/Register
    │   ├── cart/                # Shopping cart
    │   ├── orders/              # Order history
    │   ├── payment/             # Checkout
    │   ├── products/            # Product pages
    │   └── profile/             # User profile
    │
    ├── components/              # React components
    │   ├── ui/                  # Radix UI components
    │   ├── ProductGrid.tsx
    │   ├── Header.tsx
    │   └── Footer.tsx
    │
    ├── services/                # API services
    │   ├── productService.ts
    │   ├── cartService.jsx
    │   └── OrderService.ts
    │
    ├── hooks/                   # Custom hooks
    ├── context/                 # React contexts
    └── lib/                     # Utilities

🔐 Security

Authentication Flow

📊 View Interactive Diagram (Mermaid)

sequenceDiagram
    participant C as Client
    participant GW as API Gateway
    participant AS as Auth Service
    participant US as User Service
    participant PS as Protected Service

    C->>US: 1. Login (username, password)
    US->>AS: 2. Request JWT Token
    AS-->>US: 3. Return JWT Token
    US-->>C: 4. Return Token to Client
    
    C->>GW: 5. Request with JWT Bearer Token
    GW->>GW: 6. Validate JWT Locally
    GW->>PS: 7. Forward Request (if valid)
    PS-->>GW: 8. Response
    GW-->>C: 9. Return Response

Security Features

✅ JWT Authentication - Stateless token-based auth
✅ OAuth2 Resource Server - Standard authorization
✅ BCrypt Password Hashing - Secure password storage
✅ Role-Based Access Control - User/Admin roles
✅ API Gateway Security - Centralized enforcement

💳 Payment Flow

📊 View Interactive Diagram (Mermaid)

sequenceDiagram
    participant U as User
    participant F as Frontend
    participant C as Cart Service
    participant O as Order Service
    participant P as Payment Service
    participant S as Stripe

    U->>F: 1. Add items to cart
    F->>C: 2. POST /cart/{userId}
    C-->>F: 3. Cart updated
    
    U->>F: 4. Proceed to checkout
    F->>O: 5. POST /orders
    O-->>F: 6. Order created
    
    F->>P: 7. POST /payments/create
    P->>S: 8. Create PaymentIntent
    S-->>P: 9. Return client_secret
    P-->>F: 10. Return client_secret
    
    F->>S: 11. Confirm payment (Stripe.js)
    S-->>F: 12. Payment result
    
    F->>P: 13. POST /payments/{id}/confirm
    P->>O: 14. Update order status
    O-->>F: 15. Order confirmed

🧪 Testing

Run Backend Tests

# Run all tests
cd microservices-backend
./mvnw test

# Run specific service tests
cd product-service
./mvnw test

cd payment-service
./mvnw test

Test Coverage

Service	Unit Tests	Integration Tests	API Tests
Product Service	✅	✅	✅
Payment Service	✅	✅	✅
Cart Service	✅	✅	-
User Service	✅	✅	✅
Auth Service	✅	-	-

Testing Technologies

JUnit 5 - Unit testing
Mockito - Mocking framework
TestContainers - Integration testing with real databases
REST Assured - API testing

🐳 Deployment

Docker Compose Deployment

cd microservices-backend

# Build all services
./mvnw clean package -DskipTests

# Start all containers
docker-compose up -d

Docker Compose Architecture

flowchart TB
    subgraph Docker["Docker Compose"]
        MongoDB[(MongoDB)]
        SD["Service Discovery"]
        GW["API Gateway"]
        AS["Auth Service"]
        US["User Service"]
        PS["Product Service"]
        PY["Payment Service"]
    end
    
    subgraph Volume["Persistent Storage"]
        Data[("mongodb_data")]
    end
    
    MongoDB --> Data
    SD --> MongoDB
    GW --> SD
    AS --> SD
    US --> SD
    PS --> SD
    PY --> SD

🤝 Contributing

Fork the repository
Create a feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

📄 License

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

🙏 Acknowledgments

Made with ❤️ using Microservices Architecture

Name		Name	Last commit message	Last commit date
Latest commit History 4 Commits
profile		profile
Authentication Flow.png		Authentication Flow.png
High-Level System Architecture.png		High-Level System Architecture.png
Microservices Communication.png		Microservices Communication.png
Payment Flow.png		Payment Flow.png
README.md		README.md

Ecommerce-Application-Microservices-EAD/.github

Folders and files

Latest commit

History

Repository files navigation

🛒 NextShop - Online Shopping Platform

📋 Table of Contents

✨ Features

Customer Features

Admin Features

Technical Features

🏗️ Architecture

High-Level System Architecture

Microservices Communication

🔧 Technology Stack

Backend

Frontend

DevOps & Infrastructure

🔌 Microservices

1. Service Discovery (Netflix Eureka)

2. API Gateway

3. Auth Service

4. User Service

5. Product Service

6. Payment Service

Cart Endpoints

Order Endpoints

Payment Endpoints

🚀 Getting Started

Prerequisites

Installation

1. Clone the Repository

2. Start Infrastructure Services

3. Start Backend Services

4. Start Frontend

5. Access the Application

Environment Variables

📚 API Documentation

📁 Project Structure

🔐 Security

Authentication Flow

Security Features

💳 Payment Flow

🧪 Testing

Run Backend Tests

Test Coverage

Testing Technologies

🐳 Deployment

Docker Compose Deployment

Docker Compose Architecture

🤝 Contributing

📄 License

🙏 Acknowledgments

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Packages