Header Ads

ASP.NET Core 2: Architecture & Design Pattern Ideology

The need of more robust and interactive web experience is growing rapidly and so, is the need of more improved, simpler and developer friendly web technologies are rising in terms of making web development more productive, highly user-friendly & interactive and quicker to develop with less effort. Gone are those days when development of a website consumes a lot of time and expenses as everything needs to be done from scratch by yourself. Now a days, everything is available to a web developer and all that needs to build a website is understanding of the technology and the focus on more productive web development.

Today's demonstration is more theoretical than code base as I will try to elucidate ASP.NET Core 2 architecture and ideology behind some core design patterns being made part of the ASP.NET core 2 development templates.

                                                                    

ASP.NET Core Architecture

The ideology behind the ASP.NET core in general as the name suggests is to layer out web logic, infrastructure and core components from each other in order to provide more development friendly web development environment.  The concept is somewhat similar to "N" tier/layer architecture, the only difference is that ASP.NET core defines the layers as core component of the platform which ease the developer from redefining it in order to make solution more modular and reusable. What happens in ASP.NET core is that main Business logic and UI logic are encapsulated in ASP.NET core Web App layer, while, database access layer, cache services and web API services are encapsulated in infrastructure layer and common utilities, objects, interfaces and reusable business services are encapsulated as micro-services in application core layer.

So, in essences ASP.NET core creates necessary per-defined "N" tier/layers architecture for us developers automatically, which saves our time and effort to worry less about the complexity of necessary "N" tier/architecture of the web project and focus more on the business logic. In non-ASP.NET core environment, what happens in general that we as a developer are more focused on the business logic and the selection of best design patterns not on the architecture side because at the end of the day the final version of our web project is deployed on a single tier machine and we are more focused on managing the complexity of the project in terms of code re-usability and modular components but on a single tier, very few organizations/enterprises actually implement "N" tier/layer architecture to make their product more robust and modular as "N" tier/layer architecture requires more resources consumption, management for scaling the project as necessary and of course hiring of more skilled resources that can build the necessities.

No wonder you will find many modern web development frameworks more pre-build design pattern friendly rather that pre-build tier/layer friendly, for, that matter, a developer need to make the necessary tiers/layer himself/herself and no wonder MVC design pattern is the most popular for web development. Remember that design pattern and architecture are separate concepts, unfortunately, many senior developers refer design pattern and architecture as same, so, they refer MVC as architecture rather than design pattern. So, here comes ASP.NET core that brings the benefit of pre-build architectural framework that ease out tier deployment of the project along with providing pre-build Single Page Application (SPA) design pattern, Razor Pages (Page based more cleaner MVC model) design pattern and traditional MVC (View based model) design pattern. These design patterns are mostly used in hybrid manner, but, can be utilize as individual only pattern as well.

ASP.NET Web Core 2 Project Templates

So, here are the list of project templates that ASP.NET web core 2 provides i.e.
  1. ASP.NET Core Web App (Razor Pages).
  2. ASP.NET Core Web App (Model-View-Controller).
  3. ASP.NET Core Web API (no UI).
  4. ASP.NET Core with Angular (SPA).
  5. ASP.NET Core with React.js (SPA).
  6. ASP.NET Core with React.js and Redux (SPA).

Traditional Web Application Vs Single Page Application (SPA)

There are two approaches in which a web application is being built i.e.
  1. Traditional Web Application.
  2. Single Page Application (SPA).

1) Traditional Web Application

In Traditional Web Application development style, UI application logic is performed at server side. For example, in MVC design pattern application every time user clicks, the web request is sent back to server and on response entire page is reloaded, even with ajax calls to load only necessary component, the logic against any action is done at server level and then necessary UI or component on screen will load. This development style makes frequent web request calls impacting performance of the website.

2) Single Page Application (SPA)

In Single Page Application development style, UI logic is performed at client (web browser) side and server side is communicated primarily for data processing through web api calls. For example, modern front-end framework AngularJS provides all the necessary tools to perform interactive UI logic at client side and make only necessary calls to the server side. This definitely reduces frequent server requests and improves performance.

When to choose Traditional Application vs Single Page Application (SPA) Development Style

Here below is the excerpt from Architecting Modern Web Applications with ASP.NET Core 2 and Microsoft Azure book that explains well about the decision for development approach. Notice that most of the time hybrid approach is being used for development style:

Factor
Traditional Web App
Single Page Application
Required Team Familiarity with JavaScript/TypeScript
Minimal
Required
Support Browsers without Scripting
Supported
Not Supported
Minimal Client-Side Application Behavior
Well-Suited
Overkill
Rich, Complex User Interface Requirements
Limited
Well-Suited


Razor Pages (Page based model)

Razor Pages are the default web development approach in asp.net core. Razor pages are referred as page based model. Razor pages are built into ASP.NET core MVC, it provides all the similar features as MVC pattern provides, but, with its own syntax style and in much more cleaner way. In typical MVC (view based model) style, you will see a lot of folders each for controller, model and views. In case of razor pages, there are no such folders, but one i.e. "Pages" folder which is route folder for all pages. Instead of separate controller with actions and each action represent a view, razor pages are compact version of mvc style that attaches controller or view model directly with the page and there is no multiple views for each page, but, on one and necessary behind logic attach to the page and default endpoint is "OnGet()”" method, this is why it is termed as page based model. In simple terms, those of you who are familiar with WPF development or windows phone development or windows store development might find this style similar to MVVM pattern. So, in short razor pages are web development MVVM pattern in which view model is attach directly to the page.

Microsoft Azure vs IIS Server Deployment

The deployment of asp.net core can be done of personal web hosted server or on Microsoft azure. However, the pre-built architectural benefit that is the essence of the asp.net core will be noticed more on Microsoft Azure as Microsoft azure will automatically handles the tier/layers deployment and scaling automatically with the notice of the developer and do necessary load balancing of requests accordingly. In case of IIS server, asp.net core will be deployed as a regular single tier application requiring necessary steps for application scaling and load balancing the requests.

Conclusion

In this article, you will learn about asp.net core architecture ideology. You will also learn about different project templates that asp.net core 2 provides. You will learn about traditional web application approach and single page application (SPA) approach. You will learn about necessary comparison to choose between traditional application and single page application (SPA) approach. You will learn about asp.net core razor pages. You will also learn about asp.net core deployment advantage on Microsoft Azure instead of IIS server.

Disclaimer

I do not own any image. Images are taken from Architecting Modern Web Applications with ASP.NET Core 2 and Microsoft Azure.

11 comments:

  1. Which is great but with the templates not being kept inline with new releases of the spa frameworks it still works out easier rolling the whole thing by hand from an empty project !

    ReplyDelete
  2. Hey, this is an Amazing article. This article is a good read to know more tips on designing the web.
    ProWeb365

    ReplyDelete
  3. Such A Nice Post, Keep Up The Fantastic Work. Do check the link below:
    custom logo

    ReplyDelete
  4. Great post! Thanks for sharing a piece of informative information. It would be helpful for newbies, keep posting. I appreciate your efforts. Click here.

    ReplyDelete
  5. This is great job, thanks for sharing it with us.

    Buy law essay

    ReplyDelete
  6. Excellent Blog! I would like to thank for the efforts you have made in writing this post. I am hoping the same best work from you in the future as well. I wanted to thank you for this websites! Thanks for sharing. Great websites! Modern Java EE Design Patterns PDF

    ReplyDelete
  7. I have read good things here. Definitely worth to bookmark again. I am amazed at how much effort you put into creating such an informative website.

    Data Science Training in Bangalore

    ReplyDelete
  8. I think this is an informative and very useful and knowledgeable blog. therefore, I would like to thank you for your effort.
    Data Science Course in Jaipur

    ReplyDelete
  9. it's really nice and meanful. it's really cool blog. Linking is very useful thing.you have really helped lots of people who visit blog and provide them usefull information. Web Design Oxford

    ReplyDelete
  10. Allow each coat to dry before applying the next, and then on the final coat, use the hand sander to lightly sand it.Meridian ID

    ReplyDelete