🌟 Bidias E-Commerce FullStack Platform

🛍️ Bidias E-Commerce

Professional FullStack E-Commerce Platform

🎯 Modern, full-stack e-commerce solution with AI-powered features, secure payments, and beautiful UI developed as a capstone project for the NPower App Development Program

🌐 LIVE DEMO | 📧 CONTACT | 🎓 NPOWER | 🐙 REPOSITORY

🎯 Program Overview

This project represents the capstone achievement for the NPower App Development Program, demonstrating mastery of modern full-stack web development technologies and enterprise-level software engineering practices.

🏫 Program Details:

Organization: NPower (npower.org)
Program: App Development Program
Duration: Intensive Full-Stack Development Training
Focus: Professional Software Development & Career Readiness

🎖️ Achievement Goals:

✅ Complete Full-Stack E-Commerce Platform
✅ Professional Code Quality & Documentation
✅ Production-Ready Deployment
✅ Enterprise Architecture Patterns
✅ Modern Development Workflow

🎉 Latest Updates

🚀 Version 2.0.0 - NPower Capstone Edition (August 2025)

✅ Repository Migration Complete

🌐 New Repository: Bidias-E-Com-FullStack-App
🗄️ MongoDB Atlas Integration: Cloud database fully configured
🔧 Production Environment: Optimized for cloud deployment
📦 Build Optimization: Both frontend and backend production-ready

✅ Enhanced Architecture

⚡ Docker Integration: Complete containerization with production configs
🔄 Multi-Environment Support: Development, staging, and production ready
🛡️ Security Hardening: JWT, OAuth, rate limiting, and CORS protection
📱 Mobile Excellence: Fully responsive across all devices

✅ NPower Program Recognition

🎓 Capstone Status: Official NPower program completion project
📧 Professional Branding: Enhanced with instructor acknowledgments
🎨 Documentation: Comprehensive project documentation suite
🏷️ Educational Context: Clear learning outcomes and achievements

✨ Platform Features

🛍️ Core E-Commerce Functionality

🏪 Product Management - Complete CRUD operations with categories, variants, and inventory tracking
🛒 Shopping Cart - Real-time cart updates with session persistence
💳 Secure Payments - Stripe integration with multiple payment methods and webhooks
📦 Order Management - Comprehensive order tracking and status management
🔍 Advanced Search - Full-text search with filters, sorting, and faceted navigation

🤖 AI-Powered Intelligence

💬 Smart Chat Assistant - AI-powered shopping recommendations and customer support
🎯 Personalized Suggestions - Machine learning powered product recommendations
📊 Analytics Dashboard - Real-time business insights and performance metrics
🏷️ Auto-Categorization - Intelligent product categorization
🔮 Predictive Analytics - Inventory and demand forecasting

🔐 Security & Authentication

🔑 JWT Authentication - Secure token-based authentication with refresh tokens
🌐 OAuth Integration - Google and GitHub social login
🛡️ Security Middleware - Rate limiting, CORS protection, and data validation
🚫 XSS Protection - Cross-site scripting prevention
🔒 Input Sanitization - Comprehensive data validation and sanitization

📱 User Experience & Design

🎨 Material-UI Components - Beautiful, accessible React components
📱 Fully Responsive - Mobile-first design optimized for all device sizes
⚡ Vite Build Tool - Lightning-fast development and build process
🎯 Progressive Web App - PWA capabilities for mobile app-like experience
♿ Accessibility - WCAG compliant with screen reader support

🏗️ Enterprise Architecture

🐳 Docker Containerization - Complete containerized deployment
☁️ Cloud Deployment Ready - Vercel, Render, and custom cloud deployment
📈 Scalable Infrastructure - Redis caching and MongoDB clustering
🔄 Real-time Updates - WebSocket integration for live notifications
📊 Performance Monitoring - Health checks and application monitoring

🛠️ Technology Stack

Frontend Technologies

Backend Technologies

Database & Caching

DevOps & Deployment

Payment & External Services

🚀 Quick Start

🏁 Prerequisites

