Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Razor new view engine asp.net

3,969 views

Published on

In this presentation give a general overview of razor- new view engine in asp.net. This presentation is presented at the seminar titled "Microsoft Talkz" in AIUB organized by Microsoft.

Published in: Technology
  • Be the first to comment

Razor new view engine asp.net

  1. 1. ‘ Razor’ new ASP.NET View Engine Ahsan Murshed Software Engineer
  2. 2. Introduction <ul><li>Microsoft is developing a &quot;view engine&quot; for its ASP.Net Web development platform </li></ul><ul><li>Main goal: optimized around HTML generation via a code-focused templating approach </li></ul><ul><li>“ Razor” uses a new file suffix “cshtml” or “vbhtml”, where the prefix is the language used in the file. </li></ul>
  3. 3. Razor-view engine <ul><li>The view engine, a pluggable module that implements different template syntax options </li></ul><ul><li>It provides full HTML, JavaScript, and C#/VB code Intellisense within Razor-based files </li></ul><ul><li>Razor syntax is designed around one primary goal: Make code and markup flow together </li></ul>
  4. 4. Sample <ul><li>Old style ASPX </li></ul><ul><li><ul> </li></ul><ul><li><% foreach(var p in Model.Products) { %> </li></ul><ul><li><li><%= p.Name %> ($<%= p.Price %>)</li> </li></ul><ul><li><% } %> </li></ul><ul><li></ul> </li></ul><ul><li>Now let’s, removing all of the extra ASPX control characters </li></ul><ul><li>New style ASPX with ‘Razor’ </li></ul><ul><li><ul> </li></ul><ul><li>foreach(var p in Model.Products) { </li></ul><ul><li><li>p.Name ($p.Price)</li> </li></ul><ul><li>} </li></ul><ul><li></ul> </li></ul>
  5. 5. Sample <ul><li>C# </li></ul><ul><li><ul> </li></ul><ul><li>@foreach(var p in Model.Products) { </li></ul><ul><li><li>@p.Name ($@p.Price)</li> </li></ul><ul><li>} </li></ul><ul><li></ul> </li></ul><ul><li>The &quot;@&quot; character is the magic character in Razor </li></ul><ul><li>One character, not 5 “<%=%>”, and we let the parser figure out the rest. </li></ul>
  6. 6. Design goals <ul><li>Compact, Expressive, and Fluid </li></ul><ul><li>Easy to Learn </li></ul><ul><li>Is not a new language </li></ul><ul><li>Works with any Text Editor </li></ul><ul><li>Has great Intellisense </li></ul><ul><li>Unit Testable </li></ul>
  7. 7. Why? <ul><li>Razor enables you to start with static HTML (or any textual content) and then make it dynamic by adding server code to it.  </li></ul><ul><li>One of the core design goals behind Razor is to make this coding process fluid, and to enable you to quickly integrate server code into your HTML markup with a minimum of keystrokes. </li></ul>
  8. 8. Comparison <ul><li>Using ASP.NET’s existing .ASPX markup syntax, we might write it using <%= %> blocks to indicate “code nuggets” within our HTML markup like so: </li></ul>
  9. 9. Comparison <ul><li>Start of a code block with Razor using a @ character.  Unlike <% %> code nuggets, Razor does not require you to explicitly close the code-block: </li></ul>
  10. 10. Basic syntax <ul><li>If-Blocks Statements </li></ul><ul><li>Multi-line Statements </li></ul>
  11. 11. Basic syntax <ul><li>Multi-Token Statements </li></ul><ul><li>The @( ) syntax enables a code block to have multiple tokens. For example, we could re-write the above code to concatenate a string and the number together within a @( code ) block. </li></ul>
  12. 12. Basic syntax <ul><li>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 </li></ul><ul><li>Razor examines the content on the right-hand side of any @ character and attempts to determine whether it is code or whether it is just static content. </li></ul>
  13. 13. Basic syntax <ul><li>Identifying Nested Content </li></ul><ul><li>When nesting HTML content within an if/else, foreach or other block statement, you should look to wrap the inner content within an HTML or XML element </li></ul>
  14. 14. VS support <ul><li>One can get a rich code editing experience within Visual Studio 2010.  Which will provide full HTML, JavaScript and C#/VB code intellisense within Razor based files </li></ul>
  15. 15. References <ul><li>http://weblogs.asp.net/scottgu/archive/2010/07/02/introducing-razor.aspx </li></ul><ul><li>http://www.asp.net/webmatrix/tutorials/2-introduction-to-asp-net-web-programming-using-the-razor-syntax </li></ul><ul><li>http://weblogs.asp.net/fredriknormen/archive/2010/07/06/razor-the-new-asp-net-view-engine.aspx </li></ul><ul><li>http://blog.andrewnurse.net/CategoryView,category,Razor.aspx </li></ul>
  16. 16. Contract <ul><li>Email: [email_address] </li></ul><ul><li>Blog: http:// aspboss.blogspot.com </li></ul><ul><li>Site: http://www.dotnetboss.com </li></ul>

×