What’s new in VS 2015 and ALM 2015

Enterprise Software Development

Join the Conversation #VS2015 @AdamCogan

V18.1

@AdamCogan | Chief Architect @ SSW | Microsoft Regional Director

What’s new in Visual Studio 2015


A trip down memory lane (Taylor Square – Oxford St Sydney)

• Web Forms

• XML Web Services

• Windows Forms

VS 2002

• .NET 1.1

• Mobile Devices

(ASP.NET)

• Compact Framework

• Enterprise Templates

VS 2003

• .NET 2.0

• Generics

• Click Once

• Web

ASP.NET 2.0

Local web server (Cassini)

• Testers

Web Tests

VS 2005

• .NET 3.5

• LINQ, LINQ to SQL

• WPF/HTML Designers

• Web

MVC 1.0

JavaScript IntelliSense

• Testing

Web/Load Testing

VS 2008

• .NET 4.0

• F#

• Parallel Extensions

• Quick Search (Navigate to)*

• IntelliTrace

• Web

MVC 2 & 3

• Testers

Test Manager

Coded UI Tests

VS 2010


• Metro Modern UI!

• Search + Quick Launch

• Faster Add References

• NuGet

• New Team Explorer

• Storyboarding with PPT*

• IntelliTrace in Production

• Web

MVC 3 & 4

Page Inspector

CSS & HTML5

Debug in Chrome

• Testers

Exploratory Testing

Feedback Tool

VS 2012


• VisualStudio.com

• Visual Studio Community*

• Git Support

• TypeScript

• WebMVC 5 + WebAPIs

Browser Link*

Twitter Bootstrap

OAuth

• 64 bit Edit & Continue

• CTRL + ,

• Peek, Code Lens, CodeMap

• Sync Preferences

VS 2013

• Uses SignalR to push changes to connected browsers

• Update HTML, CSS

• Refresh multiple browsers

• Design mode

Browser Link



Browser Link + Web Essentials• Make changes in the browsers dev tools, save back to

VS

• Find unused CSS

• http://vswebessentials.com/features/browserlink


http://vswebessentials.com/features/browserlink

A trip down memory lane

ASP.NET 5 (was vNext)

Mobile Development

Azure

Summary

What’s New (2014 + 2015)

Agenda

The Coganator

Adam Cogan

@AdamCogan

Chief Architect at SSW

Developing custom solutions

Perform Software Audits

Microsoft Gold Partner

Microsoft Regional Director

ASP Insider

ALM MVP


What’s New

In the 2013 Updates

• Better support for IE < 10

• Bug fixes

VS 2013.1

http://support.microsoft.com/kb/2911573Join the Conversation #VS2015 @AdamCogan

http://support.microsoft.com/kb/2911573

Visual Studio

• SQL 2014 support

• TestingCloud load testing + App Insights

integration

Coded UI + Unit Tests for WinPhone 8.1

• Git improvements (blame)

TFS

• Add charts to project portal

• Work Item Tagging

• Import from VSO

• Web• Improved JSON/Sass/Less

editors

• TypeScript 1.0

• Backlog management improvements

Non-working days

Performance

VS 2013.2

http://support.microsoft.com/kb/2927432/en-us

http://support.microsoft.com/kb/2927432/en-us

Visual Studio

• CodeLens for Git

• App Insights bundled in

• Azure Mobile Service project

• Cordova tooling

TFS

• Configurable display on ‘in progress’ items on the backlog

VS 2013.3



Visual Studio

• CodeLens improvements

TFS

• Testing• Charts

• Filtering

• Tagging

• Release Management

VS 2013.4

http://www.visualstudio.com/en-us/news/vs2013-update4-rtm-vs.aspx

http://www.visualstudio.com/en-us/news/vs2013-update4-rtm-vs.aspx

3 Cools things on VisualStudio.com

• 1. MonacoLive editing of

Azure Sites

• 2. Pull Requests for Git

• 3. App InsightsMonitoring of availability

+ Make bug tracking

+ Performance issues

+ usage tracking part of your ALM process

2015 VSO / ALM…

• ? LinqPad

• Git Client

• Code Editor

• Almost as good as VS (desktop)

Intellisense

Highlight references/usage

1. Monaco Editor for VS Online


Boring title, let’s make it more exiting

An afterthought?

Add a dash of excitement

OneDrive…

• TFS History ?

• Annotate (and Blame) rock

• Git Pull Requests give code review abilities

• http://blogs.msdn.com/b/visualstudioalm/archive/201

4/06/10/git-pull-request-visual-studio-online.aspx

Git Pull Requests


http://blogs.msdn.com/b/visualstudioalm/archive/2014/06/10/git-pull-request-visual-studio-online.aspx

Jamal – the new guy


Adam - What did Jamal change?Review the pull request

Adam Cogan


Summary of reviewers’ comments

Adam Cogan

Accepting or Rejecting

Adam Cogan


• Monitoring availability, bugs, performance, usage

• Adds reporting to all your apps

• Telemetry - See how users are using your applications

• Logs data to VS Online

• Helps you inspect and adapt – ALM lifecycle

• http://rules.ssw.com.au/WebSites/RulesToBetterApplicationInsights/P

ages/Do-you-know-the-process-to-improve-the-health-of-your-web-

application.aspx

Application Insights


http://rules.ssw.com.au/WebSites/RulesToBetterApplicationInsights/Pages/Do-you-know-the-process-to-improve-the-health-of-your-web-application.aspx


When should we deploy?

Friday SatThurWedTue Sun Mon Tue

What’s New

In Visual Studio 2015

Biggest User Gripe?

https://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/2837384-change-all-caps-menu-in-vs-2012-to-vs-beta-format

“Change All CAPS Menu in VS 2012 to VS Beta format: File Edit Instead of FILE EDIT” (3056 votes)

https://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/2628203-remove-all-caps

“Remove ALL CAPS” (2072 votes)

https://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/2837384-change-all-caps-menu-in-vs-2012-to-vs-beta-format

https://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/2628203-remove-all-caps

VS 2015


1. Roslyn

http://visualstudiomagazine.com/articles/2012/03/20/10-questions-10-

answers-on-roslyn.aspx

http://blogs.msdn.com/b/dotnet/archive/2014/02/24/a-new-look-for-net-

reference-source.aspx [video] Framework bugs? Reflector

Compilers for C# and VB.NET exposed as services via API

Eg. SSW Code Auditor has Roslyn compiled Rules

APIs for Code Analysis and Refactoring

Eg. SSW Code Auditor can work like CodeLens and highlight errors in the IDE

Resharper

2. New language operators

3. More refactoring

Developer Goodies


http://visualstudiomagazine.com/articles/2012/03/20/10-questions-10-answers-on-roslyn.aspx

http://blogs.msdn.com/b/dotnet/archive/2014/02/24/a-new-look-for-net-reference-source.aspx

What is Roslyn?

• New C# and VB.NET compiler

• Exposes modules for syntactic (lexical) analysis of code

• Letting you write plugins for Code Analysis and Refactoring

• Dynamic Compilation

• Fast!

• E.g. Code Lens, SSW Code Auditor…


Old Regex Rule in Code Auditor

New C# Rules in Code Auditor using Roslyn

Roslyn Syntax Visualizer



It’s still beta

It doesn’t support other

languages e.g. HTML, JavaScript,

etc.

Scripting API was removed

Lack of documentation

Out of the box Parser & Lexer

Allows code fixes

Accurate

It can be used in Standalone

product

Used throughout VS 2015

Reporting Services

The Pros and Cons of Roslyn



Microsoft.CodeAnalysis

https://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/3990187-add-operator-to-c

“Add "?.“ null propagating operator to C#” (5389 votes)

https://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/3990187-add-operator-to-c

VS 2013if (a != null) {

a.Dispose();}

VS 2015a?.Dispose();

event EventHandler OnDoStuff;

void DoStuff() {

if (OnDoStuff != null){

OnDoStuff.Invoke(this, new EventArgs()); }

}

event EventHandler OnDoStuff;

void DoStuff() {

OnDoStuff?.Invoke(this, new EventArgs()); }

? = if it’s not null


Other Language features from Roslyna. Auto Property Initializers

b. Declaration Expressions

c. Primary constructors


Auto Property InitializersVS 2013

public class Foo

{

public int Bar { get; set; }

public Foo()

{

Bar = 5;

}

}

VS 2015

public class Foo{

public int Bar { get; set; } = 5;}

Note: Don’t have to declare a constructor just to set defaults


Declaration ExpressionsVS 2013

public void Stuff()

{

var a = "123";

int b;

int.TryParse(a, out b);

}

VS 2015

public void Stuff()

{

var a = "123";

int.TryParse(a, out var b);

}


c. Primary ConstructorsVS 2013

public class FooBar{

public int X { get; set; }public int Y { get; set; }public FooBar (int x, int y){

X = x;Y = y;

}}

VS 2015

public class FooBar(int x, int y){

public int X { get; set; } = x;public int Y { get; set; } = y;

}

Auto Property Initializers


One of the best language features in .NET…

• In 2008 we got LINQ

• In 2014 the java guys got LINQ in Java 8

• But…



In VS2013.4


In VS2015

Other Language features from Roslyn• For a full list see

• https://roslyn.codeplex.com/wikipage?title=Language%20Feature%20Status&r

eferringTitle=Home

String interpolation

"{0} {1} is {2} years old.“, p.First, p.Last, p.Age

"\{p.First} \{p.Last} is \{p.Age} years old."

• You can write the same thing with 50% less code

• Now developers are now 50% more efficient.

• Bosses will now ask us to ship 50% faster ;)


https://roslyn.codeplex.com/wikipage?title=Language Feature Status&referringTitle=Home

Warning: You need to modify the project file to enable

these new language features (in 2013)

<OutputPath>bin\Debug</OutputPath>

<DefineConstants>DEBUG;TRACE</DefineConstants>

<ErrorReport>prompt</ErrorReport>

<WarningLevel>4</WarningLevel>

<LangVersion>experimental</LangVersion>


More Refactoring… Light bulbs


Light bulbs are the new home for all quick actions you take in the Visual Studio editor

(very similar to ReSharper)

More Refactoring… Get #

Gives you a preview of the refactoring

Code Previews…

Gives you a preview of the code changes Visual Studio will make


Improved Tool TipsVS 2013 VS 2015


Improved Tool TipsVS 2013 VS 2015


Code Lens


Impediments with Unit Tests…

• The code might not lend itself to being unit testable

• Tight dependencies

• External environments…

• Difficult to measuring test quality

• Code coverage

• Number of assertions

• The happy path vs edge cases

• What assertions should we put in?


Smart Unit Tests…

• Address these impediments.

• Goes through the code, finding all of the possible

code paths

• Generates unit tests for each scenario it finds


What’s wrong with this code?


Right click method name to get “Smart Unit Test” option.


Automatically created unit tests.


Fix the code

Re-run smart tests after adding null reference check


Smart Unit tests are not an excuse not to write Unit Tests!

Blend…




Windows 10 will be HUGEIt will be a FREE upgrade for anyone on Win 7/8/8.1 for the first 12 months

It can be run on small devices, such as Raspberry Pi 2 (Headless)

It will be easy to develop solutions targeting more stuff, such as Xbox One and

new Augmented Reality headset (Holo Lens -

https://www.youtube.com/watch?v=aThCr0PsyuA)

Cortana (i.e. Siri or Google Voice) is coming pre-installed in Windows 10

Spartan web browser are coming to Windows 10. It is exciting.


https://www.youtube.com/watch?v=aThCr0PsyuA

NET has gone Open Source on GitHub

Microsoft is providing the full .NET server stack in open source, including

- ASP.NET,

- the .NET compiler,

- the .NET Core Runtime,

- Framework and Libraries

Will enable developers to build with .NET across Windows, Mac or Linux.


Shared Projects vs PCLFor 10 years we copied and pasted code and compiled against each platform

(Windows Mobile 6 vs Windows Form)

In VS2010 SP1 – PCLs were introduced, share the DLL, but we couldn't make use

of platform specific hardware

In VS2013 – PCLs for Windows 8.1

In VS2013.2 –Shared Projects for Windows 8.1 and Windows Phone 8.1 Projects.

Shared Projects could only be used for Universal XAML apps,

PCLs could be used for all other project types


Shared Projects

Think of code existing in a Shared Project as actually

belonging to the project that references it

It produces no DLLs so you can’t Unit Test shared

projects directly



public class NavigationHelper{

public NavigationHelper(){

#if WINDOWS_PHONE_APPWindows.Phone.UI.Input.HardwareButtons.BackPressed

+= HardwareButtons_BackPressed;#elif WINDOWS_APP

// Ignore. Windows Store doesn't have support for this.#else

#error Unknown platform#endif

}

// ...}

VS 2015

Can used Shared Projects for all projects

(MVC, WinForms)


Portable Class Libraries

Is the minimum .NET Framework that runs across different

platforms

Good cross platform development

Produces a DLL that can be referenced by other projects

Unit Testable



Harder to share actual code to

projects outside the solution

Can quickly become

unmaintainable

Allow using platform specific

APIs by using #if

Can handle cases where the

source is compatible but the

binary wouldn’t be

Can include non-code resources


Shared Projects

You get the minimum set of

classes/features across the different

platforms

Harder to make use of platform

specific functionality within the logic of

the PCL

E.g. PCL handles grabbing information

from the device’s sensors, can’t get

something new like developer’s coffee

intake, but just what’s common (GPS,

direction)

Can share code via NuGet

packages

Can specify which platforms the

PCL will target


Portable Class Libraries

Recommendation

Use Portable Class Libraries where you don’t need

platform specific features


Slow Code


PerfTips

How long was your program running during the

previous step or since the last breakpoint?


Debugging made easier

IntelliTrace?


IntelliTrace in VS2015

Faster

More Stats while debugging





Zoom in on the timeline and see breakpoints and exceptions

See Debug/Output statements in the timeline and debugger tab



Mobile Development

Azure

Summary

What’s New

Agenda

Mobile Development

With Xamarin Forms

Developers! Developers! Developers!

Mobile First!Mobile First! Mobile First!

+ Cloud First!

• ?

• Native

• Hybrid - HTML5 + Javascript/TypeScript (Cordova)

• Cross Compilers (Xamarin, NativeScript)

How many mobile options?


http://www.telerik.com/nativescript

• Write shared code in HTML

and Javascript

• Compiles into a Hybrid App on

Windows Phone, Android and

iOS

• VS2013 Update 3

Cordova

Suggestion

Actual?





Ripple?Apache Ripple is

a web based

mobile

environment

simulator


• ?

• When it’s sucky and clunky

• See if they are using native UI elements

E.g. Gmail when you swipe to delete it’s a different style button

• Show me a Hybrid app as good as Runkeeper and I’ll

switch

How do you tell when you are in a Hybrid App?


Spot the hybrid app


iOS Android

@AdamCogan

“There’s two kinds of mobile developers: Those developing native apps & those that wish they were.”

• Mono…. “Microsoft support Miguel”

• .NET Foundation – Open sourcing .NET

• http://www.dotnetfoundation.org

• Microsoft contributed Roslyn

• Roslyn makes it easier for .NET apps to run on Mac and Linux

• Microsoft and Xamarin are closely working together

Microsoft + Xamarin


http://www.dotnetfoundation.org/

• ? Write C#

• Build native mobile apps

• 3 apps - Learn the Xamarin API, deploy to many devices

• Less learning - Provides an abstraction over the native APIs

• Goal is to use the lowest common denominator

• Not limited - Still lets you directly call the native APIs

• Still need to code the UI natively for each platform

Xamarin is cool because…


• Abstraction over the UI

• Compiler will convert the UI

elements into their native

counterparts

• Can still do native customizations

E.g. For WinPhone – adding the carousel

• Sexy UI Designer…

Xamarin.Forms


Sexy UI designer…var profilePage = new ContentPage {

Title = "Profile",Icon = "Profile.png",Content = new StackLayout {

Spacing = 20, Padding = 50,VerticalOptions = LayoutOptions.Center,Children = {

new Entry { Placeholder = "Username" },new Entry { Placeholder = "Password", IsPassword = true },new Button {

Text = "Login",TextColor = Color.White,BackgroundColor = Color.FromHex("77D065") }}}

}; var settingsPage = new ContentPage {

Title = "Settings",Icon = "Settings.png",(...)

};var mainPage = new TabbedPage { Children = { profilePage, settingsPage } };


Compiles and uses Native Controls

You can either use:

• C#

• XAML (no designer, no intellisense)

Sexy UI designer…


Pages


Layouts


Image

Label

ListView

Map

OpenGLView

Picker

Controls

SearchBar

Slider

Stepper

TableView

TimePicker

WebView

ActivityIndicator

BoxView

Button

DatePicker

Editor

Entry

EntryCell

ImageCell

SwitchCell

TextCell

ViewCell


http://rules.ssw.com.au/

• Category

Sub Category

Rules

Building a mobile app for SSW Rules

http://rules.ssw.com.au/

#exploring demo

1. File | New Project

2. F5

3. Add 2 content page (stack layout + grid layout)

4. Add a menu - Group the pages into a tabbed page


Demo #1

File | New Project

If you have a Mac on

the network you can

install the Build host

to build the iOS

project

Shared Project

Android

iOS

Windows Phone


F5 – Start testing on the two biggest mobile platforms


Anyone running

Android?


Use the emulator

Bad Android devs think they have 1 option


• Use a device

• Use genymotion.com (but you have to give up Hyper-V

and the Windows Phone emulator)

• Or Hyper-V haxm (open GL drivers and x86 optimization

for the android emulator)

• VS2015 bundles a emulator for Android (Lollipop API

Level 21)

The good Android devs know


And the 2nd major

mobile platform…


Windows Phone emulator uses

Hyper-V


Demo #2

Showing off the controls – Stack Layout

Stack Layout with 4 controls




Demo #3

Showing off the controls – Grid Layout

Grid Layout with 4 rows and 3 columns



Add some content and colour// Column 0 to Column 3, Row 0 to Row 1

grid.Children.Add(new Label { Text = "Label 1", HorizontalOptions = LayoutOptions.Center }, 0, 3, 0, 1);

// Column 0, Row 1

grid.Children.Add(new Label { Text = "Label 2", TextColor = Color.White, BackgroundColor = Color.Lime }, 0, 1);

// Column 1, Row 1

grid.Children.Add(new BoxView { Color = Color.Red }, 1, 1);

// Column 0, Row 2

grid.Children.Add(new BoxView { Color = Color.Blue }, 0, 2);

// Column 1, Row 2

grid.Children.Add(new Label { Text = "Label 3", TextColor = Color.Purple, BackgroundColor = Color.Gray }, 1, 2);

// Column 2 to Column 3, Row 1 to Row 3

grid.Children.Add(new Label { Text = "Label 4", TextColor = Color.Yellow, BackgroundColor = Color.Navy }, 2, 3, 1, 3);

// Column 0 to Column 2, Row 3 to Row 4

grid.Children.Add(new Label { Text = "Label 4", TextColor = Color.Red, BackgroundColor = Color.Silver }, 0, 2, 3, 4);

// Column 2, Row 3

grid.Children.Add(new Label { Text = "Label 5", TextColor = Color.Aqua, BackgroundColor = Color.Red }, 2, 3);

Content = grid;


4 rows

3 columns



Demo #4

Showing off the controls – Add a Tabbed Page

public static Page GetMainPage()

{

return new TabbedPage

{

Children =

{

new StackLayoutPage { Title = "Stack" },

new GridLayoutPage { Title = "Grid"}

}

};

}

Tabbed Page showing our Stack and Grid



Demo #5

Create SSW Rules App

#realapp

1. Start coding our Rules app [5 content pages]

1. Category Page

2. Sub Category Page

3. Rules List page

4. Rule Page #shortcut

5. Search Page …


Category Page

• Add Nuget package (REST rules.ssw.com.au)

• Load the list of top level categories

Bind

• When we ‘click’, go to sub categories

Now the serious stuff…Building the SSW Rule App


public RuleCategoryPage(string url){

Title = "SSW Rules";BaseUrl = url;ListView = new ListView();

// Create a template for out list viewvar cell = new DataTemplate(typeof(TextCell));cell.SetBinding(TextCell.TextProperty, "Title");ListView.ItemTemplate = cell;

Content = new StackLayout(){

VerticalOptions = LayoutOptions.FillAndExpand,Children = { ListView }

};

Create a template for the list viewCreate a DataTemplate

for the ListView, bind the Text property to

“Title” in our data


protected override async void OnAppearing(){

base.OnAppearing();

// Create our sharepoint rules clientvar client = new SswSharePointRulesClient();

// Get a list of toplevel categoriesvar categoryResult = client.GetRuleCategories(BaseUrl);var categories = await categoryResult;

ViewModel = new RuleCategoryViewModel(){

Categories = new ObservableCollection<RuleCategoryModel>(categories)};

// Bind out results to the list viewListView.ItemsSource = ViewModel.Categories;

}

Load categories, bind on load

Call SharePoint REST API to grab our categories

Bind results to our list view


public RuleCategoryPage(string url)

{

Title = "SSW Rules";

BaseUrl = url;

ListView = new ListView();

// Create a template for out list view

var cell = new DataTemplate(typeof(TextCell));

cell.SetBinding(TextCell.TextProperty, "Title");

ListView.ItemTemplate = cell;

Content = new StackLayout()

{

VerticalOptions = LayoutOptions.FillAndExpand,

Children = { ListView }

};

ListView.ItemSelected += OnListViewOnItemSelected;

}

protected virtual void OnListViewOnItemSelected(object sender, SelectedItemChangedEventArgs args)

{

var category = (RuleCategoryModel)args.SelectedItem;

var subCategoryPage = new RuleSubCategoryPage(category.Url);

Navigation.PushAsync(subCategoryPage);

}

Add event handlers – Item Selected

Attach an event handler to the ItemSelected event

Instantiate the RuleSubCategory page with

the Url of the category

Change the current page



<?xml version="1.0" encoding="utf-8" ?><ContentPage xmlns="http://xamarin.com/schemas/2014/forms"

xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"x:Class="SSW.Rules.Mobile.RuleContentXamlPage" ><WebView VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"

Source="{Binding Url}" /></ContentPage>

#shortcutView the Rule with a WebView (XAML)

WebView is basically an iframe

Set the Source as the URL of our rule



Demo #6

Add a search page

• SearchBar

• Label for result count

• ListView to show the results

Create a Search Page



• TFS - https://tfsodata.visualstudio.com/ (bad ODATA – read only)

• TFS - https://visualstudio.com/integrate (good REST)

• REST APIs rock

https://developers.google.com/

https://developers.facebook.com/

https://dev.twitter.com/

https://developer.nokia.com/

https://developer.github.com/

http://developer.xamarin.com/

https://Developer.visualstudio.com

REST APIs


https://tfsodata.visualstudio.com/

https://visualstudio.com/integrate

https://developers.google.com/


https://dev.twitter.com/

https://developer.nokia.com/

https://developer.github.com/


https://developer.visualstudio.com/

• SharePoint - http://msdn.microsoft.com/en-us/library/office/jj860569(v=office.15).aspx

• Office 365 - http://msdn.microsoft.com/en-us/library/office/dn605892(v=office.15).aspx

• Azure - http://msdn.microsoft.com/en-us/library/azure/ee460799.aspx

Even better would be to use the .NET libraries

http://www.bradygaster.com/post/getting-started-with-the-windows-azure-

management-libraries

• Yours?

• Note: RestSharp is a great .NET library for calling REST apis

REST APIs


http://msdn.microsoft.com/en-us/library/office/jj860569(v=office.15).aspx

http://msdn.microsoft.com/en-us/library/office/dn605892(v=office.15).aspx

http://msdn.microsoft.com/en-us/library/azure/ee460799.aspx

http://www.bradygaster.com/post/getting-started-with-the-windows-azure-management-libraries

https://github.com/glennstephens/xfTemplates

Hot Tip – Resharper templates for Xamarin.Forms


https://github.com/glennstephens/xfTemplates



Mobile Development

Azure

Summary

What’s New

Agenda

Express

• October 2005 - Microsoft releases a free IDE

• Limited version Professional edition

• No licensing restrictions for applications

• No Extensions (No ReSharper / Web Essentials…)


Express was not good enough…• Visual Studio Express was crippled - no extensions

• Needlessly segmented into separate installers (Web, Windows, Desktop)

• Paid version too expensive for students and individuals

• Cheaper options for developers and languages

• Jetbrains ( Java, Php, Ruby, Phyton, Frontent Dev ( Javascript, Node.js, CSS, etc)

• Sublime

• Atom.io

• Notepad++

• …

“Visual Studio is universally praised, but if you talk to a developer in college or straight out of college, they don’t want to pay,”

“We want to eliminate that friction and enable more developers to use it on a day-to-day basis.”

Scott Guthrie, Microsoft


Goodbye Express, welcome Visual Studio 2013 Community...

• November 2014 - Microsoft finally releases a *decent* free IDE

• *All* the great functionality of Visual Studio Professional 2013

• Any individual developer can use it to create their own free or

paid apps.

• Unlimited number of users within an organization for learning,

academic research, or for contributing to open source projects

• Choose from thousands of extensions for Visual Studio


http://visualstudiogallery.msdn.microsoft.com/

What will change?

• Today for VS 2013 there are 2020 extensions

• Web Essentials

• Package Intellisense (NPM)

• Grunt Launcher

• PHP Tools for Visual Studio

• NTVS (Node.js Tools for Visual Studio) this is a plugin

• Python Tools for Visual Studio

• But…


What will change?6 kinds of developers

1. HTML and JS devs

2. Node.js devs

3. PHP devs

4. Python devs

5. Non windows devs

6. VS devs (Express and Professional)

7. Administrators


1. HTML and JS devs

• will jump on the bandwagon

• will love Bower support


2. Node.js devs

• will grow slowly, stay niche... but will jump

• will love NPM package support (non .NET server side)

• will love the new grunt support (especially the task

runner)


3. PHP devs

• will not move because

• they require a better PC than a 486

• find copy and paste too slow

• they would hate the 3 hour download and install


4. Python devs

• are the unknown - the beginner devs will switch

• will love the support VS has for git

• will love the command line driven approach they can continue

to use in the new environment

• will be happy that they get PiP for packing (because they won’t

switch to Nuget)

• progressive universities will be happy to teach it


5. Non windows devs

We can only hope they find http://www.omnisharp.net

(it is a cross platform plugin for a number of editors –

Sublime, Atom, Emacs, Brackets, Vim - that allow you to

develop .net)


http://www.omnisharp.net/

6. VS devs (Express and Professional)

(not specifically related to the community edition but)

• The majority of Microsoft devs will be shocked at the

amount of change in 2015.

• Most wont like that VS is even more complex.

• They will have to deal with it and grow.


7. Administrators

- Want to run ASP.NET on Linux

- Today ASP.NET runs on Mono on Linux and Mac

- Tomorrow ASP.NET will run on the new .NET Core on

Linux and Mac (and be supported)


Conclusionnew open source .Net Core

+

free VS Community

=

A lot of potential unlocked…

E.g. Develop self contained website for free, Docker deploy to an IoT device

(Win10 or Linux embedded e.g RaspberryPi).


State of the Web



MVC4 + WebAPI + TypeScript + KnockoutJS

MVC5 ?

Last Year I recommended…


Restoring packages for c:\users\ericphan\documents\visual studio 14\Projects\WebApplication3\WebApplication3\project.json

Attempting to resolve dependency WebApplication3 >= 1.0.0

Attempting to resolve dependency EntityFramework.SqlServer >= 7.0.0-alpha2

OPEN EntityFramework.SqlServer.7.0.0-alpha2.nupkg

OPEN EntityFramework.SqlServer.7.0.0-alpha2\EntityFramework.SqlServer.7.0.0-alpha2.nuspec

Attempting to resolve dependency Microsoft.AspNet.Mvc >= 6.0.0-alpha2

OPEN Microsoft.AspNet.Mvc.6.0.0-alpha2.nupkg

OPEN Microsoft.AspNet.Mvc.Common.6.0.0-alpha2.nupkg

:

:

OPEN Microsoft.AspNet.Mvc.Razor.Host.6.0.0-alpha2\Microsoft.AspNet.Mvc.Razor.Host.6.0.0-alpha2.nuspec

Attempting to resolve dependency EntityFramework.Migrations >= 7.0.0-alpha2

OPEN EntityFramework.Migrations.7.0.0-alpha2.nupkg

OPEN EntityFramework.Migrations.Design.7.0.0-alpha2.nupkg

OPEN EntityFramework.Migrations.7.0.0-alpha2\EntityFramework.Migrations.7.0.0-alpha2.nuspec

OPEN EntityFramework.Migrations.Design.7.0.0-alpha2\EntityFramework.Migrations.Design.7.0.0-alpha2.nuspec

Everything is a NuGet package

Change of attitude?

NUnit released in 2002 – Becomes the standard for .Net

With Visual Studio 2005 Microsoft releases MSTest

MSTest almost identical to NUnit

Why not support NUnit instead?


New terms for the .NET Developer

• Bower

• Grunt

• NPM

• OWIN


<Next PBI – create a cool logo>

• project.json

• config.json

• package.json

• bower.json

• gruntfile.js

No more web.configNo more csproj

• Add references to NuGet packages here

• Full intellisense

• IIS/Hosting configuration

project.json



Do we have to manually type in NuGetPackages into project.json?




New NuGet Package Manager

• Looks nicer

• Makes it easier to install other version of NuGet

packages


Web.config

Stores connection strings and other app settings

config.json

{"Data": {

"DefaultConnection": { "ConnectionString":

"Server=(localdb)\\mssqllocaldb;Database=aspnetvnext-WebApplication3-15606acb-81ef-4c1e-97c1-ac0b2d4e4a33;Trusted_Connection=True;MultipleActiveResultSets=true"

}}

}


• List if NPM (Node Package Manager) packages

• NPM is a javascript package manager for

development tasks (e.g. minification, bundling, image

optimization)

package.json

package.json{

"version": "0.0.0","name": "","devDependencies": {

"grunt": "0.4.5","grunt-bower-task": "0.4.0"

}}

Bower is a front end javascript package manager

(created by Twitter)

bower.json

bower.json{

"name": "WebApplication","private": true,"dependencies": {

"bootstrap": "3.0.0",

"jquery": "1.10.2","jquery-validation": "1.11.1","jquery-validation-unobtrusive": "3.2.2","hammer.js": "2.0.4","bootstrap-touch-carousel": "0.8.0"

},"exportsOverride": {"bootstrap": {

"js": "dist/js/*.*","css": "dist/css/*.*","fonts": "dist/fonts/*.*"

},:

}

• A javascript task runner (also an npm package)

• Use it to process your js and css files

gruntfile.js

gruntfile.jsmodule.exports = function (grunt) {

grunt.initConfig({bower: {

install: {options: {

targetDir: "wwwroot/lib",layout: "byComponent",cleanTargetDir: false

}}

}});grunt.registerTask("default", ["bower:install"]);grunt.loadNpmTasks("grunt-bower-task");

};

What about NuGet?

• NuGet - .NET Dependencies (SignalR, Owin)

• Bower – Frontend Javascript Dependencies (jQuery,

Angular)

• NPM – Backend Javascript Dev Tools (lodash, browserify,

watchify, grunt, JSHint)

• Grunt/Gulp – MSBuild for client side files


wwwroot?• Static files go here (*.js, *.png, *.jpg)

• Maps to http://hostname/

• Cleaner separation between code

files and static files

• TypeScript, LESS should not be put in

here, only the output of these files

should be placed in here


http://hostname/

• Built in

• Startup.cs uses it

• StructureMap, AutoFac, Ninject, Windsor, and Unity

Dependency Injection

using Microsoft.Framework.DependencyInjection; public class Startup{

public void Configure(IBuilder app)



Dependency Inject

• Can use it in Razor page too


@using WebApplication23@inject TimeService TimeSvc

<h3>@ViewBag.Message</h3>

<h3>@TimeSvc.Ticks From Razor

</h3>

WebAPI and Controllers in one

public class ValuesController : Controller{

// GET /valuespublic string Get() { return "Values"; }

// GET /values/1public string Get(int id) { return "Value " + id.ToString(); }

// POST /valuespublic ActionResult Post() { return new HttpStatusCodeResult(201); }

}

http://rules.ssw.com.au/SoftwareDevelopment/RulesToBetterWebAPI/Pages/Default.aspxJoin the Conversation #VS2015 @AdamCogan

http://rules.ssw.com.au/SoftwareDevelopment/RulesToBetterWebAPI/Pages/Default.aspx

New - View Components• Similar to partial views, but more powerful.

• Include the same separation-of-concerns and testability benefits found between a controller

and view.

• Like a mini-controller—responsible for rendering a chunk rather than a whole response.

• Can solve any problem that is too complex with a partial, such as:

• Dynamic navigation menus

• Tag cloud (where it queries the database)

• Login panel

• Shopping cart

• …


• Define what services and features this app will be using via Owin

• Services

EF

MVC

• Routes

• Features

BrowserLink

Static Files

• Authentication

Startup.cs


Tip - What can you do to make IIS Faster?Disable Modules

OWIN

• Owin is a standardised interface between web

servers and web applications.

• This means web servers that support Owin can run

any apps that implement Owin

• e.g. ASP.NET MVC running on Linux or OSX


OWIN• Owin.dll contains a single interface IAppBuilder

• Use this to register any middleware components that can handle the

web request

• SignalR

• ASP.NET Identity

• WebAPI

• This means your HTTP pipeline is optimized for just what you need,

instead of the old IIS default http modules that get loaded by default.


Startup.cs

app.UseIdentity()

app.UseStaticFiles()

app.UseMvc()

Re

qu

est /H

om

e/In

de

x

Re

qu

est /C

on

ten

t/logo

.pn

gRegister OWIN middleware

1st Request comes in to an MVC page

Verifies user is logged in and passes onto the next OWIN middleware

Not a static file, so move onto the next OWIN middle wear

MVC route handles request and returns to the client

2nd Request comes in for an image

Skips check and moves on, because we allow anonymous

Static file handler gets the file and returns to the client

Old

@Html.ActionLink(“Click me”, “View”, “Controller”)

New

<a asp-controller=“Controller” asp-view=“Index”>Click me</a>


Razor Tag Helpers


Razor Tag [email protected](true, "", new { @class = "text-danger" })<div class="form-group">

@Html.LabelFor(m => m.UserName, new { @class = "col-md-2 control-label" })<div class="col-md-10">

@Html.TextBoxFor(m => m.UserName, new { @class = "form-control" })@Html.ValidationMessageFor(m => m.UserName, "", new { @class = "text-danger" })

</div></div>

New<div asp-validation-summary="ModelOnly" class="text-danger"></div><div class="form-group">

<label asp-for="UserName" class="col-md-2 control-label"></label><div class="col-md-10">

<input asp-for="UserName" class="form-control" /><span asp-validation-for="UserName" class="text-danger"></span>

</div></div>

Harder to tell server side code

from client side code

More HTML like

More readable

More control over how the

HTML outputs


Razor Tag Helpers

No need to hit build, just save and refresh (powered by Roslyn)


AngularJS


AngularJShttp://www.adamcogan.com/2014/11/13/why-ssw-is-moving-to-angularjs/

https://github.com/johnpapa/angularjs-styleguide

http://www.ssw.com.au/ssw/Events/Webinars/DevSuperpowers-AngularJS-with-TypeScript.aspx

http://tv.ssw.com/5682/how-to-make-web-applications-with-angularjs-and-asp-net-mvc-dev-

superpowers-episode-7

http://tv.ssw.com/5818/angularjs-with-dan-wahlin

http://www.adamcogan.com/2014/11/13/why-ssw-is-moving-to-angularjs/

https://github.com/johnpapa/angularjs-styleguide

http://www.ssw.com.au/ssw/Events/Webinars/DevSuperpowers-AngularJS-with-TypeScript.aspx

http://tv.ssw.com/5682/how-to-make-web-applications-with-angularjs-and-asp-net-mvc-dev-superpowers-episode-7

http://tv.ssw.com/5818/angularjs-with-dan-wahlin

Dev Superpowers - AngularJS with TypeScriptmade easy with Duncan Hunter


How to make web applications with AngularJS and ASP.NET MVC | Dev SuperPowers Episode 7


The future of AngularJS: an interview with Dan Wahlin


AngularJS + VS2015

Built in templates to create

• Controller

• Service

• Directive

• Factory

• Module



AngularJS + VS2015 - Suggestion

Make these create TypeScript files instead of JavaScript

files

News – Angular 2.0 is to be written using TypeScript


SignalR

• Add via the NuGet package

• Real time communication between clients

• Good for:

• Showing progress on long running tasks

• Interactive apps

• Team collaboration


SignalR in action

https://sswhealthcheck.com/

https://sugarlearning.com/Public/healthcheck

https://sswlinkauditor.com/

Visual Studio BrowserLink




https://sswlinkauditor.com/

ASP.NET 5 - KRE, KVM, KPM

• KRE – K Runtime Environment

• Code required to bootstrap and run an ASP.NET 5 application.

• KVM – K Version Manager

• Updating and installing different versions of KRE. KVM is also used to set

default KRE version.

• KPM – K Package Manager

• Manages packages needed by applications to run (NuGet)



Example – Download K, grab source from Git, run app!@powershell -NoProfile -ExecutionPolicy unrestricted -Command "iex ((new-object

net.webclient).DownloadString('https://raw.githubusercontent.com/aspnet/Home/master/kvminstall.

ps1'))"

kvm upgrade

git clone https://github.com/aspnet/Home.git

cd Home\samples\HelloWeb\

kpm restore

k web


• WCF

• Highly customizable

• Hard to configure

• Can work with multiple protocols

TCP, UDP, MSMQ

• Can use multiple encodings: Text,

XML, MTOM, Binary

• Duplex binding (two way

communication)

• Reliable messaging

• WebAPI

• Works with the HTTP protocol

• More interoperable with other

platforms

• Can only encode to a few

formats

• Can do two way

communication using SignalR


WCF or WebAPI?

ECMA Script 6

• LINQ in javascript!

• But… Browser compatibility

• http://kangax.github.io/compat-table/es6/


// Old Way[1,2,3].map(function (x) {

return x * x;});

// New Way[1,2,3].map(x => x * x);

Still use Typescript

• Supports LINQ already

• Can set it to compile to different ECMA Script

versions

• Better intellisense support in VS


Say goodbye…

- ASP.NET 4

- ASP.NET 5

- No Web Forms

- No VB.NET

- Faster

- Cheaper hosting (Linux, Mac)



• project.json (was dependencies)

• config.json (was web.config)

• Javascript package managers and builders (NPM, Bower, Grunt)

• Dependency Injection included

• ApiController is Controller

• Startup class using OWIN (was \App_Start + global.asax)

• Razor Tag Helpers

• Compile ahead of time, no need to compile to see changes

• More love for Angular

• No

• + …

Summary - What’s changed in ASP.NET 5?




Mobile Development

Azure + Continuous Deployment + Testing

Summary

What’s New

Agenda

What are Azure Deployment Slots?

Auto Swap

Swapping

Testing in Production

Continuous Deploy to Deployment SlotsAzure + Continuous Deployment + Testing

Boss says “Azure is slow”• We are a large cinema chain

• We have a 100 MB Deployment and an IIS startup time of 1 minute

• We have a large customer base

• We use Sitefinity

• We deploy multiple times a day

• The boss checks his site coincidentally right after we deploy! (He

thinks Azure is slow)


A:

Deploy less often

Or

Learn about Azure Deployment Slots

(they can make your downtime 0)


A:

Dev

Test

Prod

Who has this?


A:Dev

Test / QA

UAT

Staging / Preprod

Prod / Live

www.northwind.com (1+2 Azure Deployment Slots)

Prod1 - www1.northwind.com Azure Deployment Slot #1 (Make Live) aka Swap

Prod2 – www2.northwind.com Azure Deployment Slot #2


Good example - Do you use Azure Deployment Slots on production?


ConfigureDeployment Slots


Deploy to pre-prod• Deploy a version of your website to the

pre-production slot

• Use Azure Continuous Deployment or

any of your favourite deployment tools


The beauty of “Swap”

• No cold start

• The swap will simply switch pointers

• Changes can be rolled back by reversing the swap


Deployment Slots

• Available on Standard Plan

• Up to 4 deployment slots for 1 production slot

• Scaling is not available for non-production slots.

• Shares the same resources as your production slots (sites)

and runs on the same VMs


Eg. http://www1.northwind.com

Eg. http://azuredeploy-preprod.azurewebsites.net

Eg. http://www.northwind.com

Eg. http://azuredeploy.azurewebsites.net

Settings that are not swapped:

Publishing endpoints (URL,

ConnectionString)

Custom Domain Names

SSL certificates and bindings

Scale settings

Continuous Deployment

Settings

Settings that are swapped:

General settings - such as

framework version, 32/64-bit, Web

sockets

App settings (can be configured to

stick to a slot)

Connection strings (can be

configured to stick to a slot)

Handler mappings

Monitoring and diagnostic settings


Configure Settings

Configure Sticky Slot Settings• App settings and connection strings are

swapped by default

• App settings and connection strings

can be set to “Slot Sticky”


Testing in production• A/B/N Testing

• Similar to Google Content Experiments

• Use App Insights to measure results

• ? 50/50 vs 33/33/33

• Using Production users as Testers

• Route traffic between your deployment

slots based on percentage of the traffic

• Use App Insights to check for problems





20%80%

Why should I use Testing in Production

• Measure effectiveness of different implementations of a

feature

• Test which site leads to a decrease in bounce rate, or to

the greatest increase in revenue or session duration

• Testing new features without affecting all users

(Making your disaster less of a disaster)


Auto Swap• Addresses the “cold start” issue

• When you deploy your code changes, a

swap will automatically take place once

the deployment is complete




When deployment is finished, a swap will automatically take place

Eg. http://www1.northwind.com

Eg. http://azuredeploy-preprod.azurewebsites.net


Do you know how to find bad smells in code?

The state of testing• Code

• VS Unit Tests (recommended)

• Nunit Tests

• UI

• Coded UI Tests with MTM

• Selenium + Chutzpah (recommended)

• Javascript

• JSUnit

• Qunit (made by the jQuery team)

• Mocha (new comer)

• Jasmine + Chutzpah (recommended)

Chutzpah

Lets you run Javascript unit tests in Visual Studio

1. Write your unit tests in your favourite framework

( Jasmine, Mocha)

2. Get the Chutzpah VS extension

3. Right click run tests!






xUnit.net First Class Citizen in 2015


Old way using MSTestNew way using xUnit.net

MVC + WebAPI + TypeScript + KnockoutJS + AngularJS

This Year I recommend…

• SPA app front end + WebAPI backend

• Use App Insights for usage tracking + DevOps

• Xamarin.Forms for native cross platform mobile development

• Continuous deployment to Azure using Testing in Production and Deployment Slots

• Testing

• .NET VS Tests

• Selenium

• Javascript (Jasmine + Chutzpah)




Mobile Development

Azure + Continuous Deployment

Summary

What’s New

Agenda

2 things...

@AdamCogan #NetUG

Tweet your favourite feature


Tweet your favourite video @SSWTV

Check out tv.ssw.com


Thank you!

[email protected]

www.ssw.com.au

Sydney | Melbourne | Brisbane | Adelaide

mailto:[email protected]

find me on slideshare:

http://www.slideshare.net/SSWconsulting/

http://www.slideshare.net/SSWconsulting/

What’s new in VS 2015 and ALM 2015

Software

adamcogan visualstudio

backlog vs

adamcogan chief architect

daysperformance vs

adamcogan whats newin

vs onlinejoin th

updatesbetter support

git supporttypescriptwebmvc