✅ Node.js 18+ installed
✅ Python 3.8+ installed (for AI microservices)
✅ MongoDB (local or MongoDB Atlas)
✅ Redis (optional, for caching and analytics)
✅ Stripe Account (for payments)
✅ Docker & Docker Compose (recommended)

⚡ Installation Options

Option 1: Standard Installation

# Clone the repository
git clone https://github.com/eaglepython/Bidias-E-Com-FullStack-App.git
cd sophisticated-ecommerce-capstone

# Install all dependencies (frontend + backend)
npm run install:all

# Install Python AI microservices dependencies
pip install -r ai-services/analytics-engine/requirements.txt
pip install -r ai-services/recommendation-engine/requirements.txt

# Setup environment variables
cp .env.production.example .env.production
# Edit .env.production with your actual configuration

Option 2: Docker Installation (Recommended)

# Clone repository
git clone https://github.com/eaglepython/Bidias-E-Com-FullStack-App.git
cd sophisticated-ecommerce-capstone

# Setup environment variables
cp .env.production.example .env.production
# Edit .env.production with your configuration

# Start all services with Docker
npm run dev:docker

🌟 Running the Application

Development Mode

# 1. Start the AI Analytics Service (Python)
python -m uvicorn ai-services.analytics-engine.main:app --reload --port 5000

# 2. Start the Recommendation Engine Service (Python)
python -m uvicorn ai-services.recommendation-engine.main:app --reload --port 5001

# 3. Start both frontend and backend (Node.js/React)
npm run dev

# Or start Node.js services individually:
npm run dev:frontend  # Frontend on http://localhost:3003
npm run dev:backend   # Backend on http://localhost:4001

Docker Development (Recommended)

# Start all services including database and cache
npm run dev:docker

# View logs
docker-compose logs -f

# Access services:
# Frontend: http://localhost:3003
# Backend: http://localhost:4001
# MongoDB: localhost:27017
# Redis: localhost:6379

Production Deployment

# Build for production
npm run build

# Start production with Docker
docker-compose -f docker-compose.prod.yml up --build -d

📁 Project Structure

sophisticated-ecommerce-capstone/
├── backend/                    # Node.js/Express backend
│   ├── src/
│   │   ├── controllers/       # Route controllers
│   │   ├── models/           # MongoDB models
│   │   ├── routes/           # API routes
│   │   ├── middleware/       # Custom middleware
│   │   ├── services/         # Business logic & AI integration
│   │   ├── utils/            # Utility functions
│   │   ├── config/           # Configuration files
│   │   └── scripts/          # Database & test scripts
│   ├── Dockerfile           # Backend container config
│   └── package.json         # Backend dependencies
├── frontend/                 # React frontend
│   ├── src/
│   │   ├── components/      # Reusable components
│   │   ├── pages/           # Page components
│   │   ├── hooks/           # Custom React hooks
│   │   ├── services/        # API services
│   │   ├── store/           # Redux store
│   │   ├── types/           # TypeScript types
│   │   ├── utils/           # Utility functions
│   │   └── assets/          # Static assets
│   ├── public/              # Public static files
│   ├── Dockerfile          # Frontend container config
│   └── package.json        # Frontend dependencies
├── ai-services/             # Python AI microservices
│   ├── analytics-engine/    # FastAPI analytics service
│   │   ├── __pycache__/    # Python cache directory
│   │   ├── main.py         # FastAPI application
│   │   └── requirements.txt # Python dependencies
│   └── recommendation-engine/ # FastAPI recommendation engine
│       ├── main.py         # FastAPI application
│       └── requirements.txt # Python dependencies
├── docs/                    # Documentation
├── nginx/                   # Reverse proxy config
├── infrastructure/         # Infrastructure as code
├── docker-compose.yml      # Development containers
├── docker-compose.prod.yml # Production containers
├── vercel.json            # Vercel deployment config
├── render.yaml            # Render deployment config
├── .env.production.example # Environment template
└── package.json           # Workspace configuration

⚙️ Environment Setup

🔐 Environment Variables

Create a .env.production file in the root directory. Never commit secrets to the repository.

