Category Archives: Visual Studio

Your First Razor UI Library with ASP .NET Core

By Shahed C on December 2, 2018

This is the ninth of a new series of posts on ASP .NET Core. In this post, we’ll learn about Razor Class Libraries to build reusable UI for your web app. This post is also included in Matthew Groves‘ 2018 C# Advent Calendar, in the Dec 2 slot.

ASPNETCoreLogo-300x267

Introduction to Razor Class Libraries

From an earlier post on Pages in ASP .NET Core, we’ve seen various of ways of creating web pages with or without controllers, views and models to support each of your pages. If you’re an experienced developer, you already know how to reuse server-side code in class libraries.

Starting with ASP .NET Core 2.1, you can now “package your Razor views and pages (.cshtml files) along with your controllers, page models, and data models in reusable class libraries that can be packaged and shared. Apps can then include pre-built UI components by referencing these packages and customize the UI by overriding specific views and pages.”

Better yet, ASP .NET Core Identity is now available as a Razor Class Library, and can be scaffolded into your web application with just the pieces you need.

Before You Begin

Before you begin, take a look at the sample code project on GitHub:

Web GameConsoles on GitHub: https://github.com/shahedc/GameConsoles

Open the GameConsoles.sln file to load the 2 projects included with the solution:

  • Web App project (Set as StartUp Project)
  • Razor UI Class Library project (contains shared UI for reuse)

Steps to Create in Visual Studio 2017

Create Class Library project, add reusable UI: 

  1. Click File | New | Project
  2. Select ASP .NET Core Web Application, click OK
  3. Select Razor Class Library under ASP .NET Core 2.1

VS2017-Project-RazorClassLibrary

Add partial views under /Pages/Shared/

  • /Pages/Shared/_Header.cshtml
  • /Pages/Shared/_Footer.cshtml
  1. Create folder structure /Pages/Shared/
  2. Add new Razor View _Header.cshtml to Shared subfolder
  3. Add new Razor View _Footer.cshtml to Shared subfolder

Reference for adding new folders and views: https://docs.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/adding-view?view=aspnetcore-2.1

Contents of _Header.cshtml:

<h3>_Header.cshtml partial view.</h3>

<p>/Pages/Shared/_Header.cshtml</p>

<a href="/">Home</a>

Contents of _Footer.cshtml:

<h3>_Footer.cshtml partial view.</h3>

<p>/Pages/Shared/_Footer.cshtml</p>

Source: <a href="https://en.wikipedia.org/wiki/List_of_home_video_game_consoles">https://en.wikipedia.org/wiki/List_of_home_video_game_consoles</a>

Continue reading

Watching for File Changes in ASP .NET Core

By Shahed C on November 26, 2018

This is the eighth of a new series of posts on ASP .NET Core. In this post, we’ll learn how to use the .NET CLI file watcher tool during development and debugging.

ASPNETCoreLogo-300x267

Before You Begin

Before you begin, take a look at the sample code project on GitHub:

Web AspNetCoreWatcher on GitHub: https://github.com/shahedc/AspNetCoreWatcher

Specifically, look at the history of CalcController to see how the Sum() method has been updated to accept doubles and not just ints, when summing up two numbers.

Debugging while Running

Initially, we have a Sum() method that looks like this:

 [Route("[action]")]
 public ActionResult<string> Sum(
    [FromQuery(Name = "num1")] int num1,
    [FromQuery(Name = "num2")] int num2)
 {
    var sum = (num1 + num2).ToString();
    return $"The sum of numbers {num1} and {num2} is {sum}.";
 }

We can run the web app from the command line using dotnet run:

> dotnet run

This allows us to access the Web API via a web browser to add 2 numbers, e.g. 3 and 4 for num1 and num2.

https://localhost:5001/api/calc/Sum?num1=3&num2=4

SumInts

However, we get an error if we try to pass in numbers with decimal points, e.g. 3 and 4.4 for num1 and num2.

https://localhost:5001/api/calc/Sum?num1=3&num2=4.4

