Programming with Visual Web Developer - PowerPoint PPT Presentation

Loading...

PPT – Programming with Visual Web Developer PowerPoint presentation | free to download - id: 709251-MTkyN



Loading


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation
Title:

Programming with Visual Web Developer

Description:

Chapter 9 Programming with Visual Web Developer – PowerPoint PPT presentation

Number of Views:40
Avg rating:3.0/5.0
Slides: 39
Provided by: edin151
Category:

less

Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: Programming with Visual Web Developer


1
Chapter 9
  • Programming with Visual Web Developer

2
Objectives
  • Explain the functions of the server and the
    client in Web programming.
  • Create a Web Form and run it in a browser.
  • Describe the differences among the various types
    of Web controls and the relationship of Web
    controls to controls used on Windows forms.
  • Understand the event structure required for Web
    programs.
  • Design a Web Form using tables.
  • Validate Web input using the validator controls.
  • Define ASP, XML, WSDL, and SOAP.

3
Visual Basic and Web Programming
  • In VB.NET, Web Forms are used to create the user
    interface for Web projects.
  • Web Forms display as a document in a browser.
  • Create documents that display on mobile devices
    such as cell phones and personal digital
    assistants (PDAs).

4
Client/Server Web Applications
  • Require a server and a client
  • Server sends the Web Pages to the Client.
  • Client displays the Web Pages in Browser.

5
Web Servers
  • To develop Web applications use either a
  • Remote Web Server
  • --OR--
  • Local machine set up as a Web Server by
    installing IIS before installing VB

6
Web Clients
  • Browsers display pages written in hypertext
    markup language (HTML).
  • Microsoft Internet Explorer
  • Netscape
  • Pages may also contain program logic in the form
    of
  • Java Applets
  • Script
  • JavaScript
  • VBScript
  • JScript

7
Web Pages
  • Stateless
  • Does not store any information about its contents
    from one invocation to the next
  • Techniques for working around Stateless
  • Cookies stored on local machine
  • Sending state information to server as part of
    the page's address, uniform resource locator (URL)

8
ASP.NET
  • ASP.NET 3.5 is the latest Web programming
    technology from Microsoft.
  • ASP.NET provides libraries, controls, and
    programming support for programs that
  • Interact with the user
  • Maintain state, render controls
  • Display data, and generate appropriate HTML
  • When using Web Forms in VB .NET you are using
    ASP.NET.
  • Object-oriented event-driven Web applications can
    be created using VB and ASP.NET.

9
Visual Basic and ASP.NET
  • Each Web Form has two distinct pieces
  • HTML and instructions needed to render the page
  • VB code
  • Web Form generates a file with an .aspx extension
    for HTML and .aspx.vb extension for the VB code.
  • Visual Studio IDE automatically generates the
    HTML.
  • HTML tags can be viewed and modified in the
    Visual Studio editor.
  • VB code contains the program logic to respond to
    events called the code-behind file.
  • VB code is not compiled into an .exe file as it
    is for Windows applications.

10
Types of Web Sites
  • Web applications are referred to as Web sites in
    VS 2008.
  • There are four types of Web sites
  • File System Web sites
  • IIS Web sites
  • FTP sites
  • Remote sites

11
Creating a Web Site (1 of 2)
  • Select New Web Site from the File menu in the
    New Web Site dialog box, selections can be made
    for template, location, and language.
  • A new Web site automatically contains one Web
    page called Default.aspx.
  • A second file, Default.aspx.vb, the code-behind
    file, holds the VB code for the project.

12
Creating a Web Site (2 of 2)
  • Begin a new Web project by entering the location
    and project name on the New Web Site dialog box.

13
Web Forms in the Visual Studio IDE
  • As Web project opens, connection to Web Server is
    established.
  • Web Forms are based on a completely different
    class.
  • Web Forms have different
  • Controls
  • Properties, Methods, and Events
  • Toolbar, Toolbox, and lists of files in Solution
    Explorer

14
Visual Web Developer with New Web Site
15
Viewing the HTML Code
  • Design and Sources tabs at bottom of the form in
    the Designer allow you to switch between the HTML
    code and VB code.
  • Click on the Source tab to view the static HTML
    code.
  • HTML creates the visual elements on the page and
    is automatically generated.

16
Controls
  • Several types of controls are available for Web
    Forms and can be mixed on a single form.
  • Very often used are the Standard (ASP.NET server
    controls) provided by ASP.NET and the .NET
    framework.
  • Web server controls dont directly correspond to
    HTML controls but are rendered differently for
    different browsers to achieve desired look/feel.

17
ToolBox Controls
  • Toolbox includes tabs for selecting control type.
  • VS Designer adds a small green arrow in the
    upper-left corner of server controls.

ASP Server Control
Client-side HTML Control
18
Event Handling
  • Events are written in the same way as for Windows
    controls.
  • Events may actually occur on
  • Client
  • Server
  • Process of capturing an event, sending it to the
    server, and executing the required methods is all
    done automatically.
  • Events of Web Forms are somewhat different than
    for Windows Forms.
  • Example Web Form has a Page_Load rather than
    Form_Load.

19
Files
  • Files in a Web application differ greatly from
    those in a Windows application.
  • Two files make up the form
  • .aspx file
  • Holds specifications for the user interface
  • .aspx.vb (code-behind file)
  • VB code written to respond to events