# Database Configuration
MONGODB_URI=mongodb://admin:password123@mongodb:27017/bidias_ecommerce?authSource=admin
MONGO_ROOT_USERNAME=admin
MONGO_ROOT_PASSWORD=password123

# Redis Configuration
REDIS_HOST=redis
REDIS_PORT=6379
REDIS_PASSWORD=your_redis_password

# JWT Security
JWT_SECRET=your_super_secure_jwt_secret_key_here
JWT_REFRESH_SECRET=your_super_secure_refresh_secret_key_here
JWT_RESET_SECRET=your_super_secure_reset_secret_key_here

# Stripe Payment Configuration
STRIPE_SECRET_KEY=sk_test_your_stripe_secret_key
STRIPE_WEBHOOK_SECRET=whsec_your_webhook_secret
REACT_APP_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key

# Email (SMTP Configuration)
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_SECURE=false
SMTP_USER=your_email@gmail.com
SMTP_PASS=your_app_password

# Application Configuration
NODE_ENV=production
FRONTEND_URL=https://bidias-e-com-full-stack-app.netlify.app
REACT_APP_API_URL=https://bidias-e-com-fullstack-app.onrender.com

# AI Microservices
ML_SERVICE_URL=http://localhost:5000
RECOMMENDATION_ENGINE_URL=http://localhost:5001

# OAuth Configuration
GOOGLE_CLIENT_ID=your_google_client_id
GOOGLE_CLIENT_SECRET=your_google_client_secret
GITHUB_CLIENT_ID=your_github_client_id
GITHUB_CLIENT_SECRET=your_github_client_secret

🔌 API Documentation

📋 Core API Endpoints

🔐 Authentication

POST /api/auth/login          # User login
POST /api/auth/register       # User registration
POST /api/auth/refresh        # Refresh JWT token
POST /api/auth/logout         # User logout
GET  /api/auth/google         # Google OAuth
GET  /api/auth/github         # GitHub OAuth

📦 Products

GET    /api/products          # Get all products
POST   /api/products          # Create product (admin)
GET    /api/products/:id      # Get product by ID
PUT    /api/products/:id      # Update product (admin)
DELETE /api/products/:id      # Delete product (admin)
GET    /api/products/search   # Search products with filters

🛒 Cart & Orders

GET    /api/cart              # Get user cart
POST   /api/cart/add          # Add item to cart
PUT    /api/cart/update       # Update cart item
DELETE /api/cart/remove       # Remove from cart
POST   /api/orders            # Create new order
GET    /api/orders            # Get user orders
GET    /api/orders/:id        # Get order details
PUT    /api/orders/:id/status # Update order status (admin)

💳 Payments

POST /api/payments/create-intent  # Create Stripe payment intent
POST /api/payments/webhook        # Stripe webhook handler
GET  /api/payments/methods        # Get payment methods

🤖 AI & Recommendations (Python Microservices)

POST /content-recommendations     # Get content-based recommendations (Analytics Engine)
POST /recommendations            # Get personalized recommendations (Recommendation Engine)
GET  /analytics/user-behavior    # User behavior analytics
GET  /analytics/product-trends   # Product trend analysis

📊 Health & System

GET /api/health              # Application health status
GET /api/metrics             # System performance metrics

📊 API Response Format

{
  "success": true,
  "data": {
    // Response data
  },
  "message": "Operation successful",
  "pagination": {
    "page": 1,
    "limit": 10,
    "total": 100,
    "pages": 10
  },
  "meta": {
    "timestamp": "2025-01-15T10:30:00.000Z",
    "version": "2.0.0"
  }
}

🤖 Backend Integration with AI Services

The Node.js backend seamlessly integrates with Python AI microservices for advanced functionality:

🎯 Recommendation Engine Integration

Environment Configuration: Set RECOMMENDATION_ENGINE_URL in your backend .env.production
Service Integration: Backend uses src/services/recommendationEngineService.ts to communicate with FastAPI microservice
API Endpoint: Calls /recommendations endpoint on the Python service
Testing: Use test script: npx ts-node src/scripts/test-recommendation-engine.ts

📈 Analytics Engine Integration

Real-time Analytics: Python service processes user behavior and product trends
Content Recommendations: Advanced content-based filtering algorithms
Performance Metrics: Analytics engine provides insights for business intelligence

