108 lines
2.7 KiB
Markdown
108 lines
2.7 KiB
Markdown
# Frontend Service
|
|
|
|
This directory contains the frontend service for ClassroomCopilot, including the web application and static file serving configuration.
|
|
|
|
## Directory Structure
|
|
|
|
```
|
|
frontend/
|
|
├── src/ # Frontend application source code
|
|
└── Dockerfile.dev # Development container configuration
|
|
└── Dockerfile.prod # Production container configuration
|
|
```
|
|
|
|
## Configuration
|
|
|
|
### Environment Variables
|
|
|
|
The frontend service uses the following environment variables:
|
|
|
|
- `VITE_FRONTEND_SITE_URL`: The base URL of the frontend application
|
|
- `VITE_APP_NAME`: The name of the application
|
|
- `VITE_SUPER_ADMIN_EMAIL`: Email address of the super admin
|
|
- `VITE_DEV`: Development mode flag
|
|
- `VITE_SUPABASE_URL`: Supabase API URL
|
|
- `VITE_SUPABASE_ANON_KEY`: Supabase anonymous key
|
|
- `VITE_STRICT_MODE`: Strict mode flag
|
|
- Other environment variables are defined in the root `.env` file
|
|
|
|
### Server Configuration
|
|
|
|
The frontend container uses a simple nginx configuration that:
|
|
- Serves static files on port 80
|
|
- Handles SPA routing
|
|
- Manages caching headers
|
|
- Denies access to hidden files
|
|
|
|
SSL termination and domain routing are handled by Nginx Proxy Manager (NPM).
|
|
|
|
## Usage
|
|
|
|
### Development
|
|
|
|
1. Start the development environment:
|
|
```bash
|
|
NGINX_MODE=dev ./init_macos_dev.sh up
|
|
```
|
|
|
|
2. Configure NPM:
|
|
- Create a new proxy host for app.localhost
|
|
- Forward to http://frontend:80
|
|
- Enable SSL with a self-signed certificate
|
|
- Add custom locations for SPA routing
|
|
|
|
3. Access the application:
|
|
- HTTPS: https://app.localhost
|
|
|
|
### Production
|
|
|
|
1. Set environment variables:
|
|
```bash
|
|
NGINX_MODE=prod
|
|
```
|
|
|
|
2. Start the production environment:
|
|
```bash
|
|
./init_macos_dev.sh up
|
|
```
|
|
|
|
3. Configure NPM:
|
|
- Create a new proxy host for app.classroomcopilot.ai
|
|
- Forward to http://frontend:80
|
|
- Enable SSL with Cloudflare certificates
|
|
- Add custom locations for SPA routing
|
|
|
|
## Security
|
|
|
|
- SSL termination handled by NPM
|
|
- Static file serving with proper caching headers
|
|
- Hidden file access denied
|
|
- SPA routing with fallback to index.html
|
|
|
|
## Troubleshooting
|
|
|
|
### Connection Issues
|
|
- Check NPM logs in the admin interface
|
|
- Verify frontend container is running
|
|
- Ensure NPM proxy host is properly configured
|
|
- Check network connectivity between NPM and frontend
|
|
|
|
### SPA Routing Issues
|
|
- Verify NPM custom locations are properly configured
|
|
- Check frontend container logs
|
|
- Ensure all routes fall back to index.html
|
|
|
|
## Maintenance
|
|
|
|
### Log Files
|
|
Located in `/var/log/nginx/`:
|
|
- `access.log`: General access logs
|
|
- `error.log`: Error logs
|
|
|
|
### Configuration Updates
|
|
1. Modify Dockerfile.dev or Dockerfile.prod as needed
|
|
2. Rebuild and restart the container:
|
|
```bash
|
|
docker compose up -d --build frontend
|
|
```
|