Upgrade to Pro — share decks privately, control downloads, hide ads and more …

It works on my Docker machine

It works on my Docker machine

Introduction to Docker for front-end developers demonstrating a multi-stage build for Angular testing, development server, production build and deployment with Nginx static file web server.

Presented at:
- AarhusJS Meetup, April 2019

Recording of the talk at AarhusJS April Meetup 2019:
https://youtu.be/-cO6zphDsWU

Git repository:
https://github.com/LayZeeDK/docker-angular

Lars Gyrup Brink Nielsen

April 23, 2019
Tweet

More Decks by Lars Gyrup Brink Nielsen

Other Decks in Programming

Transcript

  1. OCI containers OCI (Open Container Initiative) has a standard format

    for container images and container runtimes. A container is like a light-weight VM that is fast to start up, suspend, resume and shut down. It runs on a thin layer on a host operating system and works cross-platform given that a container runtime like Docker is installed. You can run Linux containers on Windows and vice-versa. It’s a complete environment in a box, so everything works the same on every host machine, whether it’s local, on-premise, or cloud. It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  2. Docker Docker is a suite of tools for creating, managing

    and deploying containers. Docker is an open source software suite mainly developed by Docker, Inc. An alternative container suite is Red Hat’s Podman, Buildah and related tools. It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  3. .dockerignore file Ignored in the build context passed by docker

    build. It determines what build host files are ignored by COPY and ADD commands in the Dockerfile unless explicitly mentioned. .git/ .gitignore **/tmp *Dockerfile docker-compose.yml *.md !README.md node_modules/ dist/ It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  4. Dockerfile A Dockerfile is a recipe for building a container

    image. It’s a list of instructions. A subset of the instructions create a different intermediate image layer per instruction. It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  5. Dockerfile instructions ADD ARG CMD COPY ENTRYPOINT ENV EXPOSE FROM

    HEALTHCHECK LABEL ONBUILD RUN SHELL STOPSIGNAL USER VOLUME WORKDIR # single line or inline comment It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  6. Container image layers Only the RUN, COPY, and ADD instructions

    create permanent image layers which increase the build size. Layers are cached on the host machine between builds and runs. It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  7. FROM instruction FROM <base-image> [AS <stage-name>] FROM node FROM node

    AS build FROM <base-image>:<tag> [AS <stage_name>] FROM node:lts-alpine FROM <base-image>@<digest> [AS <stage-name] FROM node@sha256:313c(…)838d It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  8. ENV instruction ENV <key> <value> ENV NODE_ENV=production ENV <key>=<value> …

    ENV NODE_ENV=development PORT=3000 It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  9. COPY instruction Copy files from host machine to container filesystem.

    src uses paths relative to the build host context (for example . in docker build --tag foo .). dest is an absolute path in the container filesystem or relative to the WORKDIR instruction. COPY [--chown=<user>[:<group>]] <src>… <dest> --chown is only supported by Linux containers COPY --chown=myuser:mygroup package*.json /opt/myapp COPY ["<src> ",… "<dest>"] For paths containing whitespace Wildcard support COPY hom* /mydir # add all files starting with "hom" COPY hom?.txt /mydir # ? is replaced with any single character such as "home.txt“ COPY --from=stage-name-or-image-name <src>… <dest> COPY --from=build dist README.md /opt/app It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  10. RUN instruction Execute any command in a new layer. Shell

    format Command is run by sh on Linux or cmd on Windows. RUN <command> RUN echo 'Hello, World!' Exec format No shell processing of for example environment variables, unless executable is a shell. RUN ["/path/to/executable", "--foo bar", "--baz qux"] RUN ["/bin/bash", "-c", "echo hello"] It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  11. WORKDIR instruction Set the working directory for ADD, CMD, COPY,

    ENTRYPOINT, and RUN instructions. WORKDIR /path/in/container WORKDIR /tmp/app COPY . . RUN npm build It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  12. EXPOSE instruction Describe a port that can be mapped from

    the container to the host machine. EXPOSE <port> [<port>/<protocol>…] tcp protocol is the default EXPOSE 80 443 docker run -P # maps port on the host to match the container EXPOSE 80/tcp EXPOSE 80/udp docker run -p 80:80/tcp -p 80:80/udp # maps both TCP and UDP It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  13. ENTRYPOINT instruction The command or partial command that is activated

    when the container is run. ENTRYPOINT ["/path/to/executable", "--foo bar", "--baz qux"] CMD ["--default", "--parameters"] docker run --name container-name image-name --forwarded --params It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  14. docker build command Build an image from a Dockerfile. docker

    build [options] <context_path> docker build --tag my-echo:next . docker build --tag docker-angular --target test . It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  15. docker run command Start a container from an image. docker

    run [options] <image> [command] [arg…] docker run --name=hello-aarhusjs my-echo 'Hello, AarhusJS!' It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  16. echo example FROM alpine:latest ENTRYPOINT ["/bin/sh", "-c ", "echo"] CMD

    ["'Hello, World!'"] docker build --tag my-echo . docker run --interactive --tty --rm \ --name=hello-aarhusjs my-echo 'Hello, AarhusJS!' docker stop hello-aarhusjs It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  17. Multi-stage Angular production build FROM node:10-alpine AS build ENV NODE_ENV

    production WORKDIR /tmp/app COPY . . RUN yarn install RUN yarn build --prod FROM nginx:stable-alpine COPY --from=build /tmp/app/dist/docker-angular /usr/share/nginx/html COPY nginx.conf /etc/nginx/conf.d/default.conf EXPOSE 443 It works on my Docker machine Lars Gyrup Brink Nielsen AarhusJS
  18. Get in touch It works on my Docker machine Lars

    Gyrup Brink Nielsen AarhusJS https://bit.do/docker-angular-slides https://medium.com/@LayZeeDK https://bit.do/docker-angular https://github.com/LayZeeDK https://twitter.com/LayZeeDK https://www.linkedin.com/in/larsgbn/ [email protected]