Docker Swarm Sample

Docker swarm sample with NodeJS app on Hyper-V


  • This sample is using Hyper-V

1. Clone sample repository

git clone

2. Build Docker Image and push to Docker Hub

docker build -t /node-app-sample .
docker push /node-app-sample

3. Create VMs

docker-machine create -d hyperv --hyperv-virtual-switch "myswitch" myvm3
docker-machine create -d hyperv --hyperv-virtual-switch "myswitch" myvm2
docker-machine create -d hyperv --hyperv-virtual-switch "myswitch" myvm3
docker-machine create -d hyperv --hyperv-virtual-switch "myswitch" myvm4

4. Create Docker Swarm and set VM1, VM3, and VM4 as manager

docker-machine ssh myvm1 "docker swarm init"
docker-machine ssh myvm1 "docker swarm join-token manager"
docker-machine ssh myvm3 "docker swarm join --token :"
docker-machine ssh myvm4 "docker swarm join --token :"
docker-machine ssh myvm1 "docker swarm join-token worker"
docker-machine ssh myvm2 "docker swarm join --token :"

5. Deploy Services

docker-machine scp docker-compose-node-app.yml myvm1:~
docker-machine ssh myvm1 "docker stack deploy -c docker-compose-node-app.yml nodeapplab"
docker-machine ssh myvm1 "docker stack ps nodeapplab"

6. Test Site

7. Remove Services

docker-machine ssh myvm1 "docker stack rm nodeapplab"

8. Remove Docker Swarm

docker-machine ssh myvm1 "docker stack rm nodeapplab"
docker-machine ssh myvm2 "docker swarm leave"
docker-machine ssh myvm3 "docker swarm leave --force"
docker-machine ssh myvm4 "docker swarm leave --force"
docker-machine ssh myvm1 "docker swarm leave --force"

Optional: Configure Load Balancer using HAProxy

Installation steps for HAProxy on Ubuntu -> How to use HAProxy

Sample config file /etc/haproxy/haproxy.cfg

maxconn 200

mode http
timeout connect 5000ms
timeout client 10000ms
timeout server 10000ms

frontend http-in
bind *:9090
default_backend servers

backend servers
server vm1 : maxconn 40
server vm3 : maxconn 40
server vm4 : maxconn 40

The Future of Software Engineering

Software is the invisible thread and hardware is the loom on which we weave the fabric of computing.

Great keynote by Grady Booch at ICSE 2015. This is a must watch keynote. Grady started his keynote with history of computing, cover the past, present, and future (start from 00:12:00). Following that he talked about how those changes affect us as software engineer (start from 00:46:26), then he closed his keynote with challenges in software engineering and how we can contribute to address to challenges (start from 1:10:00).

No matter what future you might imagine, it will rely on software-intensive systems not yet built.

Agile Architecture

​​​​”Agile Architecture” – Molly Dishman & Martin Fowler Keynote​

It covers:

  1. What software architecture is​
  2. Misinterpretation in agile
    • ​​​​Working software and​ no documentation
    • ​​Responding to change and having no plan​​
  3. How software architecture is done in agile projects​​​ and roles of software architect
​Personally I think ‘good’ software architecture enables agility and​ allowing teams to respond to change faster.

Successful IT Systems Demand Serious IT Governance

A few days ago I read a HBR blog on the trouble in and it is a different perspective. What is interesting here is, the author emphasizes on good governance then the technical issue.

Key highlights from the blog is “Good governance, not superior technical chops or ready access to alpha geeks, is how you build complex systems that deliver reliable and resilient value for money. Good governance provides oversight, insight, and foresight. Emerging problems are flagged sooner; project leaders present their testing protocols and outcomes; and updated expectations are clearly communicated throughout the enterprise. Contingencies are constantly reviewed and appropriately revised.”

If you are interested to read more, here is link to the blog post “Don’t Blame IT for Obamacare’s Tech Troubles“.

Deploying Grails Application to CloudFoundry

Here I am sharing the steps to deploy Grails Application to CloudFoundry.

Step 1: Install CloudFoundry Plugin

install-plugin cloud-foundry

Step 2: Configure Credential
Create $HOME/.grails/settings.groovy and configure your CloudFoundry credential there. Putting your credential in settings.groovy makes it available to all your Grails projects. The alternative is to configure in BuildConfig.groovy or Config.groovy which makes it available to that specific project only. Using settings.groovy is better as it keep the credential out of source control. In Windows, $HOME= C:\Users\<username>.

grails.plugin.cloudfoundry.username = ''
grails.plugin.cloudfoundry.password = ''

Step 3: Verify Credential
Check whether the credential is working by executing the following command:


You will see a similar print out as shown below

