CompSci 290.2
Spring 2018
Web Application Development

Introductions

This project is intended to introduce you to your classmates and the course staff. It will also be the beginning of your portfolio for this course that represents a record of all of your work. You will link to all of your course projects from this site so the course staff can track your progress throughout the course. It is very important that you keep it up-to-date.

Part 1: Creating your Web Site

Whether or not you already have a personal home page, you should create a separate page for this course. Your course web site must contain at least the following pages:

For those having trouble being creative, you can fill in this template file.

To create the content for your course web site, you can use any plain text editor of your choice (some recommendations are here) but not a modern word processor or other WYSIWYG editor because part of the goal of this assignment is to learn the basics of the hypertext markup language, HTML. For this part, you do not need to worry about making your page pretty — specifically, please do not embed styles directly into you HTML (even though it is possible). Instead, wait for Part 2 when you will use CSS styles to improve the look of your pages.

Note, all images used on your course web site (and in general) must be royalty free and not "stolen" off of the web. For example, use fotolia.com, istockphoto.com, everystockphoto.com, or pay attention to the Creative Commons licenses on web sites. If you choose to use your own images or a friend's make sure to include a credit and a Creative Commons license so other's know how they can use your images.

Computer Science Autobiography

Before you start this course, take a moment to reflect on your goals and motivations for taking this course and how your web/programming experiences have affected you and shaped your decision to study computer science (and to take this course).

Your autobiography should broadly attempt to answer the following questions:

Part 2: Styling your Web Site

Commonly the content of a page is developed separately from the style, or look, of the page — even by different departments of people. An obvious example of this is the thousands of free and paid CSS templates available on the web to apply to your site. This is also the basis of the popular Bootstrap framework that we will study later.

In this course, your CSS styles should be written in a separate stylesheet (typically called style.css) that is linked from your HTML pages, rather than mixing the two. This maintains a strict division of CSS (for presentation) and HTML (for content). You can choose to create a single stylesheet for all the pages in your web site or separate ones for separate pages. However, if you use separate stylesheets, you should not duplicate styles in each file but instead create a separate file that contains the common styles.

Your course web site must contain at least the following styles:

Note, you will need to change the HTML developed in the first part to accommodate your styling. We will discuss ways to do this while maintaining a clear separation of concerns during the semester, but a good example of this in action is the CSS Zen Garden.

Resources

Submission: Posting your Web page

In this course, all of your pages must display the way you expect in the latest version of Chrome and validate using the W3C validators online:

The repository for this assignment will the be your course portfolio. All future assignments will be subimitted within this repository so that only what is in your assignments-portfolio-GIT_SCREEN_NAME repository on GitHub at the deadline will be considered for your submission.

To get started, you must accept this assignment on GitHub to create your personal version of the basic portfolio starter repository. You must replace its index.html file with your own code and set its GitHub Pages setting to master branch to publish it on the web so we can view it.