// Example integration in backend service
import { recommendationEngineService } from '../services/recommendationEngineService';

// Get personalized recommendations for user
const recommendations = await recommendationEngineService.getRecommendations({
  userId: user.id,
  productIds: recentlyViewed,
  categories: userPreferences
});

🐳 Docker Development

🚀 Quick Docker Setup

# Start all services (recommended for development)
npm run dev:docker

# View service status
docker-compose ps

# View logs
docker-compose logs -f

# Stop all services
docker-compose down

# Clean up (remove containers, volumes, images)
npm run docker:clean

🔧 Docker Services

Service	Port	Description
Frontend	3003	React development server
Backend	4001	Express API server
AI Analytics	5000	Python FastAPI analytics engine
AI Recommendations	5001	Python FastAPI recommendation engine
MongoDB	27017	Database server
Redis	6379	Cache server
Nginx	80, 443	Reverse proxy (production)

📦 Docker Commands

# Development environment
docker-compose up --build -d

# Production environment
docker-compose -f docker-compose.prod.yml up --build -d

# Scale services
docker-compose up --scale backend=2 frontend=1

# Access container shell
docker-compose exec backend sh
docker-compose exec frontend sh

# View container resources
docker stats

🧪 Testing & Scripts

📋 Available Scripts

Development Scripts

npm run dev              # Start both frontend and backend
npm run dev:frontend     # Start frontend only (port 3003)
npm run dev:backend      # Start backend only (port 4001)
npm run dev:docker       # Start all services with Docker

Build Scripts

npm run build            # Build both frontend and backend
npm run build:frontend   # Build frontend for production
npm run build:backend    # Build backend TypeScript
npm run build:docker     # Build Docker images

Testing Scripts

npm test                 # Run all tests
npm run test:frontend    # Run frontend tests
npm run test:backend     # Run backend tests
npm run test:coverage    # Generate coverage report
npm run test:integration # Run integration tests

Quality & Maintenance

npm run lint            # Check code quality
npm run format          # Format code with Prettier
npm run type-check      # TypeScript type checking
npm run clean           # Clean build artifacts
npm run seed            # Seed database with sample data

Deployment Scripts

npm run deploy:vercel   # Deploy frontend to Vercel
npm run deploy:render   # Deploy to Render
npm run start:docker    # Start production containers
npm run stop:docker     # Stop all containers

🌐 Deployment

🚀 Live Deployment Status

✅ Production Deployments Active

🌐 Frontend (Netlify): https://bidias-e-com-full-stack-app.netlify.app

✅ Status: Live and Active
⚡ Build: Automatic deployment from main branch
🔒 SSL: Secured with Netlify SSL

⚡ Backend (Render): https://bidias-e-com-fullstack-app.onrender.com

✅ Status: Live and Active
🗄️ Database: MongoDB Atlas connected
🔄 Auto-Deploy: Enabled from GitHub
💤 Note: May take 30-60 seconds to wake up from sleep on first request

🚀 Cloud Platform Deployment

Netlify (Frontend) - DEPLOYED ✅

# Current deployment: https://bidias-e-com-full-stack-app.netlify.app

# Deploy updates to Netlify
npm run build:frontend
# Upload dist/ folder to Netlify dashboard
# Or connect GitHub for automatic deployments

Render (Backend) - DEPLOYED ✅

# Current deployment: https://bidias-e-com-fullstack-app.onrender.com

# Backend deployed with:
# - Build Command: npm install && npm run build
# - Start Command: npm start
# - Environment: Node.js
# - Auto-Deploy: Enabled from GitHub

Vercel (Alternative Frontend Option)

# Alternative deployment option
npm run deploy:vercel

# Or use one-click deploy
# https://vercel.com/new/clone?repository-url=https://github.com/eaglepython/Bidias-E-Com-FullStack-App

Docker Production Deployment

# Production deployment with Docker Compose
docker-compose -f docker-compose.prod.yml up --build -d

# View running services
docker-compose -f docker-compose.prod.yml ps

# View production logs
docker-compose -f docker-compose.prod.yml logs -f

