(X)HTML and CSS combine to provide users with static web pages, where they will always see exactly the same information every time they view the page. While this is appropriate in many situations, it does limit the usefulness of a web site. In order to provide dynamic web pages, we must add some form of scripting which builds the web page content “on the fly.”

We can provide this dynamic capability either on the client side, with the user’s web browser handling the creation of information as the HTML content of web page is rendered, or on the server side, where the page is built on the server as an HTML document and then sent to the user as fixed (static) information. The processes are similar from the user’s perspective — they rarely have any clue whether interactivity is produced locally or on the server.

Both processes typically use “scripting” languages, which are a form of programming language that is interpreted (translated into machine language and executed on a step-by-step basis without creating a separate executable file). Scripting languages also are quite flexible, allowing embedding of bits of program code into other file types. This allows a standard HTML file to additionally contain pieces of code that can be executed at the appropriate time to add changing information to a web page.

Although there are a number of different scripting languages that you can use on either the client side or the server side, we are limiting ourselves to one of each — JavaScript for client-side programming and PHP for server-side programming. Both languages are very widely used in web programming, and are open-source (i.e. non-proprietary) languages and thus freely available for use.

Readings and Assignment

Study the following tutorials on JavaScript.

These should give you enough information about the fundamentals of JavaScript to begin using it.

Once you’ve gone through the tutorials, create a simple web page consisting of nothing but a data form. This form should allow a user to enter data about products for sale from an e-commerce site (such as the one you’re designing for your final project). Once the user enters data into the form and presses a button, your page should use a JavaScript program/function to validate the data entered to ensure it is in the correct format and of the correct data type. You don’t need to worry yet about what to do with that data (that’s server-side processing and that’s NEXT week), just let the user know whether or not the data validated. If it didn’t, mark the invalid data fields in some way and let the user try again. Submit your HTML file and any separate JavaScript files (which I strongly urge you to use instead of embedding the JavaScript) via email.

Additional JavaScript References