SumDoublesError

Continue reading

EF Core Migrations in ASP .NET Core

By Shahed C on November 15, 2018

This is the seventh of a new series of posts on ASP .NET Core. In this post, we’ll be looking at the use of EF Core Migrations for your ASP .NET Core web apps. (Normally, I would publish these blog posts on a weekend to allow developers to read it the following week. However, it’s Thanksgiving next week in the US, so I’m publishing this one a few days earlier.) 

ASPNETCoreLogo-300x267

Entity Framework Core

Entity Framework is Microsoft’s ORM (Object-Relational Mapper) and EF Core is a lightweight, cross-platform version of EF, useful for ASP .NET Core web app developers. This article isn’t going to try and convince you of the benefits of using an ORM. If you’re reading this article, hopefully you’ll already recognize the value of using an ORM for your web app.

Instead, we’ll be focusing on EF Core Migrations for taking control of your database. By using migrations, you’ll be able to add and manipulate database objects, define relationships between entities and help developers and server environments stay in sync with specific versions of your database schema.

EFCore-diagrams

Continue reading

NetLearner – ASP .NET Core Internet Learning Helper

By Shahed C on November 11, 2018

This is the sixth of a new series of posts on ASP .NET Core. This week, we’ll be looking  at NetLearner, a new ASP.NET Core Web app to organize online learning resources.

ASPNETCoreLogo-300x267

NetLearner: What is it?

NetLearner is an ASP .NET Core web app to allow any user to consolidate multiple learning resources all under one umbrella.

NetLearner-logo

Some Background: As I’ve been doing a lot of R&D on ASP .NET Core, I found myself keeping track of blog posts, podcasts, YouTube videos, Twitch streams, Pluralsight tutorials, ebooks across Amazon, Safari Books Online, and so much more. I’ve been using Notepad, OneNote, browser bookmarks, Twitter lists, emails to myself, Google/Word docs and so much more just to keep track of URLs, notes and progress. I’m building this new app for myself to organize my learning plans, but also open-sourcing it and deploying it to allow others to use it too.

Web NetLearner on GitHub: https://github.com/shahedc/NetLearner

The name implies 2 things: the app’s source code will be a real-world example for people learning .NET (specifically ASP .NET Core 2.1 and beyond), and the tool itself will help people learn any topic from various resources across the Internet.

What can you expect in 2019?

  1. Use the web app’s source code to learn all about ASP .NET Core 2.1+ and beyond.
  2. Add links to various learning resources: books, articles, blogs, conference sessions, podcasts, online workshops, videos and livestreams.
  3. View embedded content where appropriate, e.g. videos
  4. See contents of RSS feed where appropriate, e.g. blogs with RSS
  5. Discover what others have added to their NetLearner lists, via suggestions of what’s popular.
  6. Follow content creators with links to their social media accounts.
  7. Deploy your own instance instantly to your own Azure account.
  8. Build lists to learn anything and share with others.

Stay tuned for more information!

Your Web App Secrets in ASP .NET Core

By Shahed C on November 4, 2018

This is the fifth of a new series of posts on ASP .NET Core. This week, we’ll be looking  at app secrets for ASP .NET Core projects, for use in development environments.

ASPNETCoreLogo-300x267

Protecting Application Secrets During Development

Most web apps need to store some configuration information that can be accessed by the application during runtime. This may include database connection strings and API keys, which are not user-specific confidential values, but are still sensitive pieces of information that need to be protected.

Once in a while, a developer may accidentally commit such sensitive information to public repositories such as Github. Quoting this blog post from the Azure website, “Keep in mind that removing a published secret does not address the risk of exposure. The secret may have been compromised, with or without your knowledge and is still exposed in Git History. For these reasons, the secret must be rotated and/or revoked immediately to avoid security risks.”

This blog post intends to prevent you from ever making that mistake in the first place. You may download the following sample project to follow along.

Web AppSecretDemo: https://github.com/shahedc/AppSecretDemo

Continue reading