While I was setting up Windows Terminal, I found that trying to modify settings would open a new instance of Visual Studio since that was my system’s default application for .json files. That’s a pretty heavy choice for what amounts to a text editor, so I thought I’d change my default app to Visual Studio Code. Should be easy, right?
The usual way to do this is through Windows Settings:
Settings > Default Apps > Choose default apps by file type
The problem is, when I did that, Visual Studio Code wasn’t an option!
That’s okay, though. We can change the default app through the command prompt. Open a command prompt in Windows Terminal (note: Command Prompt, not PowerShell) and run the following:
ftype jsonfile="%AppData%\Local\Programs\Microsoft VS Code\Code.exe" "%1" %*
In this article, I’ll demonstrate how to create an ASP.NET Core Angular single-page application using the .NET Core CLI, create a Docker image, and run it as a container. The entire process is just 4 steps, each of which takes about a minute to perform–although creating the Docker image takes a couple minutes to complete. Note, also, that these same steps work from both Linux and Windows.
Create Angular application
Create Docker image
Before you start, make sure you have the following prerequisites installed.
.NET Core SDK
Visual Studio Code with Docker extension
Installation can be verified by running these commands:
We begin by creating our Angular application using the dotnet new command and specifying the angular template. The -o argument will cause the new project to be created in a sub-folder named my-app. This will create a .NET Core ASP.NET project with an Angular app in its ClientApp folder. After running the command, go into the new directory and launch Visual Studio Code.
dotnet new angular -o my-app
Add Docker Files
With the Docker extension for VS Code installed, you can add Docker files easily via the command palette. Open the command palette using ctrl+shift+P or View > Command Palette menu options, and run the command Docker: Add Docker Files to Workspace. (Tip: type “docker” to filter commands.)
Selecting the command will ask you a series of questions:
Application Platform: ASP.NET Core
Operating System: Linux
What port(s) does your app listen on? 80, 443
If you’re running Docker on Windows, it’s important to make sure Docker is configured to run the right type of containers (Windows vs Linux). I answered “Linux” above, and I can confirm that my Docker for Windows is configured to run Linux containers by clicking the Docker icon in my system tray, as shown in the screenshot below. It shows “Switch to Windows containers” which means it’s currently using Linux containers. It’s fine to use Windows containers, too, but you’ll need to adjust installation instructions for NodeJS in the Dockerfile further down.
Once you’ve answered the Docker extention’s questions, a Dockerfile is generated. One modification is needed to also install NodeJS for our client app. The lines needed to do this are highlighted in the complete Dockerfile below.
FROM mcr.microsoft.com/dotnet/core/aspnet:3.1 AS base
FROM mcr.microsoft.com/dotnet/core/sdk:3.1 AS build
COPY ["my-app.csproj", "./"]
RUN dotnet restore "./my-app.csproj"
COPY . .
RUN dotnet build "my-app.csproj" -c Release -o /app/build
RUN apt-get update && \
apt-get install -y wget && \
apt-get install -y gnupg2 && \
wget -qO- https://deb.nodesource.com/setup_10.x | bash - && \
apt-get install -y build-essential nodejs
FROM build AS publish
RUN dotnet publish "my-app.csproj" -c Release -o /app/publish
FROM base AS final
COPY --from=publish /app/publish .
ENTRYPOINT ["dotnet", "my-app.dll"]
Build the Image
When you’re done editing your Dockerfile in VS Code, save changes and head back to the command line. Run the following command to build your image:
docker build -t my-app .
Verify that the image was created by running another command:
docker image ls my-app
Run a Container
Now we’ll use the docker run command to run a container using our image. We’ll specify two arguments: -d to run in detached mode and -p to map ports on the local machine to the container.
docker run -d -p 5000:80 my-app
Verify that the app is running by browsing to the localhost:5000: