Introducing ASP.NET MVC

Introducing ASP.NET MVC Intertech’s Oxygen Blast Series July 2009 An Intertech Course

Intertech Introduction  Davin Mickelson, MCT, MCSD, MCPD-Enterprise  Microsoft Technologies Instructor at Intertech  Email: davin@intertech.com  Blog: mndeveloper.com  I teach: Complete ASP.NET 3.5 Complete ASP.NET AJAX Complete C# Complete VB Beginning .NET Complete OOAD w/UML Beginning Programming Beginning OOP  Soon teaching Microsoft SQL Server…  Complete SSIS, SSAS, SSRS Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 2

Intertech Introduction – Background  Developed software professionally since 1994  Used C, C++, C#, VB, and more  Teaching full time for five years  Developed Web apps since 1998 using:  Perl  ColdFusion  PHP  ASP w/VBScript  ASP.NET  Presentations  Tech-Ed presentations  .NET UG and VSTS UG  Thanks for coming today!  I hope this presentation helps you decide about ASP.NET MVC Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 3

Intertech Resources Available Online  Slides available here: http://www.intertech.com/downloads/IntroducingMVC.pdf  Recorded presentation will also be available Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 4

Intertech Agenda  What is ASP.NET MVC?  Why ASP.NET MVC?  Compare ASP.NET Forms to ASP.NET MVC  Setting Up Visual Studio MVC Project Template  Routes  Controllers  Views  Models  Unit Testing  MVC Wrap Up – What and Why Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 5

Intertech What is MVC?  Model – View – Controller (MVC)  Originally developed in 1978 with Smalltalk at Xerox PARC  In recent years, MVC has been used as a Web framework  MVC is used with Java and Ruby  Jakarta Struts, Ruby on Rails, JSF, Spring, and more  “Separation of Concerns”  In ASP.NET Forms, the three pieces are combined (more later!)  The model, the view, and the controller are broken into separate domains  These domains may or may not be defined in separate methods, classes, or assemblies  There is no hard set of rules but rather conventions Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 6

Intertech Introducing ASP.NET MVC  Entirely new way to develop ASP.NET Web pages  MVC applied to the ASP.NET framework  Already been done before! Example: Castle Windsor http://www.castleproject.org/index.html  Microsoft’s release will have more pull, though.  Based on file and folder naming conventions  High quality coding promoted by Test Driven Development (TDD) for strong unit testing  Based on the Inversion of Control (IoC) principle  No central piece of code is in control of execution Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 7

Intertech Why ASP.NET MVC?  Hate the resource wastefulness of standard ASP.NET forms  Need Unit testing with TDD  Prefer greater control over the HTML and JavaScript sent to the Web browser  Want a better way to unit test Web applications  Want refined URL addresses  Have previous experience with the MVC model with another language  Want to take advantage of the many Microsoft’s Object Relational Mapper (ORM) tools  Tired of standard Web forms and want to try something new and cool! Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 8

Intertech Why NOT ASP.NET MVC?  Already supporting a large ASP.NET Web forms project that doesn’t need this architecture  Prefer using the ASP.NET server controls  Prefer using the automatic state management (ViewState)  Don’t need this level of control of the final HTML/JS  Haven’t had time or don’t have time to sharpen your C#/VB programming skills with:  Lambda operator, LINQ, Partial methods, ORM, ADO.NET Entity Framework, etc.  NOTE: You will need learn this stuff eventually! Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 9

Intertech ASP.NET MVC vs. ASP.NET Forms ASP.NET Web Forms ASP.NET MVC We know this stuff already! Entirely new model we must learn Supports ASP.NET Server Controls Primarily supports raw HTML/JS Automatic state mgmt of controls Manual state mgmt Drag and drop controls Manual Web page coding but you’re entirely in control Been around since 2002 1.0 released on April 9th, 2009 Weak or custom TDD required Encourages and includes TDD! Web Sites and WAP WAP only! Both ASP.NET frameworks are supported in VS 2010 Both have access to the five intrinsic objects (Session, Application, etc.) Both support the use of the ASP.NET Provider models (Membership, Profile, Sitemap, and more) Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 10

