Elite Events Architecture Overview
System Architecture
+-------------------------------------------------------------------------+
| Client Layer |
+-------------------------------------------------------------------------+
| +----------------+ +----------------+ +----------------+ |
| | Browser | | Mobile Web | | Admin UI | |
| | (Next.js) | | (PWA) | | (Next.js) | |
| +----------------+ +----------------+ +----------------+ |
+-------------------------------------------------------------------------+
|
v
+-------------------------------------------------------------------------+
| Application Layer |
+-------------------------------------------------------------------------+
| +----------------------------------------------------------------+ |
| | Next.js App Router | |
| | +--------------+ +--------------+ +--------------+ | |
| | | Pages | | API Routes | | Middleware | | |
| | | (SSR/SSG) | | (REST) | | (Auth) | | |
| | +--------------+ +--------------+ +--------------+ | |
| +----------------------------------------------------------------+ |
| |
| +--------------+ +--------------+ +--------------+ +--------------+ |
| | Redux | | NextAuth | | Stripe | | Socket.io | |
| | Store | | Session | | Payments | | Real-time | |
| +--------------+ +--------------+ +--------------+ +--------------+ |
+-------------------------------------------------------------------------+
|
v
+-------------------------------------------------------------------------+
| Service Layer |
+-------------------------------------------------------------------------+
| +--------------+ +--------------+ +--------------+ +--------------+ |
| | Prisma | | Redis | | Email | | BullMQ | |
| | ORM | | Cache | | (Resend) | | Job Queue | |
| +--------------+ +--------------+ +--------------+ +--------------+ |
| |
| +--------------+ +--------------+ +--------------+ +--------------+ |
| | OpenTelemetry| | Pino | | Cloudinary | | Zod | |
| | Tracing | | Logger | | Storage | | Validation | |
| +--------------+ +--------------+ +--------------+ +--------------+ |
+-------------------------------------------------------------------------+
|
v
+-------------------------------------------------------------------------+
| Data Layer |
+-------------------------------------------------------------------------+
| +------------------------------+ +------------------------------+ |
| | MySQL | | Redis | |
| | (Primary DB) | | (Cache/Sessions) | |
| +------------------------------+ +------------------------------+ |
+-------------------------------------------------------------------------+
Key Components
Frontend
- Next.js 16: React framework with App Router
- React 19: Latest React with Server Components
- TypeScript 5: Strict type checking
- Tailwind CSS 3: Utility-first styling
- Redux Toolkit: Client state management (cart, wishlist, compare)
- React Hook Form + Zod: Form handling and validation
- Framer Motion: Animations
- Swiper: Carousels and sliders
Backend
- Next.js API Routes: 350+ RESTful API endpoints
- Prisma ORM: Type-safe database access layer
- NextAuth v5: Authentication with multiple providers
- BullMQ: Job queue for async tasks (emails, reports)
- Socket.io: Real-time WebSocket connections
Infrastructure
- MySQL: Primary relational database
- Redis: Caching, sessions, and job queues
- Cloudinary: Image storage and optimization
- Resend: Transactional email delivery
- Stripe: Payment processing
Observability
- OpenTelemetry: Distributed tracing
- Pino: Structured JSON logging
- Web Vitals: Performance monitoring
- Custom SLO Tracking: Service Level Objectives
Testing
- Jest: Unit and integration tests (7,300+ tests)
- Playwright: E2E browser tests (450+ tests)
- MSW: API mocking
- Storybook: Component documentation (280+ components)
Data Flow
User Request Flow
- User makes request to Next.js page/API
- Middleware validates authentication (NextAuth)
- Request routed to appropriate handler
- Handler checks cache (Redis)
- If cache miss, queries database (Prisma)
- Response cached and returned
Order Processing Flow
- User adds items to cart (Redux)
- User proceeds to checkout
- Payment processed via Stripe
- Order created in database
- Confirmation email queued (BullMQ + Resend)
- Inventory updated
- Admin notified (Socket.io real-time)
Real-time Updates Flow
- Admin/User action triggers event
- Socket.io server broadcasts to relevant clients
- Live chat, notifications, order updates
Directory Structure
src/
+-- app/ # Next.js App Router
| +-- (site)/ # Public storefront pages
| +-- admin/ # Admin dashboard
| +-- api/ # REST API routes (350+)
| | +-- admin/ # Admin-only endpoints
| | +-- auth/ # Authentication
| | +-- products/ # Product catalog
| | +-- orders/ # Order management
| | +-- payments/ # Stripe integration
| | +-- promotions/ # Discounts & promos
| | +-- loyalty/ # Points & rewards
| | +-- affiliate/ # Affiliate program
| | +-- support/ # Tickets & chat
| | +-- webhooks/ # External webhooks
| | +-- monitoring/ # Health & metrics
| | +-- ... # 157 admin API routes
| +-- layout.tsx # Root layout
| +-- page.tsx # Homepage
+-- components/
| +-- ui/ # Reusable UI primitives (280+)
| +-- features/ # Feature-specific components
| +-- layout/ # Layout components
| +-- admin/ # Admin-specific components
+-- lib/
| +-- core/ # Core utilities
| | +-- logger.ts # Pino structured logging
| | +-- cache.ts # Redis cache wrapper
| | +-- errors.ts # Error handling
| +-- api/ # API helpers
| | +-- responses.ts # Standardized responses
| | +-- validation.ts # Zod schemas
| +-- auth/ # Authentication utilities
| +-- integrations/ # External service clients
| | +-- stripe/ # Payment processing
| | +-- resend/ # Email service
| | +-- cloudinary/ # Image uploads
+-- hooks/ # Custom React hooks
+-- redux/ # Redux store and slices
| +-- store.ts # Store configuration
| +-- cartSlice.ts # Shopping cart
| +-- wishlistSlice.ts # User wishlist
| +-- compareSlice.ts # Product comparison
+-- types/ # TypeScript definitions
+-- styles/ # Global styles
+-- contexts/ # React Context providers
+-- services/ # Business logic services
+-- mocks/ # MSW API mocks for testing
Key Features
E-commerce Core
- Product catalog with categories
- Shopping cart and wishlist
- Product comparison
- Order management
- Inventory tracking
Payments
- Stripe payment processing
- Multiple payment methods
- Refund handling
- Invoice generation
- Percentage discounts
- Fixed amount discounts
- BOGO (Buy One Get One)
- Bundle deals
- Free gift with purchase
- Promo codes
- Automatic promotions
Loyalty Program
- Points earning system
- Membership tiers (Bronze, Silver, Gold, Platinum)
- Points redemption
- Tier-based rewards
Affiliate System
- Referral tracking
- Commission calculation
- Payout management
- Affiliate dashboard
Support System
- Ticket management
- WebSocket live chat
- Knowledge base
- Priority queue
Admin Dashboard
- Real-time analytics
- Customer management
- Order management
- Product management
- Report generation
- Audit logging
Security Features
- NextAuth session management
- CSRF protection
- Rate limiting per endpoint
- Input validation (Zod)
- SQL injection prevention (Prisma)
- XSS protection
- Secure headers
- Audit logging
- Redis caching
- Image optimization (Cloudinary + Sharp)
- PWA support with service workers
- Code splitting
- Lazy loading
- Bundle analysis
- Strategic database indexes
Deployment
- Platform: AWS EC2
- Process Manager: PM2
- Web Server: Apache (reverse proxy)
- SSL: Let's Encrypt
- Database: MySQL (separate instance)
- Cache: Redis (same instance)