Daniel da Rocha

Posted on Jan 3, 2019

Docker from development to deployment

#help #docker #deployment

Hi!

I've been trying to solve this for days now so I might finally just ask for help:

In my development docker-compose configuration, I have 4 containers:

front: Vue app started using npm run serve on port 80
back: Koa2 server for my API (Postgraphile for GraphQL)
database: Postgres container
front-balancer: Nginx server, sends / to front, /graphql to back

It works fine locally (although I probably should skip Nginx for development...)

Now I want to deploy it, and that's where my headaches began. My initial understanding is that I should not use npm run serve for front on production, but instead build my Vue app and serve the static files with Nginx.
But does that mean I do not need my front container in production and can just mount the built files to my Nginx container?

Or how would you approach this?

Then comes the actual deployment. I am still at a loss as to where (DO, Heroku, AWS??) and how to deploy it (CD workflow). But that might come as a later question once I figure out the step above!

Thanks in advance!

Top comments (9)

Francis O. Makokha • Jan 3 '19

For building the Vue image, I use a multi-stage build with a build stage from a node image that builds the Vue project and then I copy the files to the production stage from an nginx image to serve the Vue project:

# build stage
FROM node:9.11.1-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

# production stage
FROM nginx:1.13.12-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

CristianPip3 • Dec 11 '19

When I compile, and check in the browser, I see the Nginx home page, which says that welcome to nginx, not the vue application, any idea why?

Daniel da Rocha • Jan 3 '19

That looks quite interesting. then later only push the production-stage image to your registry, right?

For development do you use Nginx at all?

Francis O. Makokha • Jan 4 '19

Both stages are in the same dockerfile. And you end up with a single image. Here's the explanation from the official docker docs:

With multi-stage builds, you use multiple FROM statements in your Dockerfile. Each FROM instruction can use a different base, and each of them begins a new stage of the build. You can selectively copy artifacts from one stage to another, leaving behind everything you don’t want in the final image.

And for development, I don't use nginx. I just use the vue cli dev server. (npm run serve)

Adrián Norte • Jan 3 '19

I would build images with the code inside instead of using volumes, that way you can tag them for pre, qa and prod or for rollbacks.

You would need a registry and some sort of server like jenkins or circleci to run the builds and generate the images.

As for the deployment... if you have the budget amazon ECS and ECR are good solutions but if you don't have that kind of budget you can use something like OVH and deploy a kubernetes or swarm and make the deployment the last step of the build on the pipeline on jenkins or circleci.

Daniel da Rocha • Jan 3 '19

As for the deployment... if you have the budget amazon ECS and ECR are good solutions but if you don't have that kind of budget you can use something like OVH and deploy a kubernetes or swarm and make the deployment the last step of the build on the pipeline on jenkins or circleci.

DigitalOcean also recently started supporting Kubernetes. Seems to be a cheaper alternative?

But, could I start deploying without Swarm or Kubernetes? It seems it is one more step to complicate things when all I need is to have it online so I can keep iterating on its development. Maybe K8s/Swarm could be implemented later, when scale becomes an issue?

Adrián Norte • Jan 3 '19

Kubernetes or Swarm are only needed if you want to go the dedicated server route if you can go to a managed solution like DigitalOcean or Amazon you don't need those.

Daniel da Rocha • Jan 3 '19

And I assume deployment to DO or AWS would also be a simple step in the build on the pipeline on jenkins or circleci?

Adrián Norte • Jan 3 '19

exactly

DEV Community

Docker from development to deployment

Top comments (9)

Read next

Kubernetes Architecture Explanation | Part 1

Next.js with Globally Accessible Variables

Manifest file in Kubernetes

Avoid Using “bloated” Node.js Docker Image in Production!