Today we are sharing a pre-release build of a new code generation framework known as ASP.NET Scaffolding, as well as a scaffold generator (code generator) for Web Forms. The Web Forms scaffold generator can automatically build Create-Read-Update-Delete (CRUD) views based on a model.

Introduction

Many programming tasks involve writing standard “boilerplate” code. Templates can help avoid having to hand-write all of this code, but only to a degree because they are static. MVC3 introduced the concept of scaffolding - generating code dynamically based on existing artifacts in a project. We are now extending this concept to other frameworks, starting with Web Forms for CRUD views generation.

The scaffolding framework provides APIs, conventions and a common delivery and discovery mechanism enabling a consistent experience for all ASP.NET scaffold generators.

Getting Started

As a prerequisite, you need to be running Visual Studio 2012 (Pro, Premium or Ultimate) with the Web Tooling Extensions 2012.2 Update.

1. First, download and install the VSIX extension. From the Visual Studio main menu select “Tools” –> “Extensions and Updates…”. From the left sidebar select “Online” and search for “Microsoft ASP.NET Scaffolding”.
2. Create a new Visual C# ASP.NET Web Forms Application project targeting .NET 4.5. If you are not starting a new project you can convert any project to a web application project by right-clicking on the solution and choosing “Convert to Web Application”.
3. In the project,  open the NuGet Package manager and install the “ASP.NET Web Forms Scaffold Generator” (“Microsoft.AspNet.Scaffolding.WebForms”) package.
   • Right click on your project in Solution Explorer and select “Manage NuGet Packages…”
   • Ensure that “Include Prerelease” is selected in the dropdown at the top of the NuGet window
   • Search for “ASP.NET Web Forms Scaffolding” (or using the package ID of “Microsoft.AspNet.Scaffolding.WebForms”)
   • Click “Install”

Note: If you started from any template different than the template above, or you did not have the latest Visual Studio update and you have not used ASP.NET Friendly URLs in your project you will have to manually enable it. For more information, please check the ASP.NET Friendly URLs website.

Running the scaffold generator

1. Create a Model: The Web Forms scaffold generator creates Create-Read-Update-Delete (CRUD) views when provided with a model. Currently it only supports simple POCO models without inheritance or related entities. Let's use the sample model below:
   

   publicclass Person
       {
           [ScaffoldColumn(false)]publicint ID { get; set; }publicstring FirstName { get; set; }publicstring LastName { get; set; }
       }

2. Build your project: from the “Build” menu select “Build Solution”.
3. To run the scaffold generator, open Solution Explorer and right click on your project. Select "Add >” and then select “Scaffold…". 
    
   
   
   
4. Click "Add" to run the selected scaffold generator. 
   
   
   
   
5. The “Add Web Forms Pages” dialog will appear.
   
6. Select the model class that you created under the "Model class" dropdown. 
   
   
   
   
7. Select "Add new data context…" from the "Data context class" dropdown. Choose a name for the new data context and click OK.
   
8. Depending on your preference choose whether to generate desktop or mobile views, or both.
   
9. Click "Add" to run the scaffold generator.

Check the Results

• All the files generated by the Web Forms scaffold generator can be found in the Views/<Model>/ folder. In addition to that it would have modified Web.config to add a connection string for a new DataContext class if that option was selected.
• Each CRUD component should have a generated view with a corresponding code-behind.
• For example, open Edit.aspx or Edit.mobile.aspx to examine it.
• Inside of Edit.aspx, there should be a DynamicEntity control which in turn generates Label and DynamicControl pairs, one for each property of your model.
• Inside of Edit.aspx.cs or Edit.mobile.aspx.cs, there should be GetItem and UpdateItem methods properly referencing the <Model> that you created for their queries.
• To run the new scaffold, select Application Root\Views\Person\Default.aspx and hit Run. You should see the People list with links to create/edit/delete entries:
  
  
  
  
• If you generated mobile views you can easily see them as well by activating the F12 developer tools and then changing the user agent of the browser to a mobile one (e.g. from the developer tools menu select “Tools” –> “Change user agent string” –> “IE10 for Windows Phone 8”) and refreshing the page:
  
   

Known Issues

• If you don't have the Web Tools 2012.2 RC Fall Update installed, you need to add the following to your Global.asax.cs for FriendlyUrls to work:
  

  using System.Web.Routing; 
      ... protectedvoid Application_Start(object sender, EventArgs e) 
      { 
          RouteConfig.RegisterRoutes(RouteTable.Routes); 
      }

• Related model entities are not supported in this pre-release.
• Once you install the “ASP.NET Web Forms Scaffold Generator” package the dependent package “ASP.NET Scaffolding Infrastructure” will get installed but may not get marked as installed in NuGet. This is due to a bug in NuGet that is on their list to get fixed.
• Only solutions with a single project within them are supported.
• To uninstall first remove the NuGet packages and then manually delete the following folders under the “packages” subfolder of your project: “Microsoft.AspNet.Scaffolding.Infrastructure.0.1.0-pre” and “Microsoft.AspNet.Scaffolding.WebForms.0.1.0-pre”.
• jQuery Mobile 1.9.1 or later is not supported yet.
• Visual Studio 2011, Visual Web Developer, .NET 4.0 and Visual Basic projects are not supported in this pre-release.

References

• ASP.NET DynamicData
• ASP.NET Friendly URLs
• ASP.NET Web Forms Model Binding

We'd love to hear from you

• What do you think of the experience and flow overall?
• What features would you like to see in the Web Forms scaffold generator itself?