diff --git a/DEPLOYMENT.md b/DEPLOYMENT.md
new file mode 100644
index 0000000..5a94cc4
--- /dev/null
+++ b/DEPLOYMENT.md
@@ -0,0 +1,250 @@
+# Deployment Guide
+
+This guide covers deploying PROJECT CONTROL to production environments.
+
+## Prerequisites
+
+- Python 3.11+
+- Node.js 18+
+- MySQL 8.0+
+- Redis 6.0+
+
+## Environment Configuration
+
+### Backend Environment Variables
+
+Create `backend/.env` with the following configuration:
+
+```env
+# Database
+MYSQL_HOST=your-mysql-host
+MYSQL_PORT=3306
+MYSQL_USER=your-username
+MYSQL_PASSWORD=your-secure-password
+MYSQL_DATABASE=project_control
+
+# Redis
+REDIS_HOST=your-redis-host
+REDIS_PORT=6379
+REDIS_DB=0
+
+# JWT (IMPORTANT: Generate a secure random key)
+JWT_SECRET_KEY=your-256-bit-secret-key-here
+JWT_ALGORITHM=HS256
+JWT_EXPIRE_MINUTES=60
+
+# Refresh Token
+REFRESH_TOKEN_EXPIRE_DAYS=7
+
+# External Auth API
+AUTH_API_URL=https://your-auth-api-url
+
+# System Admin
+SYSTEM_ADMIN_EMAIL=admin@yourcompany.com
+
+# Environment
+ENVIRONMENT=production
+DEBUG=false
+
+# CORS (comma-separated origins)
+CORS_ORIGINS=["https://your-frontend-domain.com"]
+
+# File Encryption (Optional - generate with provided command)
+ENCRYPTION_MASTER_KEY=
+
+# Rate Limiting
+RATE_LIMIT_STANDARD=60
+RATE_LIMIT_SENSITIVE=20
+RATE_LIMIT_HEAVY=5
+```
+
+### Frontend Environment Variables
+
+Create `frontend/.env.production`:
+
+```env
+VITE_API_URL=https://your-api-domain.com
+```
+
+## Database Setup
+
+### 1. Create Database
+
+```sql
+CREATE DATABASE project_control CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
+CREATE USER 'pjctrl'@'%' IDENTIFIED BY 'your-secure-password';
+GRANT ALL PRIVILEGES ON project_control.* TO 'pjctrl'@'%';
+FLUSH PRIVILEGES;
+```
+
+### 2. Run Migrations
+
+```bash
+cd backend
+alembic upgrade head
+```
+
+## Backend Deployment
+
+### Option A: Docker (Recommended)
+
+```dockerfile
+# Dockerfile
+FROM python:3.11-slim
+
+WORKDIR /app
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+COPY . .
+EXPOSE 8000
+
+CMD ["uvicorn", "app.main:app", "--host", "0.0.0.0", "--port", "8000"]
+```
+
+### Option B: Manual Deployment
+
+```bash
+cd backend
+
+# Create virtual environment
+python -m venv venv
+source venv/bin/activate
+
+# Install dependencies
+pip install -r requirements.txt
+
+# Run with gunicorn (production)
+gunicorn app.main:app -w 4 -k uvicorn.workers.UvicornWorker -b 0.0.0.0:8000
+```
+
+## Frontend Deployment
+
+### Build for Production
+
+```bash
+cd frontend
+npm install
+npm run build
+```
+
+### Serve Static Files
+
+The `dist/` folder contains static files that can be served by:
+- Nginx
+- Apache
+- CDN (CloudFront, Cloudflare)
+- Static hosting (Vercel, Netlify)
+
+### Nginx Configuration Example
+
+```nginx
+server {
+    listen 80;
+    server_name your-domain.com;
+
+    root /var/www/project-control/frontend/dist;
+    index index.html;
+
+    # SPA routing
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+
+    # API proxy
+    location /api {
+        proxy_pass http://localhost:8000;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    }
+
+    # WebSocket proxy
+    location /ws {
+        proxy_pass http://localhost:8000;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection "upgrade";
+    }
+}
+```
+
+## Security Checklist
+
+Before going live, ensure:
+
+- [ ] `DEBUG=false` in production
+- [ ] `ENVIRONMENT=production` is set
+- [ ] Strong `JWT_SECRET_KEY` (256-bit random)
+- [ ] Database password is secure
+- [ ] CORS origins are restricted to your domain
+- [ ] HTTPS is enabled (SSL/TLS certificate)
+- [ ] Rate limiting is configured
+- [ ] File upload directory has proper permissions
+- [ ] Redis is password-protected (if exposed)
+
+## Monitoring
+
+### Health Check Endpoints
+
+| Endpoint | Auth | Description |
+|----------|------|-------------|
+| `GET /health` | No | Basic health status |
+| `GET /health/live` | No | Liveness probe |
+| `GET /health/ready` | No | Readiness probe |
+| `GET /health/detailed` | Admin | Detailed system status |
+
+### API Documentation
+
+- Swagger UI: `https://your-api-domain.com/docs`
+- ReDoc: `https://your-api-domain.com/redoc`
+
+## Backup Strategy
+
+### Database Backup
+
+```bash
+# Daily backup
+mysqldump -h $MYSQL_HOST -u $MYSQL_USER -p$MYSQL_PASSWORD project_control > backup_$(date +%Y%m%d).sql
+```
+
+### File Attachments
+
+Backup the `uploads/` directory containing user attachments.
+
+### Encryption Key
+
+**CRITICAL**: Backup `ENCRYPTION_MASTER_KEY` securely. If lost, encrypted files cannot be recovered.
+
+## Troubleshooting
+
+### Common Issues
+
+1. **CORS errors**: Verify `CORS_ORIGINS` includes your frontend domain
+2. **401 Unauthorized**: Check JWT token expiry and refresh token flow
+3. **WebSocket disconnects**: Ensure proxy supports WebSocket upgrade
+4. **Rate limiting**: Adjust `RATE_LIMIT_*` values if needed
+
+### Logs
+
+Backend logs are output to stdout. Configure your logging infrastructure to capture them.
+
+```bash
+# View logs in Docker
+docker logs -f project-control-backend
+```
+
+## Scaling
+
+### Horizontal Scaling
+
+- Backend: Run multiple instances behind a load balancer
+- Redis: Use Redis Cluster for high availability
+- Database: Use read replicas for read-heavy workloads
+
+### WebSocket Considerations
+
+When running multiple backend instances, ensure WebSocket connections are sticky (session affinity) or use a shared pub/sub system (Redis pub/sub is already implemented).
diff --git a/backend/app/main.py b/backend/app/main.py
index d412f31..c5ed285 100644
--- a/backend/app/main.py
+++ b/backend/app/main.py
@@ -69,9 +69,36 @@ from app.models import User
 
 app = FastAPI(
     title="Project Control API",
-    description="Cross-departmental project management system API",
+    description="""
+## Cross-departmental Project Management System API
+
+### Features
+- **Task Management**: CRUD operations for tasks with custom fields
+- **Project & Space**: Hierarchical project organization
+- **Workload**: Resource allocation and capacity planning
+- **Collaboration**: Comments, mentions, and real-time sync
+- **Audit Trail**: Complete change history and compliance logging
+- **Automation**: Triggers, schedules, and automated reports
+
+### Authentication
+All endpoints except `/health` and `/api/auth/login` require JWT authentication.
+Include the token in the `Authorization` header: `Bearer <token>`
+
+### CSRF Protection
+State-changing requests (POST, PUT, PATCH, DELETE) require `X-CSRF-Token` header.
+""",
     version="1.0.0",
     lifespan=lifespan,
+    docs_url="/docs",
+    redoc_url="/redoc",
+    openapi_tags=[
+        {"name": "auth", "description": "Authentication and authorization"},
+        {"name": "tasks", "description": "Task management operations"},
+        {"name": "projects", "description": "Project and space management"},
+        {"name": "workload", "description": "Resource workload and capacity"},
+        {"name": "audit", "description": "Audit trail and compliance"},
+        {"name": "health", "description": "System health checks"},
+    ],
 )
 
 # Initialize rate limiter
