CSE598i - Course Project Assignments

The central programming/design element of the course will be student designed and hosted websites containing Web 2.0 applications. This effort is divided into eight assignments due every two weeks. Each student will host their website on a virtual machine provided to them on the first day of class. Below are specifics of each of the eight of the course projects. Due dates are listed on the course website schedule. Note that students should feel a great deal of latitude in the look and feel of the website, and additional effort and "sizzle" features will be strongly rewarded.

Assignment #1 - Creating an initial paper summary website using the JQuery-UI Package

Each student will create a webpage for his paper summaries that will be driven by client-side Javascript using the JQuery. Setup your initial environment and create the webpage as follows:

  1. Login into your newly acquired virtual machine and configure the firewall and install and configure the Apache web server and any other tools and services you think you will need for the semester. This is your host to manage, so feel free install anything you want to (within reason). Note the warning a the bottom of this page.

  2. The firewall should not allow any traffic coming from anywhere outside PSU. Ports 80 and 22 should be open to the following networks. A guide to setting up the firewall provided with your VM is available here.

  3. Use the JQuery UI Widgets for the entire page. You can obtain a version of the JQuery UI from the UI project website. Follow the instructions to create a customized version of the UI library and use the associated examples to help create your desired interface (the customization webpage is very useful here). For an example of adapting the UI widgets, you can review this page which has been created with the UI tools.

  4. The papers will be organized into "accordions" titled by each days' topic.

  5. Within the accordions, the papers be organized as tabs widgets for the papers listed in the order they are assigned on the course webpage.

  6. Each paper summary will be encoded into a XML document downloaded at the time the associated accordion widget is maximized. Each paper will have its own XML document, whose template can be retrieved from the course schedule page.

  7. Students should feel free to make the page look as nice as possible by adding any features or design.

A good tutorial on JQuery is available here.

Assignment #2 - Setup the SSL/Web-Page

  1. Acquire a certificate from Tom Moyer.

  2. Setup SSL on the website (make sure to test it from different hosts).

  3. On the firewall, open port 443 to the same networks that are open to ports 80 and 22.

  4. Configure Apache to redirect all requests on port 80 to port 443.

  5. Create a default page for your website. The page could identify the course, your name (with picture), a brief bio, and links to three pages for your website. Use the JQuery UI interface and make it look as nice as possible. These include:

    • summaries.html - this is the collapsable assignment page you created in assignment #1.
    • proposal.html - this is a webpage proposal for your web application you will build this semester. Details below.
    • app.html - this should be a link that sends an javascript alert when you click on it indicating that the application is not available yet.
  6. The proposal should provide a brief (one paragraph) overall description. You should create a list of features that it will support and describe them in some detail. Using your favorite drawing program, draw an example interface with buttons, windows, etc. and relate them to the features listed above.

Assignment #3 - Basic Web 2.0 Application

The central focus of this assignment will be the creation and integration of a back-end database with the application. At a minimum, you must:

  1. Setup the default page for your project application using the Zend framework. This should be a simple format and rendering of the basic page you are expecting. This page should describe your application, listing features that make it desirable for users.

  2. Install the database -- installation notes will be given in class.

  3. Setup the database. Define a schema appropriate for your target application, initialize the database, and integrate with the database. You are to create a page /schema.html that contains tables defining the scheme and the meaning of the tables. This page should be kept up to date over the course of the semester.

  4. Add a simple form on the default page to insert data into the database.

  5. Extract some information from the the database (as entered from the form on the previous step) and display it on the default page.

Note: At this stage you should be adding functionality for your application as needed to support your proposed system.

Assignment #4 - Building Pages

The central focus of this assignment will be the creation a user system. At a minimum, you must:

  1. Create tables including the the logins and passwords for users of the system.

  2. Create a registration page that allows users to define logins. It should collect what ever information is needed for the application. It must ask for an email address (to be used later).

  3. Create a login page that validates the password information. Access to the system should be denied unless the user successfully logs in.

  4. At this stage you should have a fairly clear idea of the objects and access model of your application. Add some descriptive text to the /schema.html page to describe the access controls in your application. In particular, you should identify what rights different users have in the system. Special users (e.g., "admin") should be identified.

Note: At this stage you should be adding functionality for your application as needed to support your proposed system.

Assignment #5 - Integrating with the Google API

Note: At this stage you should be adding functionality for your application as needed to support your proposed system.

Assignment #6 - Web Scraping

Note: At this stage you should be adding functionality for your application as needed to support your proposed system.

Assignment #7 - Cross Posting

Note: At this stage you should be adding functionality for your application as needed to support your proposed system.

Assignment #8 - Sizzle

This assignment is purposely under-specified. You are to add elements to your web system that give it some cool look, feel, or feature. The more sizzle, the better. Feel free to rip off other websites or to create your own cool features.

Note that each student is responsible for administering the virtual machine assigned to them and is specifically responsible for securing its content--point being that the students are specifically required to setting up the VMs' firewall, use good passwords, etc.