Home

Web Application Fundamentals

 

ASP.NET Prerequisites

 

ASP.NET and Regular Web Files

If you have previously done web development, you are probably familiar with the concept of a web site, which is primarily a series of files as web pages grouped in a main parent folder. ASP.NET uses the same approach: An ASP.NET project is one or more files presented as an application.

Like any regular web site, an ASP.NET application can include different types of files, that is, files with different extensions intended to serve different purposes. This means that, to create an ASP.NET application, you can start by creating HTML files which are files with .htm or .html extension. You can also use Cascading Style Sheet (CSS) files that would allow you to better format or interpret HTML tags. You can also use script-oriented files that have the .js, .vbs. .pl, etc extensions to complement the other pages.

The Virtual Folder 

As you would proceed for a normal web site, to start an ASP.NET application, you can create a folder with a name of your choice. Here is an example of a new folder named Grier Summer Camp:

A New Folder

After creating a folder for your project, you should create a virtual directory. To do this, you can first display the Internet Information Services or the Internet Services Manager window (if you are using Microsoft Windows XP Professional, from Control Panel, double-click Administrative Tools then double-click Internet Information Services). Then, in the left frame (of the MMC), expand the name of your server (if you are planning to use another server or computer but is not listed, right-click Internet Information Services, click Connect, type the name of the computer and click OK) and optionally expand the Default Web Site node (if you are using MS Windows XP Professional, you must expand the Web Site node under the computer). Right-click Default Web Site -> New -> Virtual Directory. In the first page of the wizard, you would click Next. In the second page, you must type the name you will use on the browser to access the application you are creating. Here is an example:

In the third page, you can type the full path to the folder you created or you can click Browse to locate and select the folder you had previously created. In the Browse For Folder dialog box, locate the folder you created:

The fourth page allows you to specify how the pages on this site will be accessed:

 

After clicking Next in the fourth page, you can click Finish in the fifth page: A new web site would have been created for your application.

ASP.NET Files

After creating the web site, you can add the necessary files to it. You can create text files and save them with the appropriate extension. When saving the files, make sure you store them in the folder you would have created. This would make it possible for the browser to locate them through the virtual directory.

ASP.NET own pages are text-based files with the .aspx extension. The content of the file is up to you and it doesn't have to have special code than regular HTML tags. Here is an example of a normal HTML-tagged file:

<html>
<head>
<title>Grier Summer Camp</title>
</head>
<body>

<center><h1>The Grier Summer Camp</h1></center>

<p>Located in the heart of Rockville, Maryland, the <b>Grier Summer Camp</b> 
is an attractive setting aimed at entertaining and supporting youth activities 
during their summer vacation.</p>

<h2>Program Presentation</h2>

<p>We feature a state of the art, regularly renovated mansions with world 
class sport facilities.</p>

<p>Coolfront Island, our star house of the season, is a 2-story like chateau 
featuring nicely finished brown bricks whose sight is tremendously appealing. 
The estate introduces two large living rooms with exquisite velour furniture. 
The colonial veranda offers a patio spanning two walls with a lost view down 
the far-reaching landscape. In this particular setting, besides their usual 
activities, children will learn special human needs to make their experience 
unforgettable.</p>

<p>Please consult our catalogue and see why the Washington Tribune called 
us <i>the most attractive summer camp of the area</i>.</p>

</body>
</html>

After creating the file, you should save it with the .aspx extension in a folder of your choice:

After saving the file, to preview it, in the Internet Information Services window, first locate the virtual directory of the project. Then, you can right-click the file (if you don't see the file, right-click the virtual directory and click Refresh) and click Browse. Alternatively, you can open  the browser and access its Address bar, change the address to http://localhost/ followed by the name of the virtual directory, and followed by the name of the file with its extension:

Types of Applications

 

Introduction

There are three main categories of applications you can create for your web-based project: HTML only, Active Server Pages, and ASP.NET. This also means that, in your applications, you may deal with various types of files. As featured above, you can create a complete application using only a text editor and IIS. As we will see later on, you can also use Microsoft Visual Studio 2005 to create your application. Just as Notepad supports all these types of applications, Microsoft Visual Studio 2005 also is completely equipped to create, handle, and maintain HTML-only applications, Active Server Pages, or ASP.NET. Everything will depend on what you are trying to do as long as you know that the choice is yours.

HTML-Based Applications

An HTML-based application is a web-based project that mostly includes regular pages with HTML tags, optional Cascading Style Sheet formatting, and optional scripts to perform some tasks that are difficult or impossible with only HTML. You can also use other formatting languages like XML to support some type of data in your application but an HTML-based application is primarily meant to use HTML tags to present text and graphics to a visitor. With this type of application, you usually don't expect any back-and-forth interaction between the visitor and you.

To create an HTML-based application, there is no special thing to do in Microsoft Visual Studio because the structure of this type of application lies on its use of web-oriented files. There are only two primary requirements. To start, you must create a folder with a name of your choice. You can create this folder using a utility such as Windows Explorer or My Computer. If you want, you can also use Microsoft Visual Stutio 2005 to create this folder. To do this, as we saw in the previous lesson, you can create an ASP.NET Application. This would prompt you to accept the suggested name of the folder or to give a new name of a folder.

The string you accept or provide on the left side of the Browse button would be the folder that contains your web application. Once you click OK, Microsoft Visual Studio 2005 would create the folder for you and get it ready to receive your files.

After creating the folder of your web-based application, you can create the necessary files for it. The most regularly used files are text-based but they have the .htm or .html extension. This type of file is called an HTML file. You can create the file using Notepad. Otherwise, if you had created the folder using Windows Explorer or My Computer, to create an HTML file in Microsoft Visual Studio 2005, on the main menu, you can click File -> New -> File... In the Templates list of the New File dialog box, you can click HTML Page. In the Name text box, accept or change the suggested name of the file. You can include the .htm extension but if you don't, it would be added for you:

Once you are ready, you can click Add. A web page would some skeleton code would be created for you. You can start writing in it and populating it as you see fit. To manually edit the file's code, in the bar under the page, you can click the Source button and edit the existing code. At any time, to save the file, on the main menu, you can click File -> Save, locate the folder you created for your web site and save the file.

If you had created an ASP.NET Application using Microsoft Visual Studio 2005 and you want to add a new HTML file to it, on the main menu, you can click Web Site -> Add New Item... In the Add New Item dialog box, make sure that HTML Page is selected. Accept the suggested or change it. Once you are ready, you can click Add. A new file with .htm extension would be added to your project.

The difference between an ASP file you create using a Text File and ane you create using Microsoft Visual Studio 2005 is that you can design the latter. This means that, after creating an ASP file in Microsft Visual Studio, you can click the Design button in the bottom section, and use the HTML button on the Toolbox to populate the web page.

Active Server Pages Applications

At one time, Microsoft developed Active Server Pages, which was a technique of using Microsoft Internet Information Server (4.0) and scripting languages such as VBScript or JavaScript to create interactive web pages, more structured that traditional HTML files. An Active Server Pages application is a web site that includes HTML and optional files that have an .asp extension. In fact, the essence of an ASP-based application is to have at least one file with that extension.

You can create an Active Server Pages application without using any formal programming environment. To start, you should create a folder that would hold the files of your application. You can use Windows Explorer or My Computer to do this. After creating the necessary folder for your project or the ASP.NET Application, you can create the necessary files. The next non-required step for an ASP application consists of creating a simple text-based file named Global and that has the .asax extension (Global.asax). This file would be used later on to process files at the application level.

In Microsoft Visual Studio 6.0, to support Active Server Pages, Microsoft created Visual Interdev. The Visual Interdev development environment is the ancestor of ASP.NET. To create an Active Server Pages application using Microsoft Visual Studio 2005, you can create an ASP.NET Application, give it a name and click Open. To add a Global.asax file to it, on the main menu, you can click Web Site -> Add New Item... In the Templates list, click Global Application Class and accept the suggested name of the file:

Once you are ready, you can click Add.

Besides HTML files, css files, and/or script-based files we mentioned for an HTML-based application, you can add special active pages. An Active Server Pages file, also called an ASP file, is a text-based document that has the .asp extension. You can use Notepad to create the file as long as you remember to add the .asp extension when you decide to save it. To create an ASP file, if you had created the folder for your application, in Microsoft Visual Studio 2005, on the main menu, you can click Web Site -> Add New Item (or File -> New -> File...) In the Templates section of the New File dialog box, you can click Text File. To make it an ASP file, when specifying the name of the file, type the name of the file and include the .asp extension:

Once you click Add, a new, but empty, ASP file would be added to the folder you selected.

After the ASP web page has been created, you can design it using the controls from the HTML section of the Toolbox.

ASP.NET Applications

An ASP.NET project is an enhanced version of an Active Server Pages application and you can create it using Notepad. As we saw earlier with IIS, to start, you would create a folder that can hold the files of your application. You can then add the necessary files. If you exclusively use Notepad, you would (manually) type all your code. This is why Microsoft Visual Studio 2005 can be very helpful.

Besides ASP.NET own files, you can also create ASP, HTML, CSS, and other script related files to add to your ASP.NET application.

Using Microsoft Visual Studio 2005

 

Introduction

Notepad's simplicity is well suited if you are just writing code. If you are developing a graphically intensive application, Notepad presents some limitations because everything would have to be typed (manually). To accelerate ASP.NET application development, Microsoft provided complete support in Microsoft Visual Studio 2005. This environment allows you to create an application and have a better view of where items are positioned on the web page. This can be a tremendous help if your application includes "graphical" controls.

ASP.NET Visually

The techniques we introduced above, including creating a folder, a virtual directory, and the necessary file(s) require that you follow those steps to get the project ready. This is perfectly fine if you have time to create and write all necessary tags required in a web page. To make it a little easier, there are various tools you can use to visually design your ASP.NET web pages.

Microsoft Visual Studio 2005 is a commercial programming environment that allows you to create an ASP.NET application as a project. To get it, you must purchase it. To create an ASP.NET project using it, you can display the New Project dialog box, select the project group of your choice, select ASP.NET Application and click Open.

"ASP.NET Web Matrix is a community-supported, easy-to-use WYSIWYG application development tool for ASP.NET. It can be installed via a quick 1.3 MB download (about 5 minutes using a 56Kb modem). New features include: Access database support, J# support, design time enhancements including improved table editing and user-control rendering, many bug fixes, and much more! Best of all? It's absolutely free!" From http://asp.net/webmatrix".

To get Web Matrix, you can download it from http://asp.net/webmatrix.

Creating an ASP.NET Project

The lessons on this site assume that you have Microsoft Visual Studio 2005 installed in your computer. To start Microsoft Visual Studio 2005, on the Taskbar, you can click Start (All) Programs -> Microsoft Visual Studio 2005 -> Microsoft Visual Studio 2005 

Microsoft Visual Studio 2005

To create an ASP.NET application in Microsoft Visual Studio 2005, on the main menu, you can click File -> New -> Web Site... In the New Web Site dialog box, make sure ASP.NET Web Site is selected. In the Language combo box, select Visual C#. Specify a name and location in the combo box on the left side of the Browse button or click the Browse button to specify a folder:

Once you are ready, click OK. Microsoft Visual Studio 2005 would create the application's folder, the virtual directory for your application, and many other files.

Compiling and Executing a Project

The instructions created for an ASP.NET project are written in plain text including HTML tags and script sections. In previous ASP applications, the code simply had to be interpreted by the browser. With ASP.NET, you must compile the project.

To compile and execute an ASP.NET project in one step, on the main menu, you can click Debug -> Start Without Debugging. Although there are other techniques or details in compiling (or debugging) and executing a project, for now, this is the technique we will use.

Opening a Project

As opposed to creating a new project, you can open a project that either you or someone else created.

To open an existing project:

  • If you had just created or used a web site, in the Start Page, if you see its name, you can click it
  • If you had just previously used the project, on the main menu, you can click File -> Recent Projects and click the project in the list displayed
  • If the project is not in the list of Recent Projects under the File main menu but you know that it exists, on the main menu, you can click File -> Open -> Web Site... The action would display the Open Web Site dialog box. By default, each ASP.NET application you create receives a new folder in your local Drive:\Documents and Settings\Usernane\My Documents\Visual Studio 2005\Projects folder (an additional folder is created in Drive:\Documents and Settings\Usernane\My Documents\Visual Studio 2005\Web Sites). When opening an ASP.NET project, if you don't know where it is located, you should first navigate to this folder. Once you have located the folder that contains the project, select the folder and click Open
 

Previous Copyright 2005-2007 FunctionX, Inc. Next