diff --git a/frontend/README.md b/frontend/README.md
new file mode 100644
index 0000000..57ca3db
--- /dev/null
+++ b/frontend/README.md
@@ -0,0 +1,147 @@
+# PROJECT CONTROL - Frontend
+
+React-based frontend for the PROJECT CONTROL task management system.
+
+## Tech Stack
+
+- **Framework**: React 18 with TypeScript
+- **Build Tool**: Vite
+- **Styling**: Inline styles with responsive design
+- **i18n**: react-i18next (English + Traditional Chinese)
+- **State Management**: React Context API
+- **Real-time**: WebSocket for live collaboration
+
+## Project Structure
+
+```
+src/
+├── components/       # Reusable UI components (40+ components)
+│   ├── GanttChart.tsx       # Gantt view with frappe-gantt
+│   ├── CalendarView.tsx     # Calendar view with FullCalendar
+│   ├── TaskDetailModal.tsx  # Task editing modal
+│   ├── ErrorBoundary.tsx    # Error handling wrapper
+│   └── ...
+├── pages/           # Route-level page components
+│   ├── Tasks.tsx           # Main task management (Kanban/Gantt/Calendar/List)
+│   ├── Dashboard.tsx       # Statistics and widgets
+│   ├── Projects.tsx        # Project management
+│   ├── WorkloadPage.tsx    # Resource workload heatmap
+│   ├── AuditPage.tsx       # Audit log viewer
+│   └── ...
+├── contexts/        # React Context providers
+│   ├── AuthContext.tsx     # Authentication state
+│   ├── NotificationContext.tsx  # Real-time notifications
+│   └── ProjectSyncContext.tsx   # WebSocket sync
+├── services/        # API service modules
+│   ├── api.ts              # Axios instance with CSRF/JWT
+│   ├── tasks.ts            # Task CRUD operations
+│   ├── projects.ts         # Project operations
+│   └── ...
+├── utils/           # Utility functions
+│   ├── logger.ts           # Environment-aware logging
+│   └── escapeHtml.ts       # XSS prevention
+├── i18n/            # Internationalization config
+├── types/           # TypeScript type definitions
+└── App.tsx          # Root component with routing
+```
+
+## Getting Started
+
+### Prerequisites
+
+- Node.js 18+
+- npm or yarn
+
+### Installation
+
+```bash
+# Install dependencies
+npm install
+
+# Start development server
+npm run dev
+```
+
+### Available Scripts
+
+| Command | Description |
+|---------|-------------|
+| `npm run dev` | Start development server (port 5173) |
+| `npm run build` | Production build to `dist/` |
+| `npm run preview` | Preview production build |
+| `npm run lint` | Run ESLint |
+
+## Environment Variables
+
+Create `.env.local` for local development:
+
+```env
+VITE_API_URL=http://localhost:8000
+```
+
+## Key Features
+
+### Authentication
+- JWT-based authentication with automatic refresh
+- CSRF token protection for state-changing requests
+- Secure token storage with validation
+
+### Task Views
+- **Kanban**: Drag-and-drop status management
+- **Gantt**: Timeline view with dependencies
+- **Calendar**: Date-based task visualization
+- **List**: Traditional table view with sorting
+
+### Real-time Collaboration
+- WebSocket connection for live updates
+- Optimistic UI updates with rollback
+- Project-level event channels
+
+### Internationalization
+- English and Traditional Chinese support
+- Dynamic locale switching
+- Date/time localization
+
+## Adding Translations
+
+1. Add keys to `public/locales/en/common.json`
+2. Add corresponding translations to `public/locales/zh-TW/common.json`
+3. Use `t('key')` in components with `useTranslation()` hook
+
+```typescript
+import { useTranslation } from 'react-i18next'
+
+function MyComponent() {
+  const { t } = useTranslation()
+  return <div>{t('myKey')}</div>
+}
+```
+
+## Code Splitting
+
+Pages are lazy-loaded using `React.lazy()` for optimal bundle size:
+
+```typescript
+const Dashboard = lazy(() => import('./pages/Dashboard'))
+```
+
+## Error Handling
+
+- `ErrorBoundary` component wraps the app for graceful error recovery
+- `SectionErrorBoundary` for granular component-level recovery
+- Environment-aware logging via `logger` utility
+
+## Testing
+
+```bash
+# Run tests (if configured)
+npm run test
+```
+
+## Build for Production
+
+```bash
+npm run build
+```
+
+Output is generated in `dist/` directory with code splitting and minification.