Walkthrough: Creating a Simple Web App

In this walkthrough, you will create a simple Web app to use as the basis for a Web performance test in Walkthrough: Recording and Running a Web Performance Test.

You’ll perform the following tasks:

Prerequisites

Here’s what you’ll need:

In Visual Studio Ultimate, on the FILE menu, choose New and then choose Project.

The New Project dialog box appears.
Under Installed templates, expand the programming language that you prefer and then choose Web.
In the list of Web project types, select ASP.NET Empty Web Application.

Note

You will write minimal code in this walkthrough.
In the Name box, type ColorWebApp.
In the Location box, specify the folder where you want to create your Web app.
Select Create directory for solution.
Choose OK.
In Solution Explorer, verify that the new ColorWebApp project is selected.
On the PROJECT menu, choose Add New Item.

The Add New Item dialog box appears.
In the list of items, choose Web Form.
In the Name text box, type Default.aspx and then choose Add.

In Solution Explorer, right-click Default.aspx and choose View Designer.

A blank page is displayed.
If the toolbox is not visible, from the VIEW menu choose Toolbox.
From the Standard group, drag a RadioButtonList onto the page.

A RadioButtonList control is added to the design surface.
Expand the RadioButtonList Tasks action tag pane, and choose the EditItems link.

A ListItem Collection Editor appears.

Note

You can also display the ListItem Collection Editor by editing the Items collection on the Properties window.
Choose Add to add a new item.
Under ListItem properties:
1. Change the Text property to Red.
2. Set the Selected property to True.
Choose Add to add another item.
Under ListItem properties change the Text property to Blue.
Choose OK to close the ListItem Collection Editor.
From the toolbox, drag a Button onto the page and in the Properties window, change the Text property to Submit.
On the FILE menu, choose Save All.

On the PROJECT menu, choose Add New Item.
In the Add New Item dialog box, select Web Form from the list of templates, and in Name type Red.aspx. Then choose Add.
At the bottom of the document window, choose the Design tab to switch to design view.
Drag a Label onto the page. In the Properties window, set the Text property to Red, and the ForeColor property to Red.
On the PROJECT menu, choose Add New Item.
In the Add New Item dialog box, choose the Web Form template, name it Blue.aspx, and then choose Add.
At the bottom of the document window, choose the Design tab to switch to design view.
Drag a Label onto the page. In the Properties window, set the Text property to Blue, and the ForeColor property to Blue.
On the FILE menu, choose Save All.

In Solution Explorer right-click Default.aspx and choose View Designer.
Double-click the SubmitButton. Visual Studio switches to the page code, and creates a skeleton event handler for the Button control's Click event.

Add the following code to the event handler:

if (this.RadioButtonList1.SelectedValue == "Blue")
{
    Response.Redirect("Blue.aspx");
}
else
{
    Response.Redirect("Red.aspx");
}

If RadioButtonList1.SelectedValue = "Blue" Then
    Response.Redirect("Blue.aspx")
Else
    Response.Redirect("Red.aspx")
End If

In Solution Explorer, right-click Default.aspx and then choose Set As Start Page.
Press CTRL+F5 to run the Web app in the browser. You will see the first page.
Choose Red and then choose Submit. If the app is working correctly you will go to the page with the Label that says Red.
Go back to the first page.
Choose Blue and then choose Submit. If the app is working correctly you will go to the page with the Label that says Blue.

In this walkthrough you created a simple Web app and tested it manually. Now you are ready to create a Web Performance Test that lets you test this app. See Walkthrough: Recording and Running a Web Performance Test.