This document provides an overview of new features in Visual Studio 2013, including improved preview tools in the IDE, better support for Git, an updated HTML editor, SASS support, improved JavaScript functionality, browser linking without Cassini, updated Web Essentials tools, and recommendations to follow influential engineers on Twitter.

1. STUDIO 2013 THAT I COPIED
FROM A LOT OF SCOTT
HANSELMAN AND MADS
KENDRICK VIDEOS ONLINE AND I
THINK THAT I MIGHT HAVE
MISSPELLED MADS KENDRICS
PLUS DID YOU KNOW VISUAL
STUDIO 2013 HAS ALREADY BEEN
OUT LIKE OVER A YEAR ALREADY
AND HAS FOUR UPDATES AND BY
THE WAY THERE’S A FREE
VERSION NOW SO GO AHEAD AND
DOWNLOAD IT ALREADY AND
AKA Visual Studio
2013 Introduction

2. (ACCORDING TO GOOGLE HIS NAME IS ACTUALLY
MADS KRISTENSEN)

3. THIS IS ALL THE STUFF WE ARE
GOING TO TALK ABOUT
IDE Updates
Git Support
HTML Editor
SASS (Update 2)
JavaScript
Web Essentials + Other tooling

4. I PROMISE IT WILL BE COOLER
THAN IT SOUNDS

5. IDE NEW FEATURES – PREVIEW
TOOLS Visual Studio 2013 offers like 5 million ways of previewing code.
For example, peek definition:

6. CAN’T GO WRONG WITH PUPPIES,
RIGHT?

7. IDE NEW FEATURES
Okay – not really five million ways of previewing code but here’s three
pretty cool ones:
 Peek Definition (Alt + F12)
 New Scrollbar (Used to be a part of powertools extension)
 Preview Window (Clicking anything in solution explorer.
Let’s look at some actual code…

8. VISUAL STUDIO HAS A TON OF BRAND NEW SHORTCUTS.
SO YOU NO LONGER HAVE TO TYPE LIKE
THIS…

10. IDE NEW FEATURES
New Quick Keyboard Shortcuts
 Ctrl-Q to find any setting quickly
 Ctrl-; to search solution explorer quickly
 Ctrl-. to quickly resolve references
 Ctrl, to open newly optimized “Navigate To” menu
 Ctrl 0, G to go to Git Changes
 Ctrl 0, o to go to Git Commits

11. NOW YOU CAN TYPE LIKE
THIS!
Let’s try it out

12. GIT SUPPORT
Setting up Stash authentication
Cloning a new project
Pulling
Code changes
Pushing
Branching
https://github.com/WhiteHouse/fortyfour/issues/3

13. BACK IN MY DAY WE HAD TO HIKE SIX MILES TO SCHOOL UPHILL
THROUGH SNOW
WITH NO CHROME DEV TOOLS OR
DEBUGGER
AND WE LIVED OFF DOCUMENT.WRITE AND ALERT(“EVERYTHING UNDER
THE SUN”)

14. NOWADAYS YOU GET
BROWSERLINK (IN VS2013)
Real time persistent client-server connection using SignalR
No more Cassini (VS Dev Server)
Works with IIS Express or Full IIS

15. THE HTML EDITOR DOESN’T SUCK
ANYMORE
HTML Editor
 Bootstrap Support
 URL Picker (Update 2)
 Update 4 no longer pukes when it sees {{}} in
HTML templates or customer elements/attributes
 #region, TODO, and HACK support (Update 4)
 Basic IntelliSense for Web Components

16. SASS
Auto-build CSS + Map
Drag and Drop Image Support
Snippets

17. READY FOR MORE CODE?

18. JAVASCRIPT
JavaScript
 XML Comments vs JSDoc
 RequireJS Support as of update 3, modules as of Update 4
 Full featured JSON editor
 Package.json and bower.json Intellisense
JavaScript
Ninja
JavaScript
Engineer

19. (ENGINEERS > NINJAS) === TRUE

20. NOW WE GET TO THE REALLY
COOL STUFF

21. ENGINEERS TO FOLLOW:
Anders Hejlsberg @ahejls1berg
 Inventor of C# and TypeScript
Mads Kristensen @mkristensen
 Microsoft Tooling Innovator – lead creator of web essentials
Scott Hanselman @shanselman
Microsoft Uber Evanglist/Developer – good luck ever finding a seat at one of his presentations
Douglas Crockford @crockfordfacts
Supreme overlord and master dictator of JavaScript i.e. the most polarizing guru in the universe
My Twitter @wtvamp
I scrubbed all the bad stuff before the presentation started (hopefully)

22. YOU SHOULD ADD THESE GUYS TO
YOUR TWITTER IMMEDIATELY

23. SERIOUSLY – WHY DON’T YOU
HAVE YOUR SMART PHONES OUT?

24. WEB ESSENTIALS
Zen Coding
SASS/CSS Intellisense
JSHint
Increased code folding
Placeholder Generators
Bootstrap class validation
Customer editors like robots.txt

25. OTHER COOL TOOLS
JavaScript Parser
 Gives a class-like view of JavaScript components for easier navigation
JavaScript vsdoc Generator
 Creates /// shortcut to auto-generate XML comments just like C#
Grunt Launcher
 Right click to launch Grunt, Gulp, and Bower commands in visual studio
 Doesn’t work in subdirectories
NodeJS Tools
 Run NodeJS programs in Visual Studio

26. QUESTIONS?