ASP.NET – Overposting/Mass Assignment Model Binding Security

imageThis little post is just a reminder that while Model Binding in ASP.NET is very cool, you should be aware of the properties (and semantics of those properties) that your object has, and whether or not your HTML form includes all your properties, or omits some.

OK, that’s a complex – and perhaps poorly written – sentence. Let me back up.

Let’s say you have this horrible class. Relax, yes, it’s horrible. It’s an example. It’ll make sense in a moment.

public class Person
{
public int ID { get; set; }
public string First { get; set; }
public string Last { get; set; }
public bool IsAdmin { get; set; }
}

Then you’ve got an HTML Form in your view that lets folks create a Person. That form has text boxes/fields for First, and Last. ID is handled by the database on creation, and IsAdmin is a property that the user doesn’t need to know about. Whatever. It’s secret and internal. It could be Comment.IsApproved or Product.Discount. You get the idea.

Then you have a PeopleController that takes in a Person via a POST:

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> Create(Person person)
{
if (ModelState.IsValid)
{
_context.Add(person);
await _context.SaveChangesAsync();
return RedirectToAction("Index");
}
return View(person);
}

If a theoretical EvilUser found out that Person had an “IsAdmin” property, they could “overpost” and add a field to the HTTP POST and set IsAdmin=true. There’s nothing in the code here to prevent that. ModelBinding makes your code simpler by handling the “left side -> right side” boring code of the past. That was all that code where you did myObject.Prop = Request.Form[“something”]. You had lines and lines of code digging around in the QueryString or Form POST.

Model Binding gets rid of that and looks at the properties of the object and lines them up with HTTP Form POST name/value pairs of the same names.

NOTE: Just a friendly reminder that none of this “magic” is magic or is secret. You can even write your own custom model binders if you like.

The point here is that folks need to be aware of the layers of abstraction when you use them. Yes, it’s convenient, but it’s hiding something from you, so you should know the side effects.

How do we fix the problem? Well, a few ways. You can mark the property as [ReadOnly]. More commonly, you can use a BindAttribute on the method parameters and just include (whitelist) the properties you want to allow for binding:

public async Task<IActionResult> Create([Bind("First,Last")] Person person)

Or, the correct answer. Don’t let models that look like this get anywhere near the user. This is the case for ViewModels. Make a model that looks like the View. Then do the work. You can make the work easier with something like AutoMapper.

Some folks find ViewModels to be too cumbersome for basic stuff. That’s valid. There are those that are “All ViewModels All The Time,” but I’m more practical. Use what works, use what’s appropriate, but know what’s happening underneath so you don’t get some scriptkiddie overposting to your app and a bit getting flipped in your Model as a side effect.

Use ViewModels when possible or reasonable, and when not, always whitelist your binding if the model doesn’t line up one to one (1:1) with your HTML Form.

What are your thoughts?


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!


© 2017 Scott Hanselman. All rights reserved.
     

imageThis little post is just a reminder that while Model Binding in ASP.NET is very cool, you should be aware of the properties (and semantics of those properties) that your object has, and whether or not your HTML form includes all your properties, or omits some.

OK, that's a complex - and perhaps poorly written - sentence. Let me back up.

Let's say you have this horrible class. Relax, yes, it's horrible. It's an example. It'll make sense in a moment.

public class Person

{
public int ID { get; set; }
public string First { get; set; }
public string Last { get; set; }
public bool IsAdmin { get; set; }
}

Then you've got an HTML Form in your view that lets folks create a Person. That form has text boxes/fields for First, and Last. ID is handled by the database on creation, and IsAdmin is a property that the user doesn't need to know about. Whatever. It's secret and internal. It could be Comment.IsApproved or Product.Discount. You get the idea.

Then you have a PeopleController that takes in a Person via a POST:

[HttpPost]

[ValidateAntiForgeryToken]
public async Task<IActionResult> Create(Person person)
{
if (ModelState.IsValid)
{
_context.Add(person);
await _context.SaveChangesAsync();
return RedirectToAction("Index");
}
return View(person);
}

If a theoretical EvilUser found out that Person had an "IsAdmin" property, they could "overpost" and add a field to the HTTP POST and set IsAdmin=true. There's nothing in the code here to prevent that. ModelBinding makes your code simpler by handling the "left side -> right side" boring code of the past. That was all that code where you did myObject.Prop = Request.Form["something"]. You had lines and lines of code digging around in the QueryString or Form POST.

Model Binding gets rid of that and looks at the properties of the object and lines them up with HTTP Form POST name/value pairs of the same names.

NOTE: Just a friendly reminder that none of this "magic" is magic or is secret. You can even write your own custom model binders if you like.

The point here is that folks need to be aware of the layers of abstraction when you use them. Yes, it's convenient, but it's hiding something from you, so you should know the side effects.

How do we fix the problem? Well, a few ways. You can mark the property as [ReadOnly]. More commonly, you can use a BindAttribute on the method parameters and just include (whitelist) the properties you want to allow for binding:

public async Task<IActionResult> Create([Bind("First,Last")] Person person)

Or, the correct answer. Don't let models that look like this get anywhere near the user. This is the case for ViewModels. Make a model that looks like the View. Then do the work. You can make the work easier with something like AutoMapper.

Some folks find ViewModels to be too cumbersome for basic stuff. That's valid. There are those that are "All ViewModels All The Time," but I'm more practical. Use what works, use what's appropriate, but know what's happening underneath so you don't get some scriptkiddie overposting to your app and a bit getting flipped in your Model as a side effect.

Use ViewModels when possible or reasonable, and when not, always whitelist your binding if the model doesn't line up one to one (1:1) with your HTML Form.

What are your thoughts?


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!



© 2017 Scott Hanselman. All rights reserved.
     

Setting up a Shiny Development Environment within Linux on Windows 10

While I was getting Ruby on Rails to work nicely under Ubuntu on Windows 10 I took the opportunity to set up my *nix bash environment, which was largely using defaults. Yes, I know I can use zsh or fish or other shells. Yes, I know I can use emacs and screen, but I am using Vim and tmux. Fight me. Anyway, once my post was done, I starting messing around with open source .NET Core on Linux (it runs on Windows, Mac, and Linux, but here I’m running on Linux on Windows. #Inception) and tweeted a pic of my desktop.

By the way, I feel totally vindicated by all the interest in “text mode” given my 2004 blog post “Windows is completely missing the TextMode boat.” ;)’

Also, for those of you who are DEEPLY NOT INTERESTED in the command line, that’s cool. You can stop reading now. Totally OK. I also use Visual Studio AND Visual Studio Code. Sometimes I click and mouse and sometimes I tap and type. There is room for us all.

WHAT IS ALL THIS LINUX ON WINDOWS STUFF? Here’s a FAQ on the Bash/Windows Subsystem for Linux/Ubuntu on Windows/Snowball in Hell and some detailed Release Notes. Yes, it’s real, and it’s spectacular. Can’t read that much text? Here’s a video I did on Ubuntu on Windows 10.

A number of people asked me how they could set up their WSL (Windows Subsystem for Linux) installs to be something like this, so here’s what I did. Note that will I’ve been using *nix on and off for 20+ years, I am by no means an expert. I am, and have been, Permanently Intermediate in my skills. I do not dream in RegEx, and I am offended that others can bust out an awk script without googling.

C9RT5_bUwAALJ-H

So there’s a few things going on in this screenshot.

  • Running .NET Core on Linux (on Windows 10)
  • Cool VIM theme with >256 colors
  • Norton Midnight Commander in the corner (thanks Miguel)
  • Desqview-esque tmux splitter (with mouse support)
  • Some hotkey remapping, git prompt, completion
  • Ubuntu Mono font
  • Nice directory colors (DIRCOLORS/LS_COLORS)

Let’s break them down one at a time. And, again, your mileage may vary, no warranty express or implied, any of this may destroy your world, you read this on a blog. Linux is infinitely configurable and the only constant is that my configuration rocks and yours sucks. Until I see something in yours that I can steal.

Running .NET Core on Linux (on Windows 10)

Since Linux on Windows 10 is (today) Ubuntu, you can install .NET Core within it just like any Linux. Here’s the Ubuntu instructions for .NET Core’s SDK. You may have Ubuntu 14.04 or 16.04 (you can upgrade your Linux on Windows if you like). Make sure you know what you’re running by doing a:

~ $ lsb_release -a
No LSB modules are available.
Distributor ID: Ubuntu
Description: Ubuntu 16.04.2 LTS
Release: 16.04
Codename: xenial
~ $

If you’re not on 16.04 you can easily remove and reinstall the whole subsystem with these commands at cmd.exe (note the /full is serious and torches the Linux filesystem):

> lxrun /uninstall /full
> lxrun /install

Or if you want you can run this within bash (will take longer but maintain settings):

sudo do-release-upgrade

Know what Ubuntu your Windows 10 has when you install .NET Core within it. The other thing to remember is that now you have two .NET Cores, one Windows and one Ubuntu, on the same (kinda) machine. Since the file systems are separated it’s not a big deal. I do my development work within Ubuntu on /mnt/d/github (which is a Windows drive). It’s OK for the Linux subsystem to edit files in Linux or Windows, but don’t “reach into” the Linux file system from Windows.

Cool Vim theme with >256 colors

That Vim theme is gruvbox and I installed it like this. Thanks to Rich Turner for turning me on to this theme.

