TheMaddax
85ed3cce2c
- Updated Hero component to show former positions - Updated biography page with specific end dates (NAD: Jan 2025, KAD: July 2025) - Updated Deafhood service page to reflect past experience - Updated timeline components with term dates - Updated Memory Bank documentation - All references now accurately reflect Chris's leadership history
89 lines
2.6 KiB
Markdown
89 lines
2.6 KiB
Markdown
# Tech Context
|
|
|
|
## Technologies Used
|
|
|
|
### Core Framework
|
|
- **Next.js**: 14.1.0 (App Router)
|
|
- **React**: 18.3.1
|
|
- **TypeScript**: 5.7.2
|
|
- **Node.js**: Required 20 or higher
|
|
|
|
### Styling & UI
|
|
- **TailwindCSS**: 3.4.15 (utility-first CSS)
|
|
- **Framer Motion**: 11.12.0 (animations)
|
|
- **Lucide React**: 0.462.0 (icons)
|
|
- **React Icons**: 5.3.0 (additional icons)
|
|
|
|
### Backend & Services
|
|
- **Upstash Redis**: 1.34.3 (rate limiting & caching)
|
|
- **NodeMailer**: 6.9.16 (email functionality)
|
|
- **XSS**: 1.0.14 (security/sanitization)
|
|
- **Validator**: 13.9.0 (input validation)
|
|
|
|
### Maps & Visualization
|
|
- **React Simple Maps**: 3.0.0 (geographic visualization)
|
|
- **TopoJSON Client**: 3.1.0 (map data processing)
|
|
|
|
### Development Tools
|
|
- **pnpm**: 9.14.4 (package manager)
|
|
- **PostCSS**: 8.4.49 (CSS processing)
|
|
- **Autoprefixer**: 10.4.20 (CSS vendor prefixes)
|
|
- **TypeScript Types**: Complete type definitions for all dependencies
|
|
|
|
## Development Setup
|
|
|
|
### Prerequisites
|
|
- Node.js 20 or higher
|
|
- pnpm package manager
|
|
- Docker (for containerized development)
|
|
|
|
### Environment Configuration
|
|
Required environment variables:
|
|
- **Email Configuration**: Gmail SMTP settings for NodeMailer
|
|
- **Redis Configuration**: Upstash Redis connection details
|
|
- **Security Settings**: Various SMTP and security configurations
|
|
|
|
### Development Commands
|
|
```bash
|
|
pnpm dev # Start development server
|
|
pnpm build # Build for production
|
|
pnpm start # Start production server
|
|
pnpm lint # Run ESLint
|
|
```
|
|
|
|
### Docker Setup
|
|
- **Development**: `docker-compose.dev.yml` with hot reloading
|
|
- **Production**: `Dockerfile` with optimized build
|
|
- **Volume Mounting**: Efficient development workflow
|
|
|
|
## Technical Constraints
|
|
|
|
### Performance
|
|
- Image optimization through Next.js Image component
|
|
- Code splitting via Next.js App Router
|
|
- Efficient client-side navigation
|
|
- Optimized Docker builds for production
|
|
|
|
### Security
|
|
- Content Security Policy implementation
|
|
- XSS protection on all inputs
|
|
- Rate limiting on API endpoints
|
|
- Secure environment variable management
|
|
- CORS policies properly configured
|
|
|
|
### Accessibility
|
|
- Responsive design (mobile-first)
|
|
- Semantic HTML structure
|
|
- Proper image alt texts
|
|
- Focus management for interactive elements
|
|
|
|
### Browser Support
|
|
- Modern browsers supporting ES2020+
|
|
- Progressive enhancement approach
|
|
- Graceful degradation for older browsers
|
|
|
|
## Deployment Architecture
|
|
- **Containerization**: Docker-based deployment
|
|
- **Environment Separation**: Different configs for dev/prod
|
|
- **Static Assets**: Optimized through Next.js build process
|
|
- **API Routes**: Serverless functions via Next.js API routes
|