#Project: The CSS Zen Garden

##Overview

The focus of this project is to have the students all start off with the same set of HTML code that they cannot alter. The student may only change the CSS.
In completing this project, the students will see the amount a website can change just by altering the CSS.

##Before Class

###Teacher Preparation

• Familiarize yourself with the CSS Zen Garden.

Prerequisites

Students should only start this project after they have completed the other lessons and projects in the unit.

Starter code

See here for code and here to view.

Solution code

There is no solution code for this project. However, It is encouraged to have students look at examples submitted at CSS Zen Garden.

###Assessment

1. Students will be assessed based on their performance in the project.

##During Class

###Do Now

1. Volunteer takes attendance. Procedure found here.
2. Return checked Do Now and Exit Ticket from previous class.
3. Students are answering the following question:
   What do you feel is more important in a website? The HTML or the CSS?

###Opening

Remember at the beginning of the year we worked on CSS Garden when you redesigned the ScriptEd starter code we gave you? Well, now that you have more CSS skills, we want you all to actually submit to the site.

The CSS Zen Garden is an online competition, in which developers design a website using the exact same HTML file.

###Introduction to New Material ("Do Now")

Students are going to design their own website using the Zen Garden code as a base.

####1. Fork this repo. Do this by clicking the Fork button on the top right of this page.

2. Clone your repo into your own Cloud9 account workspace

1. Copy the "clone URL" from this repo.
2. In your Cloud9 dashboard, click on the green "Create New Workspace" button and select "Clone from URL."

Once the workspace has been processed, check to be sure it is up to date by running git status in the terminal. You should receive a messege telling you that your branch is up to date.

NOTE: It is common practice to push your changes to your GitHub repository often. It is recommended you make a push after every major change. Through the course of completing this project you should make 7-10 pushes to GitHub. Your teacher will be evaluating you on this.

To push to GitHub run the following commands in your terminal:
git status
git add .
git commit -m "example comment"
git push origin master

3. Fill out the CSS sheet.

During this project, the student is only manipulating the style.css. Do NOT alter the HTML in ANY way. ###Independent Practice ("You Do") It's build time! Students will work alone on this project. The teacher's role will be to walk around the room helping students with any questions they have. Students are encouraged to look at previous lessons for reference.

###Closing Select students to present their work to the class.

###Checks for Understanding Teachers should keep track of student success while they are presenting to the class.

###How to Submit Students must push all final code to their GitHub repository. In order to push changes in Cloud 9, the following commands must be run in the terminal:

git status
git add .
git commit -m "example comment"
git push origin master

Students will then share the link to their repo at bit.ly/ScriptEdProjects