Introduction to the Web

Introduction to the Introduction to the WebWeb

PrerequisitesPrerequisites Basic computer skillsBasic computer skills Experience using the World Wide WebExperience using the World Wide Web Experience developing object-oriented Experience developing object-oriented

softwaresoftware

Learning ObjectivesLearning Objectives Overview of Web and Internet Overview of Web and Internet

technologiestechnologies Review of existing Web programming Review of existing Web programming

technologiestechnologies

AgendaAgenda Internet TechnologiesInternet Technologies Programming Languages and ParadigmsProgramming Languages and Paradigms Programming the WebProgramming the Web

Internet Technologies Internet Technologies The World Wide WebThe World Wide Web

A way to access and share informationA way to access and share information Technical papers, marketing materials, recipes, Technical papers, marketing materials, recipes,

...... A huge network of computers: the InternetA huge network of computers: the Internet Graphical, not just textualGraphical, not just textual Information is linked to other informationInformation is linked to other information Application development platformApplication development platform

Shop from homeShop from home Provide self-help applications for customers Provide self-help applications for customers

and partnersand partners

Internet TechnologiesInternet TechnologiesWWW ArchitectureWWW Architecture

Web Server

PC/Mac/Unix + BrowserClient

Server

Request:http://www.msn.com/default.asp

Response:<html>…</html>

Network TCP/IP

Internet TechnologiesInternet TechnologiesWWW ArchitectureWWW Architecture

Client/Server, Request/Response architectureClient/Server, Request/Response architecture You request a Web pageYou request a Web page

e.g. e.g. http://www.msn.com/default.asphttp://www.msn.com/default.asp HTTP requestHTTP request

The Web server responds with data in the form of a Web The Web server responds with data in the form of a Web pagepage

HTTP responseHTTP response Web page is expressed as HTMLWeb page is expressed as HTML

Pages are identified as a Uniform Resource Locator (URL)Pages are identified as a Uniform Resource Locator (URL) Protocol: Protocol: httphttp Web server: Web server: www.msn.comwww.msn.com Web page: Web page: default.aspdefault.asp Can also provide parameters: Can also provide parameters: ?name=Leon?name=Leon

Internet TechnologiesInternet TechnologiesWeb StandardsWeb Standards

Internet Engineering Task Force (IETF)Internet Engineering Task Force (IETF) http://www.ietf.org/http://www.ietf.org/ Founded 1986Founded 1986 Request For Comments (RFC) at Request For Comments (RFC) at http://www.ietf.org/rfc.htmlhttp://www.ietf.org/rfc.html

World Wide Web Consortium (W3C)World Wide Web Consortium (W3C) http://www.w3.orghttp://www.w3.org Founded 1994 by Tim Berners-LeeFounded 1994 by Tim Berners-Lee Publishes technical reports and Publishes technical reports and

recommendationsrecommendations

Internet TechnologiesInternet TechnologiesWeb Design PrinciplesWeb Design Principles

Interoperability:Interoperability: Web languages and Web languages and protocols must be compatible with one protocols must be compatible with one another independent of hardware and another independent of hardware and software. software.

Evolution:Evolution: The Web must be able to The Web must be able to accommodate future technologies. accommodate future technologies. Encourages simplicity, modularity and Encourages simplicity, modularity and extensibility.extensibility.

Decentralization:Decentralization: Facilitates scalability Facilitates scalability and robustness. and robustness.

Internet TechnologiesInternet TechnologiesHypertext Markup Language (HTML)Hypertext Markup Language (HTML)

The markup language used to represent The markup language used to represent Web pages for viewing by peopleWeb pages for viewing by people Designed to display data, not store/transfer dataDesigned to display data, not store/transfer data

Rendered and viewed in a Web browserRendered and viewed in a Web browser Can contain Can contain linkslinks to images, documents, to images, documents,

and other pagesand other pages Not extensibleNot extensible Derived from Standard Generalized Derived from Standard Generalized

Markup Language (SGML)Markup Language (SGML) HTML 3.2, 4.01, XHTML 1.0HTML 3.2, 4.01, XHTML 1.0

Internet TechnologiesInternet TechnologiesHTML FormsHTML Forms

Enables you to create interactive Enables you to create interactive user interface elementsuser interface elements ButtonsButtons Text boxesText boxes Drop down listsDrop down lists Check boxesCheck boxes

User fills out the form and submits itUser fills out the form and submits it Form data is sent to the Web server via Form data is sent to the Web server via

HTTP when the form is submittedHTTP when the form is submitted

Internet TechnologiesInternet TechnologiesHypertext Transport Protocol (HTTP)Hypertext Transport Protocol (HTTP)

