Title: About the Presentations
1About the Presentations
- The presentations cover the objectives found in
the opening of each chapter. - All chapter objectives are listed in the
beginning of each presentation. - You may customize the presentations to fit your
class needs. - Some figures from the chapters are included. A
complete set of images from the book can be found
on the Instructor Resources disc.
2ASP.NET Programming with C and SQL Server
First Edition
- Chapter 1
- Introduction to Web Development
3Objectives
- In this chapter, you will
- Study the history of the World Wide Web
- Learn about Web development
- Learn about Microsoft Visual Web Developer 2008
Express Edition - Work with well-formed Web pages
4Introduction to Web Development
- Original purpose of the World Wide Web was to
locate and display information - With increasing commercial usage came demand for
more interactive and visually appealing Web sites - Initial response was JavaScript, but it has some
disadvantages - Runs on the clients system
- Works only within a Web browser
5Introduction to Web Development (contd.)
- For a fully interactive Web site that accesses a
database on a server, you must use a server-side
scripting tool such as ASP.NET - Combined with C, ASP.NET is one of todays most
popular Web site development technologies
6Introduction to the World Wide Web
- Internet a vast network that connects computers
all over the world - Originally developed in the 1960s by the Advanced
Research Projects Agency (ARPA) of the U.S. Dept.
of Defense (later known as DARPA) - Goal to interconnect the main computer systems
of various universities and research institutions
funded by ARPA - First implementation was called ARPANET
- Access was restricted to academic researchers,
scientists, and the military
7Introduction to the World Wide Web (contd.)
- At the end of the 1980s, commercial access to the
Internet was granted - World Wide Web (or Web) created by Tim
Berners-Lee in 1990-91 at the European Laboratory
for Particle Physics (CERN) in Geneva,
Switzerland - Purpose to easily access cross-referenced
documents, through a method called hypertext
linking - Hypertext link (hyperlink) contains a reference
to a Web page that can be accessed by a click
8Introduction to the World Wide Web (contd.)
- Web page a document on the Web
- Uniform Resource Locator (URL) a unique address
on the Web - Uniform Resource Identifier (URI) a generic term
for many types of names and addresses on the Web - Web site refers to a location on the Internet of
Web pages and related files that belong to a
company, organization, or individual - Web browser a program for displaying Web pages
9Introduction to the World Wide Web (contd.)
- Request when the users browser asks a Web
server for a Web page - Web server a computer that delivers Web pages
- Response what the Web server returns to the Web
browser
10Understanding Web Browsers
- Microsoft Internet Explorer currently the most
popular browser on the market - NCSA Mosaic first browser, created in 1993
- Netscape Navigator created in 1994, and
controlled 75 of the market until Internet
Explorer was released, starting the browser
wars - Incompatibilities among browsers for DHTML
elements resulted in creation of a set of
industry standards - World Wide Web Consortium (W3C) oversees
development of standards for the Web
11Understanding Web Browsers (contd.)
- A benefit of the browser wars was rapid
development and adoption of advanced Web page
standards, including JavaScript, CSS, and DHTML - Mozilla Firefox a new open source software
browser that has gained significant market share - Open source software for which the source code
can be freely used and modified
12Using HTML
- Hypertext Markup Language (HTML) a markup
language used to create Web pages (HTML pages) - Markup language a set of characters or symbols
that define a documents logical structure how
it should be printed or displayed - HTML is based on Standard Generalized Markup
Language (SGML) - HTML documents are text documents that contain
formatting instructions called tags
13Basic HTML Syntax
- HTML tags determine how data is displayed on a
Web page - Are enclosed in brackets (lt gt)
- Usually occur as an opening and closing pair of
tags - Closing tag starts with a / to define it as a
closing tag - Data may be placed within the tag pair
- Element a tag pair and any data it contains
- Content the information contained within an
opening and closing tag - Empty element an element that does not require a
closing tag
14Basic HTML Syntax (contd.)
Table 1-1 Common HTML elements
15Basic HTML Syntax (contd.)
- Root element contains all other elements in a
document - lthtmlgt element the root element for an HTML
document - ltheadgt element contains information used by the
browser - Occurs at the beginning of an HTML document after
the opening lthtmlgt tag - lttitlegt element contains text that appears in
the browsers title bar - ltheadgt element must contain a lttitlegt element
16Basic HTML Syntax (contd.)
- Document head the ltheadgt element and its
contents - ltbodygt element contains the document body
- Parsing (or rendering) the process by which a
Web browser assembles and formats an HTML
document - HTML is not case sensitive, but it is recommended
to use lowercase letters for all elements - Attributes parameters used to configure some
HTML elements
17Basic HTML Syntax (contd.)
- Attributes are placed in the opening tag, prior
to the closing bracket - Syntax attribute value
- Only recognized HTML elements and text are
processed by a browser - Nonprinting characters such as tabs and line
breaks are ignored - ltpgt element creates a paragraph with a line
break before and after its contents - ltbrgt element creates a line break
18Creating a Web Page
- HTML documents are text files
- Can be created with any text editor, such as
Notepad or WordPad - Cannot view the final result until the document
is opened in a browser - HTML editor an application designed for creating
HTML documents - Examples Macromedia Dreamweaver, Microsoft
FrontPage
19Web Communication Protocols
- Hypertext Transfer Protocol (HTTP) manages the
hypertext links used to navigate the Web - Host a computer system that is being accessed by
a remote computer - Domain name a unique address for identifying a
Web server on the Internet - Domain identifier last part of a domain name
that identifies the type of organization - URL may also contain directory and file names
20Web Communication Protocols (contd.)
Figure 1-3 Sample URL
21Web Communication Protocols (contd.)
- Transmission Control Protocol/Internet Protocol
(TCP/IP) a large collection of communication
protocols used on the Internet - HTTP is a component of TCP/IP
- Hypertext Transfer Protocol Secure (HTTPS)
provides secure Internet connections
22Introduction to Web Page Development
- Web page design (Web design) refers to the
visual design and creation of documents on the
Web - Quality Web design plays an important role in
attracting first-time and repeat visitors to a
Web site - Web page authoring (Web authoring) refers to the
creation and assembly of tags, attributes, and
data that make up a Web page - Web development (Web programming) refers to the
design of software applications for a Web site
23Understanding Client/Server Architecture
- Server usually refers to some sort of database
from which a client requests information - Two-tier system a system consisting of a client
and a server - Client (front-end)
- Handles the presentation of the interface to the
user - Receives, formats, and presents the results
returned from the server - Server (back-end) performs the heavy processing
such as calculations
24Understanding Client/Server Architecture (contd.)
Figure 1-4 The design of a two-tier client/server
system
25Understanding Client/Server Architecture (contd.)
- Three-tier (multitier) client/server system
contains three distinct pieces - Client tier the Web browser
- Processing tier handles the interaction between
the Web browser client and the data storage tier - Data storage tier stores data in a database and
handles requests from the processing tier
26Understanding Client/Server Architecture (contd.)
Figure 1.5 The design of a three-tier
client/server system
27Client-Side Scripting and JavaScript
- Static Web pages pages that cannot change after
the browser renders them - JavaScript client-side scripting language used
to develop interactive Web pages - Client-side scripting refers to a scripting
language that runs on the users browser (on the
client tier) - Scripting language refers to any type of
language capable of programmatically controlling
a Web page
28Client-Side Scripting and JavaScript (contd.)
- Scripting engine part of the browser that
executes scripting language code - Interpreter any program that executes scripting
language code - Scripting host a Web browser that contains a
scripting engine - JavaScript allows creation of
- Web pages with interactive games
- Dynamic modification of Web pages after rendering
- Visual effects such as animation
- Control of the Web browser window
29Client-Side Scripting and JavaScript (contd.)
- For security reasons, client-side JavaScript
- Cannot be used outside of a Web browser
- Does not allow file manipulation
- Does not include mechanisms for creating network
connections or accessing databases - Cannot run system commands or execute programs on
a client - Cannot interact directly with Web servers
operating at the processing tier
30Server-Side Scripting and ASP.NET
- Server-side scripting a technology that
processes a request by executing a script on a
server - Primarily used for communication between the
client tier and the data storage tier - Common uses include shopping carts, search
engines, message boards, Web-based e-mail, blogs,
games, etc.
31Server-Side Scripting and ASP.NET (contd.)?
Figure 1.6 How a Web server processes a
server-side script
32Server-Side Scripting and ASP.NET (contd.)?
- Active Server Pages (ASP).NET server-side
scripting technology part of Visual Web
Developer - Can use two languages with ASP.NET Visual Basic
or Visual C - C an object-oriented programming language based
on the C programming language - Object-oriented programming (OOP) refers to the
creation of reusable software objects that can be
incorporated into other programs - .NET Framework Microsoft platform for developing
Web applications
33Should You Use Client-Side or Server-Side
Scripting?
- Use client-side scripting for
- Controlling the Web browser
- Input data validation
- Light processing
- Use server-side scripting for
- Accessing a database
- Performing intensive calculations
- Using data storage
- Web application program that runs on a server
but is accessed by clients through a Web page on
a browser
34Introduction to Microsoft Visual Studio 2008
- Visual Studio a suite of development tools
including Visual C, Visual C, Visual Basic,
and Visual Web Developer - Express Editions free but limited editions of
the tools in Visual Studio
35Installing Microsoft Visual Web Developer 2008
Express Edition
- Visual Developer can be used to create
- ASP.Net Web sites
- HTML pages
- Cascading Style Sheets
- XML files
- JavaScript code
- Other types of files used on a Web site
36Managing Web Sites in Visual Web Developer
- To create a new Web site, use File menu New Web
Site, then select the type from the templates - ASP.NET Web site
- ASP.NET Web service
- Empty Web site
- WCF (Windows Communication Foundation) Web
service
37Managing Web Sites in Visual Web Developer
- To add a new item to a Web site, use Website menu
Add New Item - Select item type from the list of installed
templates - To add an existing item, use Website menu Add
Existing Item
38Figure 1.7 Add New Item dialog box
39Managing Web Sites in Visual Web Developer
(contd.)?
- Web sites project settings are stored in two
files - Visual Studio Solution file (.sln) contains
settings required by the project - Solution User Options file (.suo) contains
customization options for the project - These files are stored in the project folder
40Using the Visual Studio Integrated Development
Environment (IDE)?
- Integrated development environment (IDE) the
Visual Studio workspace in which you create
projects - Project the program you are writing (or the Web
site you are developing) - Solution can contain multiple projects
- Start Page contains links to recent projects,
tutorials, developer information, and recent news
about Visual Web Developer
41Figure 1.8 IDE Start Page
42Using the Visual Studio Integrated Development
Environment (contd.)?
- Solution Explorer window used to manage the
files associated with the Web site - Provides a hierarchical list of the project files
- Code Editor used to edit programming code
- Includes statement completion IntelliSense
technology to automate tasks - Text Editor used to edit text that is not
associated with a programming language - CSS Editor used to edit CSS files
43Figure 1.9 Solution Explorer window for the
Cessna project
44Figure 1.10 Statement completion in the Code
Editor
45Using the Visual Studio Integrated Development
Environment (contd.)
- Properties window used to change properties,
attributes, and other settings associated with a
project - Contains two columns property column and value
column - Certain types of windows in the IDE can be
floating or dockable - Right-click the windows title bar to change
between floating and dockable
46Figure 1.11 Properties of the ltformgt tag
displayed in the Properties window
47Figure 1.12 Solution Explorer window with its
dockable property turned on
48Figure 1.13 Solution Explorer window with its
floating property turned on
49Building and Starting a Web Site
- Source code original programming code
- Compile to process and assemble the source code
into an executable format - Use Build menu to compile source code
- Build page compiles an individual file
- Build Web Site compiles all source files
- Visual Web Developer automatically saves changes
to all open items during the build process
50Building and Starting a Web Site (contd.)
- Output window displays status messages for
various IDE features, such as build progress - Use View menu Output to display the Output
window - Error List window lists any source file errors
found during the build process - Use View menu Error List to display this window
- Compiler error messages show any syntax errors
in a source file - Warning messages occur for potential problems
51Figure 1.14 Output window after building the
Cessna Web site
Figure 1.15 Error List window displaying errors
found in ASP.NET source file
52Using the ASP.NET Development Server
- ASP.NET Development Server basic Web server that
can be used to test a Web site on your local
computer - Designed to run under localhost, the name used by
a computer to refer to itself - Use Debug menu Start Without Debugging
- Port represents the endpoint of a connection
between a client and a server - Port 80 is reserved for HTTP communications
53Working with Well-Formed Web Pages
- Current version of HTML is 4.01, released in 1999
- Extensible Hypertext Markup Language (XHTML)
replaced HTML for Web pages - Supports devices other than traditional Web
browsers - User agent an application capable of retrieving
and processing HTML and XHTML documents - Includes mobile phones, PDAs, browsers, search
engine crawlers, etc.
54XHTML Document Type Declarations (DTDs)
- Well-formed document one that conforms to the
rules and regulations of XHTML - Must include a lt!DOCTYPEgt declaration as the
first line of an XHTML document - Document type declaration (DTD) defines the
elements and attributes that can be used in a
document - Deprecated term for elements and attributes that
are considered to be obsolete
55XHTML Document Type Declarations (contd.)
Table 1.2 HTML elements that are deprecated in
XHTML 1.0
56XHTML Document Type Declarations (contd.)
- Three types of DTDs for XHTML documents
- Transitional DTD allows you to use deprecated
style elements - Frameset DTD identical to transitional DTD, but
also includes the ltframesetgt and ltframegt elements - Strict DTD eliminates elements that were
deprecated in the transitional and frameset DTDs
57Writing Well-Formed Documents
- A well-formed document
- Must include lt!DOCTYPEgt declaration and lthtmlgt,
ltheadgt, and ltbodygt elements - Must use lthtmlgt as the root element
- Is case sensitive
- Must have closing tags for all XHTML elements
- Must close all empty elements with a space and
slash before the closing bracket - Must properly nest XHTML elements (an element
must be totally contained within another element)
58Using Phrase Elements
- XHTML uses two types of inline elements for
formatting text - Formatting elements provide specific
instructions about how their content should be
displayed - Phrase elements primarily identify or describe
their content - Recommended to use phrase elements to allow
compatibility with different user agents
59Using Phrase Elements (contd.)
Table 1.3 Phrase elements
60Working with Cascading Style Sheets (CSS)
- Style a single piece of CSS formatting
information - CSS information can be added directly to
documents or stored in separate documents shared
by multiple Web pages - CSS design and formatting techniques are
independent of the content of a Web page - Style declaration creates a CSS style consists
of - Property refers to a specific CSS style
- Value determines the styles visual
characteristics
61Working with Cascading Style Sheets (contd.)
- Three locations for style declarations
- Inline styles add style information to an
individual HTML element, using a style attribute - Internal style sheets add style information to
an entire document, using ltstylegt elements within
the document head - Selector the element to which a specific style
rule applies - External style sheets separate text documents
with style declarations that are used by multiple
Web documents in a Web site - Have a file extension of .css
62Validating Web Pages
- Validating parser program that checks whether an
XHTML document is well formed - Validation process of verifying that an XHTML
document is well formed and conforms to the
specified DTD - W3C Markup Validation Service free service to
validate both HTML and XHMTL - Visual Web Developer automatically validates Web
pages
63Summary
- World Wide Web created by Tim Berners-Lee in
1990-91 at CERN - W3C established in 1994 at MIT to develop Web
standards - Two-tier system consists of client and server
- Three-tier system consists of client, processing,
and data storage tiers - JavaScript is a client-side scripting language
- Active Server Pages (ASP).Net is a server-side
scripting technology
64Summary (contd.)?
- Visual Studio is an integrated development
environment (IDE) including Visual C, Visual
C, Visual Basic, and Visual Web Developer - Visual Web Developer includes the ASP.NET
Development Server for testing Web sites - XHMTL is the current standard markup language for
Web pages - A document type definition (DTD) defines the
elements and attributes that can be used in a
document
65Summary (contd.)?
- Use CSS to design and format the display of Web
pages - A validating parser is a program that checks
whether an XHTML document is well formed