Dockerizing ReactGo

First up you’ll need to be able to successfully run a build for your current ReactGo app.  I assume you have docker installed.

npm run build

Once you’ve got a successful build on your hands go ahead and create your dockerfile.  Example one below:

FROM node:boron

# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app

# Install app and dependencies
COPY package.json /usr/src/app/
RUN npm install

# Copy build
COPY compiled /usr/src/app/compiled
COPY public /usr/src/app/public

# Set Environment Variables
ENV MONGODB_URI mongodb://mongo/MyAppCollection
ENV NODE_ENV production
ENV PORT 80

EXPOSE 80

CMD ["node", "compiled/server.js"]

You can use a later version of Node if you like I built and tested my on v6.10.

docker build -t <image_name> .

NOTE: DO NOT FORGET THE PERIOD AT THE END (that caused me a serious headache one day…)

While that is building lets launch a mongo container to run our database (we’ll link to it later).  I assume you’ve already pulled mongo from the docker hub: docker pull mongo

docker run -d --name <db_container_name> mongo

Now let test our container locally… I’m going to bind our exposed 80 port to port 80 on localhost to demonstrate how it’s done.  This same principal applies when launching a container out in a production docker environment.

docker run -d -p 127.0.0.1:80:80 -it --link <db_container_name>:mongo --name <app_container> <image_name>

NOTE: notice the MONGODB_URI ENV variable we set in the docker file.  Take special note of underlined part that follows: the mongodb://mongo/MyAppCollection.  This MUST match the link name you give in your run command (e.g. <db_container_name>:mongo).

Check your local host on port 80 and you should see your app.  If not check the logs by using the docker logs <container_ID> command.  Container IDs can be found with docker ps -a command.

After you’ve successfully tested your container you’re ready to push the image to your registry.  You can use docker hub but I’m using Bluemix, since it’s private and I get it for free ;).  After you login to your registry tag your image for release:

Bluemixers need your name space? try bx ic namespace-get

docker tag <image_name> registry.ng.bluemix.net/<name_space>/<app_name>:<version_tag>

The version tag is optional but recommended.  It will default to latest otherwise. Then push it (push it real good)

docker push registry.ng.bluemix.net/<name_space>/<app_name>:<version_tag>

Then wait… forever…

If your on Bluemix you’ll probably want to push up a mongo container as well. (remember to start one up so we can link to it like we did on local host)

For those of you who are not using Bluemix substitute the bx ic commands below for your registry (should be just docker for most of the world)

bx ic cpi mongo registry.ng.bluemix.net/<name_space>/mongo

From there I usually create a dummy container with the Bluemix GUI (website) so I can provision a public IP through Bluemix which I can then reuse when I launch a container with this command.  There is probably a way to provision an IP through CLI but I’m too lazy to look it up.

bx ic run -d -p <my_public_ip>:80:3000 -it --link <db_container_name>:mongo --name <app_container_name> <name_space>/<image_name_or_id>