My Cart (0)  |  My Orders  |  My Downloads  |  My Auction  |  My Account  |  Help

Login |Register        Search

DNN and Razor 2 -The Almighty

                Print      Add To Favorite     Add To Watch List     Contact Author

Creator: host   5/24/2012 2:12:57 AM    Author: Charles Nurse   Source:   Views: 2147    0    0  
Module develop Razor WebMatrix

What are WebPages and Razor – how do we (ASP.NET developers) use them to build Web Applications.  This is the subject of this new series of articles.  In part 1 I described how you can use WebMatrix to build a simple site using the new CSHTML file type.

Why Razor?

So why do we need a new syntax and parser for ASP.NET?  We already have the ability to combine markup and code in ASP.NET Web Forms (ASPX and ASCX pages). 

Lets look at some traditional ASP.NET code, where we are rendering a table of squares, using a mixture of HTML markup and C# code (Figure 1).

Figure 1 – Traditional ASP.NET


The problem with the traditional ASP.NET parser used in WebForms is that it is not very smart as it requires explicit delimiters – the pair of “bumble-bees” <% %>, so called because of their default syntax highlighting in Visual Studio - to switch back and forth from HTML markup to C# code.

We compare this with the same code using the new Razor syntax (Figure 2).

Figure 2 – Razor code


Notice that in Figure 1 there are 8 delimiters in the traditional ASP.NET syntax – 4 to start code and 4 to return to HTML, while the same code in the Razor syntax (Figure 2) only requires 3 delimiters (the @ symbol). 

The Razor parser is much smarter.  It knows and understands the language (C# or VB), and makes smart decisions about what is markup and what is code.  Also the delimiter used is a single character, which makes the combined markup and code cleaner and more readable, and more readable code is easier to understand.

How does it work?

So what makes the Razor parser smarter?  We will use the example in Figure 2 to highlight how it works.

In line 8 of the example code the first “@” symbol is used to indicate the beginning of C# code. At that point the parser now knows that the following code is C# and as it understands the C# language it knows that at the beginning of the next line the <tr> is not valid C# so it switches back to HTML.

In lines 10 and 11 again the parser detects the “@” symbol and switches to C#.  It understands the concept of C# statements so when it encounters the closing </td> element it knows that – 1) the < is not valid C# and – 2) the preceding C# statement is valid so it switches back to HTML.

Finally, there is the closing “}” in line 11.  At first glance, it appears that we omitted the “@” symbol so the parser knows that the “}” symbol represents C#, but the Razor parser is expecting a “}” at some point, as it detected the opening “{“ on line 8, so as soon as it encounters the “}” it knows to automatically switch back to "C# and close the for statement block.

Razor is a new combination of code (C# or VB.NET) and markup (HTML) that provides cleaner, more readable code.  In the next article in this series we will look in more depth at the Razor syntax.

Rating People: 4   Average Rating:   is built to provide DNN quality modules and DNN skins, some of them are free, some not. We wish these stuffs (free or not ) can be useful to you.

     Besides that, we also provide a full range of professional services, ranging from web site build, seo, system management, administration, support, senior consultancy and security services. We act as if your development project or network was ours, with care and respect. We are not satisfied until it works the way you want it to, and we don't silently ignore found issues as somebody else's problem.