Is this just another 'Hello World' example? Yes. Pretty much. But hold on - what I'm hopefully demonstrating is how to build a very simple ASP.NET 2 application that will show you how a .Net web page differs from other web applications that you may have worked on before. It also separates the code of the application into a separate class so you should get an idea of how (an extremely basic) web application is actually constructed. So - at the end of this, you will have a web page with a text box that you type your name into, press submit and it says "Hello John" (or what ever your name is).

Now, OK, I admit this a lot of work to get a page to say "Hello Bob" when in 'classic' asp you could just use <%Response.Write("Hello " & Request("userName")%> or something like that but the whole point of this is to demonstrate the structure of an ASP.NET web application and,  once you've got used to building applications like this, you WILL appreciate this structure when you build more complicated applications.

First of all I'm assuming:

• You are on a version of windows 2000, XP Pro, 2003 etc. running IIS.
• You have set up a web site under IIS with a home directory that is just a blank folder at the moment.
• You have the .NET 2 Framework installed (most of you will just need .NET Framework Version 2.0 Redistributable Package (x86) ).
• You have Visual Web developer installed.

Open up Visual Web developer.

Close any start page window that might open up by right clicking on that window's tab at the top and selecting close.

You should have something like this:

Creating your website

Now, select 'File' then 'New Web site' and you'll get something like this:

Hit browse for the location of the site and you'll get this:

It can take a while to open but, once open, you should have all your local web site files listed in the solution explorer window on the right (If this is the first time you've done this, you wont have many files but you may notice that some new folders and files have been created).

Now, there's a load of folders that ASP.NET 2.0 expects to find certain files in but you need to create those folders. So - right click on localhost in the solution explorer and select 'Add ASP.NET folder' and add any of the folders that appear as options (doesn't matter which one). Once you have added that folder, you'll notice that you can't add it again (kind of obviously) so choose one of the other folders that appear as options under 'Add asp.net Folder'.

Do this until you have added all the available folder options:

Creating your class

By now, you should have an App_Code folder in your solution explorer. Right-click that and select 'Add new item...'

You'll see the following. You want to add a class and call it myLogic.vb:

Hit 'Add' to add it to the solution and the class file should open up. It will look something like this:

Right - in between the 'Public class...' and 'End Class' text, start typing the following. As you type, when you reach the bit that says 'as str' you should notice a pop up box that gives you a load of options (your computer may take a while to display this box for the first time).

This intellisense will make your life so much easier once you get used to it. If you've used Dreamweaver or Flash before, you'll have seen this sort of thing although they don't do it anywhere near as well as Visual Web Developer.

Anyway, what you want is the following text:

Now, lets explain what's going on here. Hopefully it should be obvious but don't worry if it looks like of rubbish.

What I've done is create a function that returns a string based on a value that was passed to it (that's kind of what functions do...)

So - what we're doing here is putting someone's name into a function and we're returning a sentence that should hopefully say "Hello persons name".

The 'public' bit means that this function can be used by other parts of my application. If I was to use 'Private' (for example) this function would only be available from within the 'myLogic' class.

"ByVal usrName as String": We are saying that this function accepts 1 value and that value is a string (a load of letters or numbers or whatever, nothing complex)

Then there's another 'As String' bit at the end of the function line. This means that the function is going to return a string. So, when I use the function, I can expect a load of letters and numbers to be returned by this function.

 

Creating your web page

OK - save that class (right click on the tab at the top for that class and save from there) now right click on 'localhost' and select 'Add new item' you should see this:

Make sure select 'Web Form' and also 'Place code in separate file' (as above). Call this file 'welcome.aspx'

Hit 'Add' and you should see this:

If you don't, don't worry, you might see something like the image below. Either way, you want to select 'Design' from the 2 options at the bottom of the new document that you've created (You'll have 2 options, 'Design' and 'Source' ).

Now - from the tool box on the left hand side, drag a TextBox, Button and Label onto your document.

Couldn't be easier. You might want to add some space between your button and the label.

Now - when you dragged those elements, they will have been assigned an ID automatically. If you select the button (for example) you will see in the properties window ( bottom right pf your screen) that it is referred to as 'Button1'. And the label is referred to as Label1 and the textbox is referred to as TextBox1.

Anyway, your page will look like this:

Using your logic class from your code file

Now - here's the important bit - double click the button and you should see this:

This is the code that handles what happens when a user clicks that button. So start typing the text below within that code:

Great! As you start typing the 'mylo' bit you'll notice that intellisense kicks in and gives you a load of options, one of which is 'myLogic' - that's the class you created earlier. Remember? Anyway, complete the code below:

What we're doing here is saying when the button is clicked:

Dim appLogic As New myLogic: This creates a new instance of the myLogic class that you created earlier. We've called this instance 'appLogic'.

Dim usrName As String: You create a new string variable

usrName = TextBox1.Text: this sets the value of the variable usrName to whatever the text in TextBox1 is.

Label1.Text = appLogic.sayHello(usrName) - This sets the text of the label on your page to whatever is returned from the sayHello function in appLogic when we pass usrName into it.

Testing your page

Right-click anywhere in your page and select "View in browser"

The page should load, enter you name in the box and hit submit. You should see something like this:

So - that's it. Pretty basic yeah? But now you could go and add another function to your logic class that reads data from a database and returns a value or something more complex..

discuss this topic to forum