This post contains the first assignment in my free web programming course.

Project: Personal web page

Now that you know a little html and css, you should be able to produce some simple web pages. In this assignment, I want you to create a web page about yourself. It should be pretty similar in content to my about-me page on my website, but it should be about you and the things you like.

Here's what it must contain.

1. A title that says your name and is styled like a title.
2. A picture of you or something you like.
3. A short paragraph of at least three sentences. You can use Lorem Ipsum if you can't write three sentences about yourself.
4. A quote you like that is styled like a quotation. Usually quotes are indented more and displayed in italics.
5. At least three links to things you've done or things you like. Use html lists to show these.

This post contains the second assignment in my free web programming course.

Project: Client-side web form

Forms are how users enter data on the web. When you register for a website, you enter your username and email into a web form. When you buy an item from a web store, you send your payment information using a web form.

Generally speaking web forms have input components on them like text boxes and dropdowns and buttons. But this isn't always the case. Web forms can be cleverly hidden using JavaScript and CSS.

Typically a web form submits data to a server, which processes that data and responds to the user with something interesting. For instance, you might submit your username and password and get back an authentication token that allows you to use the private portion of a website.

Requirements

I want you to build a single web page using html and javascript only.

It should have three things on it.

1. A page title in h1 tags.
2. A label that reads "title:".
3. An input text box.
4. A submit button.

When the button is clicked, the title of the page should change to the title entered by the user without reloading the page.

Also, the user input must validated. The user should be prevented from using dirty words like "MacOS" and "iphone". Don't let them use either of those words in any capitalization. If those words occur in the input, then a red error message should be displayed underneath the text box that reads "Please refrain from using dirty words such as 'MacOS' and 'iphone'.".

Extra credit

For extra credit, make the form beautiful using CSS. Be creative, but try to make something that a typical web user might like.