Docker for JavaScript Developers

Jörn Zaefferer
bassistance.de / @bassistance
jzaefferer.github.io/slides-docker-for-js-devs/

'bout me

  • 11 years writing JavaScript
  • jQuery, jQuery UI, QUnit
  • Commercial products like SoundCloud
  • Head of development sloppy.io

'bout you

Have you worked with Docker?

Why Docker?

  • Works on Windows, OSX and Linux
  • Sandbox for binaries like node/npm, databases
  • Better CI: Small, encapsulated applications
  • Deploy to cloud, with less vendor lock-in

Let's look at code!

All on GitHub:
  • github.com/jzaefferer/docker-for-js-devs
    web app based on create-react-app
  • github.com/jzaefferer/docker-for-nodejs-devs
    rest backend, Node.js and express, with CouchDB

package.json

Docker locally

Dockerfile

.dockerignore

docker build

docker run

docker-compose.yml

http://localhost:3000/

Dockerfile, Node.js

docker-compose.yml, Node.js

http://localhost:7777/v1/pets

Building for production

Dockerfile, Node.js

Dockerfile-prod, Node.js

Building for Node.js

Dockerfile-prod, webpack/nginx, stage 1/2

Dockerfile-prod, webpack/nginx, stage 2/2

Building for webpack/nginx, stage 1

Building for webpack/nginx, stage 2

docker-push in progress

docker-push finished

Deploying containers

Self-host Docker, with any root-access hoster

  • AWS
  • DigitalOcean
  • Azure
  • ...any other VM hoster...

Self-host Docker-orchestration platform

  • docker-compose
  • Docker Swarm
  • Kubernetes
  • DC/OS
  • Rancher
  • Dokku

Use hosted Docker-orchestration platform

  • usually Kubernetes...
  • Google Container Engine
  • Amazon Elastic Container Service
  • Azure Container Service

Use hosted Docker

  • hyper.sh
  • zeit.co/now
  • sloppy.io

sloppy.yml, webpack/nginx

sloppy change sloppy.yml

webpack/nginx project on sloppy.io

sloppy.yml, Node.js

sloppy change sloppy.yml, Node.js

node.js project on sloppy.io

Why sloppy.io?

  • Built for developers
  • Custom domains with SSL certificates
  • 14 day free trial!

That's all

  • Docker locally: Dockerfile + docker-compose.yml
  • Building for production: Dockerfile-prod + Makefile
  • Deploying: sloppy.yml + sloppy.io CLI

Future topics

  • Runtime configuration for static web apps
  • Linter and unit test setup
  • Updating npm/yarn lock files inside container
  • CI pipeline
  • Alpine issues