VMware's Cloud Application Platform
For support visit
Target: (v0.999)
User:     <your_username>
Usage:    Memory   (128.0M of 2.0G total)
Services (0 of 16 total)
Apps     (1 of 20 total)

Step 4: Deploy Grails Application
Now, deploy your Grails application by executing the following command:


If you decided to deploy your application with a different name, use the option –appname

cf-push --appname=other-name

During deployment you will be prompted with the following questions. The mysql service can be provisioned at later stage using the cf-create-service.

You're running in the development environment but haven't specified a war file, so one will be built with development settings. Are you sure you want to do proceed? ([y], n)
Application Deployed URL: ''?
Would you like to create and bind a mysql service? ([y], n)

Step 5: Verify Application Deployment
To check your deployment, execute the command below:


You will see a similar print out as shown below

| Application     | #  | Health  | URLs                             | Services |
| <app-name>      | 1  | RUNNING | <app-name>      |          |

Customizing Spring Security Login using ExtJS in Grails Apps

I’ve been wanting to learn Grails for sometime and finally had the time to try out this web application framework. Grails is a very impressive framework, it is really about productivity and simplicity. Some of the benefits are scaffolding, testing framework, easy to create plugin and seamless integration with Spring and Hibernate. As part of my first attempt, I am customizing the Spring Security Login using ExtJS in a simple Grails application. The focus here is on the integration with Spring Security and ExtJS rather than Grails. I am using SpringSource Tool Suite (STS 2.7.1) to develop the demo application. The application is to display Quotes randomly and ability to maintain them. Let’s begin the integration and customization steps.

Step 1: Install the Spring Security Plugin

Spring Security is not built-in Grails, to begin the integration execute the following Grails command.

install-plugin spring-security-core

Step 2: Generate Domain Classes

 This step will create basic domain classes needed to store user information and the controller that handle the authentication. After executing the command below you will see several files being added to your project, such as LoginController, auth.gsp, denied.gsp, User, Role, UserRole, RequestMap. The domain class name for user and role is up to you to define and if you have an existing user domain, you must decide to integrate it (possibly by extending your domain class to the generated user class). Just a note that the RequestMap is an option and will look into it at later step.

s2-quickstart org.xaab.qotd User Role RequestMap

Step 3: Define URL mapping for login and logout

In order the make the login and logout controller reachable, the URL mappings must be added into UrlMapping.groovy