Intertech Get ASP.NET MVC  ASP.NET MVC is a revolutionary step for Microsoft!  This is the first time Microsoft has ever embraced the open source model at this level  The complete ASP.NET MVC source code can be downloaded from CodePlex, modified and then recompiled for your needs!  http://aspnet.codeplex.com  The jQuery JavaScript library is now included! Wow!  Available as a free “add-on” project template for VS 2008 Web Developer Express (and higher!)  Download it at http://www.asp.net/mvc  Not available as a VS Web Site; must be Web Application Project (WAP) only! Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 11

Intertech Visual Studio 2010  ASP.NET MVC will be released with VS 2010  Project Template available now for VS 2010 Beta 1  Bummer! The “lock in” date for changes to the VS 2010 Beta 1 was before the release of ASP.NET MVC 1.0  Dynamic Data Web applications also supported  Played with VS 2010 and .NET 4.0 yet?  Created with WPF. Um, graphics performance? It’s beta…  Support for F#  Stronger support for multithreaded apps for C++ and .NET  Debugging multiple threads simultaneously Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 12

Intertech Create an ASP.NET MVC Project  Pick a language (C# or VB) for your WAP  Click File | New | Project | ASP.NET MVC Web Application Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 13

Intertech Create Unit Test?  Decide whether to add a Unit test project  Supported with VS 2008 Pro and higher  VS 2008 supports alternative testing frameworks: NUnit, MBUnit Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 14

Intertech Project Created!  ASP.NET MVC requires two important .dlls  System.Web.Mvc.dll  System.Web.Routing  System.Web.Mvc.dll is installed in the GAC  System.Web.Routing.dll was installed with Visual Studio 2008 SP1  Required for Dynamic Data Web apps Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 15

Intertech Models, Views, and Controllers  These three folders suggest where to define the three domains  Conventions:  Each controller class must end with the suffix “Controller” and be in the Controllers folder  Each controller has a dedicated folder with the same name that contains the views  Each view file (.aspx) maps to an action in the controller class  Model classes can be created anywhere but the Models folder is fine if it will just be a few classes  The Shared folder can hold pages and user controls that can be shared across multiple views Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 16

Intertech System.Web.Routing.dll  Installed with VS 2008 SP1  Smart Web addresses are a big part of ASP.NET 4.0  Used by Dynamic Data Web applications for routing web requests  Also used with ASP.NET MVC for routing requests to the proper controllers  Routing is configured in the Global.asax.cs file  A static method called RegisterRoutes() is called in the Application StartUp event handler Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 17

Intertech Default Route  “Default” is the name of the route  {controller} is the name of the controller class  {action} is the name of the public method in the controller class  {id} is a value passed into the method as a parameter  If any or all are not specified, the default parameters are used (Home/Index/””) Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 19

Intertech Adding More Routes  More routes can be added  They should be added from most specific to most generic  The first route that matches a request wins Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 20

Intertech Sample Routes (ignore the port 6831)  http://localhost:6831/  http://localhost:6831/product  http://localhost:6831/6  http://localhost:6831/product/junk  http://localhost:6831/product/Index Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 21

Intertech Route Constraints  Using regular expressions, data can be guaranteed to be of a specific size or type to be passed into a route Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 22

Intertech Which of these routes work?  http://localhost:6831/product/index  http://localhost:6831/product/index/3  http://localhost:6831/product/index/345345  http://localhost:6831/product/  http://localhost:6831/product/junk  http://localhost:6831/  http://localhost:6831/home  http://localhost:6831/home/4564  http://localhost:6831/home/index/4564 Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 23

Intertech Routes can be confusing!  Important points:  Routes must be laid out from most specific to most general  The static RegisterRoute() can be unit tested  Routing is a silent but powerful fourth player in ASP.NET MVC  You can also define “catchall” wildcard routes for handling all kinds of data tacked onto the end of the query string  Consider developing or downloading a route debugger  There are free ones available Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 24

Intertech Controllers - Purpose  Controllers are responsible for handling all incoming requests  They are the first of the three MVC members to interact with the user  Most typically, they interact with a Model to generate or retrieve data  They take the retrieved data and pass it off to a View for display to the user Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 26

Intertech Controllers - Defining  If used with the ASP.NET MVC Project, it must inherit from Controller and end in the name Controller Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 27

Intertech Controllers - Actions  The simplest controller just returns HTML to the Web browser  IMPORTANT: By default, all public methods in a controller class can be called from the Web browser Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 29

Intertech Controllers - ActionResult  Most controller methods return a type of ActionResult ActionResult Purpose Examples of Use Types ViewResult Displays a View return View(); PartialViewResult Displays a Partial View return PartialView(); RedirectToRouteResult Redirects to a route return RedirectToRoute(“NamedRoute”); RedirectResult Simple URL redirection return Redirect(“http://bing.com”); ContentResult Returns raw text to the browser return Content(rssString, “application/rss+xml”); FileResult Returns binary data to browser return File(@”.Doc1.docx”, “application/vnd.ms-word”); JsonResult Returns an object serialized as Json return Json(Car); JavaScriptResult Returns JavaScript intended to run on return JavaScript(“$(#elementName).hide();”); the browser. Used with Ajax. HttpUnauthorizedResult Returns code 401 – not authorized return new HttpUnauthorizedResult(); EmptyResult Doesn’t return. Ends. Return new EmptyResult(); Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 30

Intertech Controllers – Passing Data  Data is passed back to the View using the ViewData or the TempData collections  ViewData is a ViewDataDictionary object  Used for a single Request/Response  TempData is a TempDataDictionary object  Used to preserve data between a RedirectResult or RedirectToRouteResult  Stores data for the current and next HTTP Request/Response Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 31

Intertech Controllers - Ajax  Ajax calls can also be made of the controller  These are also public methods exposed from the controller class Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 35

Intertech Views - Adding  Views give us full control to the HTML and JavaScript mark up  Views can be easily added to the project in the Solution Explorer  IMPORTANT: Make sure you are adding it to subfolder!  Hmm: What is the naming convention for the folder and View? Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 36

Intertech Views - Description  Views are standard .aspx and .ascx Web objects  They are never directly requested by the Web browser  They can use .master pages and .css for stylized views  Views make use of the <%= %> syntax  This is the same as typing out Response.Write() but shorter Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 37

Intertech Views – HTML Helper Methods  Views can also make use of the HTML Helper methods  For example: <%= Html.TextBox(“txtName”) %> HTML Helper Example Use CheckBox Html.CheckBox(“chkChoose”, true) Radio Button Html.RadioButton(“rbRadio”, “val”, false) Hidden Form Field Html.Hidden(“hField”, “CustomerID”) Password Textbox Html.Password(“pPassword”, “val”) Text Area Html.TextArea(“taTextArea”, “val”, 4, 10, null) TextBox Html.TextBox(“txtName”, “Davin”) Drop-Down List Html.DropDownList(“ddlColors”, new SelectList( new [] {“Red”, “Green”, “Blue”}), “Pick One”)) ListBox Html.ListBox(“lbColors”, new MultiSelectList( new [] {“Red”, “Green”, “Blue”})) Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 38

Intertech Views – Back to Spaghetti Code?  Not exactly! Views only control what is sent back to the Web browser  No presentation logic, business logic or data access logic is included in the View  The controller maps a request to a View, only AFTER working with data from the Model Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 39

Intertech Models – All the Logic  Business Logic (BL), Data Access Logic (DAL) – it’s all defined here!  Where you actually write the code is up to you.  With the Model, you have the most flexibility as to where you’d like to place the code  The Model code can be located:  Right inside the Controller class  In a separate class inside the Models folder  In a separate class in the App_Code folder  In a separate Class Library assembly so that it can nbe reused by other applications Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 40

Intertech Models  A Model is code that stores and returns data in a fashion that can ultimately be bound to and displayed by a View  It can any code you want!  A model can be considered the location where your data is stored  Data in an .xml file  Data in a database  Pure business logic  A model represents the smarts of the system Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 41

Intertech Models  Using the ORM in VS 2008 or newer, you can easily program against objects in a database  The “Add View” menu supports the use of SQL Entities and LINQ to SQL Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 42

Intertech Unit Testing for TDD  Test Driven Development (TDD) was downgraded from Team Developer/Tester 2005 to VS 2008 Professional  The Class Designer helps support TDD by making all new methods fail the tests until they’ve been implemented  True TDD developers completely write the tests and then write the code in the methods/properties to pass those tests  Good Unit Testing frameworks test all behavior, no matter then visibility declarations  They can test private, protected, internal, protected internal, and public members Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 43

Intertech TDD in ASP.NET MVC  Testing the RegisterRoutes() will ensure that no one has changed them  Testing the controllers can simulate user requests  Web users will try to pass you anything; be ready for that!  Testing the Models guarantee correct results  Especially important if the models are in separate Class Library assembly for reuse across projects  Testing Views? Maybe  Unfortunately, if you change the HTML/JS out just slightly, your View tests will fail  Some developer prefer not to tests their Views, or only certain Views Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 44

Intertech My thoughts on ASP.NET MVC  Very useful error messages  Get to know know LINQ, NHibernate or Entity Framework, ORM  Control over the output is back in the developer’s hands  Some developers cheer, others boo!  It’s officially been out for two months – it’s young!  Documentation, books – they’re coming this fall  As a Web developer, community support is a must for Views you can “borrow”  The ASP.NET MVC framework is wide open for customization – explore! Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 45

Intertech My thoughts on ASP.NET MVC  Work with it and don’t give up  It can be frustrating!  Find as many examples as you can  Makes a lot of sense to use because of its support for TDD  Remember to rebuild your projects and refresh your browser. When in doubt (weird error?) - Rebuild! Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 46

Intertech Resource List  (Wrox) Professional ASP.NET MVC 1.0  ISBN: 978-0-470-38461-9  Good book to get started with MVC – the Microsoft way!  (Apress) Pro ASP.NET MVC Framework  ISBN: 978-1-4302-1007-8  Good book for a bit more advanced uses of MVC  Promotes greater use of alternative (Alt.NET) View and Unit Testing frameworks  Downloads and more: http://www.asp.net/mvc  Scott Guthrie’s Blog: http://weblogs.asp.net/scottgu/default.aspx Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 47

Intertech Intertech Resources  Intertech offers free:  Content packed newsletters  Podcasts through iTunes  YouTube videos  Free Oxygen Blast seminars  Whitepapers and .pdf downloads  For the above and special offers, register for the newsletter at the bottom of our homepage Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 48

Intertech Intertech Training  Founded in 1991, Intertech offers a full training line-up:  JEE, open source technologies  .NET, Sql Server, SharePoint  XML, Ajax  Delivery formats include:  Instructor-led public and onsite  Instructor-led night and virtual  Self-paced study  For advanced purchase customers, Intertech offers Elite Rewards™— call 651-994-8558 +23 Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 49

Intertech Intertech Consulting  In addition to training, Intertech delivers consulting  Consulting is part of our brand: Instructors Who Consult | Consultants Who Teach  Give your project success with our consulting services  To learn more, contact us at 651-994-8558 +11 Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 50

Intertech Questions For You Folks  Would you be  Let Dan McCabe know! interested in a three-  dmccabe@intertech.com day ASP.NET MVC  Thank you! course?  Would you be interested in a three- day Dynamic Data course? Copyright © Intertech, Inc. 2009 • www.Intertech.com • 800-866-9884 • Slide 51

Q&A An Intertech Course

Thanks for coming! Happy 4th of July! An Intertech Course

Introducing ASP.NET MVC

0 comments

Notes on slide 1

4 Favorites