Photo by Todd Quackenbush on Unsplash

Angular 12 starter repo with boilerplate code for server-side pagination, CRUD, OIDC/oAuth2 JWT login, role-based access, and UI/UX Bootstrap. Include source code for backend Token Service Server and REST Api Resources in ASP.NET CORE 5.
https://github.com/workcontrolgit/cat-toolkit-angular-starter

Introduction

Imagine yourself participating in an Angular hackathon, where you and your team will build a line-of-business app in 8 hours. The app must be responsive, secure, and business-oriented. Options are building the app from scratch with bare Angular CLI or employing a starter kit to jump-start the project. …


Photo by Dan Nelson on Unsplash

Introduction

Microsoft Identity Web is a set of ASP.NET Core libraries that simplifies adding authentication and authorization support to web apps and web APIs integrating with the Microsoft identity platform. Developers can modernize app security with Microsoft Identity Web and let users and customers sign in to the applications using Microsoft identities or social accounts.

If you’re building Blazor (server-side) apps, then the Visual Studio and Blazor Server App templates support Azure AD authentication out of the box. In this tutorial, I will take you through the steps to create a Blazor Server App and wire it to AzureAd. Be aware…


Photo by MIKHAIL VASILYEV on Unsplash

Another software pattern? Don’t we have enough patterns out there already? Please, hear me out. The purpose of this story is to make an introduction to the CAT (Clients- ApiResoures-TokenService) pattern to promote tightly integrated but loosely coupled modular software components.

Prelude

For those who are into political science and programming, you can draw similarities between the US Federal Government and the CAT architecture pattern. Check this out.

The US Federal Government: To ensure a separation of powers, the U.S. Federal Government is made up of three branches: Legislative, Executive, and Judicial. …


Photo by Icons8 Team on Unsplash

Update: On May 12, 2021, Google released Angular version 12. The sample Angular app in this tutorial has been upgraded from version 11 to 12. You can find the upgraded source code in the ng-12-upgrade branch. The master branch is still at version 11.

I have worked with the Angular framework since version 2. Over the years, I figured that building robust security into Single Page Application (SPA) is complex and repetitive. If you are a developer who is looking for instructions to secure your Angular application using JSON Web Token (JWT), this story is for you.

To demonstrate how…


Photo by Austin Distel on Unsplash

This is a multipart tutorial for implementing Token Service to secure Clients and API Resources using OIDC/oAuth2/JWT. The core technology includes

  1. IdentityServer4 + Admin UI
  2. ASP.NET CORE 3.1
  3. Angular 9+
  4. Azure Cloud (for a live demo)
  5. And many more

Who is this publication for?

  1. Angular/NetCore developers who are searching for a solution to secure your Client apps and WebAPI with JWT. You have spent weeks/months reading thru partial solutions scattered thru out the world wide web to figure out how the OIDC/oAuth2/JWT works.
  2. Developers who use Microsoft NetCore/Angular template to create a prototype and find it difficult to scale and deploy in real-world applications.
  3. Developers…


Photo by Ben White on Unsplash

What does JWT stand for? Just Wasting Time? John Wayne Trail? Job Without Title?

Introduction

React is a JavaScript library for building user interfaces. Developers can use the Create React App for building a new single-page application (SPA). Create React App doesn’t handle backend logic or security. It just creates a frontend user interface in Javascript/HTML and leaves it up to developers to pick a backend technology such as ASP.NET, Node, Python, or Java.

If you work with Microsoft ASP.NET Core, there is a good chance that you have heard of a popular middleware product called IdentityServer4 and its frontend Admin…


Photo by Robin Noguier on Unsplash

Man is a tool-using animal. Without tools he is nothing, with tools he is all.
— Thomas Carlyle

Introduction

Blazor WebAssembly is Microsoft's newest UI framework for building Single Page Application (SPA), using C# rather than JavasScript. Like any other SPA, the Blazor WebAssembly App relies on JSON Web Tokens (JWT) for access control. The anatomy of JWT consists of ID token and Access token. The ID token confirms the user’s identity, while the Access token grants the user’s permission to access API Resources.

What would it take to integrate JWT into Blazor WebAssembly App? Are there tools or libraries out…


Photo by Vika Aleksandrova on Unsplash

Browser + Razor = Blazor

Introduction

Blazor WebAssembly is a Microsoft UI framework for building Single Page Application (SPA) using C# rather than JavasScript. Microsoft provides productivity tools to scaffold the Blazor WebAssembly App via the dotnet command line and Visual Studio (VS) template. This tutorial will focus on using VS 2019 template to create the Blazor app.

Tutorial Content

In this tutorial, you will learn to set up your development environment and build your first Blazor web app with Visual Studio 2019.

Part 1: Configure your local environment for Blazor development with Visual Studio 2019.

Part 2: Create a Blazor WebAssembly App…

Fuji Nguyen

Software engineer. Design and build SPA, WebAPI, and DevSecOps pipelines. Developer Experience (DX) advocate and opensource contributor

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store