visual studio 2013 update 4 introduction

26
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

Upload: warren-thompson

Post on 08-Jul-2015

220 views

Category:

Software


3 download

DESCRIPTION

A presentation I gave to a customer site who recently allowed Visual Studio 2013 in their architecture.

TRANSCRIPT

Page 1: Visual Studio 2013 Update 4 Introduction

STUDIO 2013 THAT I COPIED FROM A LOT OF SCOTT

HANSELMAN AND MADSKENDRICK 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

Page 2: Visual Studio 2013 Update 4 Introduction

(ACCORDING TO GOOGLE HIS NAME IS ACTUALLY MADS KRISTENSEN)

Page 3: Visual Studio 2013 Update 4 Introduction

THIS IS ALL THE STUFF WE ARE GOING TO TALK ABOUTIDE Updates

Git Support

HTML Editor

SASS (Update 2)

JavaScript

Web Essentials + Other tooling

Page 4: Visual Studio 2013 Update 4 Introduction

I PROMISE IT WILL BE COOLER THAN IT SOUNDS

Page 5: Visual Studio 2013 Update 4 Introduction

IDE NEW FEATURES – PREVIEW TOOLSVisual Studio 2013 offers like 5 million ways of previewing code.

For example, peek definition:

Page 6: Visual Studio 2013 Update 4 Introduction

CAN’T GO WRONG WITH PUPPIES, RIGHT?

Page 7: Visual Studio 2013 Update 4 Introduction

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…

Page 8: Visual Studio 2013 Update 4 Introduction

VISUAL STUDIO HAS A TON OF BRAND NEW SHORTCUTS.

SO YOU NO LONGER HAVE TO TYPE LIKE THIS…

Page 9: Visual Studio 2013 Update 4 Introduction
Page 10: Visual Studio 2013 Update 4 Introduction

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

Page 11: Visual Studio 2013 Update 4 Introduction

NOW YOU CAN TYPE LIKE THIS!

Let’s try it out

Page 12: Visual Studio 2013 Update 4 Introduction

GIT SUPPORT

Setting up Stash authentication

Cloning a new project

Pulling

Code changes

Pushing

Branching

https://github.com/WhiteHouse/fortyfour/issues/3

Page 13: Visual Studio 2013 Update 4 Introduction

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”)

Page 14: Visual Studio 2013 Update 4 Introduction

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

Page 15: Visual Studio 2013 Update 4 Introduction

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

Page 16: Visual Studio 2013 Update 4 Introduction

SASS

Auto-build CSS + Map

Drag and Drop Image Support

Snippets

Page 17: Visual Studio 2013 Update 4 Introduction

READY FOR MORE CODE?

Page 18: Visual Studio 2013 Update 4 Introduction

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

JavaScriptNinja

JavaScriptEngineer

Page 19: Visual Studio 2013 Update 4 Introduction

(ENGINEERS > NINJAS) === TRUE

Page 20: Visual Studio 2013 Update 4 Introduction

NOW WE GET TO THE REALLY COOL STUFF

Page 21: Visual Studio 2013 Update 4 Introduction

ENGINEERS TO FOLLOW:

Anders Hejlsberg @ahejls1berg Inventor of C# and TypeScript

Mads Kristensen @mkristensen Microsoft Tooling Innovator – lead creator of web essentials

Scott Hanselman @shanselmanMicrosoft Uber Evanglist/Developer – good luck ever finding a seat at one of his presentations

Douglas Crockford @crockfordfactsSupreme overlord and master dictator of JavaScript i.e. the most polarizing guru in the universe

My Twitter @wtvampI scrubbed all the bad stuff before the presentation started (hopefully)

Page 22: Visual Studio 2013 Update 4 Introduction

YOU SHOULD ADD THESE GUYS TO YOUR TWITTER IMMEDIATELY

Page 23: Visual Studio 2013 Update 4 Introduction

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

Page 24: Visual Studio 2013 Update 4 Introduction

WEB ESSENTIALS

Zen Coding

SASS/CSS Intellisense

JSHint

Increased code folding

Placeholder Generators

Bootstrap class validation

Customer editors like robots.txt

Page 25: Visual Studio 2013 Update 4 Introduction

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

Page 26: Visual Studio 2013 Update 4 Introduction

QUESTIONS?