$ cd ~/
$ mkdir .vim
$ cd .vim
$ mkdir colors
$ cd colors
$ curl -O https://raw.githubusercontent.com/morhetz/gruvbox/master/colors/gruvbox.vim
$ cd ~/
$ vim .vimrc

Paste the following (hit ‘i’ for insert and then right click/paste)

set number
syntax enable
set background=dark
colorscheme gruvbox
set mouse=a

if &term =~ '256color'
" disable Background Color Erase (BCE) so that color schemes
" render properly when inside 256-color tmux and GNU screen.
" see also http://snk.tuxfamily.org/log/vim-256color-bce.html
set t_ut=
endif

Then save and exit with Esc, :wq (write and quit). There’s a ton of themes out there, so try some for yourself!

Norton Midnight Commander in the corner (thanks Miguel)

Midnight Commander is a wonderful Norton Commander clone that Miguel de Icaza started, that’s licensed as part of GNU. I installed it via apt, as I would any Ubuntu software.

$ sudo apt-get install mc

There’s mouse support within the Windows conhost (console host) that bash runs within, so you’ll even get mouse support within Midnight Commander!

Midnight Commander

Great stuff.

Desqview-esque tmux splitter (with mouse support)

Tmux is a terminal multiplexer. It’s a text-mode windowing environment within which you can run multiple programs. Even better, you can “detach” from a running session and reattached from elsewhere. Because of this, folks love using tmux on servers where they can ssh in, set up an environment, detach, and reattach from elsewhere.

NOTE: The Windows Subsystem for Linux shuts down all background processes when the last console exits. So you can detach and attach tmux sessions happily, but just make sure you don’t close every console on your machine.

Here’s a nice animated gif of me moving the splitter on tmux on Windows. YES I KNOW YOU CAN USE THE KEYBOARD BUT THIS GIF IS COOL.

Some hotkey remapping, git prompt, completion

I am still learning tmux but here’s my .tmux.conf. I’ve made a few common changes to make the hotkey creation of windows easier.

#remap prefix from 'C-b' to 'C-a'
unbind C-b
set-option -g prefix C-a
bind-key C-a send-prefix

# split panes using | and -
bind | split-window -h
bind _ split-window -v
unbind '"'
unbind %
bind k confirm kill-window
bind K confirm kill-server
bind < resize-pane -L 1
bind > resize-pane -R 1
bind - resize-pane -D 1
bind + resize-pane -U 1
bind r source-file ~/.tmux.conf

# switch panes using Alt-arrow without prefix
bind -n M-Left select-pane -L
bind -n M-Right select-pane -R
bind -n M-Up select-pane -U
bind -n M-Down select-pane -D

# Enable mouse control (clickable windows, panes, resizable panes)
set -g mouse on
set -g default-terminal "screen-256color"

I’m using the default Ubuntu .bashrc that includes a check for dircolors (more on this below) but I added this for git-completion.sh and a git prompt, as well as these two alias. I like being able to type “desktop” to jump to my Windows Desktop. And the -x on Midnight Commander helps the mouse support.

alias desktop="cd /mnt/c/Users/scott/Desktop"
alias mc="mc -x"
export CLICOLOR=1
source ~/.git-completion.sh
PS1='\[\033[37m\]\W\[\033[0m\]$(__git_ps1 " (\[\033[35m\]%s\[\033[0m\])") \$ '
GIT_PS1_SHOWDIRTYSTATE=1
GIT_PS1_SHOWSTASHSTATE=1
GIT_PS1_SHOWUNTRACKEDFILES=1
GIT_PS1_SHOWUPSTREAM="auto"

Git Completion can be installed with:

sudo apt-get install git bash-completion

Ubuntu Mono font

I really like the Ubuntu Mono font, and I like the way it looks when running Ubuntu under Windows. You can download the Ubuntu Font Family free.

Ubuntu Mono

Nice directory colors (DIRCOLORS/LS_COLORS)’

If you have a black command prompt background, then default colors for directories will be dark blue on black, which sucks. Fortunately you can get .dircolors files from all over the wep, or set the LS_COLORS (make sure to search for LS_COLORS for Linux, not the other, different LSCOLORS on Mac) environment variable.

I ended up with “dircolors-solarized” from here, downloaded it with wget or curl and put it in ~. Then confirm this is in your .bashrc (it likely is already)

# enable color support of ls and also add handy aliases
if [ -x /usr/bin/dircolors ]; then
test -r ~/.dircolors && eval "$(dircolors -b ~/.dircolors)" || eval "$(dircolors -b)"
alias ls='ls --color=auto'
alias dir='dir --color=auto'
#alias vdir='vdir --color=auto'

alias grep='grep --color=auto'
alias fgrep='fgrep --color=auto'
alias egrep='egrep --color=auto'
fi

Make a big difference for me, and as I mention, it’s totally, gloriously, maddeningly configurable.

Nice dircolors

Leave YOUR Linux on Windows tips in the comments!


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Watch Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Watch now


© 2017 Scott Hanselman. All rights reserved.
     

While I was getting Ruby on Rails to work nicely under Ubuntu on Windows 10 I took the opportunity to set up my *nix bash environment, which was largely using defaults. Yes, I know I can use zsh or fish or other shells. Yes, I know I can use emacs and screen, but I am using Vim and tmux. Fight me. Anyway, once my post was done, I starting messing around with open source .NET Core on Linux (it runs on Windows, Mac, and Linux, but here I'm running on Linux on Windows. #Inception) and tweeted a pic of my desktop.

By the way, I feel totally vindicated by all the interest in "text mode" given my 2004 blog post "Windows is completely missing the TextMode boat." ;)'

Also, for those of you who are DEEPLY NOT INTERESTED in the command line, that's cool. You can stop reading now. Totally OK. I also use Visual Studio AND Visual Studio Code. Sometimes I click and mouse and sometimes I tap and type. There is room for us all.

WHAT IS ALL THIS LINUX ON WINDOWS STUFF? Here's a FAQ on the Bash/Windows Subsystem for Linux/Ubuntu on Windows/Snowball in Hell and some detailed Release Notes. Yes, it's real, and it's spectacular. Can't read that much text? Here's a video I did on Ubuntu on Windows 10.

A number of people asked me how they could set up their WSL (Windows Subsystem for Linux) installs to be something like this, so here's what I did. Note that will I've been using *nix on and off for 20+ years, I am by no means an expert. I am, and have been, Permanently Intermediate in my skills. I do not dream in RegEx, and I am offended that others can bust out an awk script without googling.

C9RT5_bUwAALJ-H

So there's a few things going on in this screenshot.

  • Running .NET Core on Linux (on Windows 10)
  • Cool VIM theme with >256 colors
  • Norton Midnight Commander in the corner (thanks Miguel)
  • Desqview-esque tmux splitter (with mouse support)
  • Some hotkey remapping, git prompt, completion
  • Ubuntu Mono font
  • Nice directory colors (DIRCOLORS/LS_COLORS)

Let's break them down one at a time. And, again, your mileage may vary, no warranty express or implied, any of this may destroy your world, you read this on a blog. Linux is infinitely configurable and the only constant is that my configuration rocks and yours sucks. Until I see something in yours that I can steal.

Running .NET Core on Linux (on Windows 10)

Since Linux on Windows 10 is (today) Ubuntu, you can install .NET Core within it just like any Linux. Here's the Ubuntu instructions for .NET Core's SDK. You may have Ubuntu 14.04 or 16.04 (you can upgrade your Linux on Windows if you like). Make sure you know what you're running by doing a:

~ $ lsb_release -a

No LSB modules are available.
Distributor ID: Ubuntu
Description: Ubuntu 16.04.2 LTS
Release: 16.04
Codename: xenial
~ $

If you're not on 16.04 you can easily remove and reinstall the whole subsystem with these commands at cmd.exe (note the /full is serious and torches the Linux filesystem):

> lxrun /uninstall /full

> lxrun /install

Or if you want you can run this within bash (will take longer but maintain settings):

sudo do-release-upgrade

Know what Ubuntu your Windows 10 has when you install .NET Core within it. The other thing to remember is that now you have two .NET Cores, one Windows and one Ubuntu, on the same (kinda) machine. Since the file systems are separated it's not a big deal. I do my development work within Ubuntu on /mnt/d/github (which is a Windows drive). It's OK for the Linux subsystem to edit files in Linux or Windows, but don't "reach into" the Linux file system from Windows.

Cool Vim theme with >256 colors

That Vim theme is gruvbox and I installed it like this. Thanks to Rich Turner for turning me on to this theme.

$ cd ~/

$ mkdir .vim
$ cd .vim
$ mkdir colors
$ cd colors
$ curl -O https://raw.githubusercontent.com/morhetz/gruvbox/master/colors/gruvbox.vim
$ cd ~/
$ vim .vimrc

Paste the following (hit ‘i’ for insert and then right click/paste)

set number

syntax enable
set background=dark
colorscheme gruvbox
set mouse=a

if &term =~ '256color'
" disable Background Color Erase (BCE) so that color schemes
" render properly when inside 256-color tmux and GNU screen.
" see also http://snk.tuxfamily.org/log/vim-256color-bce.html
set t_ut=
endif

Then save and exit with Esc, :wq (write and quit). There's a ton of themes out there, so try some for yourself!

Norton Midnight Commander in the corner (thanks Miguel)

Midnight Commander is a wonderful Norton Commander clone that Miguel de Icaza started, that's licensed as part of GNU. I installed it via apt, as I would any Ubuntu software.

$ sudo apt-get install mc

