Skip to content

Commit 9ad75b5

Browse files
waleedlatif1waleedlatif1
committed
feat: added dev container as an option to run & develop sim studio
1 parent 2f58ff0 commit 9ad75b5

File tree

7 files changed

+289
-1
lines changed

7 files changed

+289
-1
lines changed

‎.devcontainer/.bashrc‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# Sim Studio Development Environment Bashrc
2+
# This gets sourced by post-create.sh
3+
4+
# Enhanced prompt with git branch info
5+
parse_git_branch() {
6+
git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/ (\1)/'
7+
}
8+
9+
export PS1="\[\033[01;32m\]\u@simstudio\[\033[00m\]:\[\033[01;34m\]\w\[\033[33m\]\$(parse_git_branch)\[\033[00m\]\$ "
10+
11+
# Helpful aliases
12+
alias ll="ls -la"
13+
alias ..="cd .."
14+
alias ...="cd ../.."
15+
16+
# Database aliases
17+
alias pgc="PGPASSWORD=postgres psql -h db -U postgres -d postgres"
18+
alias check-db="PGPASSWORD=postgres psql -h db -U postgres -c '\l'"
19+
20+
# Sim Studio specific aliases
21+
alias logs="tail -f logs/*.log 2>/dev/null || echo 'No log files found'"
22+
alias sim-start="npm run dev"
23+
alias sim-migrate="npx drizzle-kit push"
24+
alias sim-generate="npx drizzle-kit generate"
25+
alias sim-rebuild="npm run build && npm start"
26+
27+
# Welcome message
28+
echo "🚀 Welcome to Sim Studio development environment!"
29+
echo "Type 'sim-start' to start the development server"

