Monday, December 15, 2014

Setting up an web development workflow using bower, npm and grunt

I came from a .net development environment where my development workflows are all within visual studio. However, recently, I had the opportunities to move out of these ancient workflows and move into the leading edge development. Because of this shift, I interface with new technologies like grunt and bower, NodeJS (NPM to be specified), Rudy gem, etc.

One of the better workflows I encounter are

1) Use Bower to download all necessary packages like Bootstrap, jQuey, AngularJS, etc. The reason behind the use of Bower are we can easily synchronise the same environment across all developers; we do not need to push in libraries into our git repository and we can update all libraries at the touch of fingers. Another advantage is I normally separate the front-end libraries installation using Bower, and the back-end libraries using the NPM CLI.

 2) Grunt is an automatic task runner that are capable of running predetermine tasks sequentially. If setup correctly, it can significantly increase the efficiency of the current development workflow. Some of the most basic tasks Grunt can do are compiling Sass, Coffee or Typescript, logging of issue and request, injecting live reload, and much more. There is also an alternative to Grunt, Gulp. Gulp is also a tool that is similar to Grunt. The real different to me is just the syntax, and it is up to the developer preference on choosing which one for their projects.


That is about it for now. I will post more topic about the workflow we adapt and use along the way.



No comments: