1. ASP.Net 4.0 Introduction

ASP.Net 4 is a web site development platform in which one can develop rich UI based web sites. Here in all our examples, we will be using Visual Studio 2010 with Dotnet Framework 4. All these examples will work well with the latest versions as well because of backward compatibility. In this example, we will create our first website.

1: Start a Website

1. After starting visual studio 2010, click on File and choose New.
2. Click on the Web Site… Menu Item.

Here, you are telling Visual Studio that you want to start a new Asp.Net Web site. This step will land you in New Web Site dialog.

2: Select Asp.Net Site Name

1. Select Language as Visual C#. This tells, you will write the code in C# language.
2. Pick a Target Framework. Here, we picked Dotnet Framework 4.0. The website will make use of API functionalities till Dotnet Framework 4.
3. Pick ASP.NET Web Site from the Displayed Template.
4. In all our examples, we will deploy our website in the local system directory. So, choose ‘File System’.
5. Pick a Location for the Website. You can also use the browse button to pick a folder.
6. Finally, Click OK to create the site on your local file system.

This step land you to the code editing window and you can see Solution Explorer in the right-side pane.

3: Delete Default.aspx

1. Switch to the Solution Explorer window.
2. Locate default.aspx file and right click on it to get the context menu.
3. From the displayed context menu, pick the delete option. This will delete the default asp file.

We deleted the default file. But, we will create a new Asp.Net web page with our own content.

4: Add New Asp.net Web Form

1. From the MenuBar, navigate to Website | Add New Item… This will open an Add New Item dialog.
2. Make sure the development language is set to Visual C#
3. Pick Web Form from the displayed items. Web Forms are heart of the Asp.Net programming. Like windows Form, web forms will display user navigation controls in it. The user, browsing web form, can access the UI elements to feed-in their data input.
4. In the Name Text Field, provide a name for the Web Form. In our example, we gave the web form name as Hello.aspx
5. Make sure the check box, ‘Place Code in separate file’ is checked. This will create a code-behind file for the Hello.aspx in .cs extension. All our C# code goes in this file, and we will learn more about it in the coming Step-By-Step tutorials.
6. Finally, click on the Add button to add the Web Form to the website.

This step will add a Web Form named Hello.aspx into the website

5: Add Code in the Hello.aspx

1. Make sure the File Hello.aspx is loaded in the code editor. If not, double click the file in the solution explorer to open it.
2. Inside the <Title> tag add text, ‘First Asp’. When a web browser renders this web page, the title appears in the window title area of the browser window or appears in the Tab of the multi-tab enabled browsers.
3. Here, we place the ‘Hello ASP 4.0’ within the header tag <H1> to show text in bigger font. Now you can save the file. The Editor will show the saved contents with a green bar in the left margin area.

6: Run the Web Site

1. From the Debug Menu, pick the option, ‘Start without Debugging’. This option will run the website in a default web browser. Since we have only one file, the file Hello.aspx runs on the browser.
2. In my case, the default browser is Google Chrome and Hello.aspx run on it. You can notice the title in the Tab and the body text in the browser’s display area.

7. Code Reference

7.1 Hello.aspx

• JavaScript 004 – parseInt & NaN
• JavaScript 005 – One Dimensional Array

Categories: ASP 4.0

Tags: code-bdehind, WebForm

This site uses Akismet to reduce spam. Learn how your comment data is processed.