# Stop production environment
docker-compose -f docker-compose.prod.yml down

🔧 Manual Cloud Deployment

For detailed deployment instructions including SSL setup, database migration, and monitoring, see the full deployment guide in the repository documentation.

🤝 Contributing

We welcome contributions to the Bidias E-Commerce Platform! Here's how you can help:

🚀 Getting Started

🍴 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

📋 Development Guidelines

📝 Follow the existing code style and conventions
✅ Write tests for new features and bug fixes
📚 Update documentation when needed
🏷️ Use conventional commit messages
🔍 Ensure all tests pass before submitting

🐛 Bug Reports & Feature Requests

Please use the GitHub issue templates and include:

📱 Environment details (OS, browser, versions)
🔄 Steps to reproduce the issue
🎯 Expected vs actual behavior
📸 Screenshots or error logs (if applicable)

🙏 Acknowledgments

🎓 Educational Leadership (Highest Priority)

NPower App Development Program - npower.org

Javier Guerra - Lead Instructor & Technical Mentor
Casey Reyes - Programming Instructor & Project Guide
This capstone project was developed under their expert guidance and represents the culmination of intensive full-stack development training

🤝 Development & Technical Support

AI & Development Assistance

GitHub Copilot AI Assistant - Code development, problem-solving, and technical guidance
OpenAI GPT Models - AI-powered features and intelligent recommendations
Development Community - Code reviews, suggestions, and collaborative improvements

Platform & Infrastructure Partners

Vercel Team - Seamless frontend deployment and hosting platform
Render Team - Full-stack cloud deployment and database hosting
MongoDB Team - Robust database solution with Atlas cloud services
Redis Team - High-performance caching and session management
Stripe Team - Secure payment processing infrastructure and APIs

Frontend & UI Technologies

React Team - Powerful component-based frontend framework
Material-UI Team - Beautiful, accessible React component library
TypeScript Team - Type-safe development experience and tooling
Vite Team - Lightning-fast build tool and development server
Redux Toolkit Team - Efficient state management solution

Backend & Server Technologies

Node.js Community - Runtime environment and extensive ecosystem
Express.js Team - Minimal and flexible web application framework
Mongoose Team - Elegant MongoDB object modeling for Node.js
Passport.js Team - Simple, unobtrusive authentication middleware

DevOps & Deployment

Docker Team - Containerization platform for consistent deployments
Nginx Team - High-performance web server and reverse proxy
GitHub Actions Team - CI/CD automation and deployment pipelines

🌟 Open Source Community

Core Dependencies & Libraries

All Open Source Contributors - Developers who created and maintain the libraries used in this project
npm/yarn Communities - Package management and distribution ecosystems
Stack Overflow Community - Invaluable problem-solving resources and solutions
GitHub Community - Code sharing, collaboration, and version control platform

Security & Authentication

JSON Web Token Contributors - Secure token-based authentication standard
bcrypt.js Contributors - Password hashing and security implementation
Google OAuth Team - Social authentication services and APIs
GitHub OAuth Team - Developer authentication and authorization services

Testing & Quality Assurance

Jest Testing Framework - Comprehensive JavaScript testing solution
ESLint Team - Code quality and consistency enforcement
Prettier Team - Code formatting and style consistency
Testing Library Contributors - Simple and complete testing utilities

📚 Educational Impact & Recognition

This project represents the culmination of intensive learning and skill development through the NPower App Development Program. It demonstrates mastery of:

✅ Modern Full-Stack Development - React, Node.js, TypeScript, and MongoDB
✅ Enterprise Architecture - Scalable, secure, and maintainable code patterns
✅ Cloud Deployment - Production-ready deployment with Docker and cloud platforms
✅ Payment Integration - Secure e-commerce transactions with Stripe
✅ AI Integration - Modern AI-powered features and recommendations
✅ Professional Practices - Testing, documentation, and collaborative development

Special recognition to instructors Javier Guerra and Casey Reyes for their dedication to empowering the next generation of developers through practical, industry-relevant education and mentorship.

🎯 Project Goals Achieved

