Skip to main content


Showing posts from February, 2021

.Net5 Web API Managing Files Using Azure Blob Storage

In this article, we are going to understand the different file operations like uploading, reading, downloading, and deleting in .Net5 Web API application using Azure Blob Storage. Azure Blob Storage: Azure blob storage is Microsoft cloud storage. Blob storage can store a massive amount of file data as unstructured data. The unstructured data means not belong to any specific type, which means text or binary data. So something like images or pdf or videos to store in the cloud, then the most recommended is to use the blob store. The key component to creating azure blob storage resource: Storage Account:- A Storage account gives a unique namespace in Azure for all the data we will save. Every object that we store in Azure Storage has an address. The address is nothing but the unique name of our Storage Account name. The combination of the account name and the Azure Storage blob endpoint forms the base address for each object in our Storage account. For example, if our Storage Account is n

Pagination In Vue3 Application Using '@ocrv/vue-tailwind-pagination' Plugin

In this article, we will understand the pagination in the Vue3 application using the '@ocrv/vue-tailwind-pagination' plugin. Key Features Of Plugin: current -  The 'current' property to set the current page number. total - The 'total' property that represents the number of records for the table content. So based on this 'total' property value, the total number of page numbers display depends. per-page - The 'per-page' property to set the count for the records to display for each page. page-changed - The 'page-changed' event that raises on selecting the page. It outputs  '$event' which is nothing but the selected page number. Create A Vue3 Sample Application: To implement our pagination sample let's begin by creating a Vue3 sample application. Command To Create Vue3 Application: Vue Create Your_Sample_App_name Install Tailwind Pagination NPM Package: Tailwind Pagination NPM Package Command: npm install --save @ocrv/vue-ta

.Net5 Blazor WebAssembly CRUD Operation Sample For Beginners

In this article, we will explore CRUD operations in .Net5 Blazor WebAssembly application. This article targeting an audience like beginners of Blazor WebAssebly.  Create A .Net5 Blazor WebAssembly: Visual Studio users should have the latest version of 2019VS(Version 16.8.*) to build the .Net5 application. From Visual Studio it is pretty simple to create a Blazor WebAssebly application since VS provides users with a nice GUI for interaction. One other option to create an application is with .Net CLI commands. So one of the best IDE for .Net CLI developers is  Visual Studio Code Editor . .Net CLI Command To Create Blazor WebAssembly Project: dotnet new blazorwasm -n your_project_name Rest API: In the blazor webassembly application, displaying data, storing or updating data, or removing data is carried out by Rest API. So for in our demo application, we will consume a free rest API like '' . But there are limitations with these free r

360 Degree Image Preview In VueJS Application Using 'vue-360' Plugin

This article, explains about 360-degree image previewer in the vue.js application using the 'vue-360' plugin. Overview  On 'vue-360' Library: Some of the key features of the 'vue-360' library are: amount - total number of image count that is used to display the 360-degree image preview. imagePath -   need to specify the relative path or full domain path without the image name. fileName - need to specify the file name. spinReverse - boolean property used to rotate the images in reverse order. The default value is false. autoplay -  autoplay your images. The default value is '24' images. loop - number of loops you want for autoplay. The default value is '1'. boxShadow-  apply a box-shadow background. The default value is 'false'. buttonClass - apply styling to buttons. The default value is 'light'. paddingIndex - apply leading zero to image index. The default value is 'false'. disableZoom - disabling zoom functionality.

Part-2 Hot Chocolate GraphQL Validate JWT Access Token And Different Authorization Techniques

Part-1  completely discussed the steps to generate the access token in the GraphQL endpoint. Now in this article, our main goals are to validate the JWT access token and also we try to understand authorization techniques in GraphQL. Install JwtBearer Authentication NuGet: Let's install JwtBearer Authentication NuGet to configure JwtBearer services. .Net CLI Command: dotnet add package Microsoft.AspNetCore.Authentication.JwtBearer Package Manager Command: Install-Package Microsoft.AspNetCore.Authentication.JwtBearer Register JWT Validation Service: Now we need to register the JwtBearer service to validate our access token on the user sending the access token as an authorization header. Startup.cs: using Microsoft.AspNetCore.Authentication.JwtBearer; using Microsoft.IdentityModel.Tokens; services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme) .AddJwtBearer(options => { options.TokenValidationParameters = new TokenValidationParameters { ValidIssuer = Con

Part-1 Hot Chocolate GraphQL JWT(JSON Web Token) Authentication - Generating User Login Access Token

In this article, we are going to implement a JWT authentication sample for the Hot Chocolate GraphQL endpoint. It's purely optional to implement JWT authentication in the GarphQL approach. Because .Net supports endpoint configuration for both normal .Net endpoint and GraphQL endpoint. While implementing GraphQL in your application and if you want to develop an authentication endpoint in the .Net approach there is no issue. But if you want to develop all endpoint in GraphQL including authentication that is also fine. So in this article, our goal is to create JWT authentication as a GraphQL endpoint. Create A .Net5 Web API Application: To understand the concept let's start our journey by creating a sample .Net5 Web API application. Recommended IDE for development are like Visual Studio 2019(Version 16.8.* for .Net5) or  Visual Studio Code . Install Hot Chocolate Library: Package Manager Command: Install-Package HotChocolate.AspNetCore -Version 11.0.2 .Net CLI Command: dotn