- Created complete project directory structure: - Frontend with Next.js 15.2.3 app router structure - Backend with Express API endpoints - Docker configurations with security best practices - MongoDB initialization with schema validation - Nginx configuration with security headers - Implemented core file templates: - Custom video player with transcript display options - MongoDB schemas with validation for Videos and Members - JWT authentication middleware with role-based access control - Docker Compose with resource limits and security - Frontend/backend package.json with dependencies - Updated documentation: - Enhanced TECH_STACK with latest version details - Updated TO_DO.txt with WCAG 2.2 AA requirements - Updated planned_implementation.txt with current best practices - Refreshed all Memory Bank files with current state - Security and accessibility improvements: - Added MongoDB 7.0 schema validation with - Enhanced video requirements with mandatory transcripts and thumbnails - Updated accessibility to WCAG 2.2 AA standards - Added security best practices for Docker deployments
88 lines
2.7 KiB
Text
88 lines
2.7 KiB
Text
## Tech Stack
|
|
|
|
### Frontend
|
|
- React 19
|
|
- TypeScript 5.8 (5x faster incremental builds)
|
|
- React Router DOM 7
|
|
- Tailwind CSS 4.0 (CSS-first configuration with @theme directives, 182x faster builds)
|
|
- Framer Motion 11
|
|
- React Icons 5.4
|
|
- React Simple Maps 4.0 (beta)
|
|
- React Intersection Observer 9.13
|
|
- Next.js 15.2.3 (includes security patches for CVE-2025-29927)
|
|
|
|
### Backend
|
|
- Node.js with Express 4.21
|
|
- TypeScript 5.8
|
|
- Nodemailer 6.9 for email handling
|
|
- CORS for cross-origin resource sharing
|
|
- dotenv 16.4 for environment variable management
|
|
- Upstash Redis 1.28 for caching/rate limiting
|
|
- JWT authentication with role-based access control
|
|
- MongoDB 7.0 with schema validation
|
|
|
|
### Development & Build Tools
|
|
- Docker & Docker Compose with security best practices:
|
|
- Multi-stage builds
|
|
- Non-root users
|
|
- Resource limitations
|
|
- Health checks
|
|
- PostCSS 8.4
|
|
- Autoprefixer 10.4
|
|
- pnpm 9.14 (package manager)
|
|
- Vite 6.0
|
|
- ESLint 9
|
|
- Concurrently for running multiple processes
|
|
- tsx/ts-node for TypeScript execution
|
|
- Hot module replacement (HMR)
|
|
|
|
### Production
|
|
- Nginx (Production server for frontend with security headers)
|
|
- Node.js server for backend API
|
|
- SSL/TLS 1.3 configuration
|
|
|
|
### Architecture
|
|
- Frontend running on port 3000 (development)
|
|
- Backend API running on port 4000
|
|
- Containerized development and production environments
|
|
- REST API for contact form handling
|
|
- Gmail SMTP for email delivery
|
|
- Rate limiting implementation
|
|
- Context-based state management
|
|
- Redis-backed caching layer
|
|
- MongoDB schema validation using $jsonSchema
|
|
|
|
### Key Features
|
|
- Responsive design (mobile-first approach)
|
|
- Animated UI components with Framer Motion
|
|
- Interactive USA region map
|
|
- Contact form with email notifications
|
|
- Timeline visualization
|
|
- Service showcase
|
|
- Biography section
|
|
- Testimonials section
|
|
- Video playback with WebVTT subtitles and full transcript display
|
|
- Custom video player with accessibility features:
|
|
- Keyboard controls
|
|
- Focus indicators that meet WCAG 2.2 requirements
|
|
- Playback speed controls
|
|
- Transcript display options (plain, HTML, JSON formats)
|
|
- Refreshable braille display compatibility
|
|
- Snow peaks animation effect
|
|
|
|
### Development Environment
|
|
- Multi-container setup with Docker Compose
|
|
- Hot-reloading enabled
|
|
- Separate development and production builds
|
|
- Environment variable management for sensitive data
|
|
- TypeScript configuration for both client and server
|
|
- Concurrent development server (frontend + backend)
|
|
|
|
### Production Environment
|
|
- Nginx serving static frontend files
|
|
- Node.js backend API
|
|
- Containerized deployment
|
|
- Secure email handling with Google App credentials
|
|
- Multi-stage Docker builds
|
|
- Production-optimized builds with tree-shaking
|
|
- Security scanning with Trivy
|