The top-level protocol used to request and The top-level protocol used to request and return data return data E.g. HTML pages, GIFs, JPEGs, Microsoft E.g. HTML pages, GIFs, JPEGs, Microsoft

Word documents, Adobe PDF documents, etc.Word documents, Adobe PDF documents, etc. Request/Response protocolRequest/Response protocol Methods: Methods: GETGET, , POSTPOST, , HEADHEAD, …, … HTTP 1.0: simple HTTP 1.0: simple HTTP 1.1: more complexHTTP 1.1: more complex

GET /default.asp HTTP/1.0Accept: image/gif, image/x-bitmap, image/jpeg, */*Accept-Language: enUser-Agent: Mozilla/1.22 (compatible; MSIE 2.0; Windows 95)Connection: Keep-AliveIf-Modified-Since: Sunday, 17-Apr-96 04:32:58 GMT

Internet TechnologiesInternet TechnologiesHTTP RequestHTTP Request

Method File HTTP version Headers

Data – none for GETBlank line

HTTP/1.0 200 OKDate: Sun, 21 Apr 1996 02:20:42 GMTServer: Microsoft-Internet-Information-Server/5.0 Connection: keep-aliveContent-Type: text/htmlLast-Modified: Thu, 18 Apr 1996 17:39:05 GMTContent-Length: 2543 <HTML> Some data... blah, blah, blah </HTML>

Internet TechnologiesInternet TechnologiesHTTP ResponseHTTP Response

HTTP version Status code Reason phrase Headers

Data

Internet TechnologiesInternet TechnologiesHTTP Server Status CodesHTTP Server Status Codes

CodeCode DescriptionDescription200200 OKOK201201 CreatedCreated301301 Moved PermanentlyMoved Permanently302302 Moved TemporarilyMoved Temporarily400400 Bad Request – not Bad Request – not

understoodunderstood401401 UnauthorizedUnauthorized403403 Forbidden – not Forbidden – not

authorizedauthorized404404 Not FoundNot Found500500 Internal Server ErrorInternal Server Error

Internet TechnologiesInternet TechnologiesHTTPHTTP

HTTP is a stateless protocolHTTP is a stateless protocol Each HTTP request is independent of Each HTTP request is independent of

previous and subsequent requestsprevious and subsequent requests HTTP 1.1 introduced HTTP 1.1 introduced keep-alivekeep-alive for for

efficiencyefficiency Statelessness has a big impact on how Statelessness has a big impact on how

scalable applications are designedscalable applications are designed

Internet TechnologiesInternet TechnologiesCookiesCookies

A mechanism to store a small amount of A mechanism to store a small amount of information (up to 4KB) on the clientinformation (up to 4KB) on the client

A cookie is associated with a specific web A cookie is associated with a specific web sitesite

Cookie is sent in HTTP headerCookie is sent in HTTP header Cookie is sent with each HTTP requestCookie is sent with each HTTP request Can last for only one session (until browser Can last for only one session (until browser

is closed) or can persist across sessionsis closed) or can persist across sessions Can expire some time in the futureCan expire some time in the future

Internet TechnologiesInternet TechnologiesHTTPSHTTPS

A secure version of HTTP A secure version of HTTP Allows client and server to exchange data Allows client and server to exchange data

with confidence that the data was neither with confidence that the data was neither modified nor interceptedmodified nor intercepted

Uses Secure Sockets Layer (SSL)/Uses Secure Sockets Layer (SSL)/Transport Layer Security (TLS)Transport Layer Security (TLS)

Internet TechnologiesInternet TechnologiesURIs, URLs and URNsURIs, URLs and URNs

Uniform Resource Identifier (URI = URL or Uniform Resource Identifier (URI = URL or URN)URN) Generic term for all textual names/addressesGeneric term for all textual names/addresses

Uniform Resource Locator (URL)Uniform Resource Locator (URL) The set of URI schemes that have explicit instructions The set of URI schemes that have explicit instructions

on how to access the resource over the Internet, on how to access the resource over the Internet, e.g. e.g. httphttp, , ftpftp, , gophergopher

Uniform Resource Name (URN) Uniform Resource Name (URN) 1) A URI that has an institutional commitment to 1) A URI that has an institutional commitment to

availability, etc.availability, etc.2) A particular scheme intended to identify resources2) A particular scheme intended to identify resources

e.g.e.g. urn:schemas:httpmail:subjecturn:schemas:httpmail:subject

Internet TechnologiesInternet TechnologiesMultipurpose Internet Mail Extensions Multipurpose Internet Mail Extensions

(MIME)(MIME) Defines types of data/documentsDefines types of data/documents

text/plaintext/plain text/htmltext/html image/gifimage/gif image/jpegimage/jpeg audio/x-pn-realaudioaudio/x-pn-realaudio audio/x-ms-wmaaudio/x-ms-wma video/x-ms-asfvideo/x-ms-asf application/octet-stream application/octet-stream

Internet TechnologiesInternet TechnologiesMIMEMIME

Specifies character sets, e.g. ASCIISpecifies character sets, e.g. ASCII Supports multi-part messagesSupports multi-part messages Originally designed for email, but also Originally designed for email, but also

used in other places, such as HTTPused in other places, such as HTTP

Internet TechnologiesInternet TechnologiesBrowsersBrowsers

Client-side applicationClient-side application Requests HTML from Web server and Requests HTML from Web server and

renders itrenders it Popular browsers:Popular browsers:

NetscapeNetscape Internet ExplorerInternet Explorer OperaOpera othersothers

Also known as a User AgentAlso known as a User Agent

Internet TechnologiesInternet TechnologiesClients & ServersClients & Servers

Client and Server computers both have:Client and Server computers both have: CPUCPU MemoryMemory I/O I/O

DisksDisks NetworkNetwork

BusBus Multi-tasking operating systemMulti-tasking operating system ApplicationsApplications

Internet TechnologiesInternet TechnologiesClients & ServersClients & Servers

ClientsClients Generally supports a single userGenerally supports a single user Optimized for responsiveness to userOptimized for responsiveness to user User interface, graphicsUser interface, graphics

ServersServers Supports multiple usersSupports multiple users Optimized for throughputOptimized for throughput More: CPUs (SMP), memory, disks (SANs), I/OMore: CPUs (SMP), memory, disks (SANs), I/O Provide services (e.g. Web, file, print, database, Provide services (e.g. Web, file, print, database,

e-mail, fax, transaction, telnet, directory)e-mail, fax, transaction, telnet, directory)

Internet TechnologiesInternet TechnologiesProxy Servers & FirewallsProxy Servers & Firewalls

Proxy Server Proxy Server A server that sits between a client (running a A server that sits between a client (running a

browser) and the Internetbrowser) and the Internet Improves performance by caching commonly Improves performance by caching commonly

used Web pagesused Web pages Can filter requests to prevent users from Can filter requests to prevent users from

accessing certain Web sitesaccessing certain Web sites FirewallFirewall

A server that sits between a network and the A server that sits between a network and the Internet to prevent unauthorized access to the Internet to prevent unauthorized access to the network from the Internetnetwork from the Internet

Internet TechnologiesInternet TechnologiesNetworksNetworks

Network = an interconnected collection of Network = an interconnected collection of independent computersindependent computers

Why have networks?Why have networks? Resource sharingResource sharing ReliabilityReliability Cost savingsCost savings CommunicationCommunication

Web technologies add:Web technologies add: New business models: e-commerce, advertisingNew business models: e-commerce, advertising EntertainmentEntertainment Applications without a client-side installApplications without a client-side install


Network scopeNetwork scope internet: a collection of connected networksinternet: a collection of connected networks Internet: a specific world-wide network based on Internet: a specific world-wide network based on

TCP/IP, used to connect companies, universities, TCP/IP, used to connect companies, universities, governments, organizations and individuals. governments, organizations and individuals. Originated as ARPANET, funded by the US DoD.Originated as ARPANET, funded by the US DoD.

intranet: a network based on Internet technologies intranet: a network based on Internet technologies that is internal to a company or organizationthat is internal to a company or organization

extranet: a network based on Internet extranet: a network based on Internet technologies that connects one company or technologies that connects one company or organization to anotherorganization to another


Network technology is largely determined Network technology is largely determined

by scale:by scale: Local Area Network (LAN): Span up to a few Local Area Network (LAN): Span up to a few

kilometers. Bus vs. ring topologieskilometers. Bus vs. ring topologies Wide Area Networks (WAN): Can span a Wide Area Networks (WAN): Can span a

country or continent. WANs use routers as country or continent. WANs use routers as intermediate nodes to connect transmission intermediate nodes to connect transmission lineslines


Network technologyNetwork technology BroadcastingBroadcasting

Packets of data are sent from one machine and Packets of data are sent from one machine and received by all computers on the networkreceived by all computers on the network

Multicast: packets are received by a subset of the Multicast: packets are received by a subset of the machines on a networkmachines on a network

Point-to-pointPoint-to-point Packets have to be routed from one machine to Packets have to be routed from one machine to

another; there many be many pathsanother; there many be many paths In general, geographically localized networks In general, geographically localized networks

use broadcasting, while disperse networks use use broadcasting, while disperse networks use

point-to-pointpoint-to-point


ApplicationLayer

PresentationLayer

SessionLayer

TransportLayer

NetworkLayer

Data LinkLayer

PhysicalLayer

InternetLayer

ApplicationLayer Telnet FTP SMTP DNS RIP SNMP HTTP

IP

Host-to-HostTransport

LayerTCP UDP

TokenRingEthernet ATMFrame

Relay

NetworkInterface

Layer

OSI Model Layers

TCP/IP Protocol

Architecture Layers

TCP/IP Protocol Suite

ARPICMPIGMP

Internet TechnologiesInternet TechnologiesNetwork Protocol StackNetwork Protocol Stack

HTTP

TCP

IP

Ethernet

HTTP

TCP

IP

Ethernet

Internet TechnologiesInternet TechnologiesNetworks - Internet LayerNetworks - Internet Layer

Internet Protocol (IP)Internet Protocol (IP) Responsible for getting packets from Responsible for getting packets from

source to destination across multiple hopssource to destination across multiple hops Not reliableNot reliable IP address: 32 bit value usually written in IP address: 32 bit value usually written in

dotted decimal notation as four 8-bit dotted decimal notation as four 8-bit numbers numbers (0 to 255); e.g. 130.50.12.4(0 to 255); e.g. 130.50.12.4

Internet TechnologiesInternet TechnologiesNetworks - Transport LayerNetworks - Transport Layer

Provides efficient, reliable and Provides efficient, reliable and cost-effective servicecost-effective service

Uses the Sockets programming modelUses the Sockets programming model Ports identify applicationPorts identify application

Well-known ports identify standard services Well-known ports identify standard services (e.g. HTTP uses port 80, SMTP uses port 25)(e.g. HTTP uses port 80, SMTP uses port 25)

Transmission Control Protocol (TCP)Transmission Control Protocol (TCP) Provides reliable, connection-oriented byte Provides reliable, connection-oriented byte

streamstream UDPUDP

Connectionless, unreliableConnectionless, unreliable

Internet TechnologiesInternet TechnologiesNetworks - Application LayerNetworks - Application Layer

Telnet: Remote sessionsTelnet: Remote sessions File Transfer Protocol (FTP)File Transfer Protocol (FTP) Network News Transfer Protocol (NNTP)Network News Transfer Protocol (NNTP) Simple Network Management Protocol Simple Network Management Protocol

(SNMP)(SNMP) Simple Mail Transfer Protocol (SMTP)Simple Mail Transfer Protocol (SMTP) Post Office Protocol (POP3)Post Office Protocol (POP3) Interactive Mail Access Protocol (IMAP)Interactive Mail Access Protocol (IMAP)

Internet TechnologiesInternet TechnologiesNetworks - Networks - Domain Name System (DNS)Domain Name System (DNS)

Provides user-friendly domain names, Provides user-friendly domain names, e.g. e.g. www.msn.com www.msn.com

Hierarchical name space with limited root Hierarchical name space with limited root namesnames

DNS servers map domain names to DNS servers map domain names to IP addressesIP addresses

.com .net .gov .edu

.org .mil .in

Internet TechnologiesInternet TechnologiesExtensible Markup Language (XML)Extensible Markup Language (XML)

Represents hierarchical dataRepresents hierarchical data A meta-language: a language for defining A meta-language: a language for defining

other languagesother languages ExtensibleExtensible Useful for data exchange and Useful for data exchange and

transformationtransformation Simplified version of SGMLSimplified version of SGML

AgendaAgenda Internet TechnologiesInternet Technologies Programming Languages and Programming Languages and

ParadigmsParadigms Programming the WebProgramming the Web .NET Overview.NET Overview

Programming LanguagesProgramming Languages Machine codeMachine code Assembly languageAssembly language High-level languagesHigh-level languages

Fortran, LISP, CobolFortran, LISP, Cobol C, Pascal, Basic, SmalltalkC, Pascal, Basic, Smalltalk C++, EiffelC++, Eiffel Java, C#Java, C#

Scripting languagesScripting languages Shell scripts, Perl, TCL, Python, JavaScript, Shell scripts, Perl, TCL, Python, JavaScript,

VBScriptVBScript

Programming ParadigmsProgramming Paradigms Unstructured programmingUnstructured programming Structured programmingStructured programming Object-oriented programmingObject-oriented programming Component-based programmingComponent-based programming Event-based programmingEvent-based programming

Programming ParadigmsProgramming ParadigmsUnstructured ProgrammingUnstructured Programming

See “Go To Statement Considered See “Go To Statement Considered Harmful” at Harmful” at http://www.acm.org/classics/oct95/http://www.acm.org/classics/oct95/

Programming ParadigmsProgramming ParadigmsStructured ProgrammingStructured Programming

SequenceSequence Conditional Conditional

if then elseif then else switchswitch

LoopingLooping for i from 1 to nfor i from 1 to n do whiledo while do untildo until

FunctionsFunctions ExceptionsExceptions

Programming ParadigmsProgramming ParadigmsObject-Oriented ProgrammingObject-Oriented Programming

Objects have data and behaviorObjects have data and behavior Data: members, fields, variables, slots, propertiesData: members, fields, variables, slots, properties Behavior: methods, functions, proceduresBehavior: methods, functions, procedures

Using objects is easyUsing objects is easy First instantiate the type of object desiredFirst instantiate the type of object desired Then call its methods and get/set its propertiesThen call its methods and get/set its properties

Designing new types of objects can be hardDesigning new types of objects can be hard Design goals often conflict: simplicity, Design goals often conflict: simplicity,

functionality, reuse, performancefunctionality, reuse, performance

Programming ParadigmsProgramming ParadigmsObject-Oriented ProgrammingObject-Oriented Programming

Key object-oriented conceptsKey object-oriented concepts IdentityIdentity Encapsulation Encapsulation

Data + behaviorData + behavior Information hiding (abstraction)Information hiding (abstraction)

Classes vs. instancesClasses vs. instances PolymorphismPolymorphism InterfacesInterfaces Delegation, aggregationDelegation, aggregation InheritanceInheritance PatternsPatterns

Programming ParadigmsProgramming ParadigmsComponent-Based ProgrammingComponent-Based Programming

ComponentsComponents Independent modules of reuse and deploymentIndependent modules of reuse and deployment Coarser-grained than objects Coarser-grained than objects

(objects are language-level constructs)(objects are language-level constructs) Includes multiple classesIncludes multiple classes Often language-independentOften language-independent

In the general case, the component writer In the general case, the component writer and the component user don’t know each and the component user don’t know each other, don’t work for the same company, other, don’t work for the same company, and don’t use the same languageand don’t use the same language

Programming ParadigmsProgramming ParadigmsComponent-Based ProgrammingComponent-Based Programming

Component Object Model (COM)Component Object Model (COM) Initial Microsoft standard for componentsInitial Microsoft standard for components Specifies a protocol for instantiating and using Specifies a protocol for instantiating and using

components in-process, across processes or components in-process, across processes or across machine boundariesacross machine boundaries

Basis for ActiveX, OLE, and many other Basis for ActiveX, OLE, and many other technologiestechnologies

Can be created in Visual Basic, C++, .NET, …Can be created in Visual Basic, C++, .NET, … Java BeansJava Beans

Java standard for componentsJava standard for components Not language-independentNot language-independent

Programming ParadigmsProgramming ParadigmsEvent-Based ProgrammingEvent-Based Programming

When something of interest occurs, an event is When something of interest occurs, an event is raised and application-specific code is raised and application-specific code is executedexecuted

Events provide a way for you to hook in your Events provide a way for you to hook in your own code into the operation of another systemown code into the operation of another system

Event = callbackEvent = callback User interfaces are all about eventsUser interfaces are all about events

onClickonClick, , onMouseOveronMouseOver, , onMouseMoveonMouseMove…… Events can also be based upon time or Events can also be based upon time or

interactions with the network, operating interactions with the network, operating system, other applications, etc.system, other applications, etc.

AgendaAgenda Internet TechnologiesInternet Technologies Programming Languages and ParadigmsProgramming Languages and Paradigms Programming the WebProgramming the Web .NET Overview.NET Overview

Programming the WebProgramming the WebClient-Side CodeClient-Side Code

What is client-side code?What is client-side code? Software that is downloaded from Web server Software that is downloaded from Web server

to browser and then executes on the clientto browser and then executes on the client Why client-side code?Why client-side code?

Better scalability: less work done on serverBetter scalability: less work done on server Better performance/user experienceBetter performance/user experience Create UI constructs not inherent in HTMLCreate UI constructs not inherent in HTML

Drop-down and pull-out menusDrop-down and pull-out menus Tabbed dialogsTabbed dialogs

Cool effects, e.g. animationCool effects, e.g. animation Data validationData validation

Programming the WebProgramming the WebClient-Side TechnologiesClient-Side Technologies

DHTML/JavaScriptDHTML/JavaScript COMCOM

ActiveX controlsActiveX controls COM componentsCOM components Remote Data Services (RDS)Remote Data Services (RDS)

JavaJava Plug-insPlug-ins HelpersHelpers Remote ScriptingRemote Scripting

Programming the WebProgramming the WebDynamic HTML (DHTML)Dynamic HTML (DHTML)

Script that is embedded within an HTML Script that is embedded within an HTML pagepage

Usually written in JavaScript Usually written in JavaScript (ECMAScript, JScript) for portability(ECMAScript, JScript) for portability Internet Explorer also supports VBScript and Internet Explorer also supports VBScript and

other scripting languagesother scripting languages Each HTML element becomes an object Each HTML element becomes an object

that has associated events (e.g. that has associated events (e.g. onClickonClick)) Script provides code to respond to Script provides code to respond to

browser eventsbrowser events

Programming the WebProgramming the WebDHTMLDHTML

The DHTML Document Object Model The DHTML Document Object Model (DOM)(DOM)

window

history document location screen

all location children selectionforms body links

text buttonradio textarea select

password

file

checkbox submit

resetoption

navigator framesevent

Programming the WebProgramming the WebServer-Side CodeServer-Side Code

What is server-side code?What is server-side code? Software that runs on the server, not the clientSoftware that runs on the server, not the client Receives input fromReceives input from

URL parametersURL parameters HTML form dataHTML form data CookiesCookies HTTP headersHTTP headers

Can access server-side databases, e-mail Can access server-side databases, e-mail servers, files, mainframes, etc.servers, files, mainframes, etc.

Dynamically builds a custom HTML response Dynamically builds a custom HTML response for a clientfor a client

Programming the WebProgramming the WebServer-Side CodeServer-Side Code

Why server-side code?Why server-side code? AccessibilityAccessibility

You can reach the Internet from any browser, any You can reach the Internet from any browser, any device, any time, anywheredevice, any time, anywhere

ManageabilityManageability Does not require distribution of application codeDoes not require distribution of application code Easy to change codeEasy to change code

SecuritySecurity Source code is not exposedSource code is not exposed Once user is authenticated, can only allow certain Once user is authenticated, can only allow certain

actionsactions ScalabilityScalability

Web-based 3-tier architecture can scale outWeb-based 3-tier architecture can scale out

Programming the WebProgramming the WebServer-Side TechnologiesServer-Side Technologies

Common Gateway Interface (CGI)Common Gateway Interface (CGI) Internet Server API (ISAPI)Internet Server API (ISAPI) Netscape Server API (NSAPI)Netscape Server API (NSAPI) Active Server Pages (ASP)Active Server Pages (ASP) Java Server Pages (JSP)Java Server Pages (JSP) Personal Home Page (PHP)Personal Home Page (PHP) Cold Fusion (CFM)Cold Fusion (CFM) ASP.NETASP.NET

Programming the WebProgramming the Web Active Server Pages (ASP) Active Server Pages (ASP)

Technology to easily create server-side Technology to easily create server-side applicationsapplications

ASP pages are written in a scripting ASP pages are written in a scripting language, usually VBScript or JScriptlanguage, usually VBScript or JScript

An ASP page contains a sequence of static An ASP page contains a sequence of static HTML interspersed with server-side codeHTML interspersed with server-side code

ASP script commonly accesses and ASP script commonly accesses and updates data in a databaseupdates data in a database

Programming the WebProgramming the WebASPASP

HTTP request(form data, HTTP

header data)

HTTP responseHTML, XML

ASP page(static HTML, server-side logic)

ArchitecturesArchitectures

N TierN TierApplication ServersApplication ServersMiddlewareMiddlewareIntranetsIntranets

What to Know About What to Know About ArchitecturesArchitectures

Evolution of ArchitecturesEvolution of Architectures Evolution of COMEvolution of COM DefinitionsDefinitions

ASPASP MiddlewareMiddleware Database transparencyDatabase transparency ADOADO

Client/ServerClient/Server Client/Server Client/Server evolvesevolves along the line of PC along the line of PC

computing and Microsoftcomputing and Microsoft PC moved from complement to substitute PC moved from complement to substitute

for Host systemsfor Host systems 80’s PC’s were personal 80’s PC’s were personal 90’s PC’s were departmental90’s PC’s were departmental 00’s PC’s are enterprise wide platforms00’s PC’s are enterprise wide platforms

Key Problems of Key Problems of Client/ServerClient/Server

ScalabilityScalability Manageability Manageability ComplexityComplexity

Ease of UseEase of Use Application DevelopmentApplication Development

Network Architectures Network Architectures Host-based networksHost-based networks: the host computer : the host computer

performs virtually all of the workperforms virtually all of the work Client-based networksClient-based networks: the client computer : the client computer

performs virtually all of the workperforms virtually all of the work Client-server networksClient-server networks: the work is shared : the work is shared

between the hosts and clientsbetween the hosts and clients

FunctionsFunctions The work done by any application The work done by any application

program can be divided into four general program can be divided into four general functions:functions: data storagedata storage data access logicdata access logic application logicapplication logic presentation logicpresentation logic

Host-Based ArchitecturesHost-Based Architectures

Host-Based ArchitecturesHost-Based Architectures Scalability Scalability

Pros – provide large scale accessPros – provide large scale access Cons – expensive, lumpy, slowCons – expensive, lumpy, slow

Centralized ManagementCentralized Management ComplexityComplexity

Poor user interfacePoor user interface Application backlog – low level tools, Application backlog – low level tools,

specialized knowledgespecialized knowledge

Client-Based ArchitecturesClient-Based Architectures

Evolution of standalone PC to fill gaps in Evolution of standalone PC to fill gaps in departmental computing needsdepartmental computing needs

Server acts as a remote disk drive. Client does all the processing. Searches slow down the network, each query has the server pass the entire database over the network.

Client-Based ArchitecturesClient-Based Architectures

Client-Based ArchitecturesClient-Based Architectures Scalability Scalability

Pros – cheap & easy to add a station up to limitsPros – cheap & easy to add a station up to limits Cons – severely limited by Cons – severely limited by

bandwidth/architecture bandwidth/architecture Cons – changes to application must be made on Cons – changes to application must be made on

server and all clientsserver and all clients Decentralized ManagementDecentralized Management ComplexityComplexity

Graphical user interface Graphical user interface Off the shelf applications – high level toolsOff the shelf applications – high level tools Custom apps difficult to developCustom apps difficult to develop

Two Tier Client-ServerTwo Tier Client-Server

Moves data access logic to server - decreases congestionMoves data access logic to server - decreases congestion Ease application development – object oriented Ease application development – object oriented

programmingprogramming

•Improved Scalability – less data traffic•An SQL request is generated in the client and transmitted to the server. The DBMS searches locally and returns only matching records greatly reducing data traffic.

Two Tier Client/ServerTwo Tier Client/Server

COM - Component Object COM - Component Object ModelModel

Rapid development & lower costs by using ready Rapid development & lower costs by using ready made “building blocks”made “building blocks”

Components – called like subroutinesComponents – called like subroutines Two tier system - components downloaded to the Two tier system - components downloaded to the

client to execute, uses lots of bandwidth bogs client to execute, uses lots of bandwidth bogs down WAN’s and enterprise networksdown WAN’s and enterprise networks

Three Tier Client/ServerThree Tier Client/Server

Application serverApplication server – stores & executes components for clients – stores & executes components for clients Easier management - centralizing application logic Easier management - centralizing application logic Reduces network traffic Reduces network traffic Optimizes network processing - Lower load on client. Can use thin Optimizes network processing - Lower load on client. Can use thin

clients, NC’s, older PC’s, clients, NC’s, older PC’s,

CORBA – Common Object CORBA – Common Object Request Broker Request Broker ArchitectureArchitecture

DCOM (MS) – Distributed DCOM (MS) – Distributed Component Object ModelComponent Object Model

Allows components to be Allows components to be executed remotely with executed remotely with results sent back to clientresults sent back to client

Three Tier Object Three Tier Object ModelsModels

API – Application API – Application Programming Interface and Programming Interface and three tier architecture brings three tier architecture brings the power of layering logicthe power of layering logic

layering logic - change a layering logic - change a layer without changing the layer without changing the others others

Application logic - (ex. Tax Application logic - (ex. Tax software)software)

Three Tier Client/ServerThree Tier Client/Server

Web Mail as 3 Tier SystemWeb Mail as 3 Tier System

Systems Management & Performance:Systems Management & Performance: Web Sites & MS Windows Web Sites & MS Windows

DNA DNA

Front End – stateless load balancing, cloned systemsFront End – stateless load balancing, cloned systems Back End – stateful, partitioningBack End – stateful, partitioning

N-Tier ArchitectureN-Tier Architecture

.

Web Server or Application Server

HTML pages• Applets and components• Programming scripts

HTML pages• Applets and components• Programming scripts

WelcomeProducts and Support

1. Web Client 2. Web Server

Computer withWeb browser

HTTP server engine• HTML forms processing• State management• Executable program calls• Server-side scripting

HTTP server engine• HTML forms processing• State management• Executable program calls• Server-side scripting

HTTP Web Server

3. Server Programs

Executable program• Database access• Business logic• Server-side component calls

Executable program• Database access• Business logic• Server-side component calls

4. Database Server

DBMS system• Database storage• Database transactions• Stored procedures

DBMS system• Database storage• Database transactions• Stored procedures

Database Server with DBMS

Client Server

ServerServer

What is a Web Application?What is a Web Application?

IISActive Server Pages

Script Logic

COM

HTTP Clients

ServicesTransaction server

Message Queuing

Commerce

Databases and Directories

Architecture TiersArchitecture Tiers Business LogicBusiness Logic

COM - Component Object ModelCOM - Component Object Model Service accessibilityService accessibility Visual Basic, C++, JavaVisual Basic, C++, Java™™, Cobol, Pascal, Cobol, Pascal Used from Active Server PagesUsed from Active Server Pages

COM components provide:COM components provide: Encapsulation of internal detailsEncapsulation of internal details Modularity for code reuseModularity for code reuse Intellectual Property SecurityIntellectual Property Security

N Tier Intranet - N Tier Intranet - ScalabilityScalability

Application ServerFarm

Web Server

Mainframe Legacy Application Corporate Data Stores

ActiveServerApplication

Distributed COM

Distributed Components

Users (running web browser)

HTTP

N Tier ArchitectureN Tier Architecture

PresentationPresentation Business logicBusiness logic Data servicesData services

WebWebBrowserBrowser

OthersOthers

Inte

rnet

Info

rmat

ion

Inte

rnet

Info

rmat

ion

Serv

er \

LDA

P Se

rver

Serv

er \

LDA

P Se

rver

MTSMTS

DCOMDCOM

SQL ServerSQL Server

DirectoryDirectory

MicrosoftMicrosoftExchangeExchange

MSMQMSMQ

Compo

nent

s

Compo

nent

sHTTPHTTP

LDAPLDAP

IISIIS

Architecture Of A Architecture Of A Commerce SiteCommerce Site

Commerce Server Supplied Commerce Server Supplied ComponentsComponentsHTMLHTML .ASP.ASP DataData

SQL, SQL, Oracle, Oracle, (ODBC (ODBC complicompli

ant)ant)<br> Tha<br> Tha<A> Cop<A> Cop

{….{….</% Server</% Server

…….}.}

Commerce Server ComponentsCommerce Server Components

.ASP.ASP

Get Access through ODBC DSNGet Access through ODBC DSN

Select Appropriate Data with SQL QuerySelect Appropriate Data with SQL Query

Step through the data and display on your pageStep through the data and display on your page

Commerce: Accessing Commerce: Accessing The DataThe Data

Data is accessed using ADO and any ODBC Data is accessed using ADO and any ODBC compliant database can be easily usedcompliant database can be easily used

MiddlewareMiddleware Conversion layer, sits between client and Conversion layer, sits between client and

database database Database transparencyDatabase transparency - middleware translates - middleware translates

DB using OLE DB (API)DB using OLE DB (API) Data access logic (ADO, OLE DB)Data access logic (ADO, OLE DB)

application written independent of source of database application written independent of source of database integrate data from incompatible sourcesintegrate data from incompatible sources Allows multi-vendor solutionsAllows multi-vendor solutions

Benefits of Benefits of Client-Server ArchitecturesClient-Server Architectures

ScalabilityScalability ManageableManageable Cost Effective - PC hardware is more than Cost Effective - PC hardware is more than

1000 times cheaper than mainframe 1000 times cheaper than mainframe hardware for the same computing power.hardware for the same computing power.

Complexity – easy on user, tough on ITComplexity – easy on user, tough on IT

IntranetsIntranets In-house web site not accessible by publicIn-house web site not accessible by public Gives benefits of three tier modelGives benefits of three tier model

Low bandwidth requirementsLow bandwidth requirements Thin clientThin client Lower management cost /deployment costLower management cost /deployment cost ScalabilityScalability

Reduces complexity - cross platform Reduces complexity - cross platform interoperability, standard interfaceinteroperability, standard interface

Emerging tools and standards – HTML not Emerging tools and standards – HTML not suited to applications, DHTML, XML, suited to applications, DHTML, XML, BiztalkBiztalk

Elements of the IntranetElements of the Intranet Client - Browser – Client - Browser –

navigation, interpretation of HTML from navigation, interpretation of HTML from server, light processingserver, light processing

dynamic HTML - does processing on client Web dynamic HTML - does processing on client Web pages function more like regular software, pages function more like regular software, better control of interfacebetter control of interface

Server - Server - serves up HTML to client via HTTP, lower serves up HTML to client via HTTP, lower

bandwidth needed between server and client bandwidth needed between server and client Active Server Pages (.asp), script language Active Server Pages (.asp), script language

embedded in HTML pages that generates embedded in HTML pages that generates HTML output from remote procedure call on HTML output from remote procedure call on serverserver

Introduction to the Web

Documents

Transcript of Introduction to the Web