add docker workflow and update readme

.vscode/extensions.json

@@ -1,7 +1,6 @@
 {
     "recommendations": [
         "ms-python.python",
-        "ms-vscode.live-server",
         "firefox-devtools.vscode-firefox-debug",
         "ms-python.black-formatter",
         "matangover.mypy",

.vscode/launch.json

@@ -21,7 +21,7 @@
             "type": "chrome",
             "name": "Launch Chrome Debugger",
             "request": "launch",
-            "url": "http://127.0.0.1:3000/webgui/index.html"
+            "url": "http://127.0.0.1:5173/webgui/index.html"
         }
     ]
 }

Dockerfile

@@ -0,0 +1,22 @@
+FROM python:3.10-alpine
+
+ARG UNAME=archsim
+ARG UID=1000
+ARG GID=1000
+ARG SHELL=sh
+
+RUN apk --update add nodejs-lts npm bash
+
+RUN addgroup -g ${GID} ${UNAME}
+RUN adduser -D -u ${UID} -G ${UNAME} -s /bin/${SHELL} ${UNAME}
+
+USER $UNAME
+
+WORKDIR /usr/src/app
+COPY --chown=${UNAME}:${UNAME} requirements-dev.txt ./
+COPY --chown=${UNAME}:${UNAME} package.json ./
+COPY --chown=${UNAME}:${UNAME} package-lock.json ./
+RUN pip install -r requirements-dev.txt
+RUN npm install
+
+EXPOSE 4173

README.md

@@ -23,10 +23,24 @@ The original implementation was developed as part of the team project course in
     - Support for self modifying code
 
 ## Setup dev environment
+
+### docker development environment
+
+You can use docker for development. The script `docker-run.sh` builds a docker image containing all dependencies, builds the python and js packages and starts a preview server.
+
+```
+git clone https://github.com/ekut-es/architecture-simulator.git
+cd architecture-simulator
+./docker-run.sh
+```
+
+### local development environment
 - Linux / WSL / macOS
 - VSCode as editor
 - [install pyenv (tutorial)](https://k0nze.dev/posts/install-pyenv-venv-vscode/)
 - install Python 3.10 via pyenv
+- install nvm
+- install nodejs/npm
 - set Python versions to 3.10.8
 - initialize and activate venv
 - install development requirements
@@ -35,6 +49,7 @@ The original implementation was developed as part of the team project course in
 
 ```bash
 pyenv install 3.10.8
+nvm install v20.10.0
 git clone https://github.com/ekut-es/architecture-simulator.git
 cd architecture-simulator
 pyenv local 3.10.8
@@ -45,20 +60,23 @@ pre-commit install
 pip install -e .
 ```
 
-## Build package
+#### Build packages
+
+Use the script `build.sh` to build the packages.
 
 ```
-python -m build
+./build.sh build
 ```
 
-## GUI dev environment
+#### GUI dev environment
+
+Use the script `build.sh` to build the python package and start a development server.
+
+```
+./build.sh dev
+```
 
-- Install the recommended VSCode extensions (you should be prompted on start).
-- Build the Python package (see above how). Ensure there is a file `dist/*.whl` present.`
-- Then use the VSCode live preview feature to serve the needed files locally.
-  - To do so just open `webgui/index.html` in the editor and click the 'show preview' button.
-  - Alternatively start a development webserver in the project base directory: `python -m http.server`.
-- Additionally you can use the *Debugger for Firefox* Extension and start a session with the given launch configuration.
+Additionally you can use the *Debugger for Firefox* Extension and start a session with the given vscode launch configuration.
 
 ## Branch Naming Convention
 

build.sh

@@ -1,8 +1,13 @@
 #!/bin/bash
 
+# exit on error
 set -e
 
+# build python package
 python -m build
+# ensure public folder is present and copy python package
 mkdir -p webgui/public/
 cp dist/*.whl webgui/public/
+# ensure js packages are available and run npm scripts
+npm install
 npm run $1

docker-run.sh

@@ -0,0 +1,6 @@
+#!/usr/bin/bash
+
+set -e
+
+docker build --build-arg UNAME=$(id -u -n) --build-arg UID=$(id -u) --build-arg GID=$(id -g) -t archsim .
+docker run -it --rm --mount type=bind,source="$(pwd)",target=/usr/src/app/ -p 4173:4173 --user $(id -u):$(id -g) archsim ./build.sh preview-docker

package.json

@@ -6,7 +6,8 @@
   "scripts": {
     "dev": "vite webgui",
     "build": "vite build webgui",
-    "preview": "vite preview webgui"
+    "preview": "vite preview webgui",
+    "preview-docker": "vite preview webgui --host 0.0.0.0"
   },
   "devDependencies": {
     "sass": "^1.69.5",

requirements-dev.txt

@@ -15,7 +15,7 @@ platformdirs==2.6.2
 pre-commit==3.0.3
 pyflakes==3.0.1
 pyproject_hooks==1.0.0
-PyYAML==6.0
+PyYAML==6.0.1
 tomli==2.0.1
 virtualenv==20.17.1
 pytest==7.3.1