class UrlMappings {
	static mappings = {
		"/login/$action?"(controller: "login")
		"/logout/$action?"(controller: "logout")

Step 4: Add Access Control to the Controller

The need for this step depends on how you wants to control the access. You can use @Secured annotation to limit access to certain part of the application. In this example, I am not using annotation to limit the access, instead I define dynamics request maps which is shown in the Step 5. The following code is just an example of how @Secured can be used in the controller.

package org.example
import grails.plugins.springsecurity.Secured

class PostController {
    def followAjax = { ... }

    def addPostAjax = { ... }

    def global = { ... }

    def timeline = { ... }

    def personal = { ... }

Step 5: Add Dynamic Request Maps

The request maps class was generated in Step 2 and used to limit access by defining the access control at the URL. Here I create the request map in BootStrap.groovy for demo purpose, in your actual application this may be defined in configuration file or database. I don’t think you should choose between using annotation and request map. You can strike balance by implementing both to handle general and fine-grain access control.

import org.xaab.qotd.*

class BootStrap {
    def springSecurityService

    def init = { servletContext ->
		new Requestmap(url: '/**', configAttribute: 'IS_AUTHENTICATED_FULLY').save()
		new Requestmap(url: '/quote/**', configAttribute: 'ROLE_ADMIN,IS_AUTHENTICATED_FULLY').save()

		new Requestmap(url: '/js/**', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
		new Requestmap(url: '/css/**', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
		new Requestmap(url: '/images/**', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
		new Requestmap(url: '/ext-4.0.2/**', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
		new Requestmap(url: '/quote/random', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
		new Requestmap(url: '/login/**', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
		new Requestmap(url: '/logout/**', configAttribute: 'IS_AUTHENTICATED_ANONYMOUSLY').save()
    def destroy = {

Step 6: Amend related GSP to add login and logout link

Amend related GSP (random.gsp) to ensure you have the login and logout link. Since I used scaffolding, I must install the templates and ensure the GSP templates are modified.  Once scaffolding templates are installed, you will see the folders /src/templates/scaffolding/**. The files I modified in this sample application are create.gsp, edit.gsp, list.gsp & show.gsp.

<div class="nav"><span class="menuButton">Next Quote</span> <span class="menuButton">Admin</span> <span class="menuButton">Login</span> <span class="menuButton"> (Logout)</span></div>

Step 7: Customize the auth.gsp to Add ExtJs Login Form

By now the integration is completed and if you used the test data in Step 10, you will be able to see the default login page. In order to customize it, copy the ExtJS source into /web-app and in this sample application I am using ExtJS 4.0.2. Start the customization by modifying the auth.gsp as shown below. Do take note on the naming of the fields as it is the convention used in Spring Security.

Login<script type="text/javascript" src="${resource(dir:'ext-4.0.2',file:'ext-all.js')}"></script><script type="text/javascript">// <![CDATA[
		var defLoginUrl = '${postUrl}';
		var homeUrl = '${createLink(uri: "/quote/random")}';

// ]]></script>
<script type="text/javascript">// <![CDATA[

	var loginForm = Ext.create('Ext.form.Panel',{
			url: defLoginUrl,
			title: 'Login',
			renderTo: 'login',
			frame: true,
			cls: 'my-form-class',
			width: 350,
			items: [{
					xtype: 'textfield',
					fieldLabel: 'Login',
					name: 'j_username'
					xtype: 'textfield',
					inputType: 'password',
					fieldLabel: 'Password',
					name: 'j_password'
			}, {
				xtype: 'checkbox',
				fieldLabel: 'Remember Me?',
				name: '_spring_security_remember_me',
				checked: false
			buttons: [{
					id: 'lf.btn.login',
					text: 'Login',
					handler: function() {
					id: 'lf.btn.reset',
					text: 'Reset',
					handler: function() {


function fnLoginForm(theForm)
		success: function(form, action) {
			Ext.Msg.alert('Success', 'Login Successful!', function(btn, text) {
				if (btn == 'ok') {
					window.location = homeUrl; //optionally this can be part of the data return by the server.
		failure: function(form, action) {
			Ext.Msg.alert('Warning', action.result.error);
} //end fnLoginForm

function fnResetForm(theForm)
} //end fnResetForm
// ]]></script>

Step 8: Configure Authentication Success and Failure Handler

The ExtJS login form will perform HTTP post to submit the login data however it expects JSON data as response. The default method in the LoginController will not be able to handle this, thus you must define your own handler. Add your handler into Config.groovy as shown below. The handlers are implemented in LoginController in the next step.

grails.plugins.springsecurity.successHandler.defaultTargetUrl = '/login/authSucccessExtJs'
grails.plugins.springsecurity.successHandler.alwaysUseDefault = true
grails.plugins.springsecurity.failureHandler.defaultFailureUrl = '/login/authFailExtJs?login_error=1'

Step 9: Implement the Handler in LoginController

After adding the handler, I suggest you remove or comment out the other methods to ensure they are not accessible.

import grails.converters.JSON

import javax.servlet.http.HttpServletResponse

import org.codehaus.groovy.grails.plugins.springsecurity.SpringSecurityUtils

import as SCH

class LoginController {

	 * Dependency injection for the authenticationTrustResolver.
	def authenticationTrustResolver

	 * Dependency injection for the springSecurityService.
	def springSecurityService
	 * The ExtJS Authentication success handler
	def authSucccessExtJs = {
		render([success: true, username:] as JSON)

	 * The ExtJS Authentication failure handler
	def authFailExtJs = {
			def username = session[UsernamePasswordAuthenticationFilter.SPRING_SECURITY_LAST_USERNAME_KEY]
			String msg = ''
			def exception = session[WebAttributes.AUTHENTICATION_EXCEPTION]
			if (exception) {
				if (exception instanceof AccountExpiredException) {
					msg = SpringSecurityUtils.securityConfig.errors.login.expired
				else if (exception instanceof CredentialsExpiredException) {
					msg = SpringSecurityUtils.securityConfig.errors.login.passwordExpired
				else if (exception instanceof DisabledException) {
					msg = SpringSecurityUtils.securityConfig.errors.login.disabled
				else if (exception instanceof LockedException) {
					msg = SpringSecurityUtils.securityConfig.errors.login.locked
				else {
					msg =

			render([success: false, error: msg] as JSON)

Step 10: Setup Test Data

So, you have integrated your Grails application, customized the login form using ExtJS. Now, setup the test data in BootStrap.groovy and launch the application (http://localhost:8080/grails-qotd-extjs).

import org.xaab.qotd.*

class BootStrap {
    def springSecurityService

    def init = { servletContext ->
		new Quote(author: "Unknown", content: "If you think sunshine brings you happiness, then you haven’t danced in the rain.").save()
		new Quote(author: "Lao Tzu", content: "An ant on the move does more than a dozing ox.").save()
		new Quote(author: "Tony Robbins", content: "It not knowing what to do, it’s doing what you know.").save()
		new Quote(author: "Bruce Lee", content: "Simplicity is the key to brilliance.").save()


		def userRole = Role.findByAuthority('ROLE_USER') ?: new Role(authority: 'ROLE_USER').save(failOnError: true)
		def adminRole = Role.findByAuthority('ROLE_ADMIN') ?: new Role(authority: 'ROLE_ADMIN').save(failOnError: true)

		def adminUser = User.findByUsername('admin') ?: new User(
			username: 'admin',
			password: springSecurityService.encodePassword('admin'),
			enabled: true).save(failOnError: true)

		if (!adminUser.authorities.contains(adminRole)) {
			UserRole.create(adminUser, adminRole)
    def destroy = {

Hope this tutorial helps and happy coding!

download source


Custom Number Formatting in Flex.

A quick intro before I start. I’m Rudy and I’m a new contributor here.

Lately I’m doing a lot of flex programming and although Adobe Flex is quite mature (It has reached version 4.5 this year), I feel that the language is still lack of support to business. One of the missing feature is Number/Currency Formatting that accepts pattern as a template format.

In Flex, we have <mx:CurrencyFormatter>[link]. However it does not accept Pattern. In addition, it’s implemented as a tag which does not allow to be invoked in ActionScript. However, in Java this capability is being implemented nicely using DecimalFormat [link].

Based on the reasons above I decided to create my own formatter that can be called from both ActionScript and mxml. Note that since this is just a quick hack, the code maybe a little bit messy.

Currently it able to cater currency symbol, percentage, # and 0. For example :

  • 1234.56 with pattern #,###.## has output 1,234.56
  • 1234.56 with pattern USD#,###.## has output USD 1,234.56
  • 1234.56 with pattern $#,###.## has output $ 1,234.56
  • 1.23 with pattern 000.000 has output 001,230
  • -12.34 with pattern USD0##.## has output -USD 012.34
  • 123.45 with pattern ###.##% has output 123.45%

Usage :

var nf:NumberFormatter = new NumberFormatter();
var number:Number = 1234.56;
nf.formatString = "#,###.##";
var resultFormatted:String = nf.format(number);

You can download the full code in

Display JSON Data using ExtJS 4 Store

I am sharing a short example of how to display JSON data using ExtJS 4 Store. In previous version of ExtJS, there is a small helper class call JsonStore which is used to simplify creation Stores from JSON data. In ExtJS 4 the class is no longer there. In this example, I am retrieving USGS data as JSON and display it in Grid as shown below.

USGS Data in Gri

As shown below in line 20, I use proxy of type JSONP in to retrieve the JSON data.

  Ext.define('UsgsList', {
    extend: '',
    fields: [
       {name: 'fid',       type: 'int'},
       {name: 'title',     type: 'string'},
       {name: 'description',  type: 'string'},
       {name: 'link',      type: 'string'},
       {name: 'pubDate',    type: 'date'},
       {name: 'lat',      type: 'string'},
       {name: 'long',      type: 'string'}
    idProperty: 'fid'

var store = Ext.create('', {
    id: 'store',
    model: 'UsgsList',
    proxy: {
       type: 'jsonp',
       url: '',
    extraParams: {
       q: 'select * from rss where url=""',
       format: 'json'
   reader: {
      root: 'query.results.item',

function renderTitle(value, p, record) {
   return Ext.String.format('<a href="{1}" target="_blank">{0}</a>',

var grid = Ext.create('Ext.grid.Panel', {
   width: 700,
   height: 500,
   title: 'USGS - M2.5+',
   store: store,
   loadMask: true,
   disableSelection: true,
   invalidateScrollerOnRefresh: false,
   viewConfig: {
     trackOver: false
   // grid columns
      xtype: 'rownumberer',
      width: 50,
      sortable: false
      id: 'title',
      text: "Title",
      dataIndex: 'title',
      flex: 1,
      renderer: renderTitle,
      sortable: false
      id: 'pubDate',
      text: "Published Date",
      dataIndex: 'pubDate',
      width: 130,
      renderer: Ext.util.Format.dateRenderer('n/j/Y g:i A'),
      sortable: true
   renderTo: Ext.getBody()

// trigger the data store load

HTML5 @Google I/O 2011

Just sharing some of the talk/presentations on HTML5 at Google I/O 2011. HTML5 seems to be moving fast and you will see some of the cool stuff in the “HTML5 versus Android” demo,

  • I/O BootCamp 2011: Getting Started with HTML5


  • HTML5 Showcase for Web Developers: The Wow and the How


  • HTML5 and What’s Next


  • GWT + HTML5: A web developers dream!


  • HTML5 vs. Android: Apps or Web Mobile Development?


  • HTML5 Today with Google Chrome Frame


  • Kick-Ass Game Programming with Google Web Toolkit