Internet Fundamentals INE2720 Web Application Software Development Essential Materials

Internet FundamentalsInternet Fundamentals

INE2720INE2720

Web Application Software Web Application Software DevelopmentDevelopment

Essential MaterialsEssential Materials

INE2720 – Web Application Software INE2720 – Web Application Software DevelopmentDevelopment

All copyrights reserved by C.C. Cheung All copyrights reserved by C.C. Cheung 2003.2003.

22

OutlineOutline

History & Internet TechnologiesHistory & Internet Technologies– Internet Hardware, Various technical termsInternet Hardware, Various technical terms

Network ProtocolsNetwork Protocols– TCP/IP, DNSTCP/IP, DNS

Who manages the Internet?Who manages the Internet? Who defines the Internet Standards?Who defines the Internet Standards? Web Programming LanguagesWeb Programming Languages

– Markup LanguagesMarkup Languages HTML, WML, XML, XHTMLHTML, WML, XML, XHTML

– Client-side & Server-side ScriptingClient-side & Server-side Scripting JavaScript, VBScript, Java Servlets, ASP, JSPJavaScript, VBScript, Java Servlets, ASP, JSP



33

IntroductionIntroduction

This is an introductory course to the This is an introductory course to the latest technologies for creating and latest technologies for creating and processing the Web content.processing the Web content.

Enough examples will be provided to Enough examples will be provided to you to clarify the principle concepts.you to clarify the principle concepts.

You are advised to get more You are advised to get more information from the bookstore, the information from the bookstore, the library and the online materials.library and the online materials.



44

Internet HistoryInternet History

The first node of The first node of ARPAnetARPAnet was was established at UCLA in 1969.established at UCLA in 1969.

In the late 1970s and 1980s, many In the late 1970s and 1980s, many networks were developed (BITNET, networks were developed (BITNET, CSNET, NSFnet) locally.CSNET, NSFnet) locally.

Internet is a huge collection of Internet is a huge collection of computers connected in a computers connected in a communications network.communications network.

The Internet cannot continue to grow The Internet cannot continue to grow indefinitely. So… when will it stop?indefinitely. So… when will it stop?



55

Estimation of Estimation of Computers connected Computers connected to the Internetto the Internet

YearYear Number of Computers on the Number of Computers on the InternetInternet

19831983 562562

19841984 1,0241,024

19901990 290,000290,000

19911991 500,000500,000

19951995 4,852,0004,852,000

19961996 9,472,0009,472,000

19991999 43,230,00043,230,000

20002000 73,000,00073,000,000

20012001 ……



66

Network ProtocolsNetwork Protocols

It is a special set of rules that end points It is a special set of rules that end points in a telecommunication connection use in a telecommunication connection use when they communicate.when they communicate.

Transmission Control Protocol (TCP)Transmission Control Protocol (TCP) – To – To exchange messages with other Internet exchange messages with other Internet points at the information packet level.points at the information packet level.

Internet Protocol (IP)Internet Protocol (IP) – To send and – To send and receive messages at the Internet Address receive messages at the Internet Address level.level.

Hypertext Transfer Protocol (HTTP)Hypertext Transfer Protocol (HTTP) – To – To deliver HTML, sound, audio files on the deliver HTML, sound, audio files on the World Wide Web.World Wide Web.



77

Internet Protocol Internet Protocol AddressAddress The Internet devices are identified The Internet devices are identified

byby– Names for peopleNames for people– Numeric addresses for computersNumeric addresses for computers

The IP address is a unique 32-bit The IP address is a unique 32-bit numbernumber– Divided into 4 parts (1 byte each)Divided into 4 parts (1 byte each)– 191.57.126.0191.57.126.0

Next generation : IPv6 – 128-bitNext generation : IPv6 – 128-bit



88

Domain Name & DNSDomain Name & DNS

People have difficulty dealing with and People have difficulty dealing with and remembering numbers, machines on remembering numbers, machines on the Internet also have textual names.the Internet also have textual names.– www.cuhk.edu.hkwww.cuhk.edu.hk– It is the machine providing web services on It is the machine providing web services on

the CUHK domain.the CUHK domain. There are name servers on the Internet There are name servers on the Internet

that provide that provide Domain Name ServicesDomain Name Services (DNS).(DNS).– ns.cuhk.edu.hk, 137.189.6.6ns.cuhk.edu.hk, 137.189.6.6– It replies the name or IP address of any It replies the name or IP address of any

machine in the CUHK domain.machine in the CUHK domain.



99

The World Wide WebThe World Wide Web

Affectionately called “Affectionately called “The WebThe Web”” It is a collection of information It is a collection of information

