Final Project

This is a page under construction. Requirements may still be added.

Due Dates

• Proposal: November 26. (See the very end of this page!)
• Completed site: December 18, noon

The final product will not be accepted late.

The Project

The final project is to build a complete data-driven website for a company (or organization). This company can be real (e.g., Little Debbie, the English Department at Calvin, etc.) or imaginary (e.g., YoYoDyne).

It is very important that the requirements are met naturally by your site.

Every webpage should be at least a page long (using 1024x768 as the size of the browser window).

Your Webserver

Use your webserver as installed for Assignment 12.

Really use your webserver:

• Put your files in ~/local/apache2/htdocs (assuming you used my suggestions for installing Apache).
• CSS and JavaScript files can be stored in absolute locations (e.g., /css/ and /javascript/, respectively.)

Dynamic Content

Your site must be primarily data driven. That is, most pages (if not all) contain content that come from some data source.

Possible data sources:

• A flat file (really?)
• An XML file
• A database
• A web resource (like Flickr or Netflix)

Ugly numeric requirements:

• At least 100 pieces of data.
  • At least 50 of those have to be generated by you.
  • The other 50 can come from another source.
  • All 100 can come from you.
• Each piece of data has to have three values.
• The 100 pieces of data can be spread out over different data sets.

"Generated by you" means that the data was written by you in an XML file or database. Any web resource or an XML file that you download is considered "another source".

A "piece of data" is the same as a "row from an SQL table" or "an XML element". The name-price "products" of the Urlacher Shop would not qualify. I'd have to add another value (like "comment") to satsify this requirement.

"Different data sets" means that not all your data has to be the same type. For example, the Urlacher Shop started out with one data set, "products". It would make sense to have data sets for "users" and "videos" and "appearances" and "blog" and etc.

For at least one data set, you need a way to see individual items on a single page. On the Urlacher Shop, I could have a page that shows the data about a single product.

For at least one data set, I need to be able to search over it. Again, on the Urlacher Shop, I could search on the product's name.

Cookies and Sessions

Make use of cookies and/or sessions in some way. If your use of cookies/session is subtle, make sure you note it well in final.html.

Keeping track of the user's name is more than sufficient to satisfy this requirement.

Security

Make sure you're sanitizing the data received in forms. Describe in final.html where, how, and why.

Design

• Your site must generate valid XHTML. (Yes, I will check with the W3C validator!)
• Your site must use logical formatting with CSS.
• Use a CSS-based layout (which you're free to get from a book or website).
• Your Web site must be aesthetically pleasing.
• Use a templating system (your own or packaged). Have a header and footer on every page with the appropriate material in both.
• The most important design principle: consistency.

Ajax

Use Ajax on your site in some simple way. Some examples:

• Verify data in a form (e.g., make sure a price is numeric).
• Do some client-side calculations (e.g., calculate the total cost of a product)
• Add some cool animations.

Little Something Extra

If you do everything described above and the final.html as described below, you get a B.

To get an A, take one aspect of your site and do a little bit more. This includes (but is not limited to):

• Allow users to add information to a data source (e.g., a comment system for products at the Urlacher Shop). While using a database will make this really easy, it can be done with XML!
• Do something more sophisticated with cookies and/or sessions than just remember the user's name. This might be keeping track of the user's favorite pages or their favorite items from your database. (You do need to do something different than a shopping cart.)
• Use some advanced CSS techniques (e.g., rounded-corner boxes). You might have to do multiple things to get this to qualify.
• Use Ajax to actually exchange information from the server into the current document in the browser (e.g., word completion on a search form).

Whatever you want to do, get it approved by me first!

Note: this "something extra" is a necessary, but not sufficient, condition to get an A!

Submitting Your Project

Write up instructions and commentary for me in file named final.html on yardley. This file doesn't have to look good, just address these issues:

• Describe what your website is for, including its intended audience.
• How do I start your server? (This is in case your server or yardley goes down before I can grade your assignment.)
• How have you satisfied all of the requirements listed here?
• What usernames and passwords do I need (if any)?
• What special instructions should I have before using your site?
• What's the "little something extra" that you've done?
• Link to your website's home page.

Submit a URL to your final.html through KnightVision for "Final".

The Proposal

Write a proposal for the site you're going to write for this final in a file named final.html. Answer all of the questions listed above as best you can. Submit a URL for this page in KnightVision for "Final Proposal".