There's mouse support within the Windows conhost (console host) that bash runs within, so you'll even get mouse support within Midnight Commander!

Midnight Commander

Great stuff.

Desqview-esque tmux splitter (with mouse support)

Tmux is a terminal multiplexer. It's a text-mode windowing environment within which you can run multiple programs. Even better, you can "detach" from a running session and reattached from elsewhere. Because of this, folks love using tmux on servers where they can ssh in, set up an environment, detach, and reattach from elsewhere.

NOTE: The Windows Subsystem for Linux shuts down all background processes when the last console exits. So you can detach and attach tmux sessions happily, but just make sure you don't close every console on your machine.

Here's a nice animated gif of me moving the splitter on tmux on Windows. YES I KNOW YOU CAN USE THE KEYBOARD BUT THIS GIF IS COOL.

Some hotkey remapping, git prompt, completion

I am still learning tmux but here's my .tmux.conf. I've made a few common changes to make the hotkey creation of windows easier.

#remap prefix from 'C-b' to 'C-a'

unbind C-b
set-option -g prefix C-a
bind-key C-a send-prefix

# split panes using | and -
bind | split-window -h
bind _ split-window -v
unbind '"'
unbind %
bind k confirm kill-window
bind K confirm kill-server
bind < resize-pane -L 1
bind > resize-pane -R 1
bind - resize-pane -D 1
bind + resize-pane -U 1
bind r source-file ~/.tmux.conf

# switch panes using Alt-arrow without prefix
bind -n M-Left select-pane -L
bind -n M-Right select-pane -R
bind -n M-Up select-pane -U
bind -n M-Down select-pane -D

# Enable mouse control (clickable windows, panes, resizable panes)
set -g mouse on
set -g default-terminal "screen-256color"

I'm using the default Ubuntu .bashrc that includes a check for dircolors (more on this below) but I added this for git-completion.sh and a git prompt, as well as these two alias. I like being able to type "desktop" to jump to my Windows Desktop. And the -x on Midnight Commander helps the mouse support.

alias desktop="cd /mnt/c/Users/scott/Desktop"

alias mc="mc -x"
export CLICOLOR=1
source ~/.git-completion.sh
PS1='\[\033[37m\]\W\[\033[0m\]$(__git_ps1 " (\[\033[35m\]%s\[\033[0m\])") \$ '
GIT_PS1_SHOWDIRTYSTATE=1
GIT_PS1_SHOWSTASHSTATE=1
GIT_PS1_SHOWUNTRACKEDFILES=1
GIT_PS1_SHOWUPSTREAM="auto"

Git Completion can be installed with:

sudo apt-get install git bash-completion

Ubuntu Mono font

I really like the Ubuntu Mono font, and I like the way it looks when running Ubuntu under Windows. You can download the Ubuntu Font Family free.

Ubuntu Mono

Nice directory colors (DIRCOLORS/LS_COLORS)'

If you have a black command prompt background, then default colors for directories will be dark blue on black, which sucks. Fortunately you can get .dircolors files from all over the wep, or set the LS_COLORS (make sure to search for LS_COLORS for Linux, not the other, different LSCOLORS on Mac) environment variable.

I ended up with "dircolors-solarized" from here, downloaded it with wget or curl and put it in ~. Then confirm this is in your .bashrc (it likely is already)

# enable color support of ls and also add handy aliases

if [ -x /usr/bin/dircolors ]; then
test -r ~/.dircolors && eval "$(dircolors -b ~/.dircolors)" || eval "$(dircolors -b)"
alias ls='ls --color=auto'
alias dir='dir --color=auto'
#alias vdir='vdir --color=auto'

alias grep='grep --color=auto'
alias fgrep='fgrep --color=auto'
alias egrep='egrep --color=auto'
fi

Make a big difference for me, and as I mention, it's totally, gloriously, maddeningly configurable.

Nice dircolors

Leave YOUR Linux on Windows tips in the comments!


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Watch Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Watch now


© 2017 Scott Hanselman. All rights reserved.
     

Ruby on Rails on Azure App Service (Web Sites) with Linux (and Ubuntu on Windows 10)

Running Ruby on Rails on Windows has historically sucked. Most of the Ruby/Rails folks are Mac and Linux users and haven’t focused on getting Rails to be usable for daily development on Windows. There have been some heroic efforts by a number of volunteers to get Rails working with projects like RailsInstaller, but native modules and dependencies almost always cause problems. Even more, when you go to deploy your Rails app you’re likely using a Linux host so you may run into differences between operating systems.

Fast forward to today and Windows 10 has the Ubuntu-based “Linux Subsystem for Windows” (WSL) and the native bash shell which means you can run real Linux elf binaries on Windows natively without a Virtual Machine…so you should do your Windows-based Rails development in Bash on Windows.

Ruby on Rails development is great on Windows 10 because you’ve Windows 10 handling the “windows” UI part and bash and Ubuntu handling the shell.

After I set it up I want to git deploy my app to Azure, easily.

Developing on Ruby on Rails on Windows 10 using WSL

Rails and Ruby folks can apt-get update and apt-get install ruby, they can install rbenv or rvm as they like. These days rbenv is preferred.

Once you have Ubuntu on Windows 10 installed you can quickly install “rbenv” like this within Bash. Here I’m getting 2.3.0.

~$ git clone https://github.com/rbenv/rbenv.git ~/.rbenv
~$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc
~$ echo 'eval "$(rbenv init -)"' >> ~/.bashrc
~$ exec $SHELL
~$ git clone https://github.com/rbenv/ruby-build.git ~/.rbenv/plugins/ruby-build
~$ echo 'export PATH="$HOME/.rbenv/plugins/ruby-build/bin:$PATH"' >> ~/.bashrc
~$ exec $SHELL
~$ rbenv install 2.3.0
~$ rbenv global 2.3.0
~$ ruby -v
~$ gem install bundler
~$ rbenv reshash

Here’s a screenshot mid-process on my SurfaceBook. This build/install step takes a while and hits the disk a lot, FYI.

Installing rbenv on Windows under Ubuntu

At this point I’ve got Ruby, now I need Rails, as well as NodeJs for the Rails Asset Pipeline. You can change the versions as appropriate.

@ curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash -
$ sudo apt-get install -y nodejs
$ gem install rails -v 5.0.1

You will likely also want either PostgresSQL or MySQL or Mongo, or you can use a Cloud DB like Azure DocumentDB.

When you’re developing on both Windows and Linux at the same time, you’ll likely want to keep your code in one place or the other, not both. I use the automatic mount point that WSL creates at /mnt/c so for this sample I’m at /mnt/c/Users/scott/Desktop/RailsonAzure which maps to a folder on my Windows desktop. You can be anywhere, just be aware of your CR/LF settings and stay in one world.

I did a “rails new .” and got it running locally. Here you can se Visual Studio Code with Ruby Extensions and my project open next to Bash on Windows.

image

After I’ve got a Rails app running and I’m able to develop cleanly, jumping between Visual Studio Code on Windows and the Bash prompt within Ubuntu, I want to deploy the app to the web.

Since this is a simple “Hello World” default rails app I can’t deploy it somewhere where the Rails Environment is Production. There’s no Route in routes.rb (the Yay! You’re on Rails message is development-time only) and there’s no SECRET_KEY_BASE environment variable set which is used to verify signed cookies. I’ll need to add those two things. I’ll change routes.rb quickly to just use the default Welcome page for this demo, like this:

Rails.application.routes.draw do
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
    get '/' => "rails/welcome#index"
end

And I’ll add the SECRET_KEY_BASE in as an App Setting/ENV var in the Azure portal when I make my backend, below.

Deploying Ruby on Rails App to Azure App Service on Linux

From the New menu in the Azure portal, choose to Web App on Linux (in preview as of the time I wrote this) from the Web + Mobile option. This will make an App Service Plan that has an App within it. There are a bunch of application stacks you can use here including node.js, PHP, .NE Core, and Ruby.

NOTE: A few glossary and definition points. Azure App Service is the Azure PaaS (Platform as a Service). You run Web Apps on Azure App Service. An Azure App Service Plan is the underlying Virtual Machine (sall, medium, large, etc.) that hosts n number of App Services/Web Sites. I have 20 App Services/Web Sites running under a App Service Plan with a Small VM. By default this is Windows by can run Php, Python, Node, .NET, etc. In this blog post I’m using an App Service Plan that runs Linux and hosts Docker containers. My Rails app will live inside that App Service and you can find the Dockerfiles and other info here https://github.com/Azure-App-Service/ruby or use your own Docker image.

Here you can see my Azure App Service that I’ll now deploy to using Git. I could also FTP.

Ruby on Rails on Azure

I went into Deployment OPtions and setup a local (to Azure) git repro. Now I can see that under Overview.

image

On my local bash I add azure as a remote. This can be set up however your workflow is setup. In this case, Git is FTP for code.

$ git add remote azure https:[email protected]:443/RubyOnAzureAppService.git
$ git add .
$ git commit -m "initial"
$ git push azure master

This starts the deployment as the code is pushed to Azure.

Azure deploying the Rails app

IMPORTANT: I will also add “RAILS_ENV= production” and a SECRET_KEY_BASE=to my Azure Application Settings. You can make a new secret with “rake secret.”

If I’m having trouble I can turn on Application Logging, Web Server Logging, and Detailed Error Messages under Diagnostic Logs then FTP into the App Service and look at the logs.

FTPing into Azure to look at logs

