Getting Started with ASP.NET MVC 3 and Razor

17,177 views
16,889 views

Published on

Published in: Technology
0 Comments
9 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
17,177
On SlideShare
0
From Embeds
0
Number of Embeds
5,747
Actions
Shares
0
Downloads
68
Comments
0
Likes
9
Embeds 0
No embeds

No notes for slide
  • There have been a lot of rumors floating around that ASP.NET Web Forms is dying and being replaced with ASP.NET MVC…you know, like the Web Forms Reaper is coming? Well….here I am!
  • It is up to you to decide how you want to get your data and how to define your objects. Although there are accepted guidelines on how to have good design, it is not decided for you with The ASP.Net MVC Framework.
  • Getting Started with ASP.NET MVC 3 and Razor

    1. 1. rev 1.0/0111<br />Getting Started withASP.NET MVC 3 and Razor<br />Dan Wahlin<br />http://www.TheWahlinGroup.com<br />
    2. 2. Contact Info<br />Blog<br />http://weblogs.asp.net/dwahlin<br />Twitter<br />@DanWahlin<br />Email:<br />dwahlin@theWahlinGroup.com<br />
    3. 3. rev 1.0/0111<br />Agenda<br />The MVC Pattern<br />ASP.NET MVC 3<br />Getting Started with Razor<br />Demos<br />
    4. 4.
    5. 5. MVC Pattern - A Conceptual View<br />Decouples the backend business logic from the front end<br />Model<br />Binds the model and view together and selects which view to display next<br />Data Transfer<br />Request<br />Controller<br />Business InteractionLayer<br />User InteractionLayer<br />View<br />Response<br />Visualizes the application data supplied by the model<br />
    6. 6. Model<br />Has business/domain logic<br />ASP.NET MVC doesn’t tell you what to use:<br />LINQ to SQL<br />nHiberate<br />Entity Framework<br />PLINQO<br />Custom/POCO object<br />rev 1.0/0111<br />
    7. 7. View<br />Should be “thin” and dumb<br />No business logic<br />Only Display logic / Transformation of data<br />JavaScript is valid for client side - jQuery<br />rev 1.0/0111<br />
    8. 8. Controller<br />Should also be "thin"<br />Controller has "Actions"<br />Requests always come through the controller<br />Decides what data is needed<br />Tells which View to render<br />Tells the View what "Model" render<br />rev 1.0/0111<br />
    9. 9. rev 1.0/0111<br />Agenda<br />The MVC Pattern<br />ASP.NET MVC 3<br />Getting Started with Razor<br />Demos<br />
    10. 10. What is ASP.NET MVC?<br />ASP.NET MVC implements the Model-View-Controller pattern<br />Provides an alternative to ASP.NET Web Forms<br />Available from http://www.asp.net/mvc/mvc3<br />rev 1.0/0111<br />INTRODUCTION-10<br />
    11. 11. Goals of ASP.NET MVC Framework<br />rev 1.0/0111<br /><ul><li>Clean url schemes (think SEO)
    12. 12. Support existing ASP.NET runtime features
    13. 13. 100% control over rendered HTML
    14. 14. Testable by default (built with TDD in mind)
    15. 15. Support third-party view engines
    16. 16. Support static and dynamic languages
    17. 17. Auto-mapping of form variables to object properties
    18. 18. Built-in validation support</li></li></ul><li>Key ASP.NET MVC 3 Features<br />Razor View Engine<br />.cshtml extension<br />Dynamic ViewBag Property<br />Global Filters<br />JSON binding for Action Parameters<br />Enhanced .NET 4 Validation Support<br />Unobtrusive JavaScript for validation<br />Layout Page<br />Partial-Page Output Caching<br />Support for Dependency Injection<br />rev 1.0/0111<br />
    19. 19. ASP.NET MVC 3 Project Structure<br />INTRODUCTION-13<br />Controllers<br />Razor Pages (Views)<br />Model Classes<br />"Master Page"<br />rev 1.0/0111<br />
    20. 20. Steps to use ASP.NET MVC<br />Create a controller class in the Controllers folder<br />Add one or more Actions (methods) into the controller<br />Right-click on an Action and select Add View from the menu<br />rev 1.0/0111<br />
    21. 21. rev 1.0/0111<br />Agenda<br />The MVC Pattern<br />ASP.NET MVC 3<br />Getting Started with Razor<br />Demos<br />
    22. 22. What is Razor?<br />ASP.NET MVC 3 ships with a new View Engine called "Razor"<br />Less markup transitions as compared to the ASP.NET Web Forms View Engine<br />Provides a compact way to mingle code with markup<br />Uses the @ character<br />rev 1.0/0111<br />
    23. 23. Without Razor<br /><ul><br /><%foreach (varcust in Customers) { %><br /> <li><%: cust.Name%></li><br /><% } %><br /></ul><br />rev 1.0/0111<br />
    24. 24. With Razor<br /><ul><br /> @foreach (varcust in Customers) { <li>@cust.Name</li><br /> } <br /></ul><br />rev 1.0/0111<br />
    25. 25. Razor Fundamentals<br />Razor provides a compact syntax for mixing "code" with markup:<br />rev 1.0/0111<br />
    26. 26. Razor Example<br />@model ProjectName.ViewModels.CustomerViewModel<br /><fieldset><br /> <legend>Customer Data</legend><br /> <p><br /> <label for="FirstName">First Name:</label><br />@Html.EditorFor(m => m.Customer.FirstName)<br />@Html.ValidationMessageFor(m => m.Customer.FirstName, "*")<br /> </p><br /> <p><br /> <label for="LastName">Last Name:</label><br />@Html.EditorFor(m => m.Customer.LastName)<br />@Html.ValidationMessageFor(m => m.Customer.LastName, "*")<br /> </p><br /></fieldset><br />rev 1.0/0111<br />
    27. 27. Razor Layout Pages<br />Razor uses a _Layout.cshtml file as a "master page"<br />_Layout.cshtml<br /><html><br /><title>@ViewBag.Title</title><br /><body><br /> @RenderBody()<br /></body><br /></html><br />Index.cshtml@{<br />ViewBag.Title= “Your Page Title”;<br /> }<br /><div>Hello World!</div><br />
    28. 28. Thanks!<br />Blog<br />http://weblogs.asp.net/dwahlin<br />Twitter<br />@DanWahlin<br />Email:<br />dwahlin@theWahlinGroup.com<br />
    29. 29. ASP.NET MVC 3 Demo Site<br />Download an ASP.NET MVC 3 demo site from http://mvcmusicstore.codeplex.com<br />rev 1.0/0111<br />
    30. 30. Razor Tools<br />Web Forms View to Razor View Converter:https://github.com/telerik/razor-converter<br />MVC 2 to MVC 3 Project Converterhttp://aspnet.codeplex.com/releases/view/59008<br />rev 1.0/0111<br />

    ×