Role Base Security & Vue CLI Templates in ASP.NET Core (Posts by Dotnettricks)

Ajitsamal Afinoz
3 min readSep 21, 2019

--

Role Base Security & Vue CLI Templates in ASP.NET Core Security is the most important part of a modern web application. Every web application owner should make sure that all users must have secure access to the web application. Each user needs to be assigned appropriate credentials and roles according to their capability. The web application also has control on user authorization and authentication as well. ASP.Net Core provides important APIs to implement secure access for the application. Importance of Role-Based Security for Web Application:

For Web Application, developers mainly think of implementing security using safe Username and Password credentials. So, in such a case, the user has to register him/her for accessing the website. Once, the user logins in, he/she can access all the resources of the application. It’s a simple thing of Authentication. But when the website owners wants to control the user access for a specific part of the application, then each of the authenticated users need to be assigned a Role and the website access can be controlled based on the assigned roles. It is known as Role-Based Secure Access or Authorization process. Using the Authorization, each user can be restricted to get the limited access of the Website. In ASP.NET Core online training, the developers will get the Microsoft.AspNetCore.Identity namespace. The namespace provides all the important classes to create as well as manage users and role. So, to implement the Role-Based Security, the following classes are being implemented:

RoleManager — Create Roles and store it in the Persistent Store such as Database. IdentityUser: Represents the object of the Role. IdentityRole: Represents the role object. UserManager: Mainly create a user and store it in the persistent Store e.g. Database. Vue CLI Templates:

Vue.js is now one of the most popular and loved web frameworks ad its CLI 3.0 makes creating and working with Vue.js applications easier than before. When it is coming to the official SPA templates provided by the ASP.Net Core, the developer already knows that it only supports Angular and React out-of-box. What about Vue.js?

Microsoft however, has declined to include support for the Vue CLI, so it depends on the community to fill the gap in their SPA templates.

How to combine ASP.NET Core projects and Vue CLI projects: Writing and maintaining web applications using a modern framework like Vue.js is quite tough. The Vue.js application code is composed of a mixture of vue files with the extension .js/.ts, saas/.css/.less files and some static files like fonts and images. For stitching everything together there is tooling like Webpack and Babel, which can be combined all the various source files into a final set of CSS and Javascript files so that browsers can interpret with it.

Vue.js along with other modern frameworks like React or Angular need to be bundled before it can run in a browser. You can consider the building process which is equivalent to the compiling of .NET application. To bundle the application require friction during the development time and bundles need to be regenerated after doing changes to the source files before executing the latest version of code in the browser. For dealing with Vue.js with this, a development web server is being provided as a part of its tooling.

The web server then generates the bundles and keeps watching the changes on files and automatically generating the bundles along with pushing the changes to the browser. But when your team is working on full-stack and adding a traditional web server framework like ASP.NET Core along with the backend API, the development cycle of your application unexpectedly increases in complexity. So, the developer will now get two servers to get started during development -

* The Vue.js development server which provides HTML/JS/CSS to be run in the browser. * The ASP.NET Core Server providing the backend API that your application will send requests to.

Originally published at https://www.bloglovin.com on September 21, 2019.

--

--

Ajitsamal Afinoz

I am a diligent and motivated self-worker with 3+ years of experience working in credit review and loan processing within the financial tech industry.