Friday, July 01, 2011

Tame that bad ass mother of a jscript file

When writing huge amounts of javascript to make your site more dynamic and slick, as a developer you find your self scrolling all over the place and trying to figure out how many curly brackets you are missing.
You also constantly referring to the jquery site for syntax prompts. 
Here are a few handy tools that you can use when using Visual Studio as your chosen development platform:
  • Firebug - nothing new here, but it is awesome for helping you find that bug in your js file, and gives you an overview of what values you are passing from one function to the other
  • Utilise VS2010 intellisense by placing jquery references at the top of your files.
    • EG. /// <reference path="jquery-1.5.1.js"> in your javascript file 
    • or something like this in your user control: 
<%if(false){%> <script src="/scripts/jquery-1.5.1.min.js" type="text/javascript"></script> <%} %>

  • Install a rather clever extension from codeplex http://jsoutlining.codeplex.com/. This will allow you to use #regions in javascript and also create outlines around curly brackets. But beware it can be quite heavy and may slow down VS2010's performance if your javascript file is humongous. 
Happy coding.

No comments: