Project Template Changes in Visual Studio 2010

In earlier versions of ASP.NET, when you use Visual Studio to create a new Web Site project or Web Application project, the resulting projects contain only a Default.aspx page, a default Web.config file, and the App_Data folder, as shown in the following figure:

Visual Studio also supports an Empty Web Site project type, which contains no files at all, as shown in the following figure:

The result is that for the beginner, there is very little guidance on how to build a production Web application. Therefore, ASP.NET 4 Beta 2 introduces three new templates, one for an empty Web application project, and one each for a Web Application and Web Site project.

Empty Web Application Template

As the name suggests, the Empty Web Application template is a stripped-down Web Application project. You select this project template from the Visual Studio New Project dialog box, as shown in the following figure:

When you create an Empty ASP.NET Web Application, Visual Studio creates the following folder layout:

This is similar to the Empty Web Site layout from earlier versions of ASP.NET, with one exception. In Visual Studio 2010 Beta 2, Empty Web Application and Empty Web Site projects contain the following minimal Web.config file that contains information used by Visual Studio to identify the framework that the project is targeting:

Without this targetFramework property, Visual Studio defaults to targeting the .NET Framework 2.0 in order to preserve compatibility when opening older applications.

Web Application and Web Site Project Templates

The other two new project templates that are shipped with Visual Studio 2010 Beta 2 contain major changes. The following figure shows the project layout that is created when you create a new Web Application project. (The layout for a Web Site project is virtually identical.)

The project includes a number of files that were not created in earlier versions. In addition, the new Web Application project is configured with basic membership functionality, which lets you quickly get started in securing access to the new application. Because of this inclusion, the Web.config file for the new project includes entries that are used to configure membership, roles, and profiles. The following example shows the Web.config file for a new Web Application project. (In this case, roleManager is disabled.)

The project also contains a second Web.config file in the Account directory. The second configuration file provides a way to secure access to the ChangePassword.aspx page for non-logged in users. The following example shows the contents of the second Web.config file.

The pages created by default in the new project templates also contain more content than in previous versions. The project contains a default master page and CSS file, and the default page (Default.aspx) is configured to use the master page by default. The result is that when you run the Web application or Web site for the first time, the default (home) page is already functional. In fact, it is similar to the default page you see when you start up a new MVC application.

The intention of these changes to the project templates is to provide guidance on how to start building a new Web application. With semantically correct, strict XHTML 1.0-compliant markup and with layout that is specified using CSS, the pages in the templates represent best practices for building ASP.NET 4 Web applications. The default pages also have a two-column layout that you can easily customize.

For example, imagine that for a new Web Application you want to change some of the colors and insert your company logo in place of the My ASP.NET Application logo. To do this, you create a new directory under Content to store your logo image:

To add the image to the page, you then open the Site.Master file, find where the My ASP.NET Application text is defined, and replace it with an image element whose src attribute is set to the new logo image, as in the following example:

You can then go into the Site.css file and modify CSS class definitions to change the background color of the page as well as that of the header, as in the following example:

The result of these changes is that you can display a customized home page with very little effort: