159.339
Quick
Tour
of
the
Web
LECTURE
Technologies:
The BIG picture
A bird’s eye view of the different
web technologies that we shall
explore and study.
Client-Server
Client
Web
browser
159.339
requests an Internet
resource by
specifying a URL and
providing input via HTTP
encoded strings
OS
•Usually we want to open an HTML file from some
website, but we can also open a program alternatively.
HTML supports Javascript, DOM, CSS, HTML Events
Client-Server
Client
Web
browser
159.339
requests an Internet
resource by
specifying a URL and
providing input via HTTP
encoded strings
Server
os
Web
server
os
Internet
Network Core
Client-Server
Client
Web
browser
159.339
Server-side program
works out the necessary
business logic and
dynamically builds an
HTML response.
Server
os
Web
server
os
Internet
Client-Server
Client
Web
browser
159.339
Server-side program
sends back output as
HTML using HTTP as
transport mechanism
Server
Web
server
Internet
Client-Server
Client
Web
browser
159.339
Client-side program (Internet Explorer,
Firefox) displays the HTML output
• HTML text
• Graphics
• Streaming video/audio
• XML
Server
Web
server
Internet
Our own webserver
159.339
•Our codes might be embedded into an HTML, or viceversa. It may generate an HTML on its own as well.
Server
Web
server
My codes
HTML
MySQL
Client
Operating System
Web
browser
Internet
PHP
Xitami Webserver
• free, fast and open source professional web server, written in
ANSI C
• Server supports HTTP/1.0, FTP, CGI/1.1, SSI protocols
• Security: basic authentication per directory, FTP access rights per
user and per directory
• Deployment: installs ready-to-run, portable to Windows, OS/2,
Unix, OpenVMS, fully portable web sites and web applications;
• Performance: internal multithreading engine, fast even on slower
systems
• Configuration: editable config files, or through a web-based
administration interface (WBA)
Documentation: http://legacy.imatix.com/html/xitami/
159.339
159.339
Simple CGI Demonstration
Let’s have a look at a very simple program (CGI) running in the server side
CGI - The executable file generated out of a C program.
Step 1. Run your webserver.
Step 2. Using a browser, request for the HTML file
containing our program from the server.
Warning! You should specify the port number used by your
webserver!
HTTP Protocol
159.339
HTTP and TCP/IP
159.339
• Webserver supports HTTP.
• HTTP compliancy is implemented
using TCP/IP components.
Server
Web
server
My codes
HTTP
HTML
MySQL
Client
Operating System
Web
browser
TCP/IP
Internet
PHP
Network Core
159.339
What’s in the network core?
Server
Web
server
My codes
HTTP
HTML
MySQL
Client
Operating System
Web
browser
TCP/IP
Internet
PHP
Validating HTML
Client
Web
browser
159.339
How to validate your HTML and CSS files?
We want to write HTML pages + CSS files
that are interoperable across many
platforms (OS + web browser combination)
Server
Web
server
http://www.w3.org/QA/Tools/
Editor
What editor can we use to assist us in writing PHP,
Javascript, HTML, CSS files, etc.?
phpDesigner Personal Edition
• a free editor for your web-development.
• rapid fast and full-featured PHP editor and PHP IDE with
built-in HTML, CSS and JavaScript editors and FTP/SFTP!
Link: http://www.mpsoftware.dk/
159.339
PuTTY
159.339
Using a simple tool called PuTTY, examine the HTTP protocol in action
when a web client interacts with your webserver (Xitami, running in your
own machine).
PuTTY is a free implementation of Telnet and SSH for Windows and Unix
platforms, along with an xterm terminal emulator. It is written and
maintained primarily by Simon Tatham.
What is the IP address of your machine? Ipconfig /all
Is your server running properly? What was the server’s response?
Which port number is open? netstat -anop TCP
http://surf11.com/entry/176/command-to-show-open-tcp-ports-windows
What’s next?
159.339
We shall be looking at all the details of prominent
internet programming languages and technology but we
shall study how to write HTML and CSS documents
first.
Next meeting, I shall provide a good background on the
nuts and bolts of the internet so that you may have
knowledge of the essential protocols that will be
interacting with our web server.
Servlets
159.339
CLIENT
Servlets run inside a Web Container - the component of the web server
that runs and interacts with servlets
Servlets
159.339
HTML, WML, XML
CLIENT
Servlets run inside a Web Container - the component of the web server
that runs and interacts with servlets
Servlet is running on the server listening for requests
When a request comes in, a new thread is generated by the web
container.
NetBeans
•Servlets go into a specific directory structure.
•NetBeans will create that for you.
• Compile, load, deploy your servlets.
Link: http://netbeans.org/downloads/
159.339
JSP
159.339
JSP encourages you to:
– Separate the (Java) code that creates the content
from the (HTML) code that presents it
– Have different members of your team work on the HTML layout and do
the Java programming
JSP vs. Competing tech.159.339
• JSP vs PHP
– Much richer language for the dynamic part
– Better tool support
– More resource efficient
• JSP vs pure servlets
– More convenient to create HTML
– Can use standard tools
– Divide and conquer
• JSP vs client-side Javascript
– You control the server, not the client
• JSP vs .NET
– Open standards: Portable to multiple servers and operating systems
• JSP vs static HTML
– Obvious!