A web application is a program that runs on a computer with a web server, while its users interact with it via a web browser.
(Also see Wikipedia's definition.)
Gmail is a webapp. All users need is a web browser. They login, create and organize filters, read messages, reply, forward, send, and delete, and logout. Messages exist in a database on the server, as does all the code to generate pages.
With webapps, you do not have to package up software for distribution and installation on client computers. Updating the software is easier too, since you don't have to ship an update and hope users know how do install it. You just make the change on the server yourself, and users see the new version the next time they visit your site (though some browsers cache old pages a bit too aggressively).
The general pieces are something like:
GET /mypage.html HTTP/1.1CRLF
Host: www.blahblahblah.comCRLF
CRLF
HTTP/1.1 200 OKCRLF
Server: XXXCRLF
Date: XXXCRLF
Content-type: XXXCRLF
...CRLF
CRLF
<html>
...
...
</html>
Applications aren't useful if they just serve static pages; they have to respond to user input. The server has to construct the content of HTTP responses on the fly, in response to user input. Three approaches are CGI, Servlets, and Server Pages.
An ancient approach to dynamic content generation. The client specifies the name of the program to run on the server that will generate the content. Generally, this CGI program is run as a separate process outside the web server. Example:
POST /cgi-bin/register.pl HTTP/1.1CRLF
Content-type: application/x-www-form-urlencodedCRLF
Content-length: 34CRLF
CRLF
user=John+Doe&email=jdoe%40x%2ecom
(In this example the webserver accepts the request and the message body is passed to register.pl on standard input. The output of register.pl is picked up the server which sends it to the client.)
Another Example:
GET /cgi-bin/register.pl?user=John+Doe&email=jdoe%40x%2ecom HTTP/1.1CRLF
CRLF
(With GET, the server launches register.pl and passes the parameters either in the environment or as commandline arguments.)
A server extension (can be called a servlet, though this term is generally used for a specific Java component), is a piece of code that runs inside the web server process, so it should be much faster than CGI. Unlike CGI, servlets can
Example of a Java Servlet
public class HelloServlet extends HttpServlet {
public void doGet(HttpServletRequest request,
HttpServletResponse response) throws
IOException, ServletException {
response.setContentType("text/plain");
PrintWriter out = response.getWriter();
out.println("Hello, World");
out.close();
}
}
A server page turns the idea of a servlet inside out. You write essentially an HTML page with embedded tags, like
<%@ ... %>
<%= ... %>
<% ... %>
<%! ... %>
The tags contain code or directives. When processed, the whole page turns into a servlet or something similar. Server pages free you from a ton of boilerplate servlet code.
Several technologies exist to get the client to take on a greater share of the work, thereby freeing up the server to spend more time helping the other thousands of users.
An applet is a program that runs in the context of the browser (like a servlet runs inside server). Usually applets are written in Java and are executed with the Java Plugin.
Applets are invoked by the presence of an <object> element, or an <applet> element, in an HTML document.
See the Javadocs for javax.swing.JApplet, and the tutorial on writing applets.
Applets aren't as popular as they once were. Rich client experiences can be had through other plugins like Flash, or by going nuts with JavaScript.
A more lightweight alternative to the Java Plugin is embed scripts in the HTML documents. There used to be many scripting engines in browsers; now JavaScript is practically the only one around. Scripts are embedded in one of four ways:
The <script> element can refer to scripts written entirely within the HTML document:
<html>
<head>
<title>A Greeting</title>
<script type="text/javascript">
var d = new Date();
if (d.getHours() < 10) {
s = "morning";
} else {
s = "day";
}
</script>
</head>
<body>
<script type="text/javascript">
document.write("Good " + s);
</script>
</body>
</html>
or outside
.
.
.
<script type="text/javascript" src="greeting.js">
</script>
.
.
.
Many XHTML elements have attributes of type script
onAbort onError onLoad onMouseOver
onBlur onFocus onUnload onMouseOut
onChange onKeyDown onMouseDown onReset
onClick onKeyPress onMouseUp onSubmit
onDblClick onKeyUp
The HTML looks something like this:
<input type="button" value="Press" onClick="alert('You follow instructions');" />
Scripts add functionality to the client side of the web app because they can dynamically alter the document being shown in the browser (in a way, it can modify the elements and attributes on the page). See the specs for the W3C DOM, and I suppose a DOM tutorial like this one.
Ajax is a buzzword; really an acronym for Asynchronous JavaScript And XML. It's nothing more than the use of a JavaScript object that knows how to contact the webserver and fetch a chunk of XML (or plain text), parse it, and use the result to modify the client's DOM without refreshing the document.
Although completely transparent to the client, writers of webapps build these apps in the context of an operating system, web server, database, and dynamic page generation technology. Examples:
| Operating System | Web Server | Database | Dynamic Content Generation |
|---|---|---|---|
Linux OS/X Windows Solaris UNIX FreeBSD AIX HP-UX Irix A/UX BeOS Digital Unix VMS OS/2 . . . |
Apache Resin Tomcat SunONE IIS AOLServer . . . |
MySQL hsqldb Postgres Oracle DB/2 Informix SQL Server Sybase Gemstone . . . |
Servlets and JSP PHP ASP CGI (with C, Perl, or Python) Apache modules, e.g. mod_perl Ruby on Rails Grails Zope Django . . . |
It's common to make acronyms, for example LAMP = Linux Apache MySQL PHP (or Perl or Python, really).
LAPP would be like LAMP except with Postgres instead of MySQL.
LAMP and LAPP are pretty big in the Open Source world, as are LTMJ and LTOJ. An example of an all-Microsoft approach would be WISA (where S isn't Sybase).
But don't pay much attention to these silly four-letter codes! Real systems often combine several technologies: Apache and Tomcat work together very well, and big enterprise systems have several different kinds of databases. A single HTTP request may get a response from a query spanning an Oracle and a SQL Server database.