ASP.NET 2.0 basics

This is the first post in a series I will be going through as I get into learning ASP.NET. In this first part we will go trough what ASP.NET is and look at how it is handled at the server. I might not get everything right here since I really am a beginner. But writing about it helps me in my learning process so I write and you can read.

More experienced programmers are welcome to comment and correct me if/when I get something wrong, as I said I’m a beginner.

What Is ASP.NET

ASP.NET is not just a new version of ASP, it’s a whole new way for web development. ASP.NET allows you to a full featured programming language such as Visual Basic.NET (VB) or C# (C-Sharp). So what is so different about ASP.NET. Well first of all it’s not a scripting language like the old ASP, in ASP.NET we can use code behind files and separate the logic from the design totally. This is one of the features I really love. The code becomes so much more readable when separated from the HTML, I’ll give you a example in a minute. But if you like the inline model, it’s possible to use it to. I won’t be writing about it here.

Another difference is that ASP.NET code is actually compiled before handed of to the client. So when a page is requested by the browser the ASP.NET engine get’s the page and if changes were made or if it is the first time this particular page has been requested it will compile it before handing it off to the client. Doesn’t this take time you might ask, well it does, but I wouldn’t say it’s even noticeable. The upside is that the next request will get the precompiled version of this page making it a lot faster.

A picture says more than a thousand words so here is a image of the process.

Compilation

How do I get started?

First of all, I like to have a good development tool, an IDE (Integrated Development Environment) if possible. Microsoft makes gives us two choices. One being the almighty Visual Studio 2005 and the other is a free, yes you heard me, a free IDE called Visual Webdeveloper 2005. Visual webdeveloper can be downloaded from the http://www.asp.net website.

Hello ASP.NET!

Anyone who has ever read a programming book knows the first program written will almost certainly be a “Hello World!” program. So that’s what we are going to start with here also, but let’s make it a little more challenging shall we.

Well use the TextChanged control of a text box to initiate welcome and use a label to display our text. This is after all why we want to use ASP.NET, we want to use all the nice classes and features of ASP.NET. I’m using Visual Studio but you might just as well be using Visual Webdeveloper here. Fire up your IDE and start a new website, I’m more accustomed  to C,C++ and PHP code so my writings will , at least for now, remain with CSharp as codebehind.
new_project

You are now presented with the Default.aspx file. Note that this file is the design file, it’s not the Default.aspx.cs ( codebehind CSharp).

On the first row you see something new, it’s the the Page Directive. Whit the page directive you can control the behavior of your page. There are eleven directives at your disposal. So what are directives? Well they are commands the compiler uses when it’s compiling the page.

Directives are incorporated to a page simply as following,

<%@ [Directive] [Attribute=Value] %>

As I said there are eleven directives and they all have their attributes so instead of going trough them all here, you can take a look at them on http://msdn.microsoft.com/en-us/library/xz702w3e.aspx .

Code

Ok then, let’s get started. First switch the view of your page to design instead of source. Drop in a textbox and label control on the page. We don’t need a Submit button because we will use the TextChanged control. Basically that means that once your done entering something in the box just hit Enter and watch the magic happen.

page_design

In the Properties explorer you’ll find Misc and you’ll be able to name your textbox and your label. Good label_propertiesnames help in later stages when using them in the codebehind file. So I labeled mine tbName and lblHello. tb for textbox and lbl for label. After this open your codebehind file Default.aspx.cs. Let’s start building the logic. What we’ll do is use the same page to get some input, well ask for the users name and by using TextChanged we can display it on the label without moving to another page.

Sources

So this is how we do it. These are the sources for the files. I’ll also include a .zip for you with the whole demo directory to download if you want it. Anyway here it goes

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Hello ASP.NET</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        Your name:<asp:TextBox ID="tbName" runat="server" OnTextChanged="tbName_TextChanged"
            Width="342px"></asp:TextBox><br />
        <br />
        <asp:Label ID="lblHello" runat="server" Height="174px" Text="Label" Width="417px"></asp:Label></div>
    </form>
</body>
</html>

Looking at this you see how effective ASP.NET is. We only have 16 lines of code in the file to accomplish this. Now let’s look at the logic.

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
 
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
 
    }
    protected void tbName_TextChanged(object sender, EventArgs e)
    {
        //Set the label text at text change.
        lblHello.Text = "Hello " + tbName.Text + " welcome to ASP.NET.";
    }
}

What you want to look at is the tbName_TextChange part. With just one line of code we can change the content of the label.

lblHello.Text = "Hello " + tbName.Text + " welcome to ASP.NET.";

That one line sets lblHello text to the string we supply, which is built on the welcoming text and the content of the textbox control.

Bye and thanks for the fish

So this was a really short introduction to ASP.NET. Hope you stick with me as we go along in this series. Next weekend I’ll take a look at some of the built in folders of asp.net and build some custom classes. Until then, enjoy life and keep coding. The zipped files can be downloaded from http://www.nixadmins.net/files/Demo1.zip

Related posts:

  1. ASP.NET Basics Part two – special folders I’m really sorry this post is a little late. My...