The Holy Java

Building the right thing, building it right, fast


Frontend development tools 2/2014

(By Pål & co.)

Build & live reload

Have a dev server that live updates when files are saved and can also run tests, builds etc. – see an example here: (using grunt with watch).

Of course, make sure to use JSHint, testing etc.


Any, but f.ex. in LightTable it is possible to have code in one pane and live preview of the page in another next to it so the feedback loop is really short.

Tip: Use  Chrome Web Inspector’s workspaces as development environment when doing lot of changes to HTML/CSS/LESS – “inspect element”, change it, WI can store changes back to the original files, after proper configuration. See this screencast of fully in-Chrome development and description of worskpaces at HTML5 Rocks. Basically: chrome://flags –  “Enable Developer Tools experiments,” web inspector settings – add a new workspace, right-click on a file in the Sources tab and  “Map to Network Resource”.

Experimental: Adobe’s new JavaScript-based editor Brackets looks interesting, good integration with Chrome.


AngularJS: Batarang is a must-have Chrome plugin for inspecting scopes and variables.



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: