Skip to content

Commit 43f20bf

Browse files
tobias-tenglertobias-tengler
authored
Add devcontainer to website-next (#9799)
1 parent 1063f8b commit 43f20bf

6 files changed

Lines changed: 1181 additions & 410 deletions

File tree

‎website-next/.devcontainer/Dockerfile‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
FROM mcr.microsoft.com/devcontainers/javascript-node:22-bookworm
2+
3+
# Suppress Corepack's "about to download" prompt during yarn activation
4+
ENV COREPACK_ENABLE_DOWNLOAD_PROMPT=0
5+
6+
# Enable Corepack so the Yarn version from package.json's packageManager field is used
7+
RUN corepack enable
8+
9+
# Install bubblewrap (sandbox dependency for Codex CLI)
10+
RUN apt-get update && apt-get install -y bubblewrap \
11+
&& apt-get clean && rm -rf /var/lib/apt/lists/*
12+
13+
# Install Playwright's OS dependencies for Chromium (version-independent apt packages).
14+
# The browser binary itself is downloaded in postCreateCommand so it matches the
15+
# Playwright version resolved from yarn.lock.
16+
RUN npx -y playwright install-deps chromium \
17+
&& apt-get clean && rm -rf /var/lib/apt/lists/*
18+
19+
# Install GitHub Copilot CLI and Codex CLI
20+
RUN npm install -g @github/copilot @openai/codex
21+
22+
# Install Claude Code (as node user so it installs to their home directory)
23+
RUN su - node -c "curl -fsSL https://claude.ai/install.sh | bash"
24+
25+
# Install zsh plugins for better shell experience
26+
RUN git clone --depth=1 https://github.com/zsh-users/zsh-autosuggestions /home/node/.oh-my-zsh/custom/plugins/zsh-autosuggestions \
27+
&& git clone --depth=1 https://github.com/zsh-users/zsh-syntax-highlighting /home/node/.oh-my-zsh/custom/plugins/zsh-syntax-highlighting \
28+
&& chown -R node:node /home/node/.oh-my-zsh/custom/plugins/zsh-autosuggestions \
29+
&& chown -R node:node /home/node/.oh-my-zsh/custom/plugins/zsh-syntax-highlighting
30+
31+
# Configure Oh My Zsh: agnoster theme, useful plugins, claude-d alias
32+
RUN sed -i 's/ZSH_THEME=".*"/ZSH_THEME="agnoster"/' /home/node/.zshrc \
33+
&& sed -i 's/plugins=(.*)/plugins=(git gh node npm docker zsh-autosuggestions zsh-syntax-highlighting)/' /home/node/.zshrc \
34+
&& echo 'export PATH="$HOME/.local/bin:$PATH"' >> /home/node/.zshrc \
35+
&& echo 'alias claude-d="claude --dangerously-skip-permissions"' >> /home/node/.zshrc \
36+
&& echo 'alias codex-a="codex --full-auto"' >> /home/node/.zshrc \
37+
&& echo 'alias codex-d="codex --dangerously-bypass-approvals-and-sandbox"' >> /home/node/.zshrc \
38+
&& echo 'DEFAULT_USER=$USER' >> /home/node/.zshrc
39+
40+
# Set zsh as default shell
41+
RUN chsh -s /bin/zsh node

‎website-next/.devcontainer/devcontainer-lock.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"features": {
3+
"ghcr.io/devcontainers/features/github-cli:1": {
4+
"version": "1.1.0",
5+
"resolved": "ghcr.io/devcontainers/features/github-cli@sha256:d22f50b70ed75339b4eed1ba9ecde3a1791f90e88d37936517e3bace0bbad671",
6+
"integrity": "sha256:d22f50b70ed75339b4eed1ba9ecde3a1791f90e88d37936517e3bace0bbad671"
7+
}
8+
}
9+
}

‎website-next/.devcontainer/devcontainer.json‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
{
2+
"name": "website-next",
3+
"build": {
4+
"dockerfile": "Dockerfile",
5+
"context": "."
6+
},
7+
"runArgs": ["--shm-size=512m"],
8+
"features": {
9+
"ghcr.io/devcontainers/features/github-cli:1": {}
10+
},
11+
"forwardPorts": [3000, 6006],
12+
"portsAttributes": {
13+
"3000": {
14+
"label": "Next.js dev server",
15+
"onAutoForward": "notify"
16+
},
17+
"6006": {
18+
"label": "Storybook",
19+
"onAutoForward": "silent"
20+
}
21+
},
22+
"postCreateCommand": "yarn install --immutable && yarn playwright install chromium",
23+
"containerEnv": {
24+
"NEXT_TELEMETRY_DISABLED": "1"
25+
},
26+
"customizations": {
27+
"vscode": {
28+
"extensions": [
29+
"esbenp.prettier-vscode",
30+
"dbaeumer.vscode-eslint",
31+
"bradlc.vscode-tailwindcss",
32+
"unifiedjs.vscode-mdx",
33+
"jock.svg",
34+
"ms-playwright.playwright",
35+
"anthropic.claude-code",
36+
"github.copilot",
37+
"github.copilot-chat",
38+
"openai.chatgpt"
39+
],
40+
"settings": {
41+
"terminal.integrated.defaultProfile.linux": "zsh",
42+
"editor.formatOnSave": true,
43+
"editor.defaultFormatter": "esbenp.prettier-vscode",
44+
"editor.codeActionsOnSave": {
45+
"source.organizeImports": "explicit"
46+
}
47+
}
48+
}
49+
}
50+
}

‎website-next/eslint.config.mjs‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
// For more info, see https://github.com/storybookjs/eslint-plugin-storybook#configuration-flat-config-format
2+
import storybook from "eslint-plugin-storybook";
3+
14
import { defineConfig, globalIgnores } from "eslint/config";
25
import nextVitals from "eslint-config-next/core-web-vitals";
36
import nextTs from "eslint-config-next/typescript";
@@ -14,6 +17,7 @@ const eslintConfig = defineConfig([
1417
"storybook-static/**",
1518
"next-env.d.ts",
1619
]),
20+
...storybook.configs["flat/recommended"]
1721
]);
1822

1923
export default eslintConfig;

‎website-next/package.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,17 +29,18 @@
2929
"shiki": "^4.0.2"
3030
},
3131
"devDependencies": {
32-
"@storybook/nextjs-vite": "^9",
32+
"@storybook/nextjs-vite": "^10.4.1",
3333
"@tailwindcss/postcss": "^4",
3434
"@tailwindcss/vite": "^4.3.0",
3535
"@types/node": "^20",
3636
"@types/react": "^19",
3737
"@types/react-dom": "^19",
3838
"eslint": "^9",
3939
"eslint-config-next": "16.2.6",
40+
"eslint-plugin-storybook": "10.4.1",
4041
"playwright": "^1.60.0",
4142
"rehype-mermaid": "^3.0.0",
42-
"storybook": "^9",
43+
"storybook": "^10.4.1",
4344
"tailwindcss": "^4",
4445
"typescript": "^5",
4546
"vite": "^6"

0 commit comments

Comments
 (0)