This is all in Preview so you’ll likely run into issues. They are updating the underlying systems very often. Some gotchas I hit:

  • Deploying/redeploying requires an explicit site restart, today. I hear that’ll be fixed soon.
  • I had to dig log files out via FTP. They are going to expose logs in the portal.
  • I used the Kudu “sidecar” site at mysite.scm.azurewebsite.net to get shell access to the Kudu container, but I’d like to be able to ssh into or get to access to the actual running container from the Azure Portal one day.

That said, if you’d like more internal details on how this works, you can watch a session from Connect() last year with developer Nazim Lala. Thanks to James Christianson for his debugging help!


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Watch Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Watch now


© 2017 Scott Hanselman. All rights reserved.
     

Running Ruby on Rails on Windows has historically sucked. Most of the Ruby/Rails folks are Mac and Linux users and haven't focused on getting Rails to be usable for daily development on Windows. There have been some heroic efforts by a number of volunteers to get Rails working with projects like RailsInstaller, but native modules and dependencies almost always cause problems. Even more, when you go to deploy your Rails app you're likely using a Linux host so you may run into differences between operating systems.

Fast forward to today and Windows 10 has the Ubuntu-based "Linux Subsystem for Windows" (WSL) and the native bash shell which means you can run real Linux elf binaries on Windows natively without a Virtual Machine...so you should do your Windows-based Rails development in Bash on Windows.

Ruby on Rails development is great on Windows 10 because you've Windows 10 handling the "windows" UI part and bash and Ubuntu handling the shell.

After I set it up I want to git deploy my app to Azure, easily.

Developing on Ruby on Rails on Windows 10 using WSL

Rails and Ruby folks can apt-get update and apt-get install ruby, they can install rbenv or rvm as they like. These days rbenv is preferred.

Once you have Ubuntu on Windows 10 installed you can quickly install "rbenv" like this within Bash. Here I'm getting 2.3.0.

~$ git clone https://github.com/rbenv/rbenv.git ~/.rbenv

~$ echo 'export PATH="$HOME/.rbenv/bin:$PATH"' >> ~/.bashrc
~$ echo 'eval "$(rbenv init -)"' >> ~/.bashrc
~$ exec $SHELL
~$ git clone https://github.com/rbenv/ruby-build.git ~/.rbenv/plugins/ruby-build
~$ echo 'export PATH="$HOME/.rbenv/plugins/ruby-build/bin:$PATH"' >> ~/.bashrc
~$ exec $SHELL
~$ rbenv install 2.3.0
~$ rbenv global 2.3.0
~$ ruby -v
~$ gem install bundler
~$ rbenv reshash

Here's a screenshot mid-process on my SurfaceBook. This build/install step takes a while and hits the disk a lot, FYI.

Installing rbenv on Windows under Ubuntu

At this point I've got Ruby, now I need Rails, as well as NodeJs for the Rails Asset Pipeline. You can change the versions as appropriate.

@ curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash -

$ sudo apt-get install -y nodejs
$ gem install rails -v 5.0.1

You will likely also want either PostgresSQL or MySQL or Mongo, or you can use a Cloud DB like Azure DocumentDB.

When you're developing on both Windows and Linux at the same time, you'll likely want to keep your code in one place or the other, not both. I use the automatic mount point that WSL creates at /mnt/c so for this sample I'm at /mnt/c/Users/scott/Desktop/RailsonAzure which maps to a folder on my Windows desktop. You can be anywhere, just be aware of your CR/LF settings and stay in one world.

I did a "rails new ." and got it running locally. Here you can se Visual Studio Code with Ruby Extensions and my project open next to Bash on Windows.

image

After I've got a Rails app running and I'm able to develop cleanly, jumping between Visual Studio Code on Windows and the Bash prompt within Ubuntu, I want to deploy the app to the web.

Since this is a simple "Hello World" default rails app I can't deploy it somewhere where the Rails Environment is Production. There's no Route in routes.rb (the Yay! You're on Rails message is development-time only) and there's no SECRET_KEY_BASE environment variable set which is used to verify signed cookies. I'll need to add those two things. I'll change routes.rb quickly to just use the default Welcome page for this demo, like this:

Rails.application.routes.draw do
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
    get '/' => "rails/welcome#index"
end

And I'll add the SECRET_KEY_BASE in as an App Setting/ENV var in the Azure portal when I make my backend, below.

Deploying Ruby on Rails App to Azure App Service on Linux

From the New menu in the Azure portal, choose to Web App on Linux (in preview as of the time I wrote this) from the Web + Mobile option. This will make an App Service Plan that has an App within it. There are a bunch of application stacks you can use here including node.js, PHP, .NE Core, and Ruby.

NOTE: A few glossary and definition points. Azure App Service is the Azure PaaS (Platform as a Service). You run Web Apps on Azure App Service. An Azure App Service Plan is the underlying Virtual Machine (sall, medium, large, etc.) that hosts n number of App Services/Web Sites. I have 20 App Services/Web Sites running under a App Service Plan with a Small VM. By default this is Windows by can run Php, Python, Node, .NET, etc. In this blog post I'm using an App Service Plan that runs Linux and hosts Docker containers. My Rails app will live inside that App Service and you can find the Dockerfiles and other info here https://github.com/Azure-App-Service/ruby or use your own Docker image.

Here you can see my Azure App Service that I'll now deploy to using Git. I could also FTP.

Ruby on Rails on Azure

I went into Deployment OPtions and setup a local (to Azure) git repro. Now I can see that under Overview.

image

On my local bash I add azure as a remote. This can be set up however your workflow is setup. In this case, Git is FTP for code.

$ git add remote azure https:[email protected]:443/RubyOnAzureAppService.git

$ git add .
$ git commit -m "initial"
$ git push azure master

This starts the deployment as the code is pushed to Azure.

Azure deploying the Rails app

IMPORTANT: I will also add "RAILS_ENV= production" and a SECRET_KEY_BASE=to my Azure Application Settings. You can make a new secret with "rake secret."

If I'm having trouble I can turn on Application Logging, Web Server Logging, and Detailed Error Messages under Diagnostic Logs then FTP into the App Service and look at the logs.

FTPing into Azure to look at logs

This is all in Preview so you'll likely run into issues. They are updating the underlying systems very often. Some gotchas I hit:

  • Deploying/redeploying requires an explicit site restart, today. I hear that'll be fixed soon.
  • I had to dig log files out via FTP. They are going to expose logs in the portal.
  • I used the Kudu "sidecar" site at mysite.scm.azurewebsite.net to get shell access to the Kudu container, but I'd like to be able to ssh into or get to access to the actual running container from the Azure Portal one day.

That said, if you'd like more internal details on how this works, you can watch a session from Connect() last year with developer Nazim Lala. Thanks to James Christianson for his debugging help!


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Watch Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Watch now



© 2017 Scott Hanselman. All rights reserved.
     

How to control PowerPoint on Windows with a Bluetooth Nintendo Switch JoyCon controller! (or a Surface Pen)

I usually use a Logitech Presentation Clicker to control PowerPoint presentations, but I’m always looking for new ways. Michael Samarin has a great app called KeyPenX that lets you use a Surface pen to control PowerPoint!

However, I’ve also got this wonderful Nintendo Switch and two JoyCon controllers. Rachel White reminded me that they are BlueTooth! So why not pair them to your machine and map some of their buttons to keystrokes?

Let’s do it!

First, hold the round button on the black side of the controller between the SL and SR buttons, then go into Windows Settings and Add Bluetooth Device.

Add a Bluetooth Device

You can add them both if you like! They show up like Game Controllers to Windows:

Hey a JoyCon is a JoyStick to Windows!

Ah, but these are Joysticks. We need to map JoyStick Actions to Key Presses. Enter JoyToKey. If you keep using it (even though you can use it free) it’s Shareware, you can buy JoyToKey for just $7.

Hold down a button on your Joystick/Joycon to see what it maps to. For example, here I’m clicking in on the stick and I can see that’s Button 12.

Using JoyToKey to map JoyCons to PowerPoint

Map them anyway you like. I mapped left and right to PageUp and PageDown so now I can control PowerPoint!

Using JoyToKey to map JoyCons to PowerPoint

And here it is in action:

ZOMG YOU CAN CONTROL POWERPOINT WITH THE #NintendoSwitch JoyCon! /ht @ohhoe

A post shared by Scott Hanselman (@shanselman) on Apr 10, 2017 at 12:38pm PDT

So fun! Enjoy!


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Watch Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Watch now


© 2017 Scott Hanselman. All rights reserved.
     

I usually use a Logitech Presentation Clicker to control PowerPoint presentations, but I'm always looking for new ways. Michael Samarin has a great app called KeyPenX that lets you use a Surface pen to control PowerPoint!

However, I've also got this wonderful Nintendo Switch and two JoyCon controllers. Rachel White reminded me that they are BlueTooth! So why not pair them to your machine and map some of their buttons to keystrokes?

Let's do it!

First, hold the round button on the black side of the controller between the SL and SR buttons, then go into Windows Settings and Add Bluetooth Device.

Add a Bluetooth Device

You can add them both if you like! They show up like Game Controllers to Windows:

Hey a JoyCon is a JoyStick to Windows!

Ah, but these are Joysticks. We need to map JoyStick Actions to Key Presses. Enter JoyToKey. If you keep using it (even though you can use it free) it's Shareware, you can buy JoyToKey for just $7.

Hold down a button on your Joystick/Joycon to see what it maps to. For example, here I'm clicking in on the stick and I can see that's Button 12.

Using JoyToKey to map JoyCons to PowerPoint

Map them anyway you like. I mapped left and right to PageUp and PageDown so now I can control PowerPoint!

Using JoyToKey to map JoyCons to PowerPoint

And here it is in action:

ZOMG YOU CAN CONTROL POWERPOINT WITH THE #NintendoSwitch JoyCon! /ht @ohhoe

A post shared by Scott Hanselman (@shanselman) on


So fun! Enjoy!


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Watch Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Watch now



© 2017 Scott Hanselman. All rights reserved.
     

Writing and debugging Linux C++ applications from Visual Studio using the “Windows Subsystem for Linux”

I’ve blogged about the “Windows Subsystem for Linux” (also known as “Bash on Ubuntu on Windows“) many times before. Response to this Windows feature has been a little funny because folks try to:

  • Minimize it – “Oh, it’s just Cygwin.” (It’s actually not, it’s the actual Ubuntu elf binaries running on a layer that abstracts the Linux kernel.)
  • Design it – “So it’s a docker container? A VM?” (Again, it’s a whole subsystem. It does WAY more than you’d think, and it’s FASTer than a VM.)

Here’s a simple explanation from Andrew Pardoe:

1. The developer/user uses a bash shell.
2. The bash shell runs on an install of Ubuntu
3. The Ubuntu install runs on a Windows subsystem. This subsystem is designed to support Linux.

It’s pretty cool. WSL has, frankly, kept me running Windows because I can run cmd, powershell, OR bash (or zsh or Fish). You can run vim, emacs, tmux, and run Javascript/node.js, Ruby, Python, C/C++, C# & F#, Rust, Go, and more. You can also now run sshd, MySQL, Apache, lighttpd as long as you know that when you close your last console the background services will shut down. Bash on Windows is for developers, not background server apps. And of course, you apt-get your way to glory.

Bash on Windows runs Ubuntu user-mode binaries provided by Canonical. This means the command-line utilities are the same as those that run within a native Ubuntu environment.

I wanted to write a Linux Console app in C++ using Visual Studio in Windows. Why? Why not? I like VS.

Setting up Visual Studio 2017 to compile and debug C++ apps on Linux

Then, from the bash shell make sure you have build-essential, gdb’s server, and openssh’s server:

$ sudo apt update
$ sudo apt install -y build-essential
$ sudo apt install -y gdbserver
$ sudo apt install -y openssh-server

Then open up /etc/ssh/sshd_config with vi (or nano) like

sudo nano /etc/ssh/sshd_config

and for simplicity’s sake, set PasswordAuthentication to yes. Remember that it’s not as big a security issue as you’d think as the SSHD daemon closes when your last console does, and because WSL’s subsystem has to play well with Windows, it’s privy to the Windows Firewall and all its existing rules, plus we’re talking localhost also.

Now generate SSH keys and manually start the service:

$ sudo ssh-keygen -A
$ sudo service ssh start

Create a Linux app in Visual Studio (or open a Makefile app):

File | New Project | Cross Platform | Linux

Make sure you know your target (x64, x86, ARM):

Remote GDB Debugger options

In Visual Studio’s Cross Platform Connection Manager you can control your SSH connections (and set up ones with private keys, if you like.)

Tools | Options | Cross Platfrom | Connection Manager

 

Boom. I’m writing C++ for LInux in Visual Studio on Windows…running, compiling and debugging on the local Linux Subsystem

I'm writing C++ in Visual Studio on Windows talking to the local Linux Subsystem

BTW, for those of you, like me, who love your Raspberry Pi tiny Linux computers…this is a great way to write C++ for those little devices as well. There’s even a Blink example in File | New Project to start.

Also, for those of you who are very advanced, stop using Mingw-w64 and do cool stuff like compiling gcc 6.3 from source under WSL and having VS use that! I didn’t realize that Visual Studio’s C++ support lets you choose between a number of C++ compilers including both GCC and Clang.


Sponsor: Thanks to Redgate! Track every change to your database! See who made changes, what they did, & why, with SQL Source Control. Get a full version history in your source control system. See how.


© 2017 Scott Hanselman. All rights reserved.
     

I've blogged about the "Windows Subsystem for Linux" (also known as "Bash on Ubuntu on Windows") many times before. Response to this Windows feature has been a little funny because folks try to:

  • Minimize it - "Oh, it's just Cygwin." (It's actually not, it's the actual Ubuntu elf binaries running on a layer that abstracts the Linux kernel.)
  • Design it - "So it's a docker container? A VM?" (Again, it's a whole subsystem. It does WAY more than you'd think, and it's FASTer than a VM.)

Here's a simple explanation from Andrew Pardoe:

1. The developer/user uses a bash shell.
2. The bash shell runs on an install of Ubuntu
3. The Ubuntu install runs on a Windows subsystem. This subsystem is designed to support Linux.

It's pretty cool. WSL has, frankly, kept me running Windows because I can run cmd, powershell, OR bash (or zsh or Fish). You can run vim, emacs, tmux, and run Javascript/node.js, Ruby, Python, C/C++, C# & F#, Rust, Go, and more. You can also now run sshd, MySQL, Apache, lighttpd as long as you know that when you close your last console the background services will shut down. Bash on Windows is for developers, not background server apps. And of course, you apt-get your way to glory.

Bash on Windows runs Ubuntu user-mode binaries provided by Canonical. This means the command-line utilities are the same as those that run within a native Ubuntu environment.

I wanted to write a Linux Console app in C++ using Visual Studio in Windows. Why? Why not? I like VS.

Setting up Visual Studio 2017 to compile and debug C++ apps on Linux

Then, from the bash shell make sure you have build-essential, gdb's server, and openssh's server:

$ sudo apt update

$ sudo apt install -y build-essential
$ sudo apt install -y gdbserver
$ sudo apt install -y openssh-server

Then open up /etc/ssh/sshd_config with vi (or nano) like

sudo nano /etc/ssh/sshd_config

and for simplicity's sake, set PasswordAuthentication to yes. Remember that it's not as big a security issue as you'd think as the SSHD daemon closes when your last console does, and because WSL's subsystem has to play well with Windows, it's privy to the Windows Firewall and all its existing rules, plus we're talking localhost also.

Now generate SSH keys and manually start the service:

$ sudo ssh-keygen -A

$ sudo service ssh start

Create a Linux app in Visual Studio (or open a Makefile app):

File | New Project | Cross Platform | Linux

Make sure you know your target (x64, x86, ARM):

Remote GDB Debugger options

In Visual Studio's Cross Platform Connection Manager you can control your SSH connections (and set up ones with private keys, if you like.)

Tools | Options | Cross Platfrom | Connection Manager

 

Boom. I'm writing C++ for LInux in Visual Studio on Windows...running, compiling and debugging on the local Linux Subsystem

I'm writing C++ in Visual Studio on Windows talking to the local Linux Subsystem

BTW, for those of you, like me, who love your Raspberry Pi tiny Linux computers...this is a great way to write C++ for those little devices as well. There's even a Blink example in File | New Project to start.

Also, for those of you who are very advanced, stop using Mingw-w64 and do cool stuff like compiling gcc 6.3 from source under WSL and having VS use that! I didn't realize that Visual Studio's C++ support lets you choose between a number of C++ compilers including both GCC and Clang.


Sponsor: Thanks to Redgate! Track every change to your database! See who made changes, what they did, & why, with SQL Source Control. Get a full version history in your source control system. See how.


© 2017 Scott Hanselman. All rights reserved.
     

Trying ASP.NET Core on the Google Cloud Platform “App Engine Flexible Environment”

Last week I used Zeit and “now” to deploy an ASP.NET Core app (via a container) to the Zeit cloud. Tonight the kids are asleep so I thought I’d deploy to the Google Cloud. They’ve got beta support for open source ASP.NET so it’s a perfect time. Google even has Google Cloud Tools for Visual Studio (2015).

I’ll install the Google Cloud SDK. I checked “beta” as well.

Installing the Google Cloud SDK

Install it, login to your Google account and setup/select a project. I make a new folder and put an “app.yaml” in there with this inside as a directive to the Google Cloud Platform.

runtime: aspnetcore
env: flex

Here’s a gratuitous screenshot:

App.yaml

I did a dotnet new, dotnet restore, and finally a:

dotnet publish -c Release

which makes a publish folder that will get sent up to the cloud.

IMPORTANT NOTE: I initially tried to push a .NET Core app using the .NET Core 1.1 runtime but Google Cloud’s beta support in the flexible environment is set up for the 1.0.3 runtime (using their own custom docker base image) as of the time of this blog post, so you’ll want to “dotnet new mvc –framework netcoreapp1.0” and set the “RuntimeFrameworkVersion” to get that specific shared LTS (Long Term Support) version. As soon as the Google Cloud flex runtime has the latest LTS (1.0.4, at the time of this writing) then apps would just roll forward.

<PropertyGroup>
  <TargetFramework>netcoreapp1.0</TargetFramework>
<RuntimeFrameworkVersion>1.0.3</RuntimeFrameworkVersion> </PropertyGroup>

Otherwise you’ll get errors. Fortunately those errors are very clear.

.NET Core Runtime 1.0.3 supported

The walkthrough on Google Cloud suggests you copy the app.yaml file using a standard CLI copy command. However, since you’re going to need that app.yaml EVERY publish, just add it to the csproj like this:

<ItemGroup>
<Content Include="app.yaml" CopyToOutputDirectory="Always" />
</ItemGroup>

This way it’ll end up in publish automatically. You can then publish to the “AppEngine flexible environment:

dotnet restore
dotnet publish -c Release
gcloud beta app deploy .\bin\Release\netcoreapp1.0\publish\app.yaml
gcloud app browse // THIS IS JUST TO VISIT IT AFTER IT'S PUBLISHED

NOTE: You may get an ERROR that billing isn’t enabled, or that the cloudbuild.googleapis.com aren’t enabled. You’ll need to ensure you have an active Free Trial, then go to the API Manager in the Google Cloud Platform dashboard and enable “Google Cloud Container Builder API.” I also had to manually enable the API for the “Flexible” Environment and confirm I had a valid billing account.

Needed to enable some Billing APIs in the Google Cloud

Once I enabled a few APIs, I just did a standard “gcloud beta app deploy” as above:

gcloud beta app deploy

Pretty cool stuff! Here is my ASP.NET Core app running on GCP’s Flex engine:

ASP.NET on Google Cloud

You can “tail” your app with “gcloud app logs tail -s default” and you’ll see the output from .NET Core and ASP.NET (and Kestrel) in the Google Cloud!

gcloud app logs tail -s default

Or online in the Google “Stackdriver” logging page:

Google Stackdriver Logging page showing ASP.NET Core Logging

Go read up more on the Google Cloud Platform Blog. They even support Kubernetes clusters with ASP.NE Core apps packaged as Docker containers.


Sponsor: Thanks to Redgate! Track every change to your database! See who made changes, what they did, & why, with SQL Source Control. Get a full version history in your source control system. See how.


© 2017 Scott Hanselman. All rights reserved.
     

Last week I used Zeit and "now" to deploy an ASP.NET Core app (via a container) to the Zeit cloud. Tonight the kids are asleep so I thought I'd deploy to the Google Cloud. They've got beta support for open source ASP.NET so it's a perfect time. Google even has Google Cloud Tools for Visual Studio (2015).

I'll install the Google Cloud SDK. I checked "beta" as well.

Installing the Google Cloud SDK

Install it, login to your Google account and setup/select a project. I make a new folder and put an "app.yaml" in there with this inside as a directive to the Google Cloud Platform.

runtime: aspnetcore

env: flex

Here's a gratuitous screenshot:

App.yaml

I did a dotnet new, dotnet restore, and finally a:

dotnet publish -c Release

which makes a publish folder that will get sent up to the cloud.

IMPORTANT NOTE: I initially tried to push a .NET Core app using the .NET Core 1.1 runtime but Google Cloud's beta support in the flexible environment is set up for the 1.0.3 runtime (using their own custom docker base image) as of the time of this blog post, so you'll want to "dotnet new mvc --framework netcoreapp1.0" and set the "RuntimeFrameworkVersion" to get that specific shared LTS (Long Term Support) version. As soon as the Google Cloud flex runtime has the latest LTS (1.0.4, at the time of this writing) then apps would just roll forward.

<PropertyGroup>
  <TargetFramework>netcoreapp1.0</TargetFramework>

<RuntimeFrameworkVersion>1.0.3</RuntimeFrameworkVersion> </PropertyGroup>

Otherwise you'll get errors. Fortunately those errors are very clear.

.NET Core Runtime 1.0.3 supported

The walkthrough on Google Cloud suggests you copy the app.yaml file using a standard CLI copy command. However, since you're going to need that app.yaml EVERY publish, just add it to the csproj like this:

<ItemGroup>

<Content Include="app.yaml" CopyToOutputDirectory="Always" />
</ItemGroup>

This way it'll end up in publish automatically. You can then publish to the "AppEngine flexible environment:

dotnet restore

dotnet publish -c Release
gcloud beta app deploy .\bin\Release\netcoreapp1.0\publish\app.yaml
gcloud app browse // THIS IS JUST TO VISIT IT AFTER IT'S PUBLISHED

NOTE: You may get an ERROR that billing isn't enabled, or that the cloudbuild.googleapis.com aren't enabled. You'll need to ensure you have an active Free Trial, then go to the API Manager in the Google Cloud Platform dashboard and enable "Google Cloud Container Builder API." I also had to manually enable the API for the "Flexible" Environment and confirm I had a valid billing account.

Needed to enable some Billing APIs in the Google Cloud

Once I enabled a few APIs, I just did a standard "gcloud beta app deploy" as above:

gcloud beta app deploy

Pretty cool stuff! Here is my ASP.NET Core app running on GCP's Flex engine:

ASP.NET on Google Cloud

You can "tail" your app with "gcloud app logs tail -s default" and you'll see the output from .NET Core and ASP.NET (and Kestrel) in the Google Cloud!

gcloud app logs tail -s default

Or online in the Google "Stackdriver" logging page:

Google Stackdriver Logging page showing ASP.NET Core Logging

Go read up more on the Google Cloud Platform Blog. They even support Kubernetes clusters with ASP.NE Core apps packaged as Docker containers.


Sponsor: Thanks to Redgate! Track every change to your database! See who made changes, what they did, & why, with SQL Source Control. Get a full version history in your source control system. See how.



© 2017 Scott Hanselman. All rights reserved.
     

Command Line: Using dotnet watch test for continuous testing with .NET Core 1.0 and XUnit.net

I’ve installed .NET Core 1.0 on my machine. Let’s see if I can get a class library and tests running and compiling automatically using only the command line. (Yes, some of you are freaked out by my (and other folks’) appreciation of a nice, terse command line. Don’t worry. You can do all this with a mouse if you want. I’m just enjoying the CLI.

NOTE: This is considerably updated from the project.json version in 2016.

First, I installed from http://dot.net/core. This should all work on Windows, Mac, or Linux.

C:\> md testexample & cd testexample

C:\testexample> dotnet new sln
Content generation time: 33.0582 ms
The template "Solution File" created successfully.

C:\testexample> dotnet new classlib -n mylibrary -o mylibrary
Content generation time: 40.5442 ms
The template "Class library" created successfully.

C:\testexample> dotnet new xunit -n mytests -o mytests
Content generation time: 87.5115 ms
The template "xUnit Test Project" created successfully.

C:\testexample> dotnet sln add mylibrary\mylibrary.csproj
Project `mylibrary\mylibrary.csproj` added to the solution.

C:\testexample> dotnet sln add mytests\mytests.csproj
Project `mytests\mytests.csproj` added to the solution.

C:\testexample> cd mytests

C:\testexample\mytests> dotnet add reference ..\mylibrary\mylibrary.csproj
Reference `..\mylibrary\mylibrary.csproj` added to the project.

C:\testexample\mytests> cd ..

C:\testexample> dotnet restore
Restoring packages for C:\Users\scott\Desktop\testexample\mytests\mytests.csproj...
Restoring packages for C:\Users\scott\Desktop\testexample\mylibrary\mylibrary.csproj...
Restore completed in 586.73 ms for C:\Users\scott\Desktop\testexample\mylibrary\mylibrary.csproj.
Installing System.Diagnostics.TextWriterTraceListener 4.0.0.
...SNIP...
Installing Microsoft.NET.Test.Sdk 15.0.0.
Installing xunit.runner.visualstudio 2.2.0.
Installing xunit 2.2.0.
Generating MSBuild file C:\Users\scott\Desktop\testexample\mytests\obj\mytests.csproj.nuget.g.props.
Generating MSBuild file C:\Users\scott\Desktop\testexample\mytests\obj\mytests.csproj.nuget.g.targets.
Writing lock file to disk. Path: C:\Users\scott\Desktop\testexample\mytests\obj\project.assets.json
Installed:
16 package(s) to C:\Users\scott\Desktop\testexample\mytests\mytests.csproj

C:\testexample> cd mytests & dotnet test

Build started, please wait...
Build completed.

Test run for C:\testexample\mytests\bin\Debug\netcoreapp1.1\mytests.dll(.NETCoreApp,Version=v1.1)
Microsoft (R) Test Execution Command Line Tool Version 15.0.0.0
Copyright (c) Microsoft Corporation. All rights reserved.

Starting test execution, please wait...
[xUnit.net 00:00:00.5539676] Discovering: mytests
[xUnit.net 00:00:00.6867799] Discovered: mytests
[xUnit.net 00:00:00.7341661] Starting: mytests
[xUnit.net 00:00:00.8691063] Finished: mytests

Total tests: 1. Passed: 1. Failed: 0. Skipped: 0.
Test Run Successful.
Test execution time: 1.8329 Seconds

Of course, I’m testing nothing yet but pretend there’s a test in the tests.cs and something it’s testing (that’s why I added a reference) in the library.cs, OK?

Now I want to have my project build and tests run automatically as I make changes to the code. I can’t “dotnet add tool” yet so I’ll add this line to my test’s project file:

<ItemGroup>
<DotNetCliToolReference Include="Microsoft.DotNet.Watcher.Tools" Version="1.0.0" />
</ItemGroup>

Like this:

Adding <DotNetCliToolReference Include="Microsoft.DotNet.Watcher.Tools" Version="1.0.0" />

Then I just dotnet restore to bring in the tool.

NOTE: There’s a color bug using only cmd.exe so on “DOS” you’ll see some ANSI chars. That should be fixed in a minor release soon – the PR is in and waiting. On bash or PowerShell things look fin.

In this screenshot, you can see as I make changes to my test and hit save, the DotNetWatcher Tool sees the change and restarts my app, recompiles, and re-runs the tests.

Test Run Successful

All this was done from the command line. I made a solution file, made a library project and a test project, made the test project reference the library, then built and ran the tests. If I could add the tool from the command line I wouldn’t have had to manually touch the project file at all.

Again, to be sure, all this is stuff you can (and do) do in Visual Studio manually all the time. But I’ll race you anytime. 😉


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!


© 2017 Scott Hanselman. All rights reserved.
     

I've installed .NET Core 1.0 on my machine. Let's see if I can get a class library and tests running and compiling automatically using only the command line. (Yes, some of you are freaked out by my (and other folks') appreciation of a nice, terse command line. Don't worry. You can do all this with a mouse if you want. I'm just enjoying the CLI.

NOTE: This is considerably updated from the project.json version in 2016.

First, I installed from http://dot.net/core. This should all work on Windows, Mac, or Linux.

C:\> md testexample & cd testexample


C:\testexample> dotnet new sln
Content generation time: 33.0582 ms
The template "Solution File" created successfully.

C:\testexample> dotnet new classlib -n mylibrary -o mylibrary
Content generation time: 40.5442 ms
The template "Class library" created successfully.

C:\testexample> dotnet new xunit -n mytests -o mytests
Content generation time: 87.5115 ms
The template "xUnit Test Project" created successfully.

C:\testexample> dotnet sln add mylibrary\mylibrary.csproj
Project `mylibrary\mylibrary.csproj` added to the solution.

C:\testexample> dotnet sln add mytests\mytests.csproj
Project `mytests\mytests.csproj` added to the solution.

C:\testexample> cd mytests

C:\testexample\mytests> dotnet add reference ..\mylibrary\mylibrary.csproj
Reference `..\mylibrary\mylibrary.csproj` added to the project.

C:\testexample\mytests> cd ..

C:\testexample> dotnet restore
Restoring packages for C:\Users\scott\Desktop\testexample\mytests\mytests.csproj...
Restoring packages for C:\Users\scott\Desktop\testexample\mylibrary\mylibrary.csproj...
Restore completed in 586.73 ms for C:\Users\scott\Desktop\testexample\mylibrary\mylibrary.csproj.
Installing System.Diagnostics.TextWriterTraceListener 4.0.0.
...SNIP...
Installing Microsoft.NET.Test.Sdk 15.0.0.
Installing xunit.runner.visualstudio 2.2.0.
Installing xunit 2.2.0.
Generating MSBuild file C:\Users\scott\Desktop\testexample\mytests\obj\mytests.csproj.nuget.g.props.
Generating MSBuild file C:\Users\scott\Desktop\testexample\mytests\obj\mytests.csproj.nuget.g.targets.
Writing lock file to disk. Path: C:\Users\scott\Desktop\testexample\mytests\obj\project.assets.json
Installed:
16 package(s) to C:\Users\scott\Desktop\testexample\mytests\mytests.csproj

C:\testexample> cd mytests & dotnet test

Build started, please wait...
Build completed.

Test run for C:\testexample\mytests\bin\Debug\netcoreapp1.1\mytests.dll(.NETCoreApp,Version=v1.1)
Microsoft (R) Test Execution Command Line Tool Version 15.0.0.0
Copyright (c) Microsoft Corporation. All rights reserved.

Starting test execution, please wait...
[xUnit.net 00:00:00.5539676] Discovering: mytests
[xUnit.net 00:00:00.6867799] Discovered: mytests
[xUnit.net 00:00:00.7341661] Starting: mytests
[xUnit.net 00:00:00.8691063] Finished: mytests

Total tests: 1. Passed: 1. Failed: 0. Skipped: 0.
Test Run Successful.
Test execution time: 1.8329 Seconds

Of course, I'm testing nothing yet but pretend there's a test in the tests.cs and something it's testing (that's why I added a reference) in the library.cs, OK?

Now I want to have my project build and tests run automatically as I make changes to the code. I can't "dotnet add tool" yet so I'll add this line to my test's project file:

<ItemGroup>

<DotNetCliToolReference Include="Microsoft.DotNet.Watcher.Tools" Version="1.0.0" />
</ItemGroup>

Like this:

Adding <DotNetCliToolReference Include="Microsoft.DotNet.Watcher.Tools" Version="1.0.0" />

Then I just dotnet restore to bring in the tool.

NOTE: There's a color bug using only cmd.exe so on "DOS" you'll see some ANSI chars. That should be fixed in a minor release soon - the PR is in and waiting. On bash or PowerShell things look fin.

In this screenshot, you can see as I make changes to my test and hit save, the DotNetWatcher Tool sees the change and restarts my app, recompiles, and re-runs the tests.

Test Run Successful

All this was done from the command line. I made a solution file, made a library project and a test project, made the test project reference the library, then built and ran the tests. If I could add the tool from the command line I wouldn't have had to manually touch the project file at all.

Again, to be sure, all this is stuff you can (and do) do in Visual Studio manually all the time. But I'll race you anytime. ;)


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!


© 2017 Scott Hanselman. All rights reserved.
     

Visual Studio 2017 can automatically recommend NuGet packages for unknown types

There’s a great feature in Visual Studio 2015.3 and Visual Studio 2017 that is turned off by default. It does use about ~10 megs of memory but it makes me so happy that I turn it on.

It’s under C# | Advanced in Tools Options. Or you can just type “Advanced” in the Quick Launch Bar (via Ctrl+Q if you like) to jump there.

I turn on "Suggest usings for types in NuGet packages" and "Suggest usings for types in reference assemblies."

I turn on “Suggest usings for types in NuGet packages” and “Suggest usings for types in reference assemblies.”

For example, if I am typing some code and start referencing a Type that isn’t in my project but could be…you know how sometimes you just need a using statement to bring in a namespace? In this Web App, I already have Json.NET so it recommends a using statement to bring it into scope.

Can't find JSON

But in this Console App, I have no packages beyond the defaults. When I start using a type like JObject from a popular NuGet, Visual Studio can offer to install Json.NET for me!

Find and install latest version

Or another example:

XmlDocument

And then I can immediately continue typing with intellisense. If I know what I’m doing, I can bring in something like this without ever using the mouse or leaving the line.

JObject is now usable

Good stuff! 


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!


© 2017 Scott Hanselman. All rights reserved.
     

There's a great feature in Visual Studio 2015.3 and Visual Studio 2017 that is turned off by default. It does use about ~10 megs of memory but it makes me so happy that I turn it on.

It's under C# | Advanced in Tools Options. Or you can just type "Advanced" in the Quick Launch Bar (via Ctrl+Q if you like) to jump there.

I turn on "Suggest usings for types in NuGet packages" and "Suggest usings for types in reference assemblies."

I turn on "Suggest usings for types in NuGet packages" and "Suggest usings for types in reference assemblies."

For example, if I am typing some code and start referencing a Type that isn't in my project but could be...you know how sometimes you just need a using statement to bring in a namespace? In this Web App, I already have Json.NET so it recommends a using statement to bring it into scope.

Can't find JSON

But in this Console App, I have no packages beyond the defaults. When I start using a type like JObject from a popular NuGet, Visual Studio can offer to install Json.NET for me!

Find and install latest version

Or another example:

XmlDocument

And then I can immediately continue typing with intellisense. If I know what I'm doing, I can bring in something like this without ever using the mouse or leaving the line.

JObject is now usable

Good stuff! 


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!



© 2017 Scott Hanselman. All rights reserved.
     

Visual Studio 2017 can automatically recommend NuGet packages for unknown types

There’s a great feature in Visual Studio 2015.3 and Visual Studio 2017 that is turned off by default. It does use about ~10 megs of memory but it makes me so happy that I turn it on.

It’s under C# | Advanced in Tools Options. Or you can just type “Advanced” in the Quick Launch Bar (via Ctrl+Q if you like) to jump there.

I turn on "Suggest usings for types in NuGet packages" and "Suggest usings for types in reference assemblies."

I turn on “Suggest usings for types in NuGet packages” and “Suggest usings for types in reference assemblies.”

For example, if I am typing some code and start referencing a Type that isn’t in my project but could be…you know how sometimes you just need a using statement to bring in a namespace? In this Web App, I already have Json.NET so it recommends a using statement to bring it into scope.

Can't find JSON

But in this Console App, I have no packages beyond the defaults. When I start using a type like JObject from a popular NuGet, Visual Studio can offer to install Json.NET for me!

Find and install latest version

Or another example:

XmlDocument

And then I can immediately continue typing with intellisense. If I know what I’m doing, I can bring in something like this without ever using the mouse or leaving the line.

JObject is now usable

Good stuff! 


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!


© 2017 Scott Hanselman. All rights reserved.
     

There's a great feature in Visual Studio 2015.3 and Visual Studio 2017 that is turned off by default. It does use about ~10 megs of memory but it makes me so happy that I turn it on.

It's under C# | Advanced in Tools Options. Or you can just type "Advanced" in the Quick Launch Bar (via Ctrl+Q if you like) to jump there.

I turn on "Suggest usings for types in NuGet packages" and "Suggest usings for types in reference assemblies."

I turn on "Suggest usings for types in NuGet packages" and "Suggest usings for types in reference assemblies."

For example, if I am typing some code and start referencing a Type that isn't in my project but could be...you know how sometimes you just need a using statement to bring in a namespace? In this Web App, I already have Json.NET so it recommends a using statement to bring it into scope.

Can't find JSON

But in this Console App, I have no packages beyond the defaults. When I start using a type like JObject from a popular NuGet, Visual Studio can offer to install Json.NET for me!

Find and install latest version

Or another example:

XmlDocument

And then I can immediately continue typing with intellisense. If I know what I'm doing, I can bring in something like this without ever using the mouse or leaving the line.

JObject is now usable

Good stuff! 


Sponsor: Check out JetBrains Rider: a new cross-platform .NET IDE. Edit, refactor, test, build and debug ASP.NET, .NET Framework, .NET Core, or Unity applications. Learn more and get access to early builds!



© 2017 Scott Hanselman. All rights reserved.
     

Options for CSS and JS Bundling and Minification with ASP.NET Core

Maria and I were updating the NerdDinner sample app (not done yet, but soon) and were looking at various ways to do bundling and minification of the JSS and CS. There’s runtime bundling on ASP.NET 4.x but in recent years web developers have used tools like Grunt or Gulp to orchestrate a client-side build process to squish their assets. The key is to find a balance that gives you easy access to development versions of JS/CSS assets when at dev time, while making it “zero work” to put minified stuff into production. Additionally, some devs don’t need the Grunt/Gulp/npm overhead while others absolutely do. So how do you find balance? Here’s how it works.

I’m in Visual Studio 2017 and I go File | New Project | ASP.NET Core Web App. Bundling isn’t on by default but the configuration you need IS included by default. It’s just minutes to enable and it’s quite nice.

In my Solution Explorer is a “bundleconfig.json” like this:

// Configure bundling and minification for the project.
// More info at https://go.microsoft.com/fwlink/?LinkId=808241
[
{
"outputFileName": "wwwroot/css/site.min.css",
// An array of relative input file paths. Globbing patterns supported
"inputFiles": [
"wwwroot/css/site.css"
]
},
{
"outputFileName": "wwwroot/js/site.min.js",
"inputFiles": [
"wwwroot/js/site.js"
],
// Optionally specify minification options
"minify": {
"enabled": true,
"renameLocals": true
},
// Optionally generate .map file
"sourceMap": false
}
]

Pretty simple. Ins and outs. At the top of the VS editor you’ll see this yellow prompt. VS knows you’re in a bundleconfig.json and in order to use it effectively in VS you grab a small extension. To be clear, it’s NOT required. It just makes it easier. The source is at https://github.com/madskristensen/BundlerMinifier. Slip this UI section if you just want Build-time bundling.

BundleConfig.json

If getting a prompt like this bugs you, you can turn all prompting off here:

Tools Options HTML Advanced Identify Helpful Extensions

Look at your Solution Explorer. See under site.css and site.js? There are associated minified versions of those files. They aren’t really “under” them. They are next to them on the disk, but this hierarchy is a nice way to see that they are associated, and that one generates the other.

Right click on your project and you’ll see this Bundler & Minifier menu:

Bundler and Minifier Menu

You can manually update your Bundles with this item as well as see settings and have bundling show up in the Task Runner Explorer.

Build Time Minification

The VSIX (VS extension) gives you the small menu and some UI hooks, but if you want to have your bundles updated at build time (useful if you don’t use VS!) then you’ll want to add a NuGet package called BuildBundlerMinifier.

You can add this NuGet package SEVERAL ways. Which is awesome.

  • Add it from the Manage NuGet Packages menu
  • Add it from the command line via “dotnet add package BuildBundlerMinifier”
    • Note that this adds it to your csproj without you having to edit it! It’s like “nuget install” but adds references to projects!  The dotnet CLI is lovely.
  • If you have the VSIX installed, just right-click the bundleconfig.json and click “Enable bundle on build…” and you’ll get the NuGet package.
    Enable bundle on build

Now bundling will run on build…

c:\WebApplication8\WebApplication8>dotnet build
Microsoft (R) Build Engine version 15
Copyright (C) Microsoft Corporation. All rights reserved.

Bundler: Begin processing bundleconfig.json
Bundler: Done processing bundleconfig.json
WebApplication8 -> c:\WebApplication8\bin\Debug\netcoreapp1.1\WebApplication8.dll

Build succeeded.
0 Warning(s)
0 Error(s)

…even from the command line with “dotnet build.” It’s all integrated.

This is nice for VS Code or users of other editors. Here’s how it would work entirely from the command prompt:

$ dotnet new mvc
$ dotnet add package BuildBundlerMinifier
$ dotnet restore
$ dotnet run

Advanced: Using Gulp to handle Bundling/Minifying

If you outgrow this bundler or just like Gulp, you can right click and Convert to Gulp!

Convert to Gulp

Now you’ll get a gulpfile.js that uses the bundleconfig.json and you’ve got full control:

gulpfile.js

And during the conversion you’ll get the npm packages you need to do the work automatically:

npm and bower

I’ve found this to be a good balance that can get quickly productive with a project that gets bundling without npm/node, but I can easily grow to a larger, more npm/bower/gulp-driven front-end developer-friendly app.


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Join Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Register now!


© 2017 Scott Hanselman. All rights reserved.
     

Maria and I were updating the NerdDinner sample app (not done yet, but soon) and were looking at various ways to do bundling and minification of the JSS and CS. There's runtime bundling on ASP.NET 4.x but in recent years web developers have used tools like Grunt or Gulp to orchestrate a client-side build process to squish their assets. The key is to find a balance that gives you easy access to development versions of JS/CSS assets when at dev time, while making it "zero work" to put minified stuff into production. Additionally, some devs don't need the Grunt/Gulp/npm overhead while others absolutely do. So how do you find balance? Here's how it works.

I'm in Visual Studio 2017 and I go File | New Project | ASP.NET Core Web App. Bundling isn't on by default but the configuration you need IS included by default. It's just minutes to enable and it's quite nice.

In my Solution Explorer is a "bundleconfig.json" like this:

// Configure bundling and minification for the project.

// More info at https://go.microsoft.com/fwlink/?LinkId=808241
[
{
"outputFileName": "wwwroot/css/site.min.css",
// An array of relative input file paths. Globbing patterns supported
"inputFiles": [
"wwwroot/css/site.css"
]
},
{
"outputFileName": "wwwroot/js/site.min.js",
"inputFiles": [
"wwwroot/js/site.js"
],
// Optionally specify minification options
"minify": {
"enabled": true,
"renameLocals": true
},
// Optionally generate .map file
"sourceMap": false
}
]

Pretty simple. Ins and outs. At the top of the VS editor you'll see this yellow prompt. VS knows you're in a bundleconfig.json and in order to use it effectively in VS you grab a small extension. To be clear, it's NOT required. It just makes it easier. The source is at https://github.com/madskristensen/BundlerMinifier. Slip this UI section if you just want Build-time bundling.

BundleConfig.json

If getting a prompt like this bugs you, you can turn all prompting off here:

Tools Options HTML Advanced Identify Helpful Extensions

Look at your Solution Explorer. See under site.css and site.js? There are associated minified versions of those files. They aren't really "under" them. They are next to them on the disk, but this hierarchy is a nice way to see that they are associated, and that one generates the other.

Right click on your project and you'll see this Bundler & Minifier menu:

Bundler and Minifier Menu

You can manually update your Bundles with this item as well as see settings and have bundling show up in the Task Runner Explorer.

Build Time Minification

The VSIX (VS extension) gives you the small menu and some UI hooks, but if you want to have your bundles updated at build time (useful if you don't use VS!) then you'll want to add a NuGet package called BuildBundlerMinifier.

You can add this NuGet package SEVERAL ways. Which is awesome.

  • Add it from the Manage NuGet Packages menu
  • Add it from the command line via "dotnet add package BuildBundlerMinifier"
    • Note that this adds it to your csproj without you having to edit it! It's like "nuget install" but adds references to projects!  The dotnet CLI is lovely.
  • If you have the VSIX installed, just right-click the bundleconfig.json and click "Enable bundle on build..." and you'll get the NuGet package.
    Enable bundle on build

Now bundling will run on build...

c:\WebApplication8\WebApplication8>dotnet build

Microsoft (R) Build Engine version 15
Copyright (C) Microsoft Corporation. All rights reserved.

Bundler: Begin processing bundleconfig.json
Bundler: Done processing bundleconfig.json
WebApplication8 -> c:\WebApplication8\bin\Debug\netcoreapp1.1\WebApplication8.dll

Build succeeded.
0 Warning(s)
0 Error(s)

...even from the command line with "dotnet build." It's all integrated.

This is nice for VS Code or users of other editors. Here's how it would work entirely from the command prompt:

$ dotnet new mvc

$ dotnet add package BuildBundlerMinifier
$ dotnet restore
$ dotnet run

Advanced: Using Gulp to handle Bundling/Minifying

If you outgrow this bundler or just like Gulp, you can right click and Convert to Gulp!

Convert to Gulp

Now you'll get a gulpfile.js that uses the bundleconfig.json and you've got full control:

gulpfile.js

And during the conversion you'll get the npm packages you need to do the work automatically:

npm and bower

I've found this to be a good balance that can get quickly productive with a project that gets bundling without npm/node, but I can easily grow to a larger, more npm/bower/gulp-driven front-end developer-friendly app.


Sponsor: Did you know VSTS can integrate closely with Octopus Deploy? Join Damian Brady and Brian A. Randell as they show you how to automate deployments from VSTS to Octopus Deploy, and demo the new VSTS Octopus Deploy dashboard widget. Register now!


© 2017 Scott Hanselman. All rights reserved.