Scott Hanselman

Xamarin .NET Workbooks - Interactive Computing is a stellar learning tool

February 24, 2017 Comment on this post [11] Posted in DotNetCore | Learning .NET
Sponsored By

I've been thinking a lot about how to best teach .NET and C#/F# to folks who are new to the space. We've added an in-browser no-install C# tutorial at http://dot.net. You can run through almost a few days lessons in C# without installing anything. Heck, it's useful even if you just want to brush up on your skills.

When I spoke with Safia Abdalla a few months ago she re-introduced me to the ideas behind Interactive Computing and the whole ecosystem around Jupyter Notebooks, and the Nteract project Safia works on. It's pretty amazing.

Pythonistas are familiar with Jupyter and the idea of a notebook that cleanly mixes prose and code. This ecosystem is very friendly to data scientists that are (perhaps) more scientist and less developer. People for whom an IDE is not as interesting as "electric paper."

In fact, many people don't realize that the Microsoft Azure Cloud supports hosting of Jupyter Notebooks using Python, R, and F#.

Azure Notebooks

Notebooks are a great learning resource that go beyond a REPL (an simple interactive console) in that they are effectively textbooks with islands of interactive code. It's even more powerful when you consider graphics, charts, and other interactive models.

Xamarin has a thing called Xamarin Workbooks (I'm calling them .NET Workbooks in my head) that you should download and check out RIGHT NOW. Go get Xamarin Workbooks & Inspector for Windows (or download for Mac). Start playing around with workbooks or try out the samples.

I'm going to try teaching my C# and .NET courses for at least the first day or two using Xamarin .NET Workbooks. I think they have huge potential and I'm thrilled that Miguel and friends are investing so much in them. The potential for these as a learning tool that sits between a REPL and an IDE is huge.

The page at https://developer.xamarin.com/workbooks/ is FILLED with amazing example workbooks and lessons, and it's growing. It has section not only on C# but Android, Games, Graphics as a concept, iOS, WPF, and so much more.

I run it and start here:

Xamarin Workbooks

Then I start typing...prose first! Just real sentences. Then I add some code. Notice that I'm not doing Console.WriteLine, I'm just assigning a variable. Xamarin Workbooks makes a nice visualization of my variable.

var scott = "Hanselman"

The prose is ignored (by the compiler) but the code cells and built upon each other and when you execute one you're executing up to that point. Great for building up concepts.

You can print in other libraries and built upon them like in this chart example using the Urho library.

Charts in Xamarin Workbooks

Not to put to fine a point on it, but you can write really fully featured examples or games in Xamarin Workbooks. Here's a fully 3D realized planet earth WITH SATELLITES. Again, with not just sample code but explanatory prose. It's a textbook come to life.

THIS is how I wish I learned programming 25 years ago. I'd loved to have turned (or demo'ed) a .workbook file. I'm thrilled to see C# folks be able to do simple things that Jupyter users have enjoyed for so long.

3D Earth in Xamarin Workbooks

What do you think? Would this be a good way to deliver a course on learning .NET and C#?


Sponsor: Big thanks to Progress! They recently published a comprehensive whitepaper on The State of C#, discussing the history of C#, what’s new in C# 7 and whether C# is still a viable language. Check it out!

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

Azure App Service Secrets and Web Site Hidden Gems

February 22, 2017 Comment on this post [22] Posted in Azure
Sponsored By

I just discovered that you can see a preview (almost like a daily build) of the Azure Portal if you go to https://preview.portal.azure.com instead of https://portal.azure.com. Sometimes the changes are big, sometimes they are subtle. It feels faster to me.

Azure Preview Portal

A few days ago I blogged that I had found a number of things in Azure that I wasn't previously aware of like "Metrics per instance (App Service)" which is DEEPLY useful if you run more than one Web App inside an App Service Plan. Remember, an App Service Plan is basically a VM and you can run as many Websites, docker containers, Azure Functions, Mobile Apps, Api Apps, Logic apps, and whatever you can fit in there. Density is the word of the day.

Azure App Service Secrets and Hidden Gems

