=================== ####HTML/CSS These programs must be completed in either jsBin or cloud9.
Clue | Name | Create a webpage/website that... | Points |
---|---|---|---|
1 | hello.html | ...says "Hello, World!" in the body of the page. | 4 |
2 | headBody.html | ...has "Hello!" as the title and "World!" written in the body. | 1 |
3 | img.html | ...has two images stacked on top of each other. Each image must have text under it. | 3 |
4 | div.html | ...has an image and text. The image must be in a div with the class "image" and the text must be in a div with the ID "text". | 3 |
5 | MyFirstWebsite | ...contains four webpages; index.html, page1.html, page2.html, page3.html. Each webpage must have a title and one line of identifying text. | 5 |
6 | style.css | ...center the text on all four webpages using a link to a stylesheet. | 2 |
7 | MySite | ...has a home page with your picture and text. The site also needs three linked pages with text. | 4 |
8 | Style it! | ...improves the site created in clue 7 to include all of the following styles: font-family, font-size, background, color, padding and margin. | 5 |
####JavaScript: Variables & Strings
Clue | Name | Create a program that... | Points |
---|---|---|---|
1 | hello.js | ...prints "Hello, World!" in the console. | 1 |
2 | helloName.js | ...asks for your name in an alert window then prints a message saying hello to you. | 2 |
3 | age.js | ...asks for your name and age then prints out how old you are in a string. | 2 |
4 | hello3ages.js | ...asks for the names and ages of all the teachers in this class then prints their names and ages. | 6 |
5 | avg.js | ...asks for two numbers and prints the average of those two numbers. | 2 |
6 | madlibs1.js | ...asks for one part of speech (ex: noun) then prints out a sentence using that item. | 2 |
7 | madlibs3.js | ...asks for three parts of speech (ex: noun) then prints out a story using all three items. | 4 |
8 | msPotato.js | ...has a variable called "msPotato" and is set to the string "I'm packing your angry eyes." Print the string. | 1 |
9a | length | ...prints out the length of the string. | 2 |
9b | nose | ...replaces the word "shoes" with "nose". | 2 |
10 | roman.js | ...can convert any integer from 1-1000 into a roman numeral. | 10 |
####JavaScript: Conditionals
Clue | Name | Create a program that... | Points |
---|---|---|---|
1 | scriptEdLove.js | ...asks if you love ScriptEd and responds either "Yay!" or "Boo!" | 2 |
2 | iceCream.js | ...asks what your favorite ice cream is and responds with either "Yay! Chocolate" or "Boo! Vanilla" or "Huh?" | 2 |
3 | class.js | ...asks a student what grade they are in and responds with "You are a Freshman", "Sophomore", "Junior" or "Senior". | 3 |
4 | grade.js | ...can convert a test grade (1-100) to a letter grade (A-F). | 10 |
####JavaScript: Loops
Clue | Name | Create a program that... | Points |
---|---|---|---|
1 | count10.js | ...prints 1 through 10. | 1 |
2 | count476.js | ...prints 1 through 476. | 4 |
3 | sum55.js | ...prints the sum of the numbers 1 through 55. (final value is 1540) | 4 |
4 | sum128.js | ...prints the sum of the numbers 1 through 128. (final value is 8256) | 2 |
5 | prod15.js | ...prints the product of the numbers 1 through 15. (final value is 1307674368000) | 3 |
####JavaScript: Loops/Arrays
Clue | Name | Create a program that... | Points |
---|---|---|---|
1 | colors.js | ...has an array called "colors" and consists of 4 colors. | 2 |
2 | colorPicker.js | ...prints the third color in your array. | 2 |
3 | colorLoop.js | ...loops through your array one index at a time based on button clicks. | 5 |
4 | 99bottles.js | ...counts down from 99 to 1 repeating the string "# bottles of milk on the wall, # bottles of milk". | 4 |
####jQuery
Clue | Name | Create a program that... | Points |
---|---|---|---|
1 | TV Shows | Clone the workspace at http://jsbin.com/cuvimu/edit?html,js,output. Using jQuery add in your favorite TV shows to the webpage. | 4 |
2 | Bold TV | ...has bold text created using only jQuery. | 2 |
3 | TV Images | ...includes an image of both TV shows from clue 1. Do this only using jQuery. | 2 |
4 | Click Handlers | ...uses click handlers to both div's so that clicking on one prints out the text of the clicked div to the console. | 6 |
####GitHub
Clue | Name | Create a program that... | Points |
---|---|---|---|
1 | Follow | Follow one of the teachers on GitHub. | 2 |
2 | Fork | Fork an instructor's repo and add a .txt file with your name in it. | 3 |
3 | Pull | Send a pull request to the instructor. | 2 |