introducing razor - a new view engine for asp.net
DESCRIPTION
An Introducing to Razor view engine for ASP.NETTRANSCRIPT
Introducing Razor
Shiju VargheseBlog : http://weblogs.asp.net/shijuvargheseTwitter : http://twitter.com/shijucvEmail : [email protected]
A new view engine for ASP.NET
Who Am I?• Microsoft MVP on ASP.NET• Solution Architect• Focus on Microsoft Web Platform stack• Agile Enthusiast• Technology Consultant – Web Apps/ASP.NET MVC/EF• Blog: http://weblogs.asp.net/shijuvarghese• Twitter: @shijucv
Session Objectives
• Introduction to Razor• Introduction to Razor Syntax• Demonstrate Razor syntax in ASP.NET MVC 3 Views
New tools from Microsoft Web Platform• Web Matrix• IIS Express• ASP.NET Web Pages• SQL Server Compact
• Razor • NuGet
Introduction to Razor• A new view-engine option for ASP.NET• A simplified syntax• Its not a new language • A code focused templating syntax optimized around HTML
generation• Shared by ASP.Net web pages and ASP.Net MVC• Works with any Text Editor• IntelliSense with Visual Studio 2010/ VWD 2010• CSHTML (C#) and VBHTML (VB.NET)• Unit Testable
ASP.NET Razor Support
• ASP.NET Web Pages• Using for inline programming
• ASP.NET MVC 3• Using for ASP.NET MVC Views
• Tools• Web Matrix• Visual Studio 2010• Visual Web Developer 2010
• Languages• C#• VB.Net
@ character• @ character is using for insert server side code• Single statement blocks
@{ var myMessage = "Hello World"; }• Starts inline expressions
<p>The value of myMessage is: @myMessage</p>• Multi-statement blocks
@{var greeting = "Welcome to our Razor!";var weekDay = DateTime.Now.DayOfWeek;var greetingMessage = greeting + " Today is: " + weekDay;}
Razor Syntax
• Web Forms syntax<% for (int i = 0; i < 10; i++) { %> <li><% =i %></li><% } %>
• Razor syntax@for (int i = 0; i < 10; i++) {
<li>@i</li>}
Razor Syntax
@{var name = “Shiju”;var title=“Architect”;<div>
Name: @nameTitle: @title
</div>}
Layout page• Share common html across many pages
• Layout page:_LayoutPage.cshtml<html><title>@Page.Title</title><body>
<div> @Html.Partial("_Header") </div>@RenderBody()<div> @Html.Partial("_Footer")</div>
</body>
Using Layout page
@{Page.Title = “Your Page Title”;Layout = "_Layout.cshtml";
}
_PageStart.cshtml
• Run code for each page• Setup layout page for an entire folder
Using Helper• App_Code/RazorHelper.cshtml
@helper ShowCopyright() {<div>Copyright Shiju Varghese @DateTime.Now.Year </div>
Using a [email protected]()
Demo
Thanks