finlion-website/cline_docs/techContext.md

Tech Context - Technologies & Setup

Core Technologies

Frontend Stack

• Next.js: 16.0.10 (React framework with App Router)
• React: 19.2.3 (UI library)
• TypeScript: 5.9.3 (Type-safe JavaScript)
• Tailwind CSS: 4.1.18 (Utility-first CSS framework)
• @tailwindcss/postcss: 4.1.18 (PostCSS plugin for Tailwind v4)
• Framer Motion: 12.23.26 (Animation library)
• HeadlessUI: 2.2.9 (Unstyled UI components)
• Lucide React: 0.561.0 (Icon library)
• React Icons: 5.5.0 (Additional icon library)

Backend Stack

• Next.js API Routes: Server-side API endpoints
• Nodemailer: Email sending library
• Upstash Redis: Cloud Redis for rate limiting
• Node.js: Runtime environment

Development Tools

• PNPM: 9.14.2 (Package manager)
• ESLint: Code linting
• PostCSS: CSS processing
• Autoprefixer: CSS vendor prefixing
• Docker: Containerization
• Docker Compose: Multi-container orchestration

Environment Configuration

Required Environment Variables

# Email Configuration
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_SECURE=false
GOOGLE_EMAIL=system@deafgain.org
GOOGLE_APP_PASSWORD=ojvlysraxwjriwzy
RECIPIENT_EMAIL=mark@finlion.com

# Redis Configuration
UPSTASH_REDIS_REST_URL=https://gusc1-resolved-jaybird-30779.upstash.io
UPSTASH_REDIS_REST_TOKEN=AXg7ASQgNDMzMDE0MTYtNWE0Ni00OTc3LThhYjktM2IxMzMxNGMyMzMxNWRiNGMyOGU2MjE0NGUyNTkwMTQyNmUxZTU2NzE4NDI=

Email Service Setup

• Provider: Gmail SMTP
• Authentication: Google App Password (not regular password)
• Security: TLS encryption (port 587)
• From Address: system@deafgain.org
• Recipient: mark@finlion.com

Redis Setup

• Provider: Upstash (cloud Redis service)
• Purpose: Rate limiting for API endpoints
• Configuration: REST API access via URL and token

Development Setup

Prerequisites

• Node.js 18+
• PNPM package manager
• Docker and Docker Compose
• Git

Local Development

# Install dependencies
pnpm install

# Development server (Docker)
docker compose -f docker-compose.dev.yml up

# Development server (local)
pnpm dev

Production Deployment

# Production build and run
docker compose up -d

Technical Constraints

Performance

• Server-side rendering for SEO
• Optimized images and assets
• Efficient CSS with Tailwind

Security

• Input validation and sanitization
• Rate limiting on API endpoints
• Environment variable protection
• XSS prevention

Scalability

• Containerized deployment
• Redis for distributed rate limiting
• Stateless API design

File Structure

• Configuration Files: Root level (package.json, tsconfig.json, etc.)
• Source Code: /src directory
• Static Assets: /public directory
• Docker: Multiple compose files for different environments
• Documentation: /cline_docs directory

Build Process

• TypeScript Compilation: Automatic via Next.js
• CSS Processing: Tailwind CSS compilation
• Asset Optimization: Next.js built-in optimization
• Docker Build: Multi-stage builds for production