stored on the networked stored on the networked computers over the world.computers over the world.

The WWW was proposed in 1989 The WWW was proposed in 1989 by Tim Berners-Lee at CERN.by Tim Berners-Lee at CERN.



1010

How does the Web How does the Web work?work? The web information is stored in the Web The web information is stored in the Web

pages.pages.– In HTML format.In HTML format.

The web pages are stored in the computers The web pages are stored in the computers called Web servers.called Web servers.– In the Web server file system.In the Web server file system.

The computer reading the pages is called The computer reading the pages is called web clients with specific web browser.web clients with specific web browser.– Most commonly Internet Explorer or Netscape.Most commonly Internet Explorer or Netscape.

The web server waits for the request from The web server waits for the request from the web clients over the Internet.the web clients over the Internet.– Internet Information Server (IIS) or Apache.Internet Information Server (IIS) or Apache.



1111

Web or Internet?Web or Internet?

They are not the same things.They are not the same things. The Internet is a collection of computers or The Internet is a collection of computers or

networking devices connected together.networking devices connected together.– They have communication between each other.They have communication between each other.– Decentralized design that there is no Decentralized design that there is no

centralized body controls how the Internet centralized body controls how the Internet functions.functions.

The Web is a collection of documents that The Web is a collection of documents that are interconnected by hyper-links.are interconnected by hyper-links.– These documents are accessed by web These documents are accessed by web

browsers and provided by web servers.browsers and provided by web servers.



1212

Internet TerminologyInternet Terminology

ClientClient– Any computer on the network that requests Any computer on the network that requests

services from another computer on the network.services from another computer on the network. ServerServer

– Any computer that receives requests from client Any computer that receives requests from client computers, processes and sends the output.computers, processes and sends the output.

Web PageWeb Page– Any page that is hosted on the Internet.Any page that is hosted on the Internet.

Web DevelopmentWeb Development– The process of creating, modifying web pages.The process of creating, modifying web pages.



1313

Web Browser (Web Web Browser (Web Client)Client) It is a program that retrieves It is a program that retrieves

information from the Web.information from the Web.– Microsoft Internet ExplorerMicrosoft Internet Explorer

Most commonly used browsersMost commonly used browsers

– Netscape, MosaicNetscape, Mosaic Many different computing platformsMany different computing platforms

– OperaOpera The fastest browser on EarthThe fastest browser on Earth

– LynxLynx Text based web clientText based web client



1414

Lynx – UNIX basedLynx – UNIX based

Text Text mode mode browsebrowser, fast!r, fast!



1515

Some StatisticsSome Statistics

Until July 02Until July 02– Internet Explorer 6.x Internet Explorer 6.x 39%39%– Internet Explorer 5.xInternet Explorer 5.x 51%51%– Internet Explorer 4.xInternet Explorer 4.x 2%2%– Netscape Netscape 3%3%– OthersOthers 1%1%

– Win98/MEWin98/ME 64%64% , Win 95, Win 95 4%4%– WinNTWinNT 5%5% , Win2000, Win2000 20%20%– MACMAC 1%1% , www.thecounter.com, www.thecounter.com



1616

Internet ExplorerInternet Explorer

Version 1.0 Version 1.0 - August 1995- August 1995 Version 2.0Version 2.0 - November 1995- November 1995 Version 3.0Version 3.0 - August 1996- August 1996 Version 4.0Version 4.0 - October 1997- October 1997

– Support CSS & DOM, but no XMLSupport CSS & DOM, but no XML Version 5.0Version 5.0 - March 1999- March 1999 Version 5.5Version 5.5 - July 2000- July 2000 Version 6.0Version 6.0 - August 2001- August 2001

– The latest versionThe latest version



1717

Netscape NavigatorNetscape Navigator

Netscape 1.0Netscape 1.0 - December 1994- December 1994 Netscape 2.0Netscape 2.0 - March 1996- March 1996 Netscape 3.0Netscape 3.0 - August 1996- August 1996 Netscape 4.0Netscape 4.0

– The latest one is 4.79The latest one is 4.79 MozillaMozilla Netscape 5.0Netscape 5.0 - Skipped- Skipped Netscape 6.0Netscape 6.0 - November 2000- November 2000 Netscape 6.1Netscape 6.1 - August 2001- August 2001 Netscape 6.2Netscape 6.2 - November 2001- November 2001 Netscape 7.0Netscape 7.0



1818

Web ServerWeb Server

It is a program that waits for requests It is a program that waits for requests from the web browser.from the web browser.

