Implements docker container healthchecks

Dockerfile

@@ -24,4 +24,7 @@ RUN yarn build
 EXPOSE ${PORT}
 
 # Finally, run start command to serve up the built application
-CMD [ "yarn", "build-and-start"]
+CMD [ "yarn", "build-and-start"]
+
+# Run simple healthchecks every 5 mins, to check the Dashy's everythings great
+HEALTHCHECK --interval=5m --timeout=2s --start-period=30s CMD yarn health-check

README.md

@@ -48,13 +48,13 @@ You will need [Docker](https://docs.docker.com/get-docker/) installed on your sy
 
 ```docker
 docker run -d \
-  -p 8080:80 \
+  -p 4000:80 \
   -v /root/my-local-conf.yml:/app/public/conf.yml \
   --name my-dashboard \
   --restart=always \
   lissy93/dashy:latest
 ```
-After making changes to your configuration file, you will need to run: `docker exec -it [container-id] yarn build` to rebuild. You can also run other commands, such as `yarn validate-config` this way too. Container ID can be found by running `docker ps`. 
+After making changes to your configuration file, you will need to run: `docker exec -it [container-id] yarn build` to rebuild. You can also run other commands, such as `yarn validate-config` this way too. Container ID can be found by running `docker ps`. Healthchecks are pre-configured to monitor the uptime and response times of Dashy, and the status of which can be seen in the container logs, e.g. `docker inspect --format "{{json .State.Health }}" [container-id]`.
 
 #### Deploying from Source 🚀
 
@@ -76,7 +76,9 @@ After making changes to your configuration file, you will need to run: `yarn bui
 
 Dashy is configured with a single [YAML](https://yaml.org/) file, located at `./public/conf.yml` (or `./app/public/conf.yml` for Docker). Any other optional user-customizable assets are also located in the `./public/` directory, e.g. `favicon.ico`, `manifest.json`, `robots.txt` and `web-icons/*`. If you are using Docker, the easiest way to method is to mount a Docker volume (e.g. `-v /root/my-local-conf.yml:/app/public/conf.yml`)
 
-In the production environment, the app needs to be rebuilt in order for changes to take effect. This can be done with `yarn build`, or `docker exec -it [container-id] yarn build` if you are using Docker (where container ID can be found by running `docker ps`). You can check that your config matches Dashy's [schema](https://github.com/Lissy93/dashy/blob/master/src/utils/ConfigSchema.json) before deploying, by running `yarn validate-config.`
+In the production environment, the app needs to be rebuilt in order for changes to take effect. This can be done with `yarn build`, or `docker exec -it [container-id] yarn build` if you are using Docker (where container ID can be found by running `docker ps`).
+
+You can check that your config matches Dashy's [schema](https://github.com/Lissy93/dashy/blob/master/src/utils/ConfigSchema.json) before deploying, by running `yarn validate-config.`
 
 You may find these [example config](https://gist.github.com/Lissy93/000f712a5ce98f212817d20bc16bab10) helpful for getting you started
 
@@ -86,7 +88,11 @@ You may find these [example config](https://gist.github.com/Lissy93/000f712a5ce9
 
 > For full configuration documentation, see: [**Theming**](./docs/theming.md)
 
-<p align="right"><img src="https://i.ibb.co/BVSHV1v/dashy-themes-slideshow.gif" width="400"></p>
+<p align="center">
+  <a href="https://i.ibb.co/BVSHV1v/dashy-themes-slideshow.gif">
+    <img alt="Example Themes" src="/docs/assets/theme-slideshow.gif" width="400">
+  </a>
+</p>
 
 The app comes with a number of built-in themes, but it's also easy to write you're own. All colors, and most other CSS properties make use of CSS variables, which makes customizing the look and feel of Dashy very easy.
 
@@ -131,7 +137,7 @@ Some ideas for PRs include: bug fixes, improve the docs, add new themes, impleme
 Before you submit your pull request, please ensure the following:
 - Must be backwards compatible
 - All lint checks and tests must pass
-- If a new option in the the config file is added, it needs to be added into the schema, and documented in the configuring guide
+- If a new option in the the config file is added, it needs to be added into the [schema](https://github.com/Lissy93/dashy/blob/master/src/utils/ConfigSchema.json), and documented in the [configuring](https://github.com/Lissy93/dashy/blob/master/docs/configuring.md) guide
 - If a new dependency is required, it must be essential, and it must be thoroughly checked out for security or efficiency issues
 - Your pull request will need to be up-to-date with master, and the PR template must be filled in
 

azure-pipelines.yml

@@ -1,21 +0,0 @@
-# Node.js with Vue
-# Build a Node.js project that uses Vue.
-# Add steps that analyze code, save build artifacts, deploy, and more:
-# https://docs.microsoft.com/azure/devops/pipelines/languages/javascript
-
-trigger:
-- master
-
-pool:
-  vmImage: ubuntu-latest
-
-steps:
-- task: NodeTool@0
-  inputs:
-    versionSpec: '10.x'
-  displayName: 'Install Node.js'
-
-- script: |
-    npm install
-    npm run build
-  displayName: 'npm install and build'

bin/healthcheck.js

@@ -0,0 +1,37 @@
+/**
+ * An endpoint for confirming that the application is up and running
+ * Used for better Docker healthcheck results
+ * Note that exiting with code 1 indicates failure, and 0 is success
+ */
+
+const http = require('http');
+
+/* Location of the server to test */
+const port = process.env.PORT || !!process.env.IS_DOCKER ? 80 : 4000;
+const host = process.env.HOST || '0.0.0.0';
+const timeout = 2000;
+
+const requestOptions = { host, port, timeout };
+
+const startTime = new Date();
+
+console.log(`[${startTime}] Running health check...`);
+
+/* Starts quick HTTP server, attempts to send GET to app, then exists with appropriate exit code */
+const healthCheck = http.request(requestOptions, (response) => {
+  const totalTime = (new Date() - startTime) / 1000;
+  const status = response.statusCode;
+  const color = status === 200 ? '\x1b[32m' : '\x1b[31m';
+  const message = `${color}Status: ${status}\nRequest took ${totalTime} seconds\n\x1b[0m---`;
+  console.log(message);
+  if (status == 200) { process.exit(0); }
+  else { process.exit(1); }
+});
+
+/* If the server is not running, then print the error code, and exit with 1 */
+healthCheck.on('error', (err) => {
+  console.error(`\x1b[31mHealthceck Failed, Error: ${'\033[4m'}${err.code}\x1b[0m`);
+  process.exit(1);
+});
+
+healthCheck.end();

deployment-templates/azuredeploy.json

@@ -1,5 +0,0 @@
-{
-  "$schema": "https://schema.management.azure.com/schemas/2019-04-01/deploymentTemplate.json#",
-  "contentVersion": "1.0.0.0",
-  "resources": []
-}

docker-compose.yml

@@ -1,14 +1,25 @@
 ---
-version: "3"
+# Welcome to Dashy! To get started, run `docker compose up`
+version: "3.8"
 services:
   dashy:
+    # To build from source, replace 'image: lissy93/dashy' with 'build: .'
+    # build: .
     image: lissy93/dashy
-    container_name: dashy
-    volumes:
-      - /root/my-config.yml:/app/public/conf.yml
+    container_name: Dashy
+    # Pass in your config file below, by specifying the path on your host machine
+    # volumes:
+      # - /root/my-config.yml:/app/public/conf.yml
     ports:
-      - 8080:80
-    environment:
-     - UID=1000
-     - GID=1000
-    restart: unless-stopped
+      - 4000:80
+    # Specify your user ID and group ID. You can find this by running `id -u` and `id -g`
+    # environment:
+    #  - UID=1000
+    #  - GID=1000
+    restart: unless-stopped
+    healthcheck:
+      test: ['CMD', 'node', '/app/bin/healthcheck']
+      interval: 1m30s
+      timeout: 10s
+      retries: 3
+      start_period: 40s

package.json

@@ -9,7 +9,8 @@
     "lint": "vue-cli-service lint --fix",
     "build-watch": "vue-cli-service build --watch",
     "build-and-start": "npm-run-all --parallel build start",
-    "validate-config": "node src/utils/ConfigValidator"
+    "validate-config": "node src/utils/ConfigValidator",
+    "health-check": "node bin/healthcheck"
   },
   "dependencies": {
     "ajv": "^8.5.0",

server.js

@@ -7,7 +7,10 @@ const os = require('os');
 
 require('./src/utils/ConfigValidator');
 
-const port = process.env.PORT || 80;
+const isDocker = !!process.env.IS_DOCKER;
+
+/* Checks env var for port. If undefined, will use Port 80 for Docker, or 4000 for metal */
+const port = process.env.PORT || isDocker ? 80 : 4000;
 
 /* eslint no-console: 0 */
 const printWelcomeMessage = () => {
@@ -36,7 +39,7 @@ const overComplicatedMessage = (ip, port) => {
   const stars = (count) => new Array(count).fill('*').join('');
   const line = (count) => new Array(count).fill('━').join('');
   const blanks = (count) => new Array(count).fill(' ').join('');
-  if (process.env.IS_DOCKER) {
+  if (isDocker) {
     const containerId = process.env.HOSTNAME || undefined;
     msg = `${chars.BLUE}${stars(91)}${chars.BR}${chars.RESET}`
       + `${chars.CYAN}${chars.BOLD}Welcome to Dashy! 🚀${chars.RESET}${chars.BR}`
@@ -50,7 +53,7 @@ const overComplicatedMessage = (ip, port) => {
     msg = `${chars.GREEN}┏${line(75)}┓${chars.BR}`
       + `┃ ${chars.CYAN}${chars.BOLD}Welcome to Dashy! 🚀${blanks(55)}${chars.GREEN}┃${chars.BR}`
       + `┃ ${chars.CYAN}Your new dashboard is now up and running at ${chars.UNDERLINE}`
-      + `http://${ip}:${port}${chars.RESET}${blanks(20 - ip.length)}${chars.GREEN}┃${chars.BR}`
+      + `http://${ip}:${port}${chars.RESET}${blanks(18 - ip.length)}${chars.GREEN}┃${chars.BR}`
       + `┃ ${chars.CYAN}After updating your config file, run '${chars.UNDERLINE}yarn build`
       + `${chars.RESET}${chars.CYAN}' to rebuild the app${blanks(6)}${chars.GREEN}┃${chars.BR}`
       + `┗${line(75)}┛${chars.BR}${chars.BR}`;
@@ -58,12 +61,6 @@ const overComplicatedMessage = (ip, port) => {
   return msg;
 }
 
-function send404(req, res) {
-  // send your 404 here
-  res.statusCode = 404
-  res.end('nothing here!')
-}
-
 try {
   connect()
     .use(serveStatic(`${__dirname}/dist`))