134 lines
3.7 KiB
Markdown
134 lines
3.7 KiB
Markdown
# Development Container Setup
|
|
|
|
This devcontainer provides a complete Elixir Phoenix development environment with all necessary tools and dependencies pre-installed.
|
|
|
|
## What's Included
|
|
|
|
- **Elixir 1.15** with OTP 26
|
|
- **Phoenix Framework** (latest)
|
|
- **Node.js 20** for asset compilation
|
|
- **PostgreSQL 15** database
|
|
- **VS Code Extensions** for Elixir/Phoenix development
|
|
- **Development tools**: Git, build tools, inotify-tools
|
|
|
|
## Quick Start
|
|
|
|
1. Open this project in VS Code
|
|
2. Install the "Dev Containers" extension if you haven't already
|
|
3. Press `Ctrl+Shift+P` (or `Cmd+Shift+P` on Mac) and select "Dev Containers: Reopen in Container"
|
|
4. Wait for the container to build and initialize
|
|
5. The setup script will automatically run to configure your environment
|
|
|
|
## What Happens During Setup
|
|
|
|
The `setup.sh` script automatically:
|
|
- Installs Elixir dependencies (`mix deps.get`)
|
|
- Installs Node.js dependencies for assets
|
|
- Creates and migrates the database
|
|
- Runs database seeds (if available)
|
|
- Compiles the project
|
|
|
|
## Development Workflow
|
|
|
|
### Starting the Phoenix Server
|
|
```bash
|
|
mix phx.server
|
|
```
|
|
The server will be available at http://localhost:4000
|
|
|
|
### Database Operations
|
|
```bash
|
|
# Reset database
|
|
mix ecto.reset
|
|
|
|
# Create migration
|
|
mix ecto.gen.migration migration_name
|
|
|
|
# Run migrations
|
|
mix ecto.migrate
|
|
|
|
# Rollback migration
|
|
mix ecto.rollback
|
|
```
|
|
|
|
### Testing
|
|
```bash
|
|
# Run all tests
|
|
mix test
|
|
|
|
# Run specific test file
|
|
mix test test/path/to/test_file.exs
|
|
|
|
# Run tests with coverage
|
|
mix test --cover
|
|
```
|
|
|
|
### Asset Management
|
|
```bash
|
|
# Install new npm packages
|
|
cd assets && npm install package-name && cd ..
|
|
|
|
# Build assets for production
|
|
mix assets.deploy
|
|
```
|
|
|
|
## VS Code Extensions Included
|
|
|
|
- **ElixirLS** - Language server for Elixir
|
|
- **Phoenix Framework** - Phoenix-specific tooling
|
|
- **Tailwind CSS IntelliSense** - CSS utility suggestions
|
|
- **Prettier** - Code formatting
|
|
- **GitHub Copilot** - AI-powered code completion
|
|
- **Auto Rename Tag** - HTML tag synchronization
|
|
|
|
## Environment Variables
|
|
|
|
The following environment variables are pre-configured:
|
|
- `MIX_ENV=dev`
|
|
- `PHX_SERVER=true`
|
|
- `DATABASE_URL=ecto://postgres:postgres@db:5432/components_elixir_dev`
|
|
|
|
## Ports
|
|
|
|
The following ports are forwarded to your local machine:
|
|
- **4000** - Phoenix web server
|
|
- **5433** - PostgreSQL database (mapped to avoid conflicts with host PostgreSQL)
|
|
|
|
## Persistent Storage
|
|
|
|
The following directories are stored in Docker volumes for better performance:
|
|
- `_build/` - Compiled Elixir code
|
|
- `deps/` - Elixir dependencies
|
|
- `assets/node_modules/` - Node.js dependencies
|
|
- PostgreSQL data
|
|
|
|
## Troubleshooting
|
|
|
|
### Container won't start
|
|
- Make sure Docker is running
|
|
- Try rebuilding the container: "Dev Containers: Rebuild Container"
|
|
|
|
### Port conflicts
|
|
- If you get "port is already allocated" errors, make sure no other containers are using the same ports
|
|
- Stop existing containers: `docker-compose down`
|
|
- The devcontainer uses port 5433 for PostgreSQL to avoid conflicts with host installations
|
|
|
|
### Database connection issues
|
|
- Ensure the database service is running: `docker-compose ps`
|
|
- Check database logs: `docker-compose logs db`
|
|
|
|
### Permission issues
|
|
- The container runs as user `vscode` (UID 1000)
|
|
- If you encounter permission issues, rebuild the container
|
|
|
|
### Dependencies not installing
|
|
- Try running `mix deps.clean --all && mix deps.get`
|
|
- For Node.js: `cd assets && rm -rf node_modules && npm install`
|
|
|
|
## Customization
|
|
|
|
You can customize the development environment by:
|
|
- Modifying `.devcontainer/devcontainer.json` for VS Code settings
|
|
- Updating `.devcontainer/Dockerfile` for additional system packages
|
|
- Editing `.devcontainer/docker-compose.yml` for service configuration
|
|
- Adding to `.devcontainer/setup.sh` for additional setup steps |