diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
new file mode 100644
index 0000000..04c1874
--- /dev/null
+++ b/.devcontainer/devcontainer.json
@@ -0,0 +1,14 @@
+{
+  "name": "LanggraphjsGenUIExamples",
+  "image": "mcr.microsoft.com/devcontainers/javascript-node:1-22-bookworm",
+  "mounts": [
+    "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume",
+    "source=${localWorkspaceFolderBasename}-pnpm-store,target=${containerWorkspaceFolder}/.pnpm-store,type=volume"
+  ],
+  "postCreateCommand": "sh .devcontainer/hooks/postCreateCommand.sh",
+  "customizations": {
+    "vscode": {
+      "extensions": ["esbenp.prettier-vscode"]
+    }
+  }
+}
diff --git a/.devcontainer/hooks/postCreateCommand.sh b/.devcontainer/hooks/postCreateCommand.sh
new file mode 100644
index 0000000..3ec19b7
--- /dev/null
+++ b/.devcontainer/hooks/postCreateCommand.sh
@@ -0,0 +1,16 @@
+#!/bin/bash
+sudo chown -R node:node node_modules
+sudo chown -R node:node .pnpm-store
+
+FILE=".env"
+
+if [ ! -f "$FILE" ]; then
+    echo "$FILE doesn't exist. Creating..."
+    cp .env.example .env
+    echo "$FILE file created."
+else
+    echo "$FILE already created."
+fi
+
+sudo corepack enable
+pnpm i
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
index 494dcfd..6028ea0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -11,6 +11,7 @@ node_modules
 dist
 dist-ssr
 *.local
+.pnpm-store
 
 # Editor directories and files
 .vscode/*
diff --git a/README.md b/README.md
index defcbf4..635bae1 100644
--- a/README.md
+++ b/README.md
@@ -84,6 +84,24 @@ The following are some prompts, and corresponding graph IDs you can use to test
 - Graph ID: `email_agent`:
   - `Write me an email to <insert email here> about <insert email description here>` - Will generate an email for you, addressed to the email address you specified. Used to demonstrate how you can trigger the built in Human in the Loop (HITL) UI in the Agent Chat UI. This agent will throw an `interrupt`, with the standard [`HumanInterrupt`](https://github.com/langchain-ai/langgraph/blob/84c956bc8c3b2643819677bea962425e02e15ba4/libs/prebuilt/langgraph/prebuilt/interrupt.py#L42) schema, which the Agent Chat UI is able to automatically detect, and render a HITL UI component to manage the interrupt.
 
+## Devcontainer setup
+
+[![Open in Dev Containers](https://img.shields.io/static/v1?label=Dev%20Containers&message=Open&color=blue)](https://vscode.dev/redirect?url=vscode://ms-vscode-remote.remote-containers/cloneInVolume?url=https://github.com/langchain-ai/langgraphjs-gen-ui-examples)
+
+Click the badge above if you wanna, you can run the project in a devcontainer.
+
+Otherwise, clone the repo and open the directory with VSCode and run it in a devcontainer.
+
+During the startup process a `.env` file will be created, starting from `.env.example`. All dependecies will be installed automatically, so no need for a `pnpm i `.
+
+You need to set you all the required API keys in `.env` file.
+
+Start the LangGraph server:
+
+```bash
+pnpm agent --host 127.0.0.1
+```
+
 # Agents
 
 Key