[ASP. NET mvc3 learning] introducing "Razor"-A New View engine for ASP. NET

Address: http://weblogs.asp.net/scottgu/archive/2010/07/02/introducing-razor.aspx

Design goals

We had several design goals in mind as we prototyped and evaluated "razor ":

• Compact, expressive, and fluid: Razor minimizes the number of characters and keystrokes required in a file, and enables a fast, fluid coding workflow. unlike most template syntaxes, you do not need to interrupt your coding to explicitly denote server blocks within your HTML. the parser is smart enough to infer this from your code. this enables a really compact and expressive syntax which is clean, fast and fun to type.

• Easy to learn: Razor is easy to learn and enables you to quickly be productive with a minimum of concepts. You use all your existing language and HTML skills.

• Is not a new language:We consciously chose not to create a new imperative language with razor. instead we wanted to enable developers to use their existing C #/Vb (or other) language skills with razor, and deliver a template markup syntax that enables an awesome HTML construction workflow with your language of choice.

• Works with any text editor: Razor doesn't require a specific tool and enables you to be productive in any plain old Text Editor (Notepad works great ).

• Has great intelliisense: While razor has been designed to not require a specific tool or code editor, it will have awesome statement completion support within Visual Studio. we'll be updating Visual Studio 2010 and Visual Web Developer 2010 to have full editor intelliisense for it.

• Unit testable: The New View engine implementation will support the ability to unit test views (without requiring a controller or web-server, and can be hosted in any unit test project-no special app-domain required ).

Loops and Nested HTML sample

Notice above how we started a "foreach" loop using the @ symbol, and then contained a line of HTML content with code blocks within it. because the razor parser understands the C # semantics in our code block, it was able to determine that <li> content shocould be contained within the foreach and treated like content that shocould be looped. it also recognized that the trailing} terminated the foreach statement.

Razor was also smart enough to identify the @ P. Name and @ P. Price statementsWithinThe <li> element as server code-and execute them each time through the loop. notice how razor was smart enough to automatically close the @ p. name and @ p. price code blocks by inferring how the HTML and code is being used together.

If-blocks and multi-line statements

Below are a few examples of other common scenarios:

If statements

Like ourForeachExample above, you can embed content within if statements (or any other C # Or VB language construct), without having to be explicit about the code block's begin/end. For example:

Multi-line statements

You can denote multiple lines of code by wrapping it within @{Code} Block like so:

 

Notice above how variables can span multiple server code blocks-the "message" variable defined within the multi-line {} block, for example, is also being used within the @ message code block. this is conceptually the same as the <%> and <% = %> syntax. aspx markup files.

Multi-Token statements

The @ () syntax enables a code block to have multiple tokens. for example, we cocould re-write the above Code to concatenate a string and the number together within a @ (CODE) block:

 

Integrating content and code

Razor's language parser is clever enough in most cases to infer whether a @ character within a template is being used for code or static content. for example, below I'm using a @ character as part of an email address:

When parsing a file, Razor examines the content on the right-hand side of any @ character and attempts to determine whether it is C # code (if it is a cshtml file) or VB Code (if it is a vbhtml file) or whether it is just static content. the above code will output the following HTML (where the email address is output as static content and the @ datetime. now is evaluated as code:

In cases where the content is valid as code as well (and you want to treat it as content), you can explicitly escape out @ characters by typing @@.

Encapsulation and re-use with HTML helpers

Code Based HTML helpers

ASP. net MVC today has the concept of "HTML helpers"-which are methods that can be invoked within code-blocks, and which encapsulate generating HTML. these are implemented using pure code today (typically as extension methods ). all of the existing HTML extension methods built with ASP. net MVC (both ones we 've built and ones built by others) will work using the "Razor" view engine (no code changes required ):

Declarative HTML helpers

Generating HTML output using a code-only class approach works-but is not ideal.

One of the features we are looking to enable with razor is an easy way to create re-usable HTML helpers using a more declarative approach. our plan is to enable you to define reusable helpers using a @ helper {} declarative syntax like below.

You'll be able to place. cshtml files that contain these helpers into a views/helpers directory and then re-use them from any view or page in your site (no extra steps required ):

Note above how our productlisting () helper is able to define arguments and parameters. this enables you to pass any parameters you want to them (and take full advantage of existing ages features like optional parameters, nullable types, generics, etc ). you'll also get debugging support for them within Visual Studio.

Note: The @ helper syntax won't be in the first beta of razor-but is something we hope will be enabled with the next drop. code-based helpers will work with the first beta.