Stanford University Wiki
Advertisement

Introduction[]

Microsoft ASP.NET is a server-side framework that allows programmers to develop dynamic web applications. ASP.NET combines unprecedented developer productivity with performance, reliability, and deployment.

Flexibility[]

Develop web apps in any language of your choice[]

As a part of .NET Framework, ASP.NET provides an unprecedented flexibility in programming language choice. We learned in class that there are many different server-side technologies such as PHP, JSP, and Ruby on Rails, just to name a few. Most of these traditional server-side technologies, however, are constrained in terms of development languages they offer and typically tie programmers to a very specific technology and language. On the other hand, ASP.NET has full access to more than 40 programming languages provided by .NET Framework, and most of them could be used to develop web applications. When building web applications using ASP.NET, web developers write application logic in their favorite programming language. For example, C++ fans do not need to learn PHP in order to develop a web application and they can write their application logic in C++, and those Java folks can code in J++ (Microsoft’s implementation of Java specification). This flexibility in language choice allows programmers to leverage their existing programming skills and thereby help reduce the learning curve significantly and increase developer productivity.

Productivity[]

Separate between presentation logic (HTML) and application logic (any language of your choice)[]

The separation of application logic and presentation logic is another feature that greatly facilitates application development. As we all know that, programmers do not make great designers, and designers are often poor engineers. It is for this reason that most web application companies usually split their projects into two groups – visual design and functional implementation. We have seen such separate in client-side technologies like JavaScript, where programmers place scripting code in .js files and page content in .html files. However, this is not the case for server-side technologies. In traditional server-side technologies, code is scattered all over the place and intermingled with the presentation elements. It is extremely difficult for design and coding to be done at the same time. Furthermore, managing the code between designers and programmers can be tricky as well. For instance, updates to a page often introduce new bugs because of a lack of understanding between designers and programmers and no separation between the presentation elements and application logic. To tackle this problem, ASP.NET separates application logic from visual design so that code developers to work separately from the presentation designers who lay out individual pages. This is achieved through a method called code-behind. The idea is to keep all of presentational elements (controls) inside the .aspx file but to move all of code to a separate class in a .vb or .cs code-behind file.

Consider the following ASP.NET page, which displays a simple button and label. This is the example that combines presentation logic and application logic together, which is still doable, but not recommended.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
 <head> 
   <title>CS349W Project 2 Example 1</title> 
   <script runat="server" language="C#"> 
     void Click(Object s, EventArgs e)  
     { 
       messageLabel.Text = "Code-Behind Model"; 
     } 
   </script> 
 </head> 
 <body> 
   <form runat="server"> 
     <asp:Button id="submitButton" Text="Display Topic"  
          runat="server" OnClick="Click" /> 
     <asp:Label id="messageLabel" runat="server" /> 
   </form> 
 </body> 
</html>


Code behind model

Code-Behind Model