It provides four major functionsIt provides four major functions– Serving web pagesServing web pages– Running gateway programs (CGI) and Running gateway programs (CGI) and

returning outputreturning output– Controlling access to the serverControlling access to the server– Monitoring and logging all accessMonitoring and logging all access

E.g. Apache, IIS, Netscape Web server, E.g. Apache, IIS, Netscape Web server, ……



1919

Web Server - ExampleWeb Server - Example

The URL Where you place your web site



2020

Web Server StatisticsWeb Server Statistics

Apache vs. MS6 : 3



2121

Which server is Which server is running?running?

Examine Examine www.cuhk.edu.hwww.cuhk.edu.hkk from from netcraftnetcraft



2222

The HTTP The HTTP Request/Response Request/Response ModelModel

Client Server

Request

Response

HTML Codes<html>

…</html>

Program / Scripts



2323

HTTPHTTP

DEMO!



2424

Valid HTTP Valid HTTP Request/Response Request/Response mesgsmesgs Provides additional information Provides additional information

GET /index.html HTTP/1.0

Host: www.anyhost.com

User-Agent : Mozilla/4.5 [en] (WinNT; I)

Accept : image/gif, image/jpeg, */*

Accept-language : en

Accept-charset : iso-8859-1, *, utf-8

HTTP/1.0 200 OK

Last-Modified: Mon, 20 Dec 1999 …

Date: Tue, 11 Jan 2002 …

Status: 200

Content-Type: text/html

Servlet-Engine: Tomcat Web Server

Content-Length: 59

<html>

…

</html>



2525

Example – Example – Request/ResponseRequest/Response



2626

Universal Resource Universal Resource Locators (URL)Locators (URL) It is also called “Uniform Resource It is also called “Uniform Resource

Locators” which is used to identify Locators” which is used to identify resources on the Internet.resources on the Internet.

It has the following general format:It has the following general format:– SchemeScheme::object-addressobject-address– SchemesSchemes can be can be

http, ftp, gopher, telnet, file, mailto, newshttp, ftp, gopher, telnet, file, mailto, news

– Object-addressObject-address //fully-qualified-domain-name/document-path//fully-qualified-domain-name/document-path

– E.g. http://www.cse.cuhk.edu.hk/index.htmlE.g. http://www.cse.cuhk.edu.hk/index.html



2727

Who manages the Who manages the Internet?Internet? There is no such a central authority manages There is no such a central authority manages

the whole Internet.the whole Internet. WhoWho controls IP addresses? controls IP addresses? WhoWho assigns domain names? assigns domain names? Who Who handles the domain name resolution?handles the domain name resolution? The Internet is managed in a hierarchical The Internet is managed in a hierarchical

fashion with several organizations on the top.fashion with several organizations on the top.– Internet Assigned Numbers Authority (IANA)Internet Assigned Numbers Authority (IANA)– Regional Internet Registry for Europe (RIPE)Regional Internet Registry for Europe (RIPE)– Asian Pacific Network Information Center (APNIC)Asian Pacific Network Information Center (APNIC)– American Registry for Internet Numbers (ARIN)American Registry for Internet Numbers (ARIN)



2828

Top-Level DomainsTop-Level Domains

Country codedomain

Genericdomain



2929

IP Address SpaceIP Address Space



3030

Who defines the Web Who defines the Web standards?standards? The Web standards are not The Web standards are not

defined or setup by the browser defined or setup by the browser companies or Microsoft, but the companies or Microsoft, but the World Wide Web Consortium World Wide Web Consortium ((W3CW3C).).

The specifications form the Web The specifications form the Web standards.standards.– HTML, CSS, XML, XHTML, …HTML, CSS, XML, XHTML, …



3131

W3CW3C

Quoted from Quoted from W3CW3C– W3C's long term goals for the Web are:W3C's long term goals for the Web are:

1.1. Universal AccessUniversal Access:: To make the Web accessible to To make the Web accessible to all by promoting technologies that take into all by promoting technologies that take into account the vast differences in culture, languages, account the vast differences in culture, languages, education, ability, material resources, and physical education, ability, material resources, and physical limitations of users on all continents; limitations of users on all continents;

2.2. Semantic WebSemantic Web : : To develop a software To develop a software environment that permits each user to make the environment that permits each user to make the best use of the resources available on the Web; best use of the resources available on the Web;

3.3. Web of TrustWeb of Trust : : To guide the Web's development To guide the Web's development with careful consideration for the novel legal, with careful consideration for the novel legal, commercial, and social issues raised by this commercial, and social issues raised by this technology. technology.



3232

Break Time – 10 Break Time – 10 minutesminutes



3333

Web Programming Web Programming LanguagesLanguages The Web is no longer just presenting The Web is no longer just presenting

information on a computer screen.information on a computer screen.– Many commercial sites include some Many commercial sites include some

methods of getting information from a methods of getting information from a browser to web servers.browser to web servers.

How do you program your web site such that it How do you program your web site such that it can interact with people?can interact with people?

– With XML, data from spreadsheets, reports With XML, data from spreadsheets, reports or other applications can be easily displayed or other applications can be easily displayed on the Web.on the Web.

Can we learn XML without the understanding of Can we learn XML without the understanding of HTML and other Web language?HTML and other Web language?



3434

The History of MarkupThe History of Markup

In the early 1970sIn the early 1970s– GML (the Generalized Markup Language)GML (the Generalized Markup Language)– ““:h1.The Content is placed here:h1.The Content is placed here””

Since the 1980sSince the 1980s– SGML (the Standard GML)SGML (the Standard GML)– HTMLHTML

CurrentlyCurrently– XMLXML

Not intended to replace HTML!Not intended to replace HTML! XHTML does by providing better data description, XHTML does by providing better data description,

……



3535

SGML, HTML and XMLSGML, HTML and XML

MetaLanguage

Language

Usage of theLanguage

SGML XML

HTML

Web pages

XHTML

simplifies

defines

XMLDefinitions

XMLDocuments

MetaData

Data



3636

HTMLHTML

HHyperyperTText ext MMarkup arkup LLanguageanguage It is not a programming language.It is not a programming language.

– Cannot be used to describe Cannot be used to describe computations.computations.

– Use to describe the general form Use to describe the general form and layout of documents to be and layout of documents to be displayed by the browser.displayed by the browser.

Compose of “Content” and Compose of “Content” and “Controls”“Controls”



3737

WMLWML

WWireless ireless MMarkup arkup LLanguageanguage– Formerly called HDML (Handheld Formerly called HDML (Handheld

Devices Markup Languages)Devices Markup Languages)– Allows the text portions of web Allows the text portions of web

pages to be displayed on cell phones pages to be displayed on cell phones or PDAs via wireless media.or PDAs via wireless media.

– It is part of the Wireless Application It is part of the Wireless Application Protocol (WAP).Protocol (WAP).



3838

XMLXML

eeXXtensible tensible MMarkup arkup LLanguage (XML)anguage (XML) It provides a standard way to represent It provides a standard way to represent

information so as to allow information information so as to allow information to be stored and interchanged among to be stored and interchanged among any Internet-connected devices.any Internet-connected devices.– It is not a markup language.It is not a markup language.– It is a meta-markup language that specifies It is a meta-markup language that specifies

rules for creating markup languages.rules for creating markup languages.– Browsers use XML parsers to isolate and Browsers use XML parsers to isolate and

extract the information from XML extract the information from XML documents.documents.



3939

Examples of XML-Examples of XML-based languagesbased languages

AcronyAcronymm

NameName DescriptionDescription

CDFCDF Channel Definition FormatChannel Definition Format One of the first real-world applications of XML, One of the first real-world applications of XML, permits automatic delivery of updated web permits automatic delivery of updated web information (Microsoft)information (Microsoft)

CMLCML Chemical Markup LanguageChemical Markup Language Conversion of current files into structured Conversion of current files into structured documents (chemical publications)documents (chemical publications)

ETD-ETD-MLML

Electronic Thesis & Dissertation Electronic Thesis & Dissertation MLML

Converts theses from MS-Word into XMLConverts theses from MS-Word into XML

FlowMFlowMLL

A format for storing audio synthesis diagrams for A format for storing audio synthesis diagrams for synthesizerssynthesizers

ITMLITML Information Technology MLInformation Technology ML A set of specifications for protocols, message A set of specifications for protocols, message formatsformats

MathMMathMLL

Mathematical MLMathematical ML Describes mathematical notationsDescribes mathematical notations

VXMLVXML Voice XMLVoice XML Allows interaction with the Internet thru voice-Allows interaction with the Internet thru voice-recognition technologyrecognition technology

XHTMLXHTML Extensible HTMLExtensible HTML HTML 4.0.1 is written as an XML applicationHTML 4.0.1 is written as an XML application

XSLXSL Extensible Stylesheet LanguageExtensible Stylesheet Language The style standard for XML, specifies the The style standard for XML, specifies the presentation and appearance of an XML documentpresentation and appearance of an XML document

XSLTXSLT XSL Transformation LanguageXSL Transformation Language Uses to transform XML documents into another XML Uses to transform XML documents into another XML filesfiles



4040

XML TransformationXML TransformationSame XML DocumentSame XML Document

XML Document

StyleSheet 1 (XSL) StyleSheet 2 (XSL)XSLTransformation

HTML WML



4141

XML ExampleXML Example

Reference:Reference:– HK Weather HK Weather

ForecastForecast



4242

MathML ExampleMathML Example

E = mcE = mc22

MathML Presentation Markup Example

<mrow>

<mi>E</mi><mo>=</mo><mi>m</mi>

<msup>

<mi>c</mi>

<mn>2</mn>

</msup>

</mrow>



4343

CML ExampleCML Example

Reference:http://www.adobe.com/svg/demos/main.html



4444

XHTMLXHTML

The eThe eXXtensible tensible HHyperyperTText ext MMarkup arkup LLanguageanguage– A Reformulation of HTML 4 in XML 1.0A Reformulation of HTML 4 in XML 1.0– Consists all HTML 4.0.1 predefined Consists all HTML 4.0.1 predefined

components combined with XML standardscomponents combined with XML standards A way of making XML documents that A way of making XML documents that

look and act like HTML documents.look and act like HTML documents. Using XHTML helps you strengthen the Using XHTML helps you strengthen the

structure and syntax of your markup.structure and syntax of your markup.



4545

HTML – OK, XHTML - !HTML – OK, XHTML - !OKOK<HTML><HTML><HEAD><HEAD><TITLE>My Title</TITLE><TITLE>My Title</TITLE><body><body></HEAD></HEAD><td><td>It is an acceptable HTML, but It is an acceptable HTML, but an unacceptable XHTMLan unacceptable XHTML

</BODY></BODY>……<table WIDTH=80%> <table WIDTH=80%> Incorrect Incorrect<table width=“80%”> <table width=“80%”> Correct Correct

Test



4646

Evolution of the XHTML Evolution of the XHTML familyfamily

SGML (1986)

HTML 2.0 – 4.0.1(1990 – 1999)

XML Others

XHTML Basic(Dec 19, 2000)

Modularizationof XHTML

XHTML 1.0(Jan 26, 2000)

Others

XHTML 1.1(May 31, 2001)



4747

Cascading Style Sheets Cascading Style Sheets (CSS)(CSS)

Provides a powerful and flexible way to Provides a powerful and flexible way to control the details of web documents.control the details of web documents.

HTML is more concerned about the HTML is more concerned about the content, CSS is used to impose a content, CSS is used to impose a particular style on the document.particular style on the document.

Named cascading style sheets because Named cascading style sheets because they can be defined at three different they can be defined at three different levels to specify the style of a levels to specify the style of a document.document.– Inline, document level, external.Inline, document level, external.



4848

Using Stylesheets to Using Stylesheets to add presentationadd presentation

HTML Page

CSS stylesheet

Web browser Displayed page



4949

CSS ExampleCSS Example



5050

Client-SideClient-Side and and Server-Server-sideside Programming Programming Client-side codeClient-side code

– ECMAScriptECMAScript JavaScript, JScript – MicrosoftJavaScript, JScript – Microsoft

– VBScript – MicrosoftVBScript – Microsoft– Embedded in <script> elements and execute in the Embedded in <script> elements and execute in the

browser, provides immediate feedback to the user.browser, provides immediate feedback to the user.– Reduces the load on a server, reduces network Reduces the load on a server, reduces network

traffic.traffic. Server-side codeServer-side code

– Execute on the serverExecute on the server– CGI/Perl, ASP, PHP, ColdFusion, JSPCGI/Perl, ASP, PHP, ColdFusion, JSP– The code remains hidden from users, and browser The code remains hidden from users, and browser

independent.independent. Can be combined with good results.Can be combined with good results.



5151

Client-side & Server-Client-side & Server-sidesideTechnologiesTechnologies

Client-SideClient-Side Server-SideServer-Side

HTML, XML, XHTMLHTML, XML, XHTML

Cascading Style Sheets (CSS)Cascading Style Sheets (CSS)

Scripting languagesScripting languages

- JavaScript, VBScript- JavaScript, VBScript

Java AppletsJava Applets

ActiveX controlsActiveX controls

Plug-ins and Helpers Plug-ins and Helpers applicationapplication

CGI/PerlCGI/Perl

PHPPHP

ColdFusionColdFusion

Scripting LanguagesScripting Languages

- Server-side JavaScript- Server-side JavaScript

- ASP, JSP, Java Servlets- ASP, JSP, Java Servlets

ISAPI/NSAPI programsISAPI/NSAPI programs



5252

JavaScriptJavaScript

There is no relationship between There is no relationship between Java and JavaScript –Java and JavaScript – misleading misleading!!

They both contain “Objects”.They both contain “Objects”. It provides a computational It provides a computational

capability in web documents.capability in web documents. It is used in creating, accessing, It is used in creating, accessing,

modifying a document.modifying a document.



5353

What can JavaScript What can JavaScript do?do? Control document appearance and Control document appearance and

contentcontent Control the browserControl the browser Interact with the userInteract with the user Read and Write Client State with CookiesRead and Write Client State with Cookies

– my.yahoo.commy.yahoo.com Interact with AppletsInteract with Applets What it cannot do?What it cannot do?

– Read/write filesRead/write files– Protect your systemProtect your system



5454

DHTMLDHTML

It is used to describe a set of It is used to describe a set of animated web documents that built animated web documents that built from from HTMLHTML, , style sheetsstyle sheets and and scriptsscripts..

There are three main parts of DHTMLThere are three main parts of DHTML– PositioningPositioning– Style modificationsStyle modifications– Event handingEvent handing

It relies on the browser for the display It relies on the browser for the display and manipulation of the web pages.and manipulation of the web pages.



5555

DHTML ExamplesDHTML Examples

Reference: Reference: Dynamic DuoDynamic Duo



5656

VRMLVRML

VVirtual irtual RReality eality MModeling odeling LLanguage anguage (VRML) is a language for the (VRML) is a language for the animation and 3D modeling on animation and 3D modeling on the Internet.the Internet.

The user can connect the online The user can connect the online VRML website and move around VRML website and move around the “3D world”.the “3D world”.



5757

VRML ExampleVRML Example

Reference:Reference:– MolScriptMolScript



5858

Break Time – 10 Break Time – 10 minutesminutes



5959

Server Slide Include Server Slide Include (SSI)(SSI) Some pages end with the .shtml Some pages end with the .shtml

extension instead of the .html or .htmextension instead of the .html or .htm– The web server reads the document and The web server reads the document and

parses it for directives.parses it for directives.   

– Follows the instructions and creates an Follows the instructions and creates an enhanced document.enhanced document.

– The new document is sent to the client The new document is sent to the client browser.browser.



6060

CGI/PerlCGI/Perl

When the page is loaded by a When the page is loaded by a browser, the tag of the webpage browser, the tag of the webpage call the script and then execute call the script and then execute by the server.by the server.

It is different from the Java It is different from the Java applets or JavaScript which are applets or JavaScript which are executed by the client’s system.executed by the client’s system.



6161

CGI / PerlCGI / Perl

Common Gateway Interface (CGI) Common Gateway Interface (CGI) is a standard way in which a is a standard way in which a browser communicate to run a browser communicate to run a program on the server and return program on the server and return the output to the browser.the output to the browser.– It can be written in any programming It can be written in any programming

language (most common is Perl).language (most common is Perl).– It is a powerful string pattern-It is a powerful string pattern-

matching language.matching language.



6262

Using ScriptsUsing Scripts

HTML Page

CSS stylesheet

Web browser Displayed page

Database

File stored

scripts



6363

VBScriptVBScript

VBScript is the short form for VBScript is the short form for Visual Basic Scripting from Visual Basic Scripting from Microsoft.Microsoft.

Try to edit a file “hello.vbs”Try to edit a file “hello.vbs”– Msgbox “Hello world”Msgbox “Hello world”



6464

ASPASP

Active Server Page was developed by Active Server Page was developed by Microsoft and it is a popular Microsoft and it is a popular technology for developing dynamic technology for developing dynamic web sites.web sites.– It allows the author includes scripting code It allows the author includes scripting code

(VBScript or JScript) in regular web pages.(VBScript or JScript) in regular web pages.– In complex code, COM (ActiveX) In complex code, COM (ActiveX)

components are used.components are used.– Must run on an active server pages serverMust run on an active server pages server

IIS, Personal Web Server, …IIS, Personal Web Server, …

– The latest version is ASP.NETThe latest version is ASP.NET



6565

How to load an ASP How to load an ASP page?page?

Client Server

Request

Reply withHTML page

ASPServer

Component

Hands request to

Hands HTML page

TranslatesScriptInto

HTML



6666

PHPPHP

It is not an acronym for anything.It is not an acronym for anything.– An open source web scripting An open source web scripting

language.language.– A PHP page is always interpreted by A PHP page is always interpreted by

the server when it is requested.the server when it is requested.– The latest version is PHP 4.The latest version is PHP 4.– Have to learn an entirely new Have to learn an entirely new

language.language.– Reference: Reference: http://http://www.php.netwww.php.net//



6767

PHP PopularityPHP Popularity

http://php.weblogs.com/popularityhttp://php.weblogs.com/popularity



6868

PHP PHP ExampleExample

http://www.php-scripts.com/php_diary/example5.phps



6969

ColdFusionColdFusion

It is a Web application development environment produced by the It is a Web application development environment produced by the Macromedia Corporation.Macromedia Corporation.

Client Web Server

Request *.cfm

Reply Web Page

CF Page

Cold FusionApplication

Server

Web Page



7070

JAVA / Java appletJAVA / Java applet

It is used to solve the problem that It is used to solve the problem that HTML is not a programming language.HTML is not a programming language.– Instead of running a program on the web Instead of running a program on the web

server, a special kind of Java program server, a special kind of Java program (applet) is downloaded to the browser.(applet) is downloaded to the browser.

– JavaScript is less powerful than Java.JavaScript is less powerful than Java.– JavaScript code is physically part of an JavaScript code is physically part of an

HTML document, but applets are stored HTML document, but applets are stored separately from the HTML files.separately from the HTML files.



7171

Java 2, Standard Java 2, Standard EditionEdition

Source: java.sun.com



7272

Java 2 PlatformsJava 2 Platforms



7373

Java Application ModelJava Application Model

Source: java.sun.com



7474

What are Java What are Java Servlets?Servlets? An extremely popular Java An extremely popular Java

substitute for CGI scripts.substitute for CGI scripts. They are programs to be run on a They are programs to be run on a

web server.web server. The web page is based on the The web page is based on the

data submitted by the user.data submitted by the user. More efficient, easier to use, More efficient, easier to use,

Powerful and Portable.Powerful and Portable.



7575

Java ServletsJava Servlets

They are Java application programs They are Java application programs that are resident on the server and that are resident on the server and are alternatives to CGI programs.are alternatives to CGI programs.

Java Servlets allow you to buildJava Servlets allow you to build– Web page based on the user’s input Web page based on the user’s input

datadata– Web page that changes frequentlyWeb page that changes frequently

More efficient, easier to use, more More efficient, easier to use, more powerful and portable.powerful and portable.



7676

Servlets AdvantagesServlets Advantages

Platform and vendor independencePlatform and vendor independence– Supported by all the major web serversSupported by all the major web servers

IntegrationIntegration– Take advantages of all the Java technologies, Take advantages of all the Java technologies,

JDBC, Enterprise JavaBeans (EJB).JDBC, Enterprise JavaBeans (EJB). EfficiencyEfficiency

– A single process that runs until the servlet-A single process that runs until the servlet-based application is shut down.based application is shut down.

ScalabilityScalability – extremely scalable. – extremely scalable. Robustness and securityRobustness and security

– A strongly typed programming language.A strongly typed programming language.



7777

Servlet ExampleServlet Example



7878

What is JSP?What is JSP?

It is JavaServer Pages that built on top of Java It is JavaServer Pages that built on top of Java servlets in late 1999.servlets in late 1999.

In the early days of the Web, the only tool for In the early days of the Web, the only tool for developing dynamic web content was CGI. developing dynamic web content was CGI. For every request, the web server creates a For every request, the web server creates a process (not efficient).process (not efficient).

The Java Servlet API has introduced in 1997, The Java Servlet API has introduced in 1997, however, HTML code has to be embedded however, HTML code has to be embedded inside programs. (lot of “out.println()”)inside programs. (lot of “out.println()”)

JSP provides a development model for the JSP provides a development model for the web authors to experience all the server-side web authors to experience all the server-side technologies.technologies.



7979

Processing phase

Translation phase

JSP page translation JSP page translation and processing phasesand processing phases

Client Server

Request

Response

Hello.jsp

helloServlet.class

helloServlet.java

Read

Generate

Execute



8080

A simple exampleA simple exampleJava Servlet & JSPJava Servlet & JSP

import java.io.*;

import javax.servlet.*;

import javax.servlet.http.*;

public class HelloWorld extends HttpServlet {

public void doGet(HttpServletRequest req, HttpServletResponse res)

throws ServletException, IOException {

res.setContentType("text/html");

PrintWriter out = res.getWriter();

out.println("<HTML>");

out.println("<HEAD><TITLE>Hello World</TITLE></HEAD>");

out.println("<BODY>");

out.println("<BIG>Hello World</BIG>");

out.println("</BODY></HTML>");

}

}

<HTML><HEAD><TITLE>Hello</TITLE></HEAD>

<BODY><H1><% if (request.getParameter("name") == null){ out.println("Hello World");} else { out.println("Hello, " + request.getParameter("name"));}%></H1></BODY></HTML>



8181

Template PagesTemplate Pages

Server Page TemplateServer Page Template

<html><html>

<title><title>

A simple exampleA simple example

</title></title>

<body <body color=“#FFFFFF”>color=“#FFFFFF”>

The time now isThe time now is

<%= new java.util.Date() <%= new java.util.Date() %>%>

</body></body>

</html></html>

Resulting HTMLResulting HTML

<html><html>

<title><title>

A simple exampleA simple example

</title></title>

<body color=“#FFFFFF”><body color=“#FFFFFF”>

The time now isThe time now is

Tue Nov 5 16:15:11 PST Tue Nov 5 16:15:11 PST 20022002

</body></body>

</html></html>

translation



8282

What you need to get What you need to get started?started? A Personal Computer with an A Personal Computer with an

Internet connection, that allows Internet connection, that allows you to download the software you you to download the software you need.need.

A Java 2-compatible Java Software A Java 2-compatible Java Software Development Kit (Java 2 SDK)Development Kit (Java 2 SDK)

A JSP 1.1-enabled web server, A JSP 1.1-enabled web server, such as Apache Tomcatsuch as Apache Tomcat



8383

JSP vs. ASPJSP vs. ASP

JSP is platform and server independent.JSP is platform and server independent. ASP relies on Microsoft Platforms and Servers.ASP relies on Microsoft Platforms and Servers.

ASP TechnologyASP Technology JSP TechnologyJSP Technology

Web ServerWeb Server IIS or Personal Web IIS or Personal Web ServerServer

Any Web ServerAny Web Server

PlatformsPlatforms Microsoft WindowsMicrosoft Windows Most popular Most popular platformsplatforms

Reusable Reusable componentscomponents

NoNo JavaBeans, JSP tagsJavaBeans, JSP tags

Security Security against System against System

crashescrashes

NoNo YesYes

Scripting Scripting LanguageLanguage

VBScript, JscriptVBScript, Jscript JavaJava



8484

ASP & JSPASP & JSP

<html><head><title>Hello World by ASP</title></head><body><font size=12><%response.write “Hello INE2720 Students and the World!"%></font></body>

<html><head><title>Hello World by JSP</title></head><body><font size=12><%out.println("Hello INE2720 Students and the World!");%></font></body>



8585

JSP, ASP and PHPJSP, ASP and PHP

Reported Performance – PHPLIBReported Performance – PHPLIB– Test 1 – For LoopTest 1 – For Loop

JSP – Uses 4 seconds (20000*20000)JSP – Uses 4 seconds (20000*20000) ASP – Uses 63 seconds (2000*2000)ASP – Uses 63 seconds (2000*2000) PHP – Uses 84 seconds (2000*2000)PHP – Uses 84 seconds (2000*2000)

– Test 2 – Database connectivity (Oracle Test 2 – Database connectivity (Oracle 8)8) 1000 times Insert, Update, Select & Delete1000 times Insert, Update, Select & Delete

– JSP – 13 secondsJSP – 13 seconds– PHP – 69 secondsPHP – 69 seconds– ASP – 73 secondsASP – 73 seconds



8686

Web ServicesWeb Services

What are Web services?What are Web services?– They are a distributed computing They are a distributed computing

architecture.architecture. Who is using Web services now?Who is using Web services now?

– Industry technologiesIndustry technologies Which approach should we use Which approach should we use

- .NET or J2EE?- .NET or J2EE? RequestorRequestor, , RegistryRegistry, , ProviderProvider



8787

Critical Elements of a Critical Elements of a Basic Web Services Basic Web Services ArchitectureArchitecture

Format

Services

Network

XML (Format)

UDDI (Publish)

The Internet

WSDL (Find) SOAP (Bind)

For presenting data and information

A directory service

A protocol for applications to find a service

A protocol that enables applications to agree the communication

The Internet, using TCP/IP protocols…



8888

Service-Oriented Service-Oriented ArchitectureArchitecture

Requestor Registry

Provider

Find - UDDI

Publish - UDDIBind –WSDL, SOAP



8989

Developing Web Developing Web services using J2EE services using J2EE & .NET& .NET

Reference: Reference: TheServerSideTheServerSide



9090

ReferencesReferences

Programming the World Wide WebProgramming the World Wide Web Microsoft & Sun MicrosystemsMicrosoft & Sun Microsystems Online MaterialsOnline Materials

The End.The End. Thank you for patience!Thank you for patience!