Last Updated: June 19, 2019

How to create docker image with NodeJs and Grunt?

Description: In this post I'm gonna show you how to create Docker Image for Nodejs project using Grunt

Grunt:  Its a Javascript task runner. In this project we'll use for minification of our .js file.
Docker:  Its a platform where we gonna place containerised image of our NodeJs Project.

Github Project

So lets get started.

Step 1:  Create index.js

//Import Express
var express = require('express')
var app = express()

//Import Path
var path = require('path')

//Mounting our .js from build folder.
app.use("/build", express.static(__dirname + "/build"))

//Capture the base url
app.get('/', function(req, res){
 res.sendFile(__dirname + "/index.html")

//Listen on port 9000
app.listen(9000, function(){
 console.log('Lisening on port 9000')

Note: build folder will be created after we run our Gruntfile

Step 2:  Create package.json

  "name": "demo-docker-nodejs-grunt",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "grunt uglify",
    "start": "node index.js"
  "author": "coderconsole",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1",
    "grunt": "^1.0.4",
    "grunt-cli": "^1.3.2",
    "grunt-contrib-uglify": "^4.0.1"

dependencies: Its contains all the dependencies we needed within the project.
scripts: Its contains grunt uglify to minify our .js and and start to start the nodejs app.

Step 3:  Create Gruntfile.js parallel to package.json and echo.js within src/ folder(just to separate our code structure)

//Setting grunt
module.exports = function(grunt){

    //Setting Init Config from package.json

        //Read package.json and assign it to 'pkg'
        pkg: grunt.file.readJSON('package.json'),

        uglify: {
              options: {
                banner: '/*! <%= %> <%="yyyy-mm-dd") %> */\n'
              build: {
                src: 'src/echo.js',
                dest: 'build/echo.min.js'

    // Load "uglify" task

    // Load default task
    grunt.registerTask('default', ['uglify'])


echo.js within src/ folder
function echoNameFunction(data) {
       return "<h2>Welcome " + data + "</h2>"

Step 4:  Create Dockerfile
# Select the Node Module
FROM node:11

# Add the working Directory

# COPY out package.json to our working directory /app
COPY package*.json /app/

# RUN npm install which will download all the dependencies from package.json
RUN npm install

# COPY the current content to /app folder structure
COPY . /app/

# UGLIFY the src/*.js
RUN npm run build

# EXPOSE our port

# Create EntryPoint of index.js file
ENTRYPOINT ["node", "index.js"]

Note: Dockerfile contains steps which get executed sequentially. Please read comments for what each steps does.

Step 5:  Create index.html
<html lang="en">
    <script src="build/echo.min.js"></script>

        function display(){
            var name = document.getElementById('firstname').value
            document.getElementById('display').innerHTML = echoNameFunction(name)
<label for="firstname">Enter your first name</label>
<input id="firstname" name="firstname" type="text"/>
<button onclick="display()">
<p id="display"></p>

Step 6:  Create .dockerignore file to avoid node_modules or build folder get added into the image


Step 7:  Finally, lets create our docker image and run it using below command.
Build Docker image
docker build -t docker-node-grunt:1.0.0 -f Dockerfile .

Run Docker image
docker run -p 9000:9000 docker-node-grunt:1.0.0

Now, open browser and hit url http://localhost:9000/

Bingo! We've successfully deployed our nodeJs application in docker using grunt.

Github Project