20
Debugging
  • IDE does not automatically generate code
    necessary for debugging a Web application
    debugging functions need to be added ltcompilation
    debug"true" /gt.
  • If running without debugging enabled in the
    Web.config file, an error message is received.
  • There are two options
  • Run without debugging
  • Add Web.config file
  • After creating the Web.config file breakpoints,
    single-step execution, and display, the contents
    of variable and properties can be set.

21
Add Web.config File
22
Testing In Other Browsers
  • By default, Web projects are tested in Microsoft
    Internet Explorer.
  • To test in another browser
  • Right-click on the project name
  • Select Browse With

23
Laying Out Web Forms
  • Factors that will effect the layout of page
  • Browsers
  • Screen Sizes
  • Screen Resolutions
  • Window Sizes
  • ASP.NET generates appropriate HTML to render the
    page in various browsers but cannot be aware of
    the screen size, resolution, or window size on
    the target machine.

24
Using Tables for Layout
  • HTML Tables contain rows and columns.
  • Add controls and text to the table cells to align
    the columns.
  • Table is an HTML control, requiring no
    server-side programming.

25
Entering Controls or Text in a Table
  • Controls can be added to a table cell or type
    text in a cell during design time.
  • Add a label and give it an ID to be able to refer
    to the text in a cell at run time. OR
  • Type text directly into the cell.

26
Including Images on Web Pages
  • Use the Image control to add graphics to a Web
    page.
  • Concept is similar to the PictureBox control on
    Windows Forms but the graphic file is connected
    differently due to the nature of the Web
    applications.
  • Each Image control has an ImageUrl property that
    specifies the location of the graphic file.
  • To place an image on a Web page, the graphic
    should first be copied into the Web site folder.
  • Image controls can be added to a cell in a table
    or directly on a Web page.

27
Table and Image
Place images, text, and controls where you want
them by using a table.
28
Navigating Web Pages
  • Add a HyperLink to allow user to navigate to
    another site or page.
  • Enter a Text property for the text to display for
    the user.
  • Enter a NavigateUrl property to specify the URL
    to which to navigate the Select URL dialog box
    displays.
  • Select the page from a list.
  • If wanting to navigate to another Web site, type
    the Web address as the NavigateUrl property value.

29
Select URL dialog box
Select the page to which to navigate for a
HyperLink control from the Select URL dialog box.
30
Adding a Second Web Page
To add a new Web Form to a Web site, select Web
Form in the Add New Item dialog box. Make sure to
choose Visual Basic for the language and select
Place code in separate file.
31
Using the Validator Controls
  • ASP.NET provides several controls that can
    automatically validate input data.
  • Steps for using
  • Add a validator control attach it to an input
    control and set the error message.
  • At run time, when data is input, the error
    message displays if the validation rule is
    violated.
  • Validator controls run on the client side.

32
Maintaining State
  • Must take steps to maintain values of variables
    and controls on page.
  • Set EnableViewState to True (default), so control
    contents reappear for each postback.
  • Local variables in a Web application are
    re-created each time the procedure begins.
  • Store value of module-level variables in controls
    to hold their values during postback.
  • Use IsPostBack property to control actions on
    postback.

33
Checking for Postback
  • When an ASP.NET application loads, the Page-Load
    event occursthe page is reloaded for each
    round-trip to the server (each postback).
  • The Page-Load event occurs many times in a Web
    application.
  • The pages IsPostBack property is set to False
    for the initial page load and to True for all
    page loads after the first.
  • Check for IsPostBack True to make sure that
    actions are only performed on postbacks.

34
AJAX
  • Asynchronous JavaScript and XML (AJAX) for
    creating interactive applications allows to
    reload only a portion of the Web page, rather
    than the entire page.
  • AJAX is an open and cross-platform technology
    that works on many operating systems.
  • Using AJAX, the loading speed can increase
    dramatically by downloading and rendering only
    the portion that changes.

35
AJAX
36
Managing Web Projects
  • Moving and renaming Web projects is easy when
    using File Systems Web sites as opposed to IIS
    sites.
  • Make sure the project is closed so that the
    project folder can be renamed and then it can be
    moved or copied to different locations or
    computers.

37
Using the Copy Web Site Tool
  • Can copy an entire Web site from one location to
    another on the same computer, or to another
    computer on a network, or to a remote site
  • Can copy the Web site to a remote server where it
    can be accessed by multiple users

38
Some Web Acronyms (1 of 2)
  • XML Extensible Markup Language. This popular
    tag-based notation is used to define data and
    their format and transmit the data over the Web.
    XML is entirely text based, does not follow any
    one manufacturers specifications, and can pass
    through firewalls.
  • SOAP Simple Object Access Protocol. An XML-based
    protocol for exchanging component information
    among distributed systems of many different
    types. Since it is based on XML, its messages can
    pass through network
  • firewall.

39
Some Web Acronyms (2 of 2)
  • HTTP HyperText Transfer Protocol. The protocol
    used to send and receive Web pages over the
    Internet using standardized request and response
    messages
  • Web Service Code in classes used to provide
    middle-tier services over the Internet
  • WSDL Web Services Description Language. An XML
    document using specific syntax that defines how a
    Web service behaves and how clients interact with
    the service
About PowerShow.com