‎.devcontainer/Dockerfile‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
FROM node:18-bullseye
2+
3+
# Avoid warnings by switching to noninteractive
4+
ENV DEBIAN_FRONTEND=noninteractive
5+
6+
# Configure apt and install packages
7+
RUN apt-get update \
8+
&& apt-get -y install --no-install-recommends apt-utils dialog 2>&1 \
9+
# Install git, process tools, lsb-release
10+
&& apt-get -y install git procps lsb-release \
11+
# Install other dependencies
12+
&& apt-get -y install curl wget jq sudo \
13+
# Clean up
14+
&& apt-get autoremove -y \
15+
&& apt-get clean -y \
16+
&& rm -rf /var/lib/apt/lists/*
17+
18+
# Create a non-root user
19+
ARG USERNAME=node
20+
ARG USER_UID=1000
21+
ARG USER_GID=$USER_UID
22+
23+
# [Optional] Add sudo support
24+
RUN apt-get update \
25+
&& apt-get install -y sudo \
26+
&& echo $USERNAME ALL=\(root\) NOPASSWD:ALL > /etc/sudoers.d/$USERNAME \
27+
&& chmod 0440 /etc/sudoers.d/$USERNAME
28+
29+
# Make sure we have the latest npm
30+
RUN npm install -g npm@latest
31+
32+
# Install global packages
33+
RUN npm install -g drizzle-kit
34+
35+
# Install dependencies for Postgres client
36+
RUN apt-get update && apt-get -y install --no-install-recommends \
37+
postgresql-client \
38+
&& rm -rf /var/lib/apt/lists/*
39+
40+
# Switch back to dialog for any ad-hoc use of apt-get
41+
ENV DEBIAN_FRONTEND=dialog
42+
43+
WORKDIR /workspace
44+
45+
# Expose the ports we're interested in
46+
EXPOSE 3000

‎.devcontainer/README.md‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
# Sim Studio Development Container
2+
3+
This directory contains configuration files for Visual Studio Code Dev Containers / GitHub Codespaces. Dev containers provide a consistent, isolated development environment for this project.
4+
5+
## Contents
6+
7+
- `devcontainer.json` - The main configuration file that defines the development container settings
8+
- `Dockerfile` - Defines the container image and development environment
9+
- `docker-compose.yml` - Sets up the application and database containers
10+
- `post-create.sh` - Script that runs when the container is created
11+
- `.bashrc` - Custom shell configuration with helpful aliases
12+
13+
## Usage
14+
15+
### Prerequisites
16+
17+
- Visual Studio Code
18+
- Docker installation:
19+
- Docker Desktop (Windows/macOS)
20+
- Docker Engine (Linux)
21+
- VS Code Remote - Containers extension
22+
23+
### Getting Started
24+
25+
1. Open this project in Visual Studio Code
26+
2. When prompted, click "Reopen in Container"
27+
- Alternatively, press `F1` and select "Remote-Containers: Reopen in Container"
28+
3. Wait for the container to build and initialize
29+
4. The post-creation script will automatically:
30+
31+
- Install dependencies
32+
- Set up environment variables
33+
- Run database migrations
34+
- Configure helpful aliases
35+
36+
5. Start the application with `sim-start` (alias for `npm run dev`)
37+
38+
### Development Commands
39+
40+
The development environment includes these helpful aliases:
41+
42+
- `sim-start` - Start the development server
43+
- `sim-migrate` - Push schema changes to the database
44+
- `sim-generate` - Generate new migrations
45+
- `sim-rebuild` - Build and start the production version
46+
- `pgc` - Connect to the PostgreSQL database
47+
- `check-db` - List all databases
48+
49+
### Using GitHub Codespaces
50+
51+
This project is also configured for GitHub Codespaces. To use it:
52+
53+
1. Go to the GitHub repository
54+
2. Click the "Code" button
55+
3. Select the "Codespaces" tab
56+
4. Click "Create codespace on main"
57+
58+
This will start a new Codespace with the development environment already set up.
59+
60+
## Customization
61+
62+
You can customize the development environment by:
63+
64+
- Modifying `devcontainer.json` to add VS Code extensions or settings
65+
- Updating the `Dockerfile` to install additional packages
66+
- Editing `docker-compose.yml` to add services or change configuration
67+
- Modifying `.bashrc` to add custom aliases or configurations
68+
69+
## Troubleshooting
70+
71+
If you encounter issues:
72+
73+
1. Rebuild the container: `F1` → "Remote-Containers: Rebuild Container"
74+
2. Check Docker logs for build errors
75+
3. Verify Docker Desktop is running
76+
4. Ensure all prerequisites are installed
77+
78+
For more information, see the [VS Code Remote Development documentation](https://code.visualstudio.com/docs/remote/containers).

‎.devcontainer/devcontainer.json‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
{
2+
"name": "Sim Studio Dev Environment",
3+
"dockerComposeFile": "docker-compose.yml",
4+
"service": "app",
5+
"workspaceFolder": "/workspace",
6+
7+
"customizations": {
8+
"vscode": {
9+
"settings": {
10+
"editor.formatOnSave": true,
11+
"editor.codeActionsOnSave": {
12+
"source.fixAll.eslint": true
13+
},
14+
"editor.defaultFormatter": "esbenp.prettier-vscode",
15+
"[typescript]": {
16+
"editor.defaultFormatter": "esbenp.prettier-vscode"
17+
},
18+
"[typescriptreact]": {
19+
"editor.defaultFormatter": "esbenp.prettier-vscode"
20+
}
21+
},
22+
"extensions": [
23+
"dbaeumer.vscode-eslint",
24+
"esbenp.prettier-vscode",
25+
"bradlc.vscode-tailwindcss",
26+
"ms-vscode.vscode-typescript-next",
27+
"github.copilot",
28+
"github.copilot-chat",
29+
"rvest.vs-code-prettier-eslint",
30+
"mikestead.dotenv",
31+
"dsznajder.es7-react-js-snippets",
32+
"steoates.autoimport"
33+
]
34+
}
35+
},
36+
37+
"forwardPorts": [3000, 5432],
38+
39+
"postCreateCommand": "sh .devcontainer/post-create.sh",
40+
41+
"remoteUser": "node",
42+
43+
"features": {
44+
"ghcr.io/devcontainers/features/node:1": {
45+
"version": "lts"
46+
},
47+
"ghcr.io/devcontainers/features/git:1": {},
48+
"ghcr.io/devcontainers-contrib/features/npm-package:1": {
49+
"package": "typescript",
50+
"version": "latest"
51+
}
52+
}
53+
}

‎.devcontainer/docker-compose.yml‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
version: '3.8'
2+
3+
services:
4+
app:
5+
build:
6+
context: ..
7+
dockerfile: .devcontainer/Dockerfile
8+
volumes:
9+
- ..:/workspace:cached
10+
command: sleep infinity
11+
environment:
12+
- DATABASE_URL=postgresql://postgres:postgres@db:5432/postgres
13+
- NEXT_PUBLIC_SUPABASE_URL=${NEXT_PUBLIC_SUPABASE_URL:-http://db:5432}
14+
- NEXT_PUBLIC_SUPABASE_ANON_KEY=${NEXT_PUBLIC_SUPABASE_ANON_KEY:-your-anon-key}
15+
depends_on:
16+
- db
17+
network_mode: service:db
18+
19+
db:
20+
image: postgres:14
21+
restart: unless-stopped
22+
volumes:
23+
- postgres-data:/var/lib/postgresql/data
24+
environment:
25+
POSTGRES_PASSWORD: postgres
26+
POSTGRES_USER: postgres
27+
POSTGRES_DB: postgres
28+
ports:
29+
- "5432:5432"
30+
- "3000:3000"
31+
32+
volumes:
33+
postgres-data:

‎.devcontainer/post-create.sh‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
#!/bin/bash
2+
3+
set -e
4+
5+
echo "🔧 Setting up Sim Studio development environment..."
6+
7+
# Install dependencies
8+
echo "📦 Installing npm dependencies..."
9+
npm install
10+
11+
# Set up environment variables if .env doesn't exist
12+
if [ ! -f ".env" ]; then
13+
echo "📄 Creating .env file from template..."
14+
cp .env.example .env 2>/dev/null || echo "DATABASE_URL=postgresql://postgres:postgres@db:5432/postgres" > .env
15+
fi
16+
17+
# Run database migrations
18+
echo "🗃️ Running database migrations..."
19+
echo "Waiting for database to be ready..."
20+
until PGPASSWORD=postgres psql -h db -U postgres -c '\q'; do
21+
echo "Database is unavailable - sleeping"
22+
sleep 2
23+
done
24+
25+
echo "Database is ready!"
26+
npx drizzle-kit push
27+
28+
# Add helpful aliases to .bashrc
29+
cat << EOF >> ~/.bashrc
30+
31+
# Sim Studio Development Aliases
32+
alias migrate="npx drizzle-kit push"
33+
alias generate="npx drizzle-kit generate"
34+
alias dev="npm run dev"
35+
alias build="npm run build"
36+
alias start="npm run start"
37+
alias lint="npm run lint"
38+
alias test="npm run test"
39+
EOF
40+
41+
echo "✅ Development environment is ready! Here are some helpful commands:"
42+
echo "📦 dev - Start the development server"
43+
echo "🔨 build - Build the application for production"
44+
echo "🚀 start - Start the production server"
45+
echo "🧹 lint - Run ESLint"
46+
echo "🧪 test - Run tests"
47+
echo "🗃️ migrate - Push schema changes to the database"
48+
echo "📃 generate - Generate new migrations"

‎.dockerignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,4 +8,5 @@ node_modules
88
.env
99
.env.*
1010
npm-debug.log
11-
README.md
11+
README.md
12+
.devcontainer

0 commit comments

Comments
 (0)