From ebd50740f01ad6c3311eb60ef56976f0918093d3 Mon Sep 17 00:00:00 2001 From: lubiana Date: Fri, 25 Jul 2025 15:23:52 +0200 Subject: [PATCH] devmode --- .dockerignore | 44 +++++++++++++--------- Dockerfile.dev | 63 +++++++++++++++++++++++++++++++ README.md | 83 +++++++++++++++++++++++++++++++++++++++++ dev-docker.sh | 39 +++++++++++++++++++ docker-compose.dev.yml | 35 +++++++++++++++++ frontend/vite.config.ts | 2 + 6 files changed, 249 insertions(+), 17 deletions(-) create mode 100644 Dockerfile.dev create mode 100755 dev-docker.sh create mode 100644 docker-compose.dev.yml diff --git a/.dockerignore b/.dockerignore index b434702..4affe0f 100644 --- a/.dockerignore +++ b/.dockerignore @@ -3,32 +3,42 @@ .gitignore # Docker -Dockerfile -Containerfile +Dockerfile* +docker-compose*.yml .dockerignore -# Build artifacts -gocheck -gocheck-* +# Development +dev.sh +dev-docker.sh +tmp/ +*.log + +# Node.js +frontend/node_modules/ +frontend/dist/ +frontend/.vite/ + +# Go *.exe +*.exe~ +*.dll +*.so +*.dylib +*.test +*.out +go.work -# Database files (will be created at runtime) -checklists.db -checklists.db-* - -# OS files +# OS .DS_Store Thumbs.db -# IDE files +# IDE .vscode/ .idea/ *.swp *.swo +*~ -# Logs -*.log - -# Temporary files -/tmp/ -/temp/ \ No newline at end of file +# Build artifacts +build/ +dist/ \ No newline at end of file diff --git a/Dockerfile.dev b/Dockerfile.dev new file mode 100644 index 0000000..d299f6a --- /dev/null +++ b/Dockerfile.dev @@ -0,0 +1,63 @@ +# Development Dockerfile with hot reload support +FROM golang:1.24-alpine + +# Install development dependencies +RUN apk add --no-cache \ + git \ + ca-certificates \ + gcc \ + musl-dev \ + nodejs \ + npm \ + sqlite \ + # For file watching + inotify-tools + +# Set working directory +WORKDIR /app + +# Install Air for Go hot reloading +RUN go install github.com/cosmtrek/air@latest + +# Copy go mod files first for better caching +COPY go.mod go.sum ./ + +# Download Go dependencies +RUN go mod download + +# Copy Air configuration +COPY .air.toml ./ + +# Copy the entire project +COPY . . + +# Install frontend dependencies +WORKDIR /app/frontend +RUN npm install + +# Go back to app root +WORKDIR /app + +# Expose ports for both backend and frontend +EXPOSE 8080 5173 + +# Create a development startup script +RUN echo '#!/bin/sh\n\ + echo "🚀 Starting development environment..."\n\ + echo "📡 Backend will be available at http://localhost:8080"\n\ + echo "🎨 Frontend will be available at http://localhost:5173"\n\ + echo ""\n\ + # Start frontend in background\n\ + cd /app/frontend && npm run dev &\n\ + FRONTEND_PID=$!\n\ + \n\ + # Start backend with Air\n\ + cd /app && air\n\ + \n\ + # Cleanup on exit\n\ + trap "kill $FRONTEND_PID" EXIT\n\ + wait\n\ + ' > /app/dev-start.sh && chmod +x /app/dev-start.sh + +# Set the development startup script as entrypoint +ENTRYPOINT ["/app/dev-start.sh"] \ No newline at end of file diff --git a/README.md b/README.md index b4dee67..d8a0365 100644 --- a/README.md +++ b/README.md @@ -376,5 +376,88 @@ The application uses SQLite with the following schema: ## Development +### Local Development + To run in development mode with automatic reloading, you can use tools like `air` or `realize`. + +#### Using the Development Script + +The project includes a development script that runs both backend and frontend with hot reloading: + +```bash +# Start development environment +./dev.sh +``` + +This will: +- Start the Go backend with Air for hot reloading +- Start the React frontend with Vite for hot reloading +- Proxy API requests from frontend to backend +- Clean up processes on exit + +### Docker Development + +For a consistent development environment using Docker with hot reloading: + +#### Prerequisites + +- Docker and Docker Compose installed +- Ports 8080 and 5173 available + +#### Quick Start + +```bash +# Start development environment with Docker +./dev-docker.sh +``` + +This will: +- Build a development container with all dependencies +- Mount your source code for hot reloading +- Start both backend (Air) and frontend (Vite) with hot reloading +- Make the application available at: + - Backend: http://localhost:8080 + - Frontend: http://localhost:5173 + +#### Manual Docker Commands + +```bash +# Build and start the development container +docker-compose -f docker-compose.dev.yml up --build + +# Stop the development container +docker-compose -f docker-compose.dev.yml down + +# View logs +docker-compose -f docker-compose.dev.yml logs -f + +# Rebuild the container +docker-compose -f docker-compose.dev.yml up --build --force-recreate +``` + +#### Development Features + +The Docker development environment includes: + +- **Hot Reloading**: Both Go backend and React frontend reload automatically on code changes +- **Volume Mounts**: Your local code is mounted into the container for live editing +- **Dependency Management**: All dependencies are pre-installed in the container +- **Consistent Environment**: Same environment across all developers +- **Easy Cleanup**: Simple commands to start/stop the development environment + +#### File Watching + +The development container uses: +- **Air** for Go backend hot reloading (watches `.go` files) +- **Vite** for React frontend hot reloading (watches all frontend files) +- **inotify-tools** for efficient file system watching + +#### Troubleshooting + +If you encounter issues: + +1. **Port conflicts**: Ensure ports 8080 and 5173 are not in use +2. **Permission issues**: The container runs with appropriate permissions +3. **Hot reload not working**: Check that your files are being watched by the respective tools +4. **Container won't start**: Check Docker logs with `docker-compose -f docker-compose.dev.yml logs` diff --git a/dev-docker.sh b/dev-docker.sh new file mode 100755 index 0000000..ad56713 --- /dev/null +++ b/dev-docker.sh @@ -0,0 +1,39 @@ +#!/bin/bash + +# Development script using Docker with hot reload support +# This script builds and runs the development container + +set -e + +# Colors for output +RED='\033[0;31m' +GREEN='\033[0;32m' +YELLOW='\033[1;33m' +BLUE='\033[0;34m' +NC='\033[0m' # No Color + +# Function to cleanup +cleanup() { + echo -e "\n${YELLOW}🛑 Shutting down development container...${NC}" + docker-compose -f docker-compose.dev.yml down + echo -e "${GREEN}✅ Development environment stopped${NC}" + exit 0 +} + +# Set up signal handlers +trap cleanup SIGINT SIGTERM + +echo -e "${BLUE}🚀 Starting GoCheck development environment with Docker...${NC}" + +# Check if Docker is running +if ! docker info > /dev/null 2>&1; then + echo -e "${RED}❌ Docker is not running. Please start Docker and try again.${NC}" + exit 1 +fi + +# Build and start the development container +echo -e "${YELLOW}📦 Building development container...${NC}" +docker-compose -f docker-compose.dev.yml up --build + +# The container will keep running until interrupted +# When interrupted, the cleanup function will be called \ No newline at end of file diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml new file mode 100644 index 0000000..1dc7c7f --- /dev/null +++ b/docker-compose.dev.yml @@ -0,0 +1,35 @@ +version: '3.8' + +services: + gocheck-dev: + build: + context: . + dockerfile: Dockerfile.dev + container_name: gocheck-dev + ports: + - "8080:8080" # Backend port + - "5173:5173" # Frontend port + volumes: + # Mount source code for hot reloading + - .:/app + # Exclude node_modules to avoid conflicts + - /app/frontend/node_modules + # Exclude Go modules cache + - /app/go.sum + - /app/go.mod + environment: + - NODE_ENV=development + - GO_ENV=development + # Enable Vite host binding for external access + - VITE_HOST=0.0.0.0 + networks: + - gocheck-dev-network + # Enable interactive mode for better development experience + stdin_open: true + tty: true + # Restart policy for development + restart: unless-stopped + +networks: + gocheck-dev-network: + driver: bridge diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 8df1dad..3a0ebb7 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -6,6 +6,8 @@ import tailwindcss from '@tailwindcss/vite' export default defineConfig({ plugins: [react(), tailwindcss()], server: { + host: '0.0.0.0', // Allow external access for Docker + port: 5173, proxy: { '/api': { target: 'http://localhost:8080',