Skip to main content

Posts

Showing posts from November, 2020

.Net 5 MVC Application Model Binding And Validation Using Record Types(C#9 Feature)

In this article, we will understand the model binding and validation that will be carried out by 'record' types c#9 feature in MVC application. Specs: C#9 .Net5 MVC Application C# 9 Record Types: The Record Types has been introduced in C# 9 feature. Using Record Types, it is effortless to create immutable reference types. Most features supported by 'Class' will be supported by the 'Record' types but in the case to make them immutable(not allow changes in the object) then it will be an ideal choice to use 'Record' types. Record Syntax Type1: public record Profile { public string FirstName { get; } public string MiddleName { get; } } Above Record, the syntax looks similar to 'class' but only defense instead of 'class' we use 'record' keyword. Always declare properties as private in records that fulfill our immutable feature. Record Syntax Type2: public record Profile(string FirstName, string MiddleName) This syntax declarat

NestJS In-Memory Cache

In this article, we are going to explore the steps to implement the In-Memory Cache in the NestJS application. Caching can significantly improve application performance and its scalability by reducing the workload to generate the content. In-Memory cache creates within the server application memory. Since it uses application memory it delivers content more fastly. But if our application runs on multiple nodes or multiple servers then the in-memory cache can't be shared between the nodes or server each will maintains its own in-memory cache. Create A Sample NestJS Application: Let's understand step by step implementation authentication in NestJs application, so let's begin our journey by creating a sample application. Command To Install CLI: npm i -g @nestjs/cli Command To Create NestJS App: npm new your_project_name Install Cache Npm Packages: NestJS Cache NPM Packages: npm install cache-manager npm install -D @types/cache-manager Register CacheModule: Now let's

A Localization Sample Using Blazor WebAssembly

In this article, we are going to implement Localization in the Blazor WebAssembly sample application. The translation to a specific region or country or culture or local can be called as Localization. The websites with Localization can reach a wider range of audiences. Create A Sample Blazor WebAssembly App: Let's start coding by creating a sample blazor webassembly application(I'm using .Net5 Blazor). For development, IDE can be chosen based on own preferences but the most recommended IDE's are Visual Studio 2019(The latest version that supports .Net5) and  Visual Studio Code . Install Supporting Package: Package Manager: Install-Package Microsoft.Extensions.Localization .Net CLI: dotnet add package Microsoft.Extensions.Localization Register AddLocalization Services: To get the full support of Localization we need to register the 'AddLocalization' service. Program.cs: builder.Services.AddLocalization(options => { options.ResourcesPath = "Resources&

A Sample On Blazor WebAssembly Virtualization Component

The 'Virtualize' pre-build Blazor component was shipped from .Net5 framework.  The concept behind making a virtualization component is to render the HTML content within the are of the viewport(i.e, visible area on a page).  The most useful case to use this 'Virtualize' component is to display huge table content of data, by using this component renders the huge data as parts of data based on visible area dynamically.  This dynamic loading data rendering will happen on scroll-up and scroll-down event implicitly nothing to worry about by us.  This makes our website UI more user-friendly to render huge data without any UI delay. Create A Sample WebAssembly Application: The virtualization component can be used either in Blazor Server or Blazor WebAssembly applications. Here we are going to create a sample application using the Blazor WebAssembly template. For developing our sample application we can use any IDE of your choice but the most recommended are Visual Studio 2019(S

.Net5 Web API Redis Cache Using StackExchange.Redis.Extensions Library

In this article, we are going to explore the integration of Redis cache in .Net5 Web API application using the 'StackExchange.Redis.Exntensions' library. Note:- Microsoft has introduced an 'IDistributedCache' interface in dotnet core which supports different cache stores like In-Memory, Redis, NCache, etc. It is simple and easy to work with  'IDistributedCache', for the Redis store with limited features but if we want more features of the Redis store we can choose to use 'StackExchange.Redis.Extensions'.  Click here for Redis Cache Integration Using IDistributedCache Interface . Overview On StackExchange.Redis.Extnesions Library: The 'StackExchange.Redis.Extension' library extended from the main library 'StackExchange.Redis'. Some of the key features of this library like: Default serialization and deserialization. Easy to save and fetch complex objects. Search key. Multiple Database Access Setup Redis Docker Instance: For this sampl

Part-2 Angular JWT(JSON Web Token) Authentication(Refresh Token Implementation)

In  Part-1  we have implemented steps for jwt authentication in angular application. This is a continuation of  Part-1 , our main goals here to use the access token as a key for authorization header to access secured endpoints and refresh token to re-issue the access token on the expiration. NestJS(Nodejs) Todos API: In  Part-1  we discussed steps to set up the Nestjs API. In that API we have a secured endpoint called 'Todos'. In the next step, we are going to consume this 'Todo' API from our angular application. http://localhost:3000/todos Authorization Header To Access Secured Endpoint: Now let's try to consume the secured 'Todos' endpoint by adding the access token to the request header. Let's create a 'Todos' service. src/app/services/todos.service.ts: import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; @Injectable() export class TodosService{ constructor(private http:HttpCl

Part-1 Angular JWT(JSON Web Token) Authentication(Access Token Implementation)

In this article, we are going to understand the steps on JWT authentication implementation in Angular(Version11 used in this sample) application. Here our main focus is on authenticate users using the JWT access token. What Is JSON Web Token?: JSON Web Token is a digitally signed and secured token for user validation. The jwt is constructed with 3 informative parts: Header Payload Signature Create A Sample Angular Application: Let's begin by creating a sample application in which we are going to implement JWT authentication. Command To Install Angular CLI: npm install -g @angular/cli Command To Create Angular App: ng new your_app_name Command To Install Angular Material: ng add @angular/material Angular JWT Library: JWT library to decrypt the user info within the JWT access token. Command To Run Angular JWT Library: npm install @auth0/angular-jwt Integrate Login Module: Let's create all login files like the below structure. src/app/login/login-route.module.ts: impo