8.2. Getting Started

To get started, let's create a web application named WebNorthWind. Open Visual Studio 2005. Click on New Web Site and in the drop-down menus, choose FileSystem, filling in an appropriate file location. Make sure the language is set to Visual Basic, as shown in Figure 8-2.

Visual Studio 2005 will create a filesystem-based web site (you will not find the web site listed under IIS Management) and will create a file, Default.aspx, that represents the first ASP.NET form. The editor will open, and the web Toolbox will be visible (if

Figure 8-2. Creating a new web site

not, you can make it visible through the View window). The toolbox, like all windows, can be "pinned" in place by clicking on the thumbtack.

Depending on how you've configured your system, you'll probably find yourself in the Source view, with a tabbed window allowing you to switch to WYSIWYG (What You See Is What You Get) Design view, as shown in Figure 8-3.

Figure 8-3. Web development editor

I've circled and numbered six areas of this screen:

The Toolbox , which consists of multiple drop-down collections of controls you can add to your application (the standard collection is visible). You can right-click in any one of these collections to pick a menu choice that will sort them alphabetically, as has been done here.
The window manipulation controls. Clicking on the down arrow allows you to change the window placement, as shown in Figure 8-4. Clicking on the thumbtack the window open in place, or, if it is already tacked open auto-hides the window and creates a tab on the side of the editing window. Hover over that tab and the Toolbox reemerges, move away from the Toolbox and it hides again, as shown in Figure 8-5. (Reclicking on the thumbtack pins the window back into place.) Finally, clicking on the "X" closes the Toolbox (you can reopen it from the View menu).

Figure 8-4. Window placement

Figure 8-5. Auto-hiding the Toolbox
The tab indicating the form you are working on (you may have many open at once, and use the tabs to move among them).
The tab that allows you to switch between Source and Design view. You can drag controls from the Toolbox directly onto either view.
The Solution explorer shows you the name and files for each project in your web solution. A solution is just a collection of projects, with each project typically compiled into an assembly.
The Properties window. As you click on controls (or your form), the Properties window will change to reflect the properties (and if appropriate, the events) of that control.

Visual Studio creates a folder named WebNorthWind in the directory you've indicated, and within that directory it creates your Default.aspx page (for the User interface), Default.aspx.vb (for your code) and an App_Data directory (currently empty but often used to hold mdb files or other data-specific files).

While Visual Studio no longer uses projects for web applications, it does keep solution files to allow you to return quickly to a web site or Desktop application you've been developing. The solution files are kept together in a directory you may designate through the Tools Options window, as shown in Figure 8-6.

Figure 8-6. Setting the project location

8.2.1. Code-Behind Files

Let's take a closer look at the .aspx and code-behind files that Visual Studio creates. Start by renaming Default.aspx to Welcome.aspx. To do this, click on the name in the Solution explorer and rename the file.

Note to ASP.NET 1.1 programmers: the code-behind model for ASP.NET has changed.

In Versions 1.x, the code-behind file defined a class that derived from Page. This code-behind class contained instance variables for all the controls on the page, with explicit event binding using delegates and the .aspx page derived from the code-behind class.

In Version 2.0, ASP.NET generates a single class from the combined .aspx page and partial class definitions in the code-behind file.

ASP.NET can infer the control instances and derive event bindings from the markup during compilation; thus, the new code-behind file includes only the application code you need, such as event handlers, and does not need to include instance variables or explicit event binding. The new code-behind files are simpler, easier to maintain, and always in sync with the .aspx page.

Rename the class, which you do by right-clicking on the .aspx page and choosing View Code in the code page. Rename the class Welcome_aspx. You'll see a small line next to the name. Click on it and you'll open the smart tag that allows you to rename the class wherever it is used. Rename Default_aspx as Welcome_aspx, and Visual Studio will do the work of ensuring that every occurrence of Default_aspx is replaced with its new name, as shown in Figure 8-7.

Figure 8-7. Renaming the class

Unfortunately, the name of the class is not changed in the page directive in Welcome.aspx, so go back to the Welcome.aspx file and change the page directive's Inherits attribute to Welcome_aspx.

     <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Welcome.aspx.vb"     Inherits="Welcome_aspx" %>

Within the HTML view of Welcome.aspx, you see that a form has been specified in the body of the page using the standard HTML form tag:

     <form  runat="server">

ASP.NET assumes that you need at least one form to manage the user interaction, and creates one when you open a project. The attribute runat="server" is the key to the server-side magic. Any tag that includes this attribute is considered a server-side control to be executed by the ASP.NET framework on the server. Within the form, Visual Studio has added div tags to facilitate placing your controls and text.

8.2.2. Put a Toe in the Water

Having created an empty web form, the first thing you might want to do is add some text to the page. By switching to Source view, you can add script and HTML directly to the file (just as you could with classic ASP.) Adding the following line to the <body> segment of the HTML page will cause it to display a greeting and the current local time:

     Hello World  ! It is now <% = DateTime.Now.ToString( ) %>

The <% and %> marks indicate that code falls between them (in this case, Visual Basic 2005). The = sign immediately following the opening tag causes ASP.NET to display the value, just like a call to Response.Write. You could just as easily write the line as:

     Hello World! It is now     <% Response.Write(DateTime.Now.ToString( ))%>

Run the page by pressing F5. Visual Studio 2005 will notice that you have not enabled debugging for this application, and a dialog box will appear, offering to enable debugging for you, as shown in Figure 8-8. Click OK. You should see the string printed to the browser, as in Figure 8-9.

Figure 8-8. Enabling debugging

Figure 8-9. Hello World from ASP.NET