Lab 1 - HTML

Due Monday 2/2/09 - 3:30PM

The goal of this lab is to refresh your knowledge of HTML and get you started on the project you'll be implementing over the course of the semester. Each week you will implement a new component of a personal file synchronization service with features similar to SugarSync or DropBox. You will begin by implementing a centralized service that uses the RESTlet framework and an XML-based database of files. By the end of the semester, you will have a purely distributed system that allows a user to access files from any computer via the web, and backup and restore files across multiple computers.  Please refer to the Project 1 assignment page for a complete description of the project.

The focus of this lab is to design the HTML front-end for your site.  Your goal is to design the look and feel. You should include some basic (realistic!) sample content, but keep in mind that you will eventually be dynamically generating these pages using the RESTlet framework.   

For now, you may link your pages using basic HTML and make your pages available at This means you will need to set up your site under /home/web/your-user-name/syncservice.

Your site must provide the interface for supporting the following operations:

  1. Settings - The user may visit a settings page that will allow him/her to set and/or change the root directory that will be exposed by the application.  In other words, if the web service receives a request to list all of a user's files, it will provide a listing of all files and directories found under the root directory.
  2. File View - The main interface of your service will be a file view that lists all files available in the root directory, and all of the files available in the user's Google Documents account.  For each file, the interface will list (at minimum) the name of the file, the size of the file, and the last time the file was modified.  You will also provide the user with an option to open a file and an option to upload a local file to the user's Google Documents account.
  3. Search - You will also provide the user with an option to search for files meeting certain criteria.  The user may search by file name (contains or matches) or by modified date.  Your service will provide the file view listing only files matching the given criteria.

It should be clear how your site will provide all of the functionality described, but you do not need to implement the functionality now. For example, if the user chooses to search, you could return a web page containing some fake, static results in lieu of the actual results.

Please do not use a WYSIWYG tool to develop your site. I recommend that you keep your design as simple as possible, though you may choose to add additional functionality.

If you are particularly enthusiastic about this assignment, you might consider using Cascading Style Sheets (CSS) to help separate the content from presentation in your site.  Extra effort may always be rewarded with extra credit.

Here are a few HTML resources:


HTML Goodies

HTML Code Tutorial


Email me a link to your site by 3:30PM on Monday, 2/2/09.