Quellcode durchsuchen

Add comprehensive dev container setup for consistent development environment

- .devcontainer/devcontainer.json: Full configuration with Node.js 20, pnpm, extensions, and port forwarding
- .devcontainer/Dockerfile: Custom image with HandBrake CLI, FFmpeg, SQLite, and development tools
- .devcontainer/README.md: Detailed setup and usage instructions
- .devcontainer/.gitignore: Ignore temporary files
- Updated main README.md to highlight dev container as recommended setup option
Timothy Pomeroy vor 1 Monat
Ursprung
Commit
d4960bccce
4 geänderte Dateien mit 317 neuen und 0 gelöschten Zeilen
  1. 28 0
      .devcontainer/.gitignore
  2. 53 0
      .devcontainer/Dockerfile
  3. 148 0
      .devcontainer/README.md
  4. 88 0
      .devcontainer/devcontainer.json

+ 28 - 0
.devcontainer/.gitignore

@@ -0,0 +1,28 @@
+# Dev container temporary files
+*.log
+.cache/
+.vscode/settings.json
+.pnpm-debug.log*
+
+# OS generated files
+.DS_Store
+.DS_Store?
+._*
+.Spotlight-V100
+.Trashes
+ehthumbs.db
+Thumbs.db
+
+# Development artifacts
+node_modules/
+dist/
+build/
+coverage/
+
+# Database files (if not using persistent mounts)
+*.db
+*.db-*
+
+# Temporary files
+*.tmp
+*.temp

+ 53 - 0
.devcontainer/Dockerfile

