docker: add compose file for docker deployment (#194)

The latest tag points to the last release, while `main` can be used for the latest development commits

Author: maurerle

.gitignore

@@ -15,7 +15,6 @@ Thumbs.db
 # Project files
 /node_modules
 /build
-/config.json
 *.zip
 /dev-dist
 /public/config.json

DEVELOPMENT.md

@@ -1,12 +1,60 @@
 # Meshviewer Development
 
+## Building
+
+### Build yourself
+
+- Clone this repository
+- Run `npm install`
+- Place your config file in `public/config.json`.
+  You can copy the example config for testing/development: `cp config.example.json public/config.json`.
+- Run `npm run build`
+- A production build can then be found in [`/build`](./build)
+
+Hint: You can start a development server with `npm run dev`
+
+### Build and run using Docker
+
+You have to copy `config.example.json` to `public/config.json`.
+
+Static local instance:
+
+```bash
+docker run -it --rm -u $(id -u):$(id -g) -v "$PWD":/app -w /app node npm install
+docker run -it --rm -u $(id -u):$(id -g) -v "$PWD":/app -w /app node npm run build
+docker run -it --rm -v "$PWD/build":/usr/share/nginx/html -p 8080:80 --name nginx nginx
+```
+
+The map is reachable at [localhost:8080](http://localhost:8080).
+Start a development environment with hot-reload:
+
+```bash
+docker run -it --rm --name meshviewer-dev \
+  -u $(id -u):$(id -g) \
+  -v "$PWD":/app -w /app \
+  -e NODE_ENV=development \
+  -p 5173:5173 \
+  node npm run dev -- --host 0.0.0.0
+```
+
+## Workflow
+
+To submit a feature, you should fork this repository and commit your changes on a branch of your fork.
+Then you can open a PR against this repository.
+
+To align your changes with the linter of this project run
+
+`npm run lint:fix`
+
+## Conventions
+
 Following you can find some wording and used functionality for this project.
 
 Normally you should use meaningful and self explaining names for variables and functions
 but sometimes using common conventions might help as well, for example `i` / `j` for index, `e` for exceptions or events etc.
 but also names based on elements like `p`, `a`, `div`..
 
-## Functions
+### Functions
 
 `_.t("[translation.selector]")`
 : Lookup translation based on dotted path from `public/locale/[language].json`

README.md

@@ -14,40 +14,20 @@ It is recommended to use the latest release:
 - Let your webserver serve this build
 - Add a config.json to the webdir (based on config.example.json)
 
-### Build yourself
+## Docker Deployment
 
-- Clone this repository
-- Run `npm install`
-- Place your config file in `public/config.json`.
-  You can copy the example config for testing/development: `cp config.example.json public/config.json`.
-- Run `npm run build`
-- A production build can then be found in [`/build`](./build)
+Using the GitHub Container Registry (GHCR) you can get the latest dockerized release with `docker compose`.
 
-Hint: You can start a development server with `npm run dev`
+Put your config.json into the public folder and run the following to deploy a meshviewer:
 
-### Build and run using Docker
-
-Static local test instance:
-
-```bash
-docker run -it --rm -u $(id -u):$(id -g) -v "$PWD":/app -w /app node npm install
-docker run -it --rm -u $(id -u):$(id -g) -v "$PWD":/app -w /app node npm run build
-docker run -it --rm -v "$PWD/build":/usr/share/nginx/html -p 8080:80 --name nginx nginx
+```
+docker compose pull
+docker compose up -d
 ```
 
 The map is reachable at [localhost:8080](http://localhost:8080).
-You have to copy `config.example.json` to `public/config.json`:
 
-Start a development environment:
-
-```bash
-docker run -it --rm --name meshviewer-dev \
-  -u $(id -u):$(id -g) \
-  -v "$PWD":/app -w /app \
-  -e NODE_ENV=development \
-  -p 5173:5173 \
-  node npm run dev -- --host 0.0.0.0
-```
+Hint: Instead of the latest release `ghcr.io/freifunk/meshviewer:latest` one can also use version tags for a specific version or `main` for the latest unreleased commits.
 
 ## Configuration
 
@@ -59,9 +39,10 @@ Both the deprecation and the EOL warning can be turned off with `"deprecation_en
 
 You can insert custom HTML into the deprecation and eol warning via `"deprecation_text":""` and `"eol_text":""` respectively.
 
-## Development
+## Development & Building
 
 To contribute to the project by developing new features, have a look at our [development documentation](DEVELOPMENT.md).
+This also includes instructions on building this project.
 
 ## History
 

compose.yml

@@ -0,0 +1,7 @@
+services:
+  meshviewer:
+    image: ghcr.io/freifunk/meshviewer:latest
+    volumes:
+      - ./public/config.json:/usr/share/nginx/html/config.json
+    ports:
+      - "8080:80"