Homework 1

Due February 4th, 11:59pm

Submission Instructions

As with all homeworks, you will submit this project in a two-step process:

• First, place all source code (stylesheets, html, and php files) in a single h1 directory. You will submit this homework under the unique id h1 using turnin per the instructions on the course homepage.
• You will also put your assignment up on your personal webspace on z. Per the FAQ for z, you'll need to place these files in /u/z/users/cs105-s13/YOURCSID/h1.

Make sure your name, email address, and eid are in a comment at the top of each file you submit.

Assignment

Social networks are all the rage today, with angel investors looking for the next Facebook to dump money into. For this assignment, you need to create the initial webpages for a simple social network. It can be a straightforward Facebook knockoff, or you can offer your own unique spin on the phenomenon, like a network specialized for movie aficionados or foodies. You will be improving this website throughout the course, so I encourage you to have fun with it. Brownie points for creativity.

For this assignment, you need to build at least three different webpages:

• A simple homepage directing visitors to the signup page.
• A signup page for people to register with the network.
• This webpage will need to use a form to collect the registrant's name, some sort of password, and at least three more bits of information of your choosing (these should be tailored to whatever sort of social network you're building).
• This form will need to feature at least four different kinds of elements for gathering this data. The password needs to be entered into at least two different boxes so that the handler can validate it.
• The form handler will need to validate passwords. It will need to compare the two passwords to make sure they are equal. It also needs to ensure the password meets some simple guidelines that you come up with (i.e. it contains both a numeral and a punctuation mark, etc.)
• If the validation fails, or if the user fails to input a required piece of data, the handler needs to send the user back to the signup page. The handler should put all the correctly entered information back into the form elements so that the user doesn't have to reenter them. The page should also indicate what went wrong.
• If the data is good, the handler should present the data on a profile page.
• The profile page should pleasantly present the data from the signup form.
• This page should include a form with a textarea element so that users can post messages on their profile. When this form is submitted, the handler needs to redisplay the profile page with this message on the "wall".
• The page also needs an "Edit" button that takes users back to the signup page so that they can modify their profile data. The signup page should use the current information as default values for each form element. (This edit button should be another form which uses the signup page as its handler).

Hint: One way to preserve data so that it can be used by another handler is to include it in a hidden input element. I would recommend you do this for the two forms on the profile page.

Bonus Points

Use style sheets to beautify your three pages.