Update Codespaces configuration

Author: sis0k0

.devcontainer/README.md

@@ -8,10 +8,7 @@ This project is configured to work seamlessly in GitHub Codespaces or with VS Co
 2. The devcontainer will automatically:
    - Spin up a MongoDB instance (Atlas Local)
    - Install all dependencies
-   - Seed sample data each time the Codespace starts
-   - Start the Express API on port 5050
-   - Start the React app on port 5173
-   - Open the React app in the built-in Codespaces browser preview
+   - Seed sample data
 
 ## Using with VS Code Dev Containers
 
@@ -32,21 +29,20 @@ Once the devcontainer is running:
 
 ## Quick Start in Codespaces
 
-Once the devcontainer is fully loaded, the app should already be running.
-
-If you want to check logs:
+Once the devcontainer is fully loaded (wait for "Poststart" to complete):
 
 ```bash
-tail -f /tmp/mern-server.log
-tail -f /tmp/mern-client.log
-```
-
-If you need to restart startup tasks manually:
+# Terminal 1: Start the Express server
+cd mern/server
+npm start
 
-```bash
-bash .devcontainer/startup.sh
+# Terminal 2: Start the React dev server
+cd mern/client
+npm run dev
 ```
 
+Then open http://localhost:5173 in your browser.
+
 ## Database Credentials
 
 - **Host**: `mongodb` (inside container) or `localhost:27017` (from host)
@@ -75,9 +71,8 @@ The devcontainer includes these extensions:
 
 ### MongoDB connection issues
 ```bash
-# Check if mongodb is running
-cd mern/server
-node --input-type=module -e "import { MongoClient } from 'mongodb'; const c = new MongoClient(process.env.ATLAS_URI || 'mongodb://admin:mongodb@mongodb:27017/employees'); await c.connect(); console.log(await c.db('admin').command({ ping: 1 })); await c.close();"
+# Check if MongoDB is running
+mongosh -u admin -p mongodb --eval "db.adminCommand('ping')"
 ```
 
 ### Port conflicts

.devcontainer/devcontainer.json

@@ -3,12 +3,6 @@
   "dockerComposeFile": "docker-compose.yml",
   "service": "app",
   "workspaceFolder": "/workspaces/${localWorkspaceFolderBasename}",
-  
-  "features": {
-    "ghcr.io/devcontainers/features/node:1": {
-      "version": "22"
-    }
-  },
 
   "customizations": {
     "vscode": {
@@ -43,7 +37,14 @@
   "postCreateCommand": "cd mern/server && npm ci && cd ../client && npm ci",
   "postStartCommand": "bash .devcontainer/startup.sh",
 
+  // this will open 3 bash sessions, each one running the specified command
+  "postAttachCommand": {
+    "server": "cd mern/server && npm start",
+    "client": "cd mern/client && npm run dev -- --host 0.0.0.0",
+    "portSetup": "sleep 5 && .devcontainer/portSetup.sh"
+  },
+
   "remoteEnv": {
-    "ATLAS_URI": "mongodb://admin:mongodb@mongodb:27017/employees"
+    "ATLAS_URI": "mongodb://admin:mongodb@localhost:27017/employees"
   }
 }

.devcontainer/docker-compose.yml

@@ -7,12 +7,14 @@ services:
       - ../..:/workspaces:cached
     command: sleep infinity
     network_mode: service:mongodb
+    depends_on:
+      - mongodb
     environment:
-      - ATLAS_URI=mongodb://admin:mongodb@mongodb:27017/employees
+      - ATLAS_URI=mongodb://admin:mongodb@localhost:27017/employees
       - PORT=5050
 
   mongodb:
-    image: mongodb/mongodb-atlas-local:latest
+    image: mongodb/mongodb-atlas-local:8.0.3-20250506T093411Z
     restart: unless-stopped
     ports:
       - 27017:27017
@@ -23,6 +25,7 @@ services:
     volumes:
       - mongodb-data:/data/db
       - mongodb-config:/data/configdb
+      - ../..:/workspaces:cached
     healthcheck:
       test: mongosh --eval "db.adminCommand('ping')"
       interval: 10s

.devcontainer/portSetup.sh

@@ -0,0 +1,19 @@
+if [ -z "$CODESPACE_NAME" ]; then
+    echo "Not running in a codespace, exiting."
+    exit
+fi
+
+echo "Installing GH"
+
+(type -p wget >/dev/null || (sudo apt update && sudo apt install wget -y)) \
+&& sudo mkdir -p -m 755 /etc/apt/keyrings \
+&& out=$(mktemp) && wget -nv -O$out https://cli.github.com/packages/githubcli-archive-keyring.gpg \
+&& cat $out | sudo tee /etc/apt/keyrings/githubcli-archive-keyring.gpg > /dev/null \
+&& sudo chmod go+r /etc/apt/keyrings/githubcli-archive-keyring.gpg \
+&& sudo mkdir -p -m 755 /etc/apt/sources.list.d \
+&& echo "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/githubcli-archive-keyring.gpg] https://cli.github.com/packages stable main" | sudo tee /etc/apt/sources.list.d/github-cli.list > /dev/null \
+&& sudo apt update \
+&& sudo apt install gh -y
+
+echo "Exposing ports"
+gh codespace ports visibility 5050:public 5173:public 27017:public -c $CODESPACE_NAME

.devcontainer/startup.sh

@@ -5,7 +5,7 @@ ROOT_DIR="/workspaces/${localWorkspaceFolderBasename:-$(basename "$PWD")}"
 SERVER_DIR="$ROOT_DIR/mern/server"
 CLIENT_DIR="$ROOT_DIR/mern/client"
 CONFIG_FILE="$SERVER_DIR/config.env"
-ATLAS_URI_VALUE="${ATLAS_URI:-mongodb://admin:mongodb@mongodb:27017/employees}"
+ATLAS_URI_VALUE="${ATLAS_URI:-mongodb://admin:mongodb@localhost:27017/employees}"
 PORT_VALUE="${PORT:-5050}"
 
 ensure_config() {

.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+    "mdb.presetConnections": [
+        {
+            "name": "Local Database",
+            "connectionString": "mongodb://localhost:27017"
+        }
+    ],
+    "mdb.showOverviewPageAfterInstall": false
+}