×

iFour Logo

What is Razor View Engine in ASP.Net Core?

Kapil Panchal - October 27, 2020

Listening is fun too.

Straighten your back and cherish with coffee - PLAY !

  • play
  • pause
  • pause
What is Razor View Engine in ASP.Net Core?

What is View Engine?


View Engine is responsible for producing an HTML response when called by the Controller Action method.The Controller Action methods can return different types of responseswhich are collectively called as Action Results. The View-result is the Action Result which produces the HTML Response.

The View Results are produced by the View Engine. When the Controller Action method call the view () or PartialView ()it calls the View Engine, which generate the HTML Response.View Engine is responsible for rendering the view into HTML form to the browser, View Engine is used to convert HTMLProgramming language to pure HTML.

Why is View Engine required in ASP.NET?


  • View engine is responsible in creating HTML for View.

  • It converts Pure HTML programming language to HTML

  • View Engine is used to find the Related view for the action method.

  • We are able to write C#/VB code on View

  • View Engine is Needed to implement the strongly-typed View.

What is Razor View Engine?


The Razor View Engine is the default View Engine for the ASP.NET Core. It looks for Razor markup in the View File and parses it and produces the HTML response.

Razor Markup


The Controller in MVC invokes the View by passing the info to render. The Views must have the power to process the info and generate a response. This is done by the Razor markup, which allows us to use C# code in an HTML file. The Razor View Engine process these markups to get the HTML.

The files which contains Razor markup have a. cshtml file extension.The Razor syntax is shorter, simpler and straightforward to find out because it uses the C# or visual basic. The Visual Studio Intelligence support also helps with Razor syntax.

What is Razor Syntax in MVC?


There aretwo types of Razor syntax.

  1. Single statement block: It starts with @.

  2. Multi statement block: It is starts with @ {Coding part}.

It needs to be always enclosed in @ {Coding part}

The semicolon “;” must be used to end the statements

Inline expressions (variables and functions) start with @

 

1) Single block Statements

A single statement block is used when a single line of code needs to write on View.

Example

To display current Date-time.

Create Index.cshtml View and add below code.


  @{  
     ViewBag.Title = "Index";  
 }

Inspect browser and search for “DateTime.Now.ToString()” on browser.We cannot find the C# code on the browser as we did.

If you inspect browser and search for “DateTime.Now.ToString()” on the browser. it could not see the C# code on the browser. We can only see the only HTML code. This is the job of View Engine which convert C# code into pure Html format in the browser.

 

2) Multi statement block

We can also define a multiline statement block as a single-line statement block. In a multiline statement block we can define multiple code statements and doprocess. A multiline block is between opening and closing curly braces {}, but the opening brace will have the "@" character in the same line if we define the "@" and opening curly braces in different lines then it will give an error.

                
@{ Var Java=100; Var Rubi=200; Var Ionic=400; Var sum=(Java+Rubi+Ionic); } Sum of @Java and @Rubi and @Ionic is

Now, let’s see how to write Razor code:

  Variables 

// Using the var keyword:  
var a = "Welcome to MyProgram";  
var b = 300;  
var c = DateTime.Today;    
// Using data types:  
string greeting = "Welcome to MyProgram ";  
int counter = 300;  
DateTime day = DateTime.Today; 
                                        

Now, in the above example, we have declared variables using “var” keyword as well as throughits types forexample. string, int, Date Time. You can declare any of them. Italso uses int, float, decimal, bool and string data types.

 

Conditions

If statement

It starts with code block and its condition is written in parenthesis and the code which needs to be executed once condition gets true is written inside braces.

Let’s understand with the below example.


  @{var a=60;}  
  
  @if (a>50) { The a is greater than 50.
  }
  
                                          

In the above example, we have declared var “a” has a value of 60 and we are using if statement which is validating value of “a”. If the value is greater than 50 then the code written in side braces is executed.


If – Else statement

Initially the code block and its condition arewritten in parenthesis and code which is needs to be executed once the condition gets true is written inside braces and if it does not gettrue then code write inside else block gets executed.

