DT228/3 Web Development WWW and Client server model

HTML Javascript Java applets JScript VBScript ASP JSP CSS DHTML SSIs CGI PHP A quick tour of common client and server web technologies Server Side Java script Cold Fusion XML WML

HTML – client side Hyper Text Mark up language Used for rendering documents via web browser such as IE or FoxFire. Interpreted by browser Client side Tag based Different browser may interpret tags differently e.g.

WML– client side Wireless markup language The WAP equivalent of HTML -  Supports WAP technology for mobile devices Client side Fewer tags than HTML Supports WML Scripts Used on less powerful client devices

JavaScript and Jscript – Can be used as Client side AND server side. A very simple scripting language for enriching the display and interactivity of web pages. Typical example is a button that changes color as you move your mouse over it. A more useful example is a menu that rolls out more details when you click a category; this is done without loading a whole new page, and even without connecting to the web server. JavaScript is Netscape's technology, but fully adopted by Microsoft. When JavaScript is used inside IE browser, it is called JScript. JavaScript is not related to Java, except that it somewhat resembles Java. It can be used within Active Server Pages* More info:

A Scripting language, similar to Javascript A lighter weight version of Microsoft’s Visual Basic. Developed by Microsoft, and does not work in Netscape. A simplified variant of Visual Basic. Used for client processing and also the default programming language within Active Server Pages More info: m?/scripting/vbscript m?/scripting/vbscript VBScript –client and server side

Instructions for the browser about how to display the page (font, layout, etc.). Using CSS, the author of the web page has full control over what the user sees, regardless of the browser settings, etc. In addition, CSS allows web designer to define complex formatting styles, and then use them with a short command, instead of specifying all the fonts, sizes, layout, etc., every time. More info: / / Cascading Style Sheets (CSS) – client side

Java applets are programs written in Java that are downloaded onto and run on a Web browser. Applets can provide functionality to the client machine such as enhanced presentation, graphics, validation. etc The main difference between an applet and a fully-blown Java application is that an applet is restricted in functionality for security reasons; for instance, it cannot freely access the client hard drive. When you go to a website, you do not know what applets are included in it, and who wrote them and why – hence the security restrictions applied to Java Applets. More info: Java Applets – client side

“Animated” HTML. E.g. button changes colour, graphic moves from one part of the screen to the other. Refers to the combination of HTML, CSS and JavaScript, and other web site enhancing software which together allow creating web pages that interact with the user. More info: DHTMl – Dynamic HTMl – Client side

CGI is the oldest server-side technology. It was available in very early browsers, and was supported by very early versions of HTML. It is still used today CGI is most often used for processing forms. Any programming language can be used (such as C/C++, Java or Perl). More later More info: Common Gateway Interface – CGI – Server side

#!/usr/local/bin/perl # # hello_s.pl-- simple "hello, world" program to demonstrate basic # # CGI output. # Print the CGI response header, required for all HTML output # Note the extra \n, to send the blank line print "Content-type: text/html\n\n" ; # Print the HTML response page to STDOUT print CGI Results Hello, world. EOF exit ; Common Gateway Interface – CGI – Server side

Microsoft’s leading server side technology for creating dynamic web pages. Works by default only with Microsoft web server software (but browser brand does not matter). Allows to execute scripting languages such as VBScript and JavaScript on the server. Better uniformity than client side processing (since the server is controlled by the website owner, while each browser is different) and offloads the processing from the user computer. Since ASP runs on the server, it also offers additional functionality not available with client-side scripting. For instance, an ASP page can connect to a database to get the information to be displayed. Pages that use ASP have extension.asp rather than.htm or.html. More info: Active Server Pages – ASP – server side

") response.write(Right(sometext,5)) %> Active Server Pages – ASP – server side

JSP is similar in function to ASP and CGI. It allows a web server to process user input or perform some other functions and return the results to the user's browser. JSP files have an extension of.jsp JSP is supported by all major web server software. More info: Java Server Pages – JSP – server side

Hello, User My name is Cindy. What's yours? Java Server Pages – JSP – server side

Hello, Java Server Pages – JSP – server side

Scripting language for use on the server. Free (developed by Linux enthusiasts). Supported by all web servers. Similar to ASP in functionality, but simpler and less powerful. More info: PHP – Server side

hhhh Hello World! "; ?> PHP – Server side

An instruction inside a web page for the web server. For instance, it may ask the server to include another web page inside the current one (typically, a navigation bar, or some other common header or footer). This saves a lot of time when this common element needs to be updated in hundreds of pages throughout the website Usually supplied free as part of web server functionality More info: Server Side Includes (SSI) - Server side

ColdFusion, from Allaire, provides a set of HTML-like tags which were initially targeted at embedding database queries into web pages, but it has since been extended to support a wide variety of data sources for dynamic content generation. The adoption of HTML-like tags has the advantage that there is a single, consistent style of syntax throughout the page; the ColdFusion tags are comfortable to web designers because they look just like the other tags present in the document. ColdFusion supports both UNIX and Microsoft Windows platforms. Cold Fusion – Server side

#variable# Cold Fusion – Server side

Used with Netscape servers Server-Side JavaScript uses JavaScript as its scripting language. Server-side JavaScript included in an HTML document is enclosed in a... tag pair. SSJS adds built-in features for database and support, session management, and interoperability with server-side Java classes using Netscape's LiveWire technology. File extension =.js Compiled language. Server Side JavaScript – Server side

XML (extensible mark-up language) – is a simple, very flexible mark-up language (like HTMl). It is used throughout the web to as the basis for new mark-up languages such as Wireless Mark- Up (WML) and the latest version of HTML (XHTML). XML by itself does not do anything – it is usually used for defining the structure of data. For example, providing information in a generic format that will be sent to a variety of channels – e.g. web site, and wireless devices Example: talbot street XML user defined tags

Client or server side? Some websites/web applications will only need client side technologies Many use both client and server

To determine whether client-side or server-side or both will be used for a web application, need to consider: Static web pages only? Validation of user input needed? Will the user be entering information/ searching? (I.e. likely to use database) Session tracking required? Client or server side? Client-side may be sufficient Client-side will reduce traffic back to server, server side will provide uniform response If database used, need server-side technologies Server-side needed

Volume of users (want to minimise traffic back to server)? Sensitivity of code? Power of client device (e.g. PDA)? Security limitations (e.g. users prevented from certain web pages) Client Browser support Client or server side? Use of Client-side reduces traffic back to server Client-side code will be visible to visitors Client side code runs on device -> restrictions? Server-side provides ability to add security A consideration when using client-side

Client vs server technologies? A website for a small retailer, displaying location, map and staff descriptions Online daily newspaper displaying relevant news items and articles. Users can enter their details to subscribe. A transport website enabling users to enquire upon train timetables, destinations, prices. Information changes monthly. A temporary website, providing details of a concert. All information is static.

Questions A web design team are developing a web application for the Olympics Games. The application will provide bulletin board information, maps, hotel information and updates on event timetables and results. Explain how client-side and server-side web technologies may be used to develop the application. Give examples of each technology.

Summary Client server model for Web Different between client-side and server-side technologies Limitation of Client-side technologies Common Client-side and Server-side technologies Choosing use of client versus server-side technologies