Dockerize VueJS Spring boot project Scaffold


Introduction

This a follow-up of VueJS Spring boot project Scaffold post. In previous post I talked about a combined build system to build a web application based on VueJS and Spring. This is next in series to show how to containerize the build and release it to docker hub.

Dockerfile

The build and deployment is governed by Java so it is obvious to use the Java base image for the container.

FROM openjdk:11

RUN apt-get update && apt-get install -y -q --no-install-recommends \
        maven \
    && rm -rf /var/lib/apt/lists/*

COPY mvnw /usr/src/project/
COPY mvnw.cmd /usr/src/project/
COPY pom.xml /usr/src/project/
COPY .mvn/ /usr/src/project/.mvn
COPY api/ /usr/src/project/api
COPY webapp/ /usr/src/project/webapp

RUN cd /usr/src/project/api/src/main/resources && mkdir public

WORKDIR /usr/src/project

RUN mvn clean install

CMD ["java", "-jar",  "api/target/api-0.0.1-SNAPSHOT.jar"]

The file is supposed to be kept outside the whole project so the dockerfile can copy everything in one folder with one COPY step. But files can be copied individually as well without changing the project structure much. Plus I get to do file copy, folder copy and directory creation as an example as well.

Local Deployment

To deploy it locally just build the docker image from the dockerfile’s root location and run the image.

docker build . -t tagname

docker run -d -p hostport:appport --name run-name tagname

Docker Hub

Create a docker hub repository

docker build . -t new-repo:tagname
docker push new-repo:tagname
docker pull new-repo:tagname
docker run -d -p hostport:appport --name run-name new-repo:tagname