Add dev:client script to watch files and start the server

.codesandbox/tasks.json

@@ -2,28 +2,27 @@
   // These tasks will run in order when initializing your CodeSandbox project.
   "setupTasks": [
     {
-      "name": "cd examples/browser-api-playground",
-      "command": "cd examples/browser-api-playground"
-    },
-    {
-      "name": "yarn install",
-      "command": "yarn install"
+      "name": "initialize",
+      "command": "cd examples/browser-api-playground && pnpm i && pnpm build"
     }
   ],
-
   // These tasks can be run from CodeSandbox. Running one will open a log in the app.
   "tasks": {
+    "Setup": {
+      "name": "Setup",
+      "command": "cd examples/browser-api-playground && pnpm i && pnpm build"
+    },
     "FE Server": {
       "name": "FE Server",
-      "command": "cd examples/browser-api-playground && yarn && yarn start:client",
+      "command": "cd examples/browser-api-playground && pnpm start:client",
       "runAtStart": true,
       "preview": {
         "port": 3000
       }
     },
     "BE Server": {
       "name": "BE Server",
-      "command": "cd examples/browser-api-playground && yarn && yarn start:server",
+      "command": "cd examples/browser-api-playground && pnpm start:server",
       "runAtStart": true,
       "preview": {
         "port": 8585

examples/browser-api-playground/package.json

@@ -6,33 +6,37 @@
   "main": "src/index.tsx",
   "dependencies": {
     "@ant-design/icons": "^5.2.5",
+    "@gleanwork/web-sdk": "next",
     "antd": "^5.8.2",
     "axios": "^1.4.0",
     "cors": "^2.8.5",
-    "loadash": "^1.0.0",
+    "express": "^5.1.0",
     "loader-utils": "3.2.1",
+    "lodash": "^4.0.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-json-view": "^1.21.3",
     "react-router": "6.9.0",
     "react-router-dom": "6.10.0",
     "react-scripts": "5.0.1",
-    "react-virtualized-auto-sizer": "1.0.9",
-    "@gleanwork/web-sdk": "next"
+    "react-virtualized-auto-sizer": "1.0.9"
   },
   "devDependencies": {
-    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@types/lodash": "^4.14.197",
     "@types/react": "^18.2.20",
     "@types/react-dom": "^18.2.7",
+    "concurrently": "^9.2.0",
+    "nodemon": "^3.1.10",
     "typescript": "4.4.2"
   },
   "scripts": {
-    "start:client": "yarn build && node webserver.js",
+    "start:client": "node webserver.js",
     "start:server": "node server.js",
     "build": "react-scripts build",
     "test": "react-scripts test --env=jsdom",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "watch": "nodemon --watch src --ext js,jsx,ts,tsx,css --exec \"pnpm run build\"",
+    "dev:client": "concurrently \"pnpm run watch\" \"pnpm react-scripts start\""
   },
   "browserslist": [
     ">0.2%",