🏆 Technical Excellence - Production-ready, enterprise-grade application
📚 Educational Value - Comprehensive learning experience and skill development
🌟 Community Impact - Open-source contribution to developer community
💼 Career Preparation - Industry-standard practices and portfolio enhancement
🚀 Innovation - Integration of cutting-edge technologies and AI features

📄 License

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

📋 What This Means:

✅ Commercial Use - Use in commercial projects
✅ Modification - Modify the source code
✅ Distribution - Distribute original or modified versions
✅ Private Use - Use for private/internal projects
❗ Attribution Required - Include original copyright notice
❌ No Warranty - Software provided "as is"

📞 Support & Contact

Need help or have questions? We're here to support you!

📋 Support Channels

📧 Email Support: bidias_consulting@outlook.com
🐛 Bug Reports: GitHub Issues
💡 Feature Requests: GitHub Discussions
📚 Documentation: Repository README and docs folder
🎓 Educational Context: NPower Program Information

👨‍💻 Author

Joseph Bidias Full-Stack Developer & NPower Graduate

⭐ If you found this project helpful, please give it a star on GitHub! ⭐

Built with ❤️ using modern web technologies and powered by continuous learning

"This project represents not just code, but a journey of learning, growth, and the pursuit of technical excellence."

Name		Name	Last commit message	Last commit date
Latest commit History 33 Commits
ai-services		ai-services
backend		backend
frontend		frontend
nginx		nginx
.dockerignore		.dockerignore
.env.production.example		.env.production.example
.gitignore		.gitignore
README.md		README.md
docker-compose.prod.yml		docker-compose.prod.yml
docker-compose.yml		docker-compose.yml
package-lock.json		package-lock.json
package.json		package.json
render.yaml		render.yaml
vercel.json		vercel.json

Uh oh!

Uh oh!

eaglepython/Bidias-E-Com-FullStack-App

Folders and files

Latest commit

History

Repository files navigation

🌟 Bidias E-Commerce FullStack Platform

🛍️ Bidias E-Commerce

Professional FullStack E-Commerce Platform

📋 Table of Contents

🎯 Program Overview

🎉 Latest Updates

🚀 Version 2.0.0 - NPower Capstone Edition (August 2025)

✨ Platform Features

🛍️ Core E-Commerce Functionality

🤖 AI-Powered Intelligence

🔐 Security & Authentication

📱 User Experience & Design

🏗️ Enterprise Architecture

🛠️ Technology Stack

Frontend Technologies

Backend Technologies

Database & Caching

DevOps & Deployment

Payment & External Services

🚀 Quick Start

🏁 Prerequisites

⚡ Installation Options

Option 1: Standard Installation

Option 2: Docker Installation (Recommended)

🌟 Running the Application

Development Mode

Docker Development (Recommended)

Production Deployment

📁 Project Structure

⚙️ Environment Setup

🔐 Environment Variables

🔌 API Documentation

📋 Core API Endpoints

🔐 Authentication

📦 Products

🛒 Cart & Orders

💳 Payments

🤖 AI & Recommendations (Python Microservices)

📊 Health & System

📊 API Response Format

🤖 Backend Integration with AI Services

🎯 Recommendation Engine Integration

📈 Analytics Engine Integration

🐳 Docker Development

🚀 Quick Docker Setup

🔧 Docker Services

📦 Docker Commands

🧪 Testing & Scripts

📋 Available Scripts

Development Scripts

Build Scripts

Testing Scripts

Quality & Maintenance

Deployment Scripts

🌐 Deployment

🚀 Live Deployment Status

✅ Production Deployments Active

🚀 Cloud Platform Deployment

Netlify (Frontend) - DEPLOYED ✅

Render (Backend) - DEPLOYED ✅

Vercel (Alternative Frontend Option)

Docker Production Deployment

🔧 Manual Cloud Deployment

🤝 Contributing

🚀 Getting Started

📋 Development Guidelines

🐛 Bug Reports & Feature Requests

🙏 Acknowledgments

🎓 Educational Leadership (Highest Priority)

🤝 Development & Technical Support

AI & Development Assistance

Platform & Infrastructure Partners

Frontend & UI Technologies

Packages