Sometimes I have wondered just what the h**l they were thinking over at Microsoft: their flagship development tool just didn’t perform and deliver what you would expect from a tool of that caliber. That was before the Microsoft Visual Studio 2010 (VS 2010)! I will try to write about features in VS 2010 which makes me happy as a frontend web developer, hoping that you will gain something from it – and please do comment and share your experiences.
The background: What I missed…
I have during my 15 years career as web developer tried various development tools, and have touched the “backend” development side of web applications also. It seems that many rich development tools focus on the heavier backend development part of web application development with things like intellisense, snippets and so on. I have often wondered: Why should it be so difficult and not possible – especially in VS – to automate things, processes which is done many times every day? Rich development tools RDTs should support the “web craftsmen” trying to produce quality work. In real life “real” tools for craftsmen like a carpenter have evolved. Quality tools make the fundament for quality work! Anyway, we might just have got a piece of quality tool in VS 2010!
It is near perfect now! The intellisense engine in VS 2010 seems to “think” nearly perfect. Say you want to use jQuery. If you include your jQuery API using a local version, you will get basic intellisense – that is objects inside the jQuery API will appear as you start typing. You will get relevant methods shown together with basic information about which parameters you can use. Okay, but it gets better!
Microsoft minimised version of jQuery still has intellisence
jQuery embedded from Microsoft at: http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js
Using the MS CDN to get even a minified version of jQuery, you still get extensive intellisence!
[Shift]+[Ctrl]+J. For big APIs like jQuery this might take perhaps 20 seconds.
jQuery plug-ins handled as well in intelisence
Extra jQuery plug-ins added will also get intellisense, as expected, but also at the correct place
If you think about it – VS 2010 is quit smart! It scans the cycle plug-in and sees that it extends the jQuery API. That is how it can figure out – I guess – that the cycle method fits in as a method on a found elements of the “$” (or jQuery) method. Nice feature!
Dropdown filelist simplified
Automatic dropdown file list when adding HTML code like “script”. Previously you had to click the “Pick URL…” and then point to the file which you wanted to use in your HTML document. Now you simply click on the file, if it is located at the same place as the current document. Nice.
Snippets – finally!!
I have written about snippets in Visual Studio in a previous post: Find Visual Studio Snippets ready for download on my DropBox folder, but it is first in VS 2010 that it is actually possible to execute snippets in HTML mode! (Why, why, why?). Anyway you can now! And VS 2010 comes with a few snippets installed.
Snippet types “Surround with” and “Insert snippet”
If you do not know how to activate them try the “surround with snippet” by pressing
[Ctrl]-K, [Ctrl]-X. And remember: You can always create your own!
Just discovered that in fact Microsoft has not made it possibel to use snippets within CSS… Why, why, why???
Intellisence will execute your code dynamically to give better suggestions
Your own intellisence using XML comments!
[Ctrl]+K, [Ctrl]+X, choose “XML Comments” and what type of comment you want to insert. After having done and (of cause) filling out the marked fields, your code will be providing intellisense and suggestions when other people use it! Cool!
You can see below a simple function called “myhide”, The 3 lines below the function have been inserted using the above mentioned XML comments snippet. I defined a summary, a return definition and a param description. Voila! My function now has intellisense and build in help – which will without doubt be useful for me and others at a later state. You can make this part quit advanced with references to documentation files, assemblies and more.
Various small changes
- You can zoom the work area as you can in your browser. Just hold down
[Ctrl]while rolling the wheel of you mouse up and down. Guess that woud be nice for elderly people like me :-)
- All these improvements also apply to the free Visual Web Developer 2010 Express!