@@ -0,0 +1,53 @@
+# [Choice] Node.js version: 20, 18, 16
+ARG VARIANT=20-bullseye
+FROM mcr.microsoft.com/devcontainers/javascript-node:1-${VARIANT}
+
+# Install additional OS packages
+RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
+    && apt-get -y install --no-install-recommends \
+        sqlite3 \
+        ffmpeg \
+        handbrake-cli \
+        curl \
+        wget \
+        git \
+        htop \
+        tree \
+        jq \
+        unzip \
+    && apt-get clean \
+    && rm -rf /var/lib/apt/lists/*
+
+# Install pnpm globally
+RUN npm install -g pnpm@latest
+
+# Set up pnpm store location
+ENV PNPM_HOME="/home/node/.local/share/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+
+# Create workspace directory
+RUN mkdir -p /workspaces/watch-finished-turbo
+WORKDIR /workspaces/watch-finished-turbo
+
+# Switch to node user
+USER node
+
+# Set up git configuration (will be overridden by user)
+RUN git config --global init.defaultBranch main
+
+# Pre-install common global packages
+RUN pnpm add -g \
+    turbo \
+    typescript \
+    @types/node \
+    eslint \
+    prettier \
+    jest \
+    playwright
+
+# Set default shell
+ENV SHELL=/bin/bash
+
+# Health check
+HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \
+    CMD node --version || exit 1

+ 148 - 0
.devcontainer/README.md

@@ -0,0 +1,148 @@
+# Development Container Setup
+
+This project includes a development container configuration that provides a fully configured development environment using Docker containers.
+
+## Prerequisites
+
+- [Docker](https://www.docker.com/get-started) installed and running
+- [Visual Studio Code](https://code.visualstudio.com/) with the [Dev Containers extension](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers)
+
+## Getting Started
+
+1. **Open in Dev Container**:
+   - Open the project in VS Code
+   - When prompted, click "Reopen in Container" or use Command Palette: `Dev Containers: Reopen in Container`
+   - The first time will take longer as it builds the container
+
+2. **Alternative Methods**:
+   - Use Command Palette: `Dev Containers: Open Folder Locally in Container`
+   - Or click the green "Open Remote Window" button in the bottom-left and select "Reopen in Container"
+
+## What's Included
+
+### Development Tools
+
+- **Node.js 20** with pnpm package manager
+- **TypeScript** and **ESLint** for code quality
+- **Prettier** for code formatting
+- **Jest** and **Playwright** for testing
+- **Git** for version control
+- **GitHub CLI** for repository management
+
+### Project Dependencies
+
+- **HandBrake CLI** for video processing
+- **FFmpeg** for media handling
+- **SQLite3** for database operations
+- **Docker-in-Docker** for container operations
+
+### VS Code Extensions
+
+- TypeScript and JavaScript support
+- Tailwind CSS IntelliSense
+- ESLint and Prettier integration
+- Playwright testing tools
+- GitHub Copilot (if available)
+- Test Explorer integration
+
+## Development Workflow
+
+Once the container is running:
+
+```bash
+# Install dependencies (already done in postCreateCommand)
+pnpm install
+
+# Start development servers
+pnpm run dev
+
+# Run tests
+pnpm run test
+
+# Lint code
+pnpm run lint
+
+# Format code
+pnpm run format
+```
+
+## Port Forwarding
+
+The following ports are automatically forwarded:
+
+- **3000**: Next.js web application
+- **3001**: NestJS API service
+- **9229**: Node.js debugger
+
+## File Mounting
+
+- **Workspace**: Full project directory is mounted for live editing
+- **Data Directory**: SQLite database files persist between sessions
+- **pnpm Store**: Package cache is persisted for faster installs
+
+## Customization
+
+### Adding Extensions
+
+Edit `.devcontainer/devcontainer.json` and add extensions to the `customizations.vscode.extensions` array.
+
+### Modifying Environment
+
+Add environment variables in the `containerEnv` section of `devcontainer.json`.
+
+### Installing Additional Tools
+
+Add packages to the Dockerfile or use the features system in `devcontainer.json`.
+
+## Troubleshooting
+
+### Container Won't Start
+
+- Ensure Docker is running
+- Check available disk space
+- Try rebuilding: `Dev Containers: Rebuild Container`
+
+### Port Conflicts
+
+- Modify port forwarding in `devcontainer.json`
+- Check if ports are already in use on host
+
+### Performance Issues
+
+- Ensure adequate RAM allocation for Docker
+- Consider using Docker Desktop settings to increase resources
+
+### Permission Issues
+
+- Files are owned by the `node` user in the container
+- Use `sudo` if needed for system-level operations
+
+## Advanced Configuration
+
+### Custom Dockerfile
+
+The included Dockerfile extends the official Node.js dev container image. Modify it to add custom tools or configurations.
+
+### Multiple Configurations
+
+Create multiple dev container configurations by adding more files in the `.devcontainer` directory.
+
+### Remote Development
+
+This setup works with GitHub Codespaces and other remote development environments.
+
+## Contributing
+
+When making changes to the dev container setup:
+
+1. Test the configuration thoroughly
+2. Update this README if adding new features
+3. Consider the impact on different development environments
+
+## Support
+
+For issues with the dev container setup:
+
+1. Check the VS Code Dev Containers documentation
+2. Review Docker and container logs
+3. Ensure all prerequisites are met

+ 88 - 0
.devcontainer/devcontainer.json

@@ -0,0 +1,88 @@
+{
+  "name": "Watch Finished Turbo Development",
+  "dockerFile": "Dockerfile",
+  "context": "..",
+
+  // Configure tool-specific properties.
+  "customizations": {
+    // Configure properties specific to VS Code.
+    "vscode": {
+      "extensions": [
+        "ms-vscode.vscode-typescript-next",
+        "bradlc.vscode-tailwindcss",
+        "esbenp.prettier-vscode",
+        "ms-vscode.vscode-eslint",
+        "ms-vscode.vscode-json",
+        "ms-playwright.playwright",
+        "ms-vscode.test-adapter-converter",
+        "hbenl.vscode-test-explorer",
+        "ms-vscode.vscode-jest",
+        "ms-vscode-remote.remote-containers",
+        "GitHub.copilot",
+        "GitHub.copilot-chat"
+      ],
+      "settings": {
+        "typescript.preferences.preferTypeOnlyAutoImports": true,
+        "typescript.suggest.autoImports": true,
+        "editor.formatOnSave": true,
+        "editor.defaultFormatter": "esbenp.prettier-vscode",
+        "editor.codeActionsOnSave": {
+          "source.fixAll.eslint": "explicit"
+        },
+        "tailwindCSS.experimental.classRegex": [
+          ["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
+          ["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
+        ],
+        "jest.autoRun": "off",
+        "playwright.reuseBrowser": true
+      }
+    }
+  },
+
+  // Features to add to the dev container. More info: https://containers.dev/features.
+  "features": {
+    "ghcr.io/devcontainers/features/github-cli:1": {},
+    "ghcr.io/devcontainers/features/docker-in-docker:2": {},
+    "ghcr.io/devcontainers/features/node:1": {
+      "version": "20",
+      "pnpmVersion": "latest"
+    },
+    "ghcr.io/devcontainers/features/git:1": {
+      "version": "latest",
+      "ppa": false
+    }
+  },
+
+  // Use 'forwardPorts' to make a list of ports inside the container available locally.
+  "forwardPorts": [
+    3000, // Next.js web app
+    3001, // NestJS API service
+    9229 // Node.js debugger
+  ],
+
+  // Use 'postCreateCommand' to run commands after the container is created.
+  "postCreateCommand": "pnpm install",
+
+  // Configure tool-specific properties.
+  "remoteUser": "node",
+
+  // Mount the workspace
+  "workspaceMount": "source=${localWorkspaceFolder},target=/workspaces/watch-finished-turbo,type=bind,consistency=cached",
+  "workspaceFolder": "/workspaces/watch-finished-turbo",
+
+  // Environment variables
+  "containerEnv": {
+    "NODE_ENV": "development",
+    "PNPM_HOME": "/home/node/.local/share/pnpm",
+    "PATH": "/home/node/.local/share/pnpm:/home/node/.local/share/pnpm/global/5/node_modules/.bin:${PATH}"
+  },
+
+  // Security options
+  "securityOpt": ["label:disable"],
+
+  // Mounts for persistent data
+  "mounts": [
+    "source=${localWorkspaceFolder}/.devcontainer/.pnpm-store,target=/home/node/.local/share/pnpm,type=volume",
+    "source=${localWorkspaceFolder}/data,target=/workspaces/watch-finished-turbo/data,type=bind"
+  ]
+}