INT422 Internet III Web Programming on Windows

1
INT422 Internet III Web Programming on
Windows

• Get started -
• programming with ASP.NET

2
Agenda

• Get started with ASP.NET web app programming
• Walkthrough Your First ASP.NET Web App
• This creates and initializes your home directory
  web application on the warp server
• Using VS to create and edit a web app
• A tour, organization, files, help, keyboard
  shortcuts
• Testing and prototyping techniques
• Simple controls button, textbox, label,
  hyperlink

3
Get startedwith ASP.NET web app programming
4
Getting started

• An ASP.NET Web Application is a collection of
  files stored in a web server directory and served
  by IIS
• ASP.NET Web Applications execute at the server,
  and return HTML to the browser/client
• We use Visual Studio to create/edit web apps
• The entry point to a web app must be a default
  page called default.aspx

5
Introduction to postback

• In ASP.NET, postback is a key concept
• ASP.NET Web Applications are forms-based and
  event-driven applications, where the user at a
  browser interacts with the form/page by entering
  text, making selections, and clicking command
  buttons
• A postback is a submit of the form and its
  data back to the server
• The server executes code and responds back to the
  user with the same updated form

6
Walkthrough Your First ASP.NET Web Application
7
Your first home directory web app

• Walkthrough
• Posted on Week 1 details page
• And on the Resources area of the website
• Should have completed it as part of Lab 1
• Its important that you follow this carefully so
  that your home directory web app is created and
  initialized without problems

8
Important tip

• In the lab rooms, we strongly recommend that you
  re-boot (power-cycle) your computer before
  working with your projects
• When you re-boot the computer (just press the
  small reset button on the system unit), it will
  clear out any settings changes and locally-cached
  (copies of) files that were created by other
  students and may interfere with your work

9
Opening an existing web app

• Walkthrough
• Also posted on Week 1 details page
• And on the Resources area of the website

10
Your home directory web app

• Create a default home page default.aspx
• On this page, you can place content, and
  hyperlinks to the other pages that you create
  during the course
• This will make it easy for you and your professor
  and classmates to find content on your website

11
Using Visual Studio .NETto create and edit a web
app
12
Using Visual Studio .NET

• Demonstration / discussion
• The default VS screen has (at least) five areas
• Toolbox graphical web page elements
• Output window results from builds/compiles
• Solution Explorer shows your project files
• Properties list of editable properties for
  objects
• Design surface / code editor / help window
• All except Design can be pinned/unpinned

13
Design surface / code editor / help

• Design surface has two views
• Design view GUI layout
• HTML view code-behind for design view
• Code editor opens as a separately tabbed window,
  showing the VB language code-behind

14
Customizations (at home)

• Tools gt Options a good place to visit
• Text Editor gt All Languages Line numbers
• Projects gt Web Settings FrontPage Extensions
• Environment gt Fonts and Colors Display Item
  String - color red
• Right-click on the project name, choose
  Properties, click Common Properties
• Designer Defaults Page Layout - Flow

15
Keyboard shortcuts reminder

• When using VS
• CtrlPgDn
• F7 and ShiftF7
• F4
• CtrlShiftB
• If your side windows are unpinned
• CtrlAltX Show Toolbox
• CtrlAltL Show Solution Explorer
• See Visual Studio .NET User Tips in Resources

16
Testing and prototyping techniques
17
Testing and prototyping

• Here are a few techniques that you can use
• Create and use a simple ASP.NET web form (page)
• Put it in your examples folder
• One button
• One label or textbox
• Put the code you are testing inside the button
  click event block, and write the resulting output
  to the label or textbox

18
More techniques

• In the coming weeks, we will learn more
  techniques to help debug, troubleshoot, and
  handle errors, including
• Debugging
• Tracing
• The use of Try-Catch-Finally blocks, and
  structured exception handling

19
Simple controls button, textbox, label,
hyperlink
20
Simple controls

• Web Controls are user interface objects that are
  programmable
• The simple basic controls are
• Button
• Textbox
• Label
• Hyperlink

21
Simple controls get started

• What do you do with these controls?
• Drag-and-drop a control from the toolbox to the
  design surface
• Set its properties
• Write the C language code-behind that makes the
  control do something useful (double-click the
  control which opens the code editor, and inserts
  the properly-formatted event handler code block)
• Demonstration and discussion