feat: add Docker development environment for frontend
Create containerized development setup for safe and consistent frontend development: Docker Configuration: - docker-compose.yml: Root-level orchestration with frontend service - frontend/Dockerfile.dev: Node.js 20 Alpine optimized for dev - Volume mounts for Hot Module Replacement (HMR) - Named volume for node_modules to avoid conflicts - Health check to verify service availability - Environment variables for file watching (CHOKIDAR_USEPOLLING) Vite Configuration Update: - vite.config.ts: Add server config for Docker compatibility - host: '0.0.0.0' to accept external connections - usePolling: true for file watching in container - port: 5173 explicitly configured Documentation: - README.md: Add Docker development procedure section - Document docker compose up -d workflow - Explain HMR and hot-reload capabilities - List advantages of Docker-based development Usage: docker compose up -d # Start development server docker compose logs -f # View logs docker compose down # Stop container Access: http://localhost:5173 Safety First: - Isolated environment prevents system conflicts - Reproducible setup across different machines - No host Node.js installation required - Easy team onboarding Refs: Docker best practices for Node.js development
This commit is contained in:
30
README.md
30
README.md
@@ -141,6 +141,36 @@ npm run preview
|
||||
|
||||
La landing page sarà disponibile su `http://localhost:5173` durante lo sviluppo.
|
||||
|
||||
#### Sviluppo con Docker (Consigliato)
|
||||
|
||||
Per un ambiente di sviluppo isolato e consistente, utilizza Docker Compose:
|
||||
|
||||
```bash
|
||||
# Avvia il container di sviluppo
|
||||
docker compose up -d
|
||||
|
||||
# La landing page sarà disponibile su http://localhost:5173
|
||||
# Modifica i file in frontend/src/ e vedi le modifiche in tempo reale (HMR)
|
||||
|
||||
# Visualizza i log
|
||||
docker compose logs -f frontend
|
||||
|
||||
# Ferma il container
|
||||
docker compose down
|
||||
```
|
||||
|
||||
**Vantaggi Docker:**
|
||||
- Ambiente isolato e riproducibile
|
||||
- Hot Module Replacement (HMR) funzionante
|
||||
- Nessun conflitto con Node.js installato sul sistema
|
||||
- Facile da condividere con il team
|
||||
|
||||
**Stack Frontend:**
|
||||
- **React 18** + **TypeScript** - UI library con type safety
|
||||
- **Vite** - Build tool veloce con HMR
|
||||
- **Tailwind CSS** - Utility-first CSS framework
|
||||
- **PostCSS** + **Autoprefixer** - Processing CSS
|
||||
|
||||
|
||||
## 🤖 Agenti AI (OpenCode.ai)
|
||||
|
||||
|
||||
Reference in New Issue
Block a user