Web Designs & Languages CSC1720 – Introduction to Internet Essential Materials.

Web Designs & Web Designs & LanguagesLanguages

CSC1720 – Introduction to InternetCSC1720 – Introduction to Internet

Essential MaterialsEssential Materials

CSC1720 – Introduction to CSC1720 – Introduction to InternetInternet

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

22

OutlineOutline

WWW and InternetWWW and Internet Web Server and Web ClientsWeb Server and Web Clients How does the WWW work?How does the WWW work? Who defines the Web standards?Who defines the Web 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

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 computers stored on the networked computers over the world.over the world.

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



44

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.



55

Internet TerminologyInternet Terminology

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

services from another computer on the services from another computer on the network.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.



66

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



77

Lynx – UNIX basedLynx – UNIX based

Text Text mode mode browserbrowser, fast!, fast!



88

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



99

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



1010

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



1111

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, ……



1212

Web connectionWeb connection



1313

Web Server - ExampleWeb Server - Example

The URL Where you place your web site



1414

Web Server StatisticsWeb Server Statistics

Apache vs. MS6 : 3



1515

Which server is Which server is running?running?

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



1616

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 web The computer reading the pages is called web clients with specific web browser.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 The web server waits for the request from the web clients over the Internet.web clients over the Internet.– Internet Information Server (IIS) or Apache.Internet Information Server (IIS) or Apache.



1717

The HTTP The HTTP Request/Response Request/Response ModelModel

Client Server

Request

Response

HTML Codes<html>

…</html>

Program / Scripts



1818

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>



1919

HTTPHTTP

HTTP (HTTP (HHyperyperttext ext TTransfer ransfer PProtocol)rotocol)– protocol used to access data on the protocol used to access data on the

WWW.WWW.– uses one TCP connection on well-uses one TCP connection on well-

known port 80.known port 80.– two types of http messages: two types of http messages: RequestRequest, ,

ResponseResponse– transfer data in the form of plain text, transfer data in the form of plain text,

hypertext, audio, video, and so on.hypertext, audio, video, and so on.



2020

HTTPHTTP

DEMO!



2121

Example – Example – Request/ResponseRequest/Response



2222

Top-Level DomainsTop-Level Domains

Country codedomain

Genericdomain



2323

IP Address SpaceIP Address Space



2424

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

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

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



2525

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 all To make the Web accessible to all by promoting technologies that take into account the by promoting technologies that take into account the vast differences in culture, languages, education, vast differences in culture, languages, education, ability, material resources, and physical limitations of ability, material resources, and physical limitations of users on all continents; users on all continents;

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

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



2626

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?



2727

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,

……



2828

SGML, HTML and XMLSGML, HTML and XML

MetaLanguage

Language

Usage of theLanguage

SGML XML

HTML

Web pages

XHTML

simplifies

defines

XMLDefinitions

XMLDocuments

MetaData

Data



2929

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 and Use to describe the general form and layout of documents to be displayed layout of documents to be displayed by the browser.by the browser.

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



3030

HTML Element / TagHTML Element / Tag

<<pp alignalign==“right”“right”> </p>> </p>

Element Attribute Name Attribute Value

You have to understand the You have to understand the important terms related to HTML.important terms related to HTML.

Not case-sensitive.Not case-sensitive.



3131

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 pages Allows the text portions of web pages

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

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



3232

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 to information so as to allow information to be stored and interchanged among any be stored and interchanged among any Internet-connected devices.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.



3333

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



3434

XML TransformationXML TransformationSame XML DocumentSame XML Document

XML Document

StyleSheet 1 (XSL) StyleSheet 2 (XSL)XSLTransformation

HTML WML



3535

XML ExampleXML Example

Reference:Reference:– HK Weather HK Weather

ForecastForecast



3636

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>



3737

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.



3838

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



3939

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)



4040

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.



4141

Using Stylesheets to Using Stylesheets to add presentationadd presentation

HTML Page

CSS stylesheet

Web browser Displayed page



4242

CSS ExampleCSS Example



4343

CSS Example:CSS Example:Skin an Input Form?Skin an Input Form?



4444

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 traffic.Reduces the load on a server, reduces network 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.



4545

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

Client-SideClient-Side Server-SideServer-Side

HTML, XMLHTML, XML

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



4646

JavaScriptJavaScript

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

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.



4747

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



4848

DHTMLDHTML

It is used to describe a set of animated It is used to describe a set of animated web documents that built from web documents that built 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.



4949

DHTML ExamplesDHTML Examples

Reference: Reference: Dynamic DuoDynamic Duo



5050

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 the animation and 3D modeling on the Internet.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”.



5151

VRML ExampleVRML Example

Reference:Reference:– MolScriptMolScript



5252

Break Time – 10 Break Time – 10 minutesminutes



5353

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 by call the script and then execute by the server.the server.

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



5454

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.



5555

Using ScriptsUsing Scripts

HTML Page

CSS stylesheet

Web browser Displayed page

Database

File stored

scripts



5656

VBScriptVBScript

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

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



5757

ASPASP

Active Server Page was developed by Active Server Page was developed by Microsoft and it is a popular technology Microsoft and it is a popular technology for developing dynamic web sites.for developing dynamic 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) components In complex code, COM (ActiveX) components

are used.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



5858

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



5959

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//



6060

PHP PopularityPHP Popularity

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



6161

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



6262

ColdFusion ExampleColdFusion Example*.cfm*.cfm



6363

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.



6464

Java 2, Standard Java 2, Standard EditionEdition

Source: java.sun.com



6565

Java 2 PlatformsJava 2 Platforms



6666

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 data The web page is based on the data

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

Powerful and Portable.Powerful and Portable.



6767

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.



6868

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.



6969

Servlet ExampleServlet Example



7070

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. For developing dynamic web content was CGI. For every request, the web server creates a 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 web JSP provides a development model for the web authors to experience all the server-side authors to experience all the server-side technologies.technologies.



7171

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



7272

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>



7373

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



7474

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, such A JSP 1.1-enabled web server, such as Apache Tomcatas Apache Tomcat



7575

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



7676

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>



7777

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



7878

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…



7979

Service-Oriented Service-Oriented ArchitectureArchitecture

Requestor Registry

Provider

Find - UDDI

Publish - UDDIBind –WSDL, SOAP



8080

ReferencesReferences

Internet and World Wide Web How to Internet and World Wide Web How to Program – Deitel, Deitel and NietoProgram – Deitel, Deitel and Nieto

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

Web Designs & Languages CSC1720 – Introduction to Internet Essential Materials.

Documents

Transcript of Web Designs & Languages CSC1720 – Introduction to Internet Essential Materials.