Let's see how this example could be separated into the following distinct files:

  • .aspx file
    • layout, presentation, and static content
  • .aspx.cs file (the exact extension depends on the language you use; .cs is for C#)
    • code-behind files containing a custom page class

First, we take all the code and place it in a .aspx.cs file. This file is a pure code file, and contains no HTML or other markup tags. Nevertheless, we can still access presentation elements from this file, using their IDs (such as messageLabel) as shown below:

using System; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
public partial class CodeBehindModel: System.Web.UI.Page  
{ 
 public void Click(Object s, EventArgs e)  
 { 
   messageLabel.Text = "Code-Behind Model"; 
 } 
}

Without code, the main ASP.NET page becomes:

<%@ Page Language="C#" CodeFile="CodeBehindModel.aspx.cs" 
   Inherits="CodeBehindModel"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
 <head> 
   <title>CS349W Project 2 Example 1</title> 
 </head> 
 <body> 
   <form runat="server"> 
     <asp:Button id="submitButton" Text="Display Topic"  
         runat="server" OnClick="Click" /> 
     <asp:Label id="messageLabel" runat="server" /> 
   </form> 
 </body> 
</html>

As you can see, the separation of visual elements and application logic can make managing and using our pages much more straightforward than keeping your code in code declaration blocks.

Vs

Visual Design

All HTML business is automatically taken care of by Visual Studio .NET IDE[]

ASP.NET also provides a rich set of tools that significantly increase the productivity of designers and programmers alike. Therefore, in most cases, the programmers never have to manually modify (or even understand) the ".aspx" file (containing HTML) at all. Designers can visually design the look-and-feel of web applications using familiar drag-and-drop and double-click techniques and ".aspx" file will be automatically generated. Designers no longer need to spend hours to figure out the absolute coordinates to place an element. Instead, they can simply drag a widget and drop it anywhere they want on the page. Programmers enjoy full-fledged code support including statement completion, color-coding, debugging, and deploying.

Reusability[]

ASP.NET shipped with tons of common webapp widgets (called Web Server Controls)[]

ASP.NET makes it easy to reuse common user interface elements in a web application. First of all, ASP.NET provides a set of standard widgets called Web Server Controls. Programmers do no need to have any knowledge of how these controls are represented in actual HTML and C# code since ASP.NET will automatically generate it for programmers. The Calendar is a great example of ASP.NET web server controls. The Calendar control generates the markup to display an intuitive calendar in which the user can click to select or move between days, weeks, months, and so on. Programmers can simply drag the Calendar control from visual design toolbox and drop it on the page, or insert the following markup in their presentation logic:

<form runat="server"> 
  <asp:Calendar id="myCalendar" runat="server" /> 
</form> 

Programmers can also customize a web server control by modifying its properties, methods, and events. As mentioned before, all application logic will be end up in .cs file (the code-behind model).

Create you own Web Server Controls (called Web User Controls)[]

If you cannot find the building block you want, you can build you own web server controls, which ASP.NET calls Web User Controls. As we saw in the Fiz framework lecture, more often than not, there are pieces of building block that appear in multiple places in a web application. By packing their forms and behaviors into a user-defined building block (or web user control in ASP.NET terminology), programmers can easily reuse these components and increase productivity.

Let's walk through an example. Suppose you find that all the forms in your web application consist of pairs of label and input elements, like the one shown below:

<form>
First name: <input type="text" name="firstname" maxlength=20> <br>
Last name: <input type="text" name="lastname" maxlength=20> <br>
School: <input type="text" name="lastname" maxlength=20> <br>
</form> 

Notice all the input element has a maximum size of 20. Rather than adding many labels and input boxes to the form, and then having to set all their properties, let's make life easier by building a web user control called LabeledInput that includes a label and a input box that accepts 20 characters; you'll then be able to reuse the web user control wherever it's needed in your project. First, we create a new file named LabeledInput.ascx. Then, add the control's constituent web server controls--a Label server control and a TextBox server control, both of which are built-in server controls of ASP.NET. Again, we can do this by just drag-and-drop and the ".ascx" file below will be generated automatically.

<p> 
 <asp:Label ID="myLabel" runat="server" Text="" /> 
 <asp:TextBox ID="myInput" runat="server" Text="" MaxLength="20" /> 
</p>

Next, we add application logic for our web user control:

<script runat="server" language="C#"> 
 public string LabelText  
 { 
   set 
   { 
     myLabel.Text = value; 
   } 
 } 
 public string Text 
 { 
   get 
   { 
     return myInput.Text; 
   } 
 } 
</script>

Finally, we can use the web user control we just built as follows:

<form id="Form1" runat="server"> 
  <pt:LabeledInput id="firstname" runat="server" LabelText="First name:" /> 
  <pt:LabeledInput id="lastname" runat="server" LabelText="Last name:" /> 
  <pt:LabeledInput id="school" runat="server" LabelText="School:" /> 
</form> 

This is a very trivial example indeed, but we can easily extend it for other purposes. In general, web user controls allow application developers to add powerful features to their web sites and to reuse them in many places with a minimum of effort.

Use Master Pages as Templates[]

Master pages are a feature of ASP.NET that can make an important difference in the way we compose web applications. Master pages are used as building blocks to design the structure of your web site. Basically, a master page is a page template that can be applied to give many web pages a consistent appearance. For example, if all the pages in our web application have the same banner on the top and navigation menu on the left, it makes sense to include these components in a master page, and to build several web forms that customize only the content areas on each page.

In conclusion, designing a site structure using master pages and web user controls gives you the power to easily modify and extend the site. If your site uses these features in a well-planned way, it can be very easy to modify certain details in the layout or functionality of your site, because updating a master page or a web user control has immediate effects on all the web forms that use the file.

Performance[]

Unlike most server-side technologies like PHP and Ruby, ASP.NET pages are compiled, not interpreted. For a interpreted language, every time a user requested a page, the server would read the page's code into memory, figure out how to execute the code (that is, interpret the code), and execute it. In ASP.NET, the server need only figure out how to execute the code once. The code is compiled into efficient binary files, which can be run very quickly, again and again, without the overhead involved in re-reading the page each time. This significantly improves performance.

Creating a web app[]

Example application: Freedom Calculator

Obama

Freedom Calculator

We will demonstrate how to easily create a webapp named "Freedom Calculator". This webapp can be used by any students who want to know how many days left before the final exam. The user can put his name and the last day of final exam (in "Calendar" web server control). Then, Freedom Calculator will tell you how many days left!

Please play with it yourself: "Freedom Calculator webapp"

Here, we also provide a VDO clip to show you how to create Freedom Calculator webapp within 30 seconds using VS Studio.NET: "VDO clip: how to create Freedom Calculator using VS.NET"

Deployment[]

To deploy our web app, on the web server, we need to:

  1. Install .NET Framework (which is Microsoft version of Java Virtual Machine)
  2. Install Internet Information Service (IIS), which is Microsoft's web server. IIS will work in conjunction with .NET Framework to process ".aspx" files.
  3. For a web page, put one .aspx file and the code-behind .cs file together in the WWW folder.
  4. network coding using apsx table

Unique and Advantages[]

No HTML knowledge required / No "embed code in html" headache problem[]

Programmers don't need to know anything about HTML to create web applications. Comparing to PHP, when programming in PHP, programmers need to have the clear picture of what will happen to HTML page after a particular line of PHP script is run. For example, to create a dynamic table in PHP, the developers have to write the code to echo " ... " and embed the code in HTML. For ASP.NET, all HTML related code (in .aspx) will be automatically generated. To create a dynamic table, the developers just have to pick the "table control" from toolbar, and just write the logic in ".cs" file the same way when we write windows application (e.g., table1.addRow(..)). Let's see an example if we want to create a table with different colors for odd and even rows. Here is the comparison of using ASP.NET and PHP.

ASP.NETPHP
System.Web.UI.WebControls.Table table1;

String [] array
  = new String[“Bugs”, “Daffy”, “Tom”, “Jerry”];

for(int i = 0; i < array.length; i++) {
 table1.addNewRow();
 if( i % 2 == 0)
   table1.getRow(table1.size()).setColor(Color.red);
 else
   table1.getRow(table1.size()).setColor(Color.blue);
}

// in CSS
.row0 { background-color: #ffffff; }
.row1 { background-color: #f0f0f0; } 

// in HTML
<?php
$toons = array("Bugs", "Daffy", "Tom", "Jerry");
$rowclass = 0;
foreach ($toons as $toon) {
?>
    <tr class="row<?= $rowclass ?>">
    <td><?= $toon ?></td>
    </tr> 
<?php 
     $rowclass = 1 - $rowclass;
} ?> 

As you can see, using PHP, we have to create CSS and echo HTML appropriately and the code seems very confusing. With ASP.NET, you can see that it's just normal java code. No HTML whatsoever! Obviously, ASP.NET code is far easier to understand and debug.

Easier to debug[]

Since now the programmers don't have to worry about HTML syntax, they can just focus on debugging the logic of the program. Luckily, since all code relating to the program logic is in ".cs" file, debugging becomes so easy as when we debug non-web applications. More luckily, Visual Studio provides us with a powerful GUI debugger, which will keep compiling code as we are coding. So, some programmers may not have a chance to use to launch the debugger at all!

Clean separation of HTML and code[]

As mentioned previously, ASP.NET's code-behind model encourages developers to build applications with separation of presentation and content in mind. In theory, this would allow a web designer, for example, to focus on the design markup with less potential for disturbing the programming code that drives it. This is similar to the separation of the controller from the view in model-view-controller frameworks.

Code in any Visual Studio language (C#, VB, C++, J#)[]

One of the best selling points of ASP.NET is the developers can choose any language of their choice to develop the web applications.

Easier reuse / Simpler maintenance[]

Since all program-logic code is written in C#, it can easily share the library with other applications. For example, to create a ticket-booking website, we may have the frontend ticket-selling website and the backend application used by agents to maintain the system. The frontend will be webapp and the backend will be windows app. However, everything will share the same library (e.g., the library to connect to database) since everything is just C# code.

Deployment without source code[]

With ASP.NET code-behind scheme, we can deploy webapps without revealing the source code. Since ASP.NET is a server-side technology, all application logic code will be stored at server. The client can see only the processed ".aspx" files which basically are just html files. This can mitigate many security issues (since there is no way bad guys will know how the web page is constructed) and can also reduce the risk of losing competitive advantage (there is no way the competitor can reverse engineer our webapp).

Moreover, the code at the server can be run using compilation-once or pre-compilation mode. Normally, to deploy a web page, we will put a ".cs" file and a ".aspx" file in the WWW folder and ASP.NET read ".cs" file at the first time it is read. This is the compilation-once mode. However, in some cases, we do not want to put the source code even at the server (for example, if we do not want our web-hosting company to reverse engineer our website). In this case, we can compile ".cs" to binary (".dll" files) and .NET Framework will take care of running everything.

Weakness[]

Everything has to be processed at server[]

As discussed above, ASP.NET is a server-side technology. That means all actions triggered by the user have to be sent and processed at the server. This can introduce more round-trip time. For example, to do form validation, all information the user types in has to be sent to the server to validate and the server will respond with HTML based on the result of the validation. However, this does not mean that we cannot do anything at the client side. In fact, ASP.NET is javascript compatible. To incorporate javascript code in ASP.NET, we can edit ".aspx" files manually like what we usually in PHP. This can reduce the round-trip time and the server's workload.

It's Microsoft's product -- Windows platform only![]

As everyone might guess, this implies that everything has to be run on Windows platform. No Linux, UNIX, etc. Generally speaking, there is no way an UNIX web server running PHP can also run ASP.NET at the same time. However, in order to run ASP.NET on non-windows platform, we can use Virtual Machine products to run Windows on top of UNIX and run ASP.NET on top of Windows.

It's not free[]

Again, since this is a Microsoft product. You have to pay around $1,000 to get the professional version with all features. However, to see it on the bright side, paid products always come with supports (hopefully good) as opposed to free software. Many big enterprises normally prefers to pay to get support and has someone to blame when things go wrong. (..test..)

Advertisement