A bunch of folks agreed that there were some real hidden gems worth exploring so I thought I'd take a moment and do just that. Here's a few of the things that I'm continuously amazed are included for free with App Service.

Console

The Console option under Development Tools

There's a web-based console that you can access from the Azure Portal to explore your apps!

Live HTML5 Console within the Azure Portal

This is basically an HTML 5 bash prompt. I find it useful to double check the contents of certain files in Production, and confirm environment variables are set. I also, for some reason, find it comforting to see that my "cloud web site" actually lives on Drive D:. It calms me to know the Cloud has a D Drive.

App Service Editor

App Service Editor

App Service Editor is the editor that's codenamed "Monaco" that powers Visual Studio Code. It's amazing and few people know about it. I use it to make quick updates to production, although you do need to be aware if you have Continuous Deployment enabled that your changes will get eventually overwritten.

It's like a whole "IDE in the Cloud"

Testing in Production - (A/B Testing)

This is an amazing feature that not enough people know about. So, I'm assuming you are aware of Staging Slots? These are things like dev-, test-, or staging- that you can pull from a different branch during CI/CD, or just a separate but near-identical website that runs on the same hardware. The REAL magic is the Testing in Production feature.

Once you have a slot - I have one here for the Staging Site for BabySmash - you have the option to just "swap" between staging and production...OR...you can set a percentage of traffic you want to go to each slot!

Note that traffic is pinned to a slot for the life of a client session, so you don't have to worry about folks bouncing around if you change the UI or something.

Why is this insanely powerful? You can even make - for example - a "beta" slot and have your customers opt-in to a beta! And you don't have to write any code to enable this! MyApp.com/?x-ms-routing-name=beta would get them there and MyApp.com?x-ms-routing-name=self always points to Production.

Testing in Production 

You could also write a PowerShell script that would slowly move traffic in increments. That way you could ramp up traffic to staging from 5% to 100% - assuming you see no errors or issues.

$siteName = "yourProductionSiteName"
$rule1 = New-Object Microsoft.WindowsAzure.Commands.Utilities.Websites.Services.WebEntities.RampUpRule
$rule1.ActionHostName = "yourSlotSiteName"
$rule1.ReroutePercentage = 10;
$rule1.Name = "stage"

$rule1.ChangeIntervalInMinutes = 10;
$rule1.ChangeStep = 5;
$rule1.MinReroutePercentage = 5;
$rule1.MaxReroutePercentage = 50;
$rule1.ChangeDecisionCallbackUrl = "callBackUrlOfyourChoice-OptionalThatDecidesIfYouShoudlKeepGoing"

Set-AzureWebsite $siteName -Slot Production -RoutingRules $rule1

All this stuff is built-in to the Standard Azure AppServicePlan.

Easy and Cheap Databases

A number of folks in the comments of my last post asked about the 20 websites I have running on my single App Service Plan. Some felt I may have been disingenuous about the pricing and assumed I have a bunch of SQL Server databases behind my sites, or that a site can't be useful without a SQL Server.

There's a few things there to answer. My sites are many different techs, Node.js, Ruby, C# and ASP.NET MVC, and static sites. For example:

  • Running the Ruby Middleman Static Site Generator on Microsoft Azure runs in the cloud when I check code into GitHub but deploys a static site.
  • The Hanselminutes Podcast uses WebMatrix and ASP.NET WebPage's "SQL Compact Edition." This database runs out of a single file that's stored locally.
  • One of my node.js sites uses SQL Lite for its data.
  • One ASP.NET application uses "Azure MySQL in-app" that is also included in Azure App Service. You get a single modest MySQL database that runs in the context of your App Service. It's not super fast and meant for development, but with a little caching it's very workable.
  • One node.js app thinks it is talking MongoDB but actually it's talking via MongoDB protocol support in Azure DocumentDB. You can create an Azure noSQL DocumentDB and point any app that speaks Mongo to it and it Just Works.

There's a number of options, including Easy Tables for your Mobile Apps. Check out http://mobile.azure.com to learn more about how you can get a VERY quick and easy backend for mobile (or web) apps.

Azure App Service Extensions

If you have used Git deploy to an Azure App Service, you likely noticed a "Sidecar" website that your app has. I have babysmash.com which is actually babysmash.azurewebsites.net, right? There's also babysmash.scm.azurewebsites.net that you can't access. That sidecar site (when I'm authenticated) has a ton of easy REST GET APIs I can call to get my process list, files, deployments, and lots more. This is all powered by Kudu, which is open source by the way.

The Azure Kudu sidecar site

Kudu's sidecar site is a "site extension." You can not only write your own Azure Site Extension (they are just NuGet packages!) but it turns out there are a TON of useful already vetted and published extensions you can add to your site today. Those extensions live at http://www.siteextensions.net but you add them directly from the Azure Portal. There's 84 at the time of this blog post.

Azure Site Extensions include:

  • phpMyAdmin - for Admin of MySQL over the web
  • Azure Let's Encrypt - Easy install of Let's Encrypt SSL certs!
  • Image Optimizer - Automatic squishing of your site's JPGs and PNGs because you know you forgot!
  • GoLang Support - Azure doesn't officially support Go in Azure Web Apps...but with this extension it works fine!
  • Jekyll - Easy static site generation in Azure
  • Brotli HTTP Compression

You get the idea.

Diagnostics

I just discovered this "uptime" blade within my Web Apps in the Azure Portal. It tells me my app's uptime and if it's not 100%, it tells my why not and when!

Azure Diagnostics and Uptime

Again, none of this stuff costs extra. You can add Site Extensions or explore your apps to the limit of the underlying App Service Plan. I'm doing all this on a single Standard 1 (S1) App Service Plan.


Sponsor: Excited about the future in ASP.NET? The folks at Progress held an awesome webinar which gives a 360⁰ view of the new ASP.NET Core and how it compares to WebForms and MVC. Watch it now on demand!

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

Penny Pinching in the Cloud: Running and Managing LOTS of Web Apps on a single Azure App Service

February 18, 2017 Comment on this post [24] Posted in Azure | nodejs
Sponsored By

I've blogged before about "penny pinching in the cloud." I'll update that series for 2017 soon, but the underlying concepts still apply. Many if you are still using bigger virtual machines than are needed when doing IaaS (Infrastructure as a Service) or when doing PaaS (Platform as a Service) folks are doing "one website per App Service." That's super expensive.

Remember that you can fit as many web applications as memory and CPU will into an Azure App Service Plan. An "App Service Plan" in Azure is effectively the Virtual Machine under your Web Apps. You don't need to think about it as it's totally managed and hidden - but - if you choose think about it you'll be able to squeeze more out of it and you'll pay less.

For example, I have 20 web applications running in a plan I named "DefaultServerFarm." It's a Small Standard Plan (S1) and I pay about $70 a month. Some folks use a Basic (B1) plan if they don't need to scale out and that's about $50 a month. Both B1 and S1 support "unlimited" web apps within them, to the limits of memory. That's what allows me to run 20 modest (but real) sites on the one plan and that's what makes it a good deal from a pricing perspective for me.

I logged in to the Azure Portal recently and noticed the CPU percentage on my plan was higher than usual and higher than I'd like.

Why is that web app using so much CPU?

That's the CPU of the machine "under" my 20 sites. I can click here on my App Service Plan's "blade" to see the underlying sites, or just click "Apps" in the blade menu.

Running 20 apps in a Single Azure App Service

However, when I'm looking at an app that lives within my plan, there's two super powerful menu items to check out. One is  called "Metrics per instance (Apps)" and one is "Metrics per instance (App Service)." Click the latter option. For many of you it's going to become your favorite area in the Azure Portal. It was a game changer for me as it gave me the internal insight I needed to make sure I can get maximum density in my plan (thereby saving the most money).

Metrics per Instance - App Service Plan

I click here and see "Sites in App Service Plan."

20 sites in a single plan

I can see that over the last few days my CPU has been going up and up...

The CPU is going up and up over a few days

I can see by site:

A graph showing ALL 20 sites and their CPU

So now I can filter by site and I see that it's ONE site that's going nuts.

One site is using all the CPU

I can then dig in, go to the main CPU charge and see exactly when it started:

The site is using 2.12 days of CPU

I can change the scale

It started on Feb 11th

I had a Web Job stuck in a loop. I restarted and will be monitoring but for now, I'm in a much better place for this one app.

Now it's calming down

Now if I check the App Service Plan itself, I can see everything has calmed down.

Things have calmed down after the one rogue site was restarted

The point here is that even though it's "Platform as a Service" and we want a layer of abstraction, at no point are things HIDDEN from us. If you want to see the hardware, you can. If you want to see the process tree, you can. A good reminder.


Sponsor: Excited about the future in ASP.NET? The folks at Progress held an awesome webinar which gives a 360⁰ view of the new ASP.NET Core and how it compares to WebForms and MVC. Watch it now on demand!

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

dotnet new angular and dotnet new react

February 13, 2017 Comment on this post [30] Posted in Javascript | Open Source | VS2017
Sponsored By

I was exploring the "dotnet new" experience last week and how you can extend templates, then today the .NET WebDev blog posted about Steve Sanderson's work around Single Page Apps (SPA). Perfect timing!

image

Since I have Visual Studio 2017 RC and my .NET Core SDK tools are also RC4:

C:\Users\scott\Desktop\fancypants>dotnet --info
.NET Command Line Tools (1.0.0-rc4-004771)

Product Information:
Version: 1.0.0-rc4-004771
Commit SHA-1 hash: 4228198f0e

Runtime Environment:
OS Name: Windows
OS Version: 10.0.15031
OS Platform: Windows
RID: win10-x64
Base Path: C:\Program Files\dotnet\sdk\1.0.0-rc4-004771

I can then do this from the dotnet command line interface (CLI) and install the SPA templates:

dotnet new --install Microsoft.AspNetCore.SpaTemplates::*

The * is the package version so this is getting the latest templates from NuGet. I'm looking forward to using YOUR templates (docs are coming! These are fresh hot bits.)

This command adds new templates to dotnet new. You can see the expanded list here:

Templates                                     Short Name      Language      Tags
------------------------------------------------------------------------------------------
Console Application console [C#], F# Common/Console
Class library classlib [C#], F# Common/Library
Unit Test Project mstest [C#], F# Test/MSTest
xUnit Test Project xunit [C#], F# Test/xUnit
Empty ASP.NET Core Web Application web [C#] Web/Empty
MVC ASP.NET Core Web Application mvc [C#], F# Web/MVC
MVC ASP.NET Core with Angular angular [C#] Web/MVC/SPA
MVC ASP.NET Core with Aurelia aurelia [C#] Web/MVC/SPA
MVC ASP.NET Core with Knockout.js knockout [C#] Web/MVC/SPA
MVC ASP.NET Core with React.js react [C#] Web/MVC/SPA
MVC ASP.NET Core with React.js and Redux reactredux [C#] Web/MVC/SPA
Web API ASP.NET Core Web Application webapi [C#] Web/WebAPI
Solution File sln Solution

See there? Now I've got "dotnet new react" or "dotnet new angular" which is awesome. Now I just "npm install" and "dotnet restore" followed by a "dotnet run" and very quickly I have a great starter point for a SPA application written in ASP.NET Core 1.0 running on .NET Core 1.0. It even includes a dockerfile if I like.

From the template, to help you get started, they've also set up:

  • Client-side navigation. For example, click Counter then Back to return here.
  • Server-side prerendering. For faster initial loading and improved SEO, your Angular 2 app is prerendered on the server. The resulting HTML is then transferred to the browser where a client-side copy of the app takes over. THIS IS HUGE.
  • Webpack dev middleware. In development mode, there's no need to run the webpack build tool. Your client-side resources are dynamically built on demand. Updates are available as soon as you modify any file.
  • Hot module replacement. In development mode, you don't even need to reload the page after making most changes. Within seconds of saving changes to files, your Angular 2 app will be rebuilt and a new instance injected is into the page.
  • Efficient production builds. In production mode, development-time features are disabled, and the webpack build tool produces minified static CSS and JavaScript files.

Go and read about these new SPA templates in depth on the WebDev blog.


Sponsor: Big thanks to Raygun! Join 40,000+ developers who monitor their apps with Raygun. Understand the root cause of errors, crashes and performance issues in your software applications. Installs in minutes, try it today!

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

How to make an offline installer for VS2017

February 08, 2017 Comment on this post [25] Posted in VS2017
Sponsored By

I just got back from Kenya and South Africa and had a great time speaking at NexTech Africa and the Microsoft Tech Summit in Johannesburg. I also got to hang out with my wife's family a bunch. While I was there I was reminded (as one is when one travels) how spoiled many of us with being always connected. Depending on how far out of town you get the quality of internet varies. There's not just bandwidth issues but also issues of latency and reliability.

Visual Studio generally - and Visual Studio 2017 specifically - has an online installer and if you lose connectivity during the installation you can run into problems. However, they haven't got an ISO available for downloading for legal reasons. They can't package up the Android Installer from Google, for example, into an ISO. The user needs to download certain things themselves dynamically.

Fortunately there's docs that walk you through making an offline installer. These could be used to create USB sticks or DVDs that could then be passed out at User Groups or free Events.

  • First, I went to http://visualstudio.com/free and clicked Download. I use VS Community but you can also do this for Enterprise, etc. I downloaded the bootstrapper .exe and put it in its own folder.
  • If you want EVERYTHING possible then you'd run something like this. Note that is my folder there and I selected en-US as my language.
    vs_community.exe --layout e:\vs2017offline --lang en-US
  • However if you don't want EVERYTHING - maybe you just want .NET Core, ASP.NET Core, and Azure, then you'll pass those options in on the command line. They call them "Workloads" but that's a Microsoftism.
    • Here is a list of all the Component IDs you can choose from.
    • I did this to get an offline setup for my main four "workloads." I ran this from a cmd prompt.
      vs_community.exe --layout e:\vs2017offline --lang en-US --add Microsoft.VisualStudio.Workload.Azure Microsoft.VisualStudio.Workload.ManagedDesktop Microsoft.VisualStudio.Workload.NetCoreTools Microsoft.VisualStudio.Workload.NetWeb

It will go and download everything you need. If you want everything then it'll take a while, so hang back.

Give us a minute, we'll be done soon...

If you have trouble or nothing happens, check the dd_bootstrapper*.log file in %TEMP%.

DOS prompt downloading Visual Studio

When it's all done you'll end up with a folder like this that you can copy to a DVD or USB key.

The result of the VS offline Layout generator

One nice aspect of this system is that you can update a "layout" in place. As updates become available for Visual Studio 2017 (RC or otherwise), you can run the --layout command again, pointing to the same layout folder, to ensure that the folder contains the latest components. Only those components that have been updated since the last time --layout was run will be downloaded.

IMPORTANT NOTE: Make sure that your file is named "vs_[SKU].exe." Sometimes you'll end up with a file like vs_community__198521760.1486960229.exe and you'll want to rename it to vs_community.exe for offline to work.

Before you run the installer, you'll want to install the root certificates in the \certificates folder. From the team:

They are the root certs needed to verify the setup application (the stuff installed under ProgramFiles\Visual Studio\2017\Installer) and the catalog (a json file that lists of all the VS components that could be installed by setup).  Most computers will already have these root certs.  But users on Win7 machine may not.  Once you install these certs, setup will be able to authenticate the content being installed is trusted.  You should not remove them after installing them.

I hope this helps you set up offline installers for your classrooms and organizations! You'll save a lot of bandwidth.


Sponsor: Big thanks to Raygun! Join 40,000+ developers who monitor their apps with Raygun. Understand the root cause of errors, crashes and performance issues in your software applications. Installs in minutes, try it today!

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

facebook bluesky subscribe
About   Newsletter
Hosting By
Hosted on Linux using .NET in an Azure App Service

Disclaimer: The opinions expressed herein are my own personal opinions and do not represent my employer's view in any way.