The new world of MV* frameworks


The BIG THING last year in terms of Web Development was Responsive Web Design.

This year, it’s going to be MV* frameworks.

If you are new to MV* frameworks, like I am, head on over to:

To help you get your feet wet and decide which framework you would like to use.  this site created TodoMVC – a project which offers the same Todo application implemented using MV* concepts in most of the popular JavaScript MV* frameworks of today.


My Developer Tool Stack

I often get asked what extensions I use for development.

As my development is mainly building websites/apps using .Net, here is my stack of tools that I use on a day to day basis:

Visual Studio Extensions Stack

Collapse Selection In Solution Explorer
Many Visual Studio users have a solution tree structure with multiple projects and solution folders that are organized as a deep hierarchy.  This extension allows you to easily collapse the hierarchy in the solution explorer.

Indent Guides
This simple extension draws vertical lines (guides) for you visual studio code.

Javascript Parser
When you are editing a extremely large javascript files it’s very useful to have some set of tools to improve the performance of development process and avoid possible bugs.

This extension provides outlining and matching braces highlighting features for Visual Studio JavaScript and CSS editor.

Mindscape Web Workbench
I mainly use this extension to for LESS syntax formatting

Productivity Power Tools
A set of extensions to Visual Studio Professional (and above) which improves developer productivity.

Web Essentials
The Web Essentials extension lets you perform common tasks much easier.

Firefox Extensions Stack

Advanced Eyedropper, ColorPicker, Color Analyzer and other useful goodies for Firefox and Chrome

Web Development Evolved.  If you don’t already have this installed, I’m not even sure you can call yourself a web developer.  😉

FireQuery is a Firefox extension integrated with Firebug.  I mainly use to this determine what events are bound to elements in the DOM.

Other Tools

WinLess (for Windows)
LESS is a CSS precompiler tool that allows you to extend CSS with dynamic behavior such as variables, mixins, operations and functions. For more information on LESS itself, see WinLess watches specific folders/files and automatically compiles your LESS files into standard CSS files.

Awesome screengrab tool. What I really like about it, is the ability to capture the last capture region.

Lazy Loading Images in Javascript


I’ve been meaning to implement a lazy loading technique for images on the the ecommerce websites that I develop for, especially in the search results area.   Loading the images as the user scrolls down the page, should hopefully increase page load time, making EVERYONE happy.

My searches have come across two solutions that seem quite promising, and that I’m going to implement (and test).

  • jQuery Unveil – This plugin is very useful and it boosts performance delaying loading of images in long web pages because images outside of viewport (visible part of web page) won’t be loaded until the user scrolls to them.  This plugin is also QUITE lightweight.
  • – Mika Tuupola’s implementation that so many others have used / forked.

rwldrn/idiomatic.js · GitHub


I can’t help it, but I do it anyways…

There are many times where I get hung up on what is the correct way to syntactically format my (javascript) code. I only spend seconds making a decision or looking up some other code that I have recently written, to decide how to format it.

Well, if you’re looking for a thorough JavaScript style guide for your team, Rick Waldron’s Principles of Writing Consistent, Idiomatic JavaScript is a great place to start.

Or maybe you’re just completely bored, but a geek like me. Either way, when you’re ready read A LOT more via rwldrn/idiomatic.js · GitHub.

Unheap – A tidy repository of jQuery plugins


I’m sure that you’re like me (yeah right), and your always on the hunt for the next “killer” jQuery plug-in.  Whether you just want to add it to your already growing number of plug-ins, or if you’re like me, you’ll want to dive into the code to learn or create your own better version.

Here’s a great, consolidated list of jQuery Plugins, plus it boasts a pretty nice UI/UX experience.

Check it out at : Unheap – A tidy repository of jQuery plugins.

JavaScript Patterns


A JavaScript pattern and antipattern collection that covers function patterns, jQuery patterns, jQuery plugin patterns, design patterns, general patterns, literals and constructor patterns, object creation patterns, code reuse patterns, DOM and browser patterns

Read more via JavaScript Patterns.

The State Of Responsive Web Design | Smashing Mobile


Responsive Web design has been around for some years now, and it was a hot topic in 2012. Many well-known people such as Brad Frost and Luke Wroblewski have a lot of experience with it and have helped us make huge improvements in the field. But there’s still a whole lot to do.

In the article, they will look at what is currently possible, what will be possible in the future using what are not yet standardized properties (such as CSS Level 4 and HTML5 APIS), and what still needs to be improved. This article is not exhaustive, and they won’t go deep into each technique, but you’ll have enough links and knowledge to explore further by yourself.

Read more via The State Of Responsive Web Design | Smashing Mobile.