Let’s understand with the below example.


  @ {var a=60;}  
  
  @if (a>50) { The value is greater than 50.
  } else {
  The value is less than 50.
  }
  
                                            

In the above example, we have declared var “a” having a value of 60 and we are using if statement which is validating value of “a”. If the “a” is greater than 50 then the code written inside braces gets executed else the “a” is less than 50 and it will be executed.


Switch statement

It is used to check multiple times with different conditions.


  @ {  
      var month = DateTime.Now.Year.ToString();  
      var message = "";  
  }   
    
       
    @ {  
          switch (month)   
          {  
              case "January":  
                  message = "Starting of Year.";  
                  break;  
              case "June":  
                  message = "Middle of Year";  
                  break;  
              case "December":  
                  message = "End of Year";  
                  break;  
          }  
          @message;   
  
                                                

Looking to Hire ASP.Net Core Developer ?

Contact Now

 

Loops

Loops are used for executing same statement multiple times.

For Loops

If you know how many times you want to run the loop, you can use a For loop.


  @for(var i = 0; i<10; i="">
                                                
For Each Loops

Foreach loop is used when you are working with array.

<10; i="">
@foreach (var x in Request.variable) {
    @x
}
<10; i="">
                                                

Model

If you want to use model in HTML page then you have to declare model shown below

<10; i="">
  @model modelname
  Let's understand in the below example.
    @model data Detail:
  Id: @Model.Id 
  Name: @Model.Name
  Age: @Model.Age
  <10; i="">
                                              

Now, in the above example, we have used data model which is created in the Model folder by declaring @model data and by using @Model, we are using its properties.

Conclusion


Using Razor View Engine,you can make dynamic HTML Pages and use to get the data from model and database.

What is Razor View Engine in ASP.Net Core? What is View Engine? View Engine is responsible for producing an HTML response when called by the Controller Action method.The Controller Action methods can return different types of responseswhich are collectively called as Action Results. The View-result is the Action Result which produces the HTML Response. The View Results are produced by the View Engine. When the Controller Action method call the view () or PartialView ()it calls the View Engine, which generate the HTML Response.View Engine is responsible for rendering the view into HTML form to the browser, View Engine is used to convert HTMLProgramming language to pure HTML. Why is View Engine required in ASP.NET? View engine is responsible in creating HTML for View. It converts Pure HTML programming language to HTML View Engine is used to find the Related view for the action method. We are able to write C#/VB code on View View Engine is Needed to implement the strongly-typed View. What is Razor View Engine? The Razor View Engine is the default View Engine for the ASP.NET Core. It looks for Razor markup in the View File and parses it and produces the HTML response. Razor Markup The Controller in MVC invokes the View by passing the info to render. The Views must have the power to process the info and generate a response. This is done by the Razor markup, which allows us to use C# code in an HTML file. The Razor View Engine process these markups to get the HTML. The files which contains Razor markup have a. cshtml file extension.The Razor syntax is shorter, simpler and straightforward to find out because it uses the C# or visual basic. The Visual Studio Intelligence support also helps with Razor syntax. What is Razor Syntax in MVC? There aretwo types of Razor syntax. Single statement block: It starts with @. Multi statement block: It is starts with @ {Coding part}. It needs to be always enclosed in @ {Coding part} The semicolon “;” must be used to end the statements Inline expressions (variables and functions) start with @ Read More: How To Use Elmah For Enumerating Error In Asp.net Core?   1) Single block Statements A single statement block is used when a single line of code needs to write on View. Example To display current Date-time. Create Index.cshtml View and add below code. @{ ViewBag.Title = "Index"; } Current-Date: @DateTime.Now.ToString() Current-Long Date: @DateTime.Now.ToLongDateString() Inspect browser and search for “DateTime.Now.ToString()” on browser.We cannot find the C# code on the browser as we did. If you inspect browser and search for “DateTime.Now.ToString()” on the browser. it could not see the C# code on the browser. We can only see the only HTML code. This is the job of View Engine which convert C# code into pure Html format in the browser.   2) Multi statement block We can also define a multiline statement block as a single-line statement block. In a multiline statement block we can define multiple code statements and doprocess. A multiline block is between opening and closing curly braces {}, but the opening brace will have the "@" character in the same line if we define the "@" and opening curly braces in different lines then it will give an error. @{ Var Java=100; Var Rubi=200; Var Ionic=400; Var sum=(Java+Rubi+Ionic); } Sum of @Java and @Rubi and @Ionic is Now, let’s see how to write Razor code:   Variables  // Using the var keyword: var a = "Welcome to MyProgram"; var b = 300; var c = DateTime.Today; // Using data types: string greeting = "Welcome to MyProgram "; int counter = 300; DateTime day = DateTime.Today; Now, in the above example, we have declared variables using “var” keyword as well as throughits types forexample. string, int, Date Time. You can declare any of them. Italso uses int, float, decimal, bool and string data types.   Conditions If statement It starts with code block and its condition is written in parenthesis and the code which needs to be executed once condition gets true is written inside braces. Let’s understand with the below example. @{var a=60;} @if (a>50) { The a is greater than 50. } In the above example, we have declared var “a” has a value of 60 and we are using if statement which is validating value of “a”. If the value is greater than 50 then the code written in side braces is executed. If – Else statement Initially the code block and its condition arewritten in parenthesis and code which is needs to be executed once the condition gets true is written inside braces and if it does not gettrue then code write inside else block gets executed. Let’s understand with the below example. @ {var a=60;} @if (a>50) { The value is greater than 50. } else { The value is less than 50. } In the above example, we have declared var “a” having a value of 60 and we are using if statement which is validating value of “a”. If the “a” is greater than 50 then the code written inside braces gets executed else the “a” is less than 50 and it will be executed. Switch statement It is used to check multiple times with different conditions. @ { var month = DateTime.Now.Year.ToString(); var message = ""; } @ { switch (month) { case "January": message = "Starting of Year."; break; case "June": message = "Middle of Year"; break; case "December": message = "End of Year"; break; } @message; Looking to Hire ASP.Net Core Developer ? Contact Now See here   Loops Loops are used for executing same statement multiple times. For Loops If you know how many times you want to run the loop, you can use a For loop. @for(var i = 0; i For Each Loops Foreach loop is used when you are working with array. @foreach (var x in Request.variable) { @x } Model If you want to use model in HTML page then you have to declare model shown below @model modelname Let's understand in the below example. @model data Detail: Id: @Model.Id Name: @Model.Name Age: @Model.Age Now, in the above example, we have used data model which is created in the Model folder by declaring @model data and by using @Model, we are using its properties. Conclusion Using Razor View Engine,you can make dynamic HTML Pages and use to get the data from model and database.
Kapil Panchal

Kapil Panchal

A passionate Technical writer and an SEO freak working as a Content Development Manager at iFour Technolab, USA. With extensive experience in IT, Services, and Product sectors, I relish writing about technology and love sharing exceptional insights on various platforms. I believe in constant learning and am passionate about being better every day.

Build Your Agile Team

Enter your e-mail address Please enter valid e-mail

Categories

Ensure your sustainable growth with our team

Talk to our experts
Sustainable
Sustainable
 
Blog Our insights
10 Executive Dashboard Examples for Consultants and CEOs
10 Executive Dashboard Examples for Consultants and CEOs

There is a principle behind every business. “If you don’t keep track of essentials, you won’t get clear direction, eventually causing your company to stumble.” To manage this scenario,...

How Spatial Data Analysis Improves Healthcare
How Spatial Data Analysis Improves Healthcare

Do you know when geospatial analysis took traction in healthcare? It was when John Snow, a London-based physician, used it to analyze the spread of cholera, which ultimately proved...

4 Types of Power BI Dashboards: Analytical, Strategic, Operational, and Tactical
4 Types of Power BI Dashboards: Analytical, Strategic, Operational, and Tactical

One interesting aspect you truly love about Power BI, as a CTO, is how it lets you step back and see the bigger picture of your business. Isn’t it? Without getting bogged down in minute...