Coding 101: Lesson 5 - Capstone

Coding 101: Lesson 5 - Capstone

5.0 Intro

Lesson Overview

  1. Key concepts left to learn
    • How to Google for help!
    • Deploying your website (i.e. putting it online)
  2. Capstone Projects
    • Sally Says: Sally says is a simple game where Sally says 1 or more colors in a row and then you have to repeat the colors back to Sally. If you repeat it back correctly and in the right order, then Sally will repeat back the same colors again in order and then add one more. You repeat them back. You keep going until you get one wrong.
    • Build your own! Time to get your creative juices flowing! Using all of the concepts we have learnt so far (i.e. JavaScript, HTML, CSS, and JQuery), build and deploy your own website!

Coding 101: Lesson 5 - Capstone

5.1 Sally Says

Project Sally Says (Part 1 of 3)

User presses “play game” to start game

User is asked to memorize 3 colors and then repeat back on the next prompt screen

If user gets it right, then they have to memorize 4 colors; otherwise, the game ends and app tells user correct answer

User continues to play and color sequence continues to get longer until the user gets one wrong

Use “y” to represent the color yellow, “r” for red, “g” for green, and “b” for blue

Remember to use: while … loop, if () {} else {}, Math.floor(Math.random())

sally1

Project Sally Says (Part 2 of 3)

You are going to continue building this app now

This time you should add some style to your button and create a table with the four colors on it

Each of the colors in table should be a button

Now when user is prompted for answer, they press button color instead of typing in letter of color

Remember to use

  • while … loop
  • if () {} else {}
  • Math.floor()
  • Math.random()
sally2

Project Sally Says (Part 3 of 3)

To continue building on this app…app will now alert user which colors to memorize by pressing and lighting up each button and playing a unique sound when button is pressed

When user presses button in response, the button lights up and plays sound

Remember to use

  • while … loop
  • if () {} else {}
  • Math.floor()
  • Math.random()

Build your own Project

Time to get your creative juices flowing!

Using all of the concepts we have learnt so far (i.e. JavaScript, HTML, CSS, and JQuery), build and deploy your own website!

Acceptance Criteria to complete project:

  • Create a multi-page website with at least 3 pages
  • Use each one of the following at least once: If then statement, for loop, while loop
  • Use pseudo code and comments to make your code clearly understandable
  • Use at least one list and one dictionary
  • Build at least 3 functions
  • Use JQuery to activate at least one button and make formatting or content of website change in at least one place
  • Make your website mobile friendly and dynamically change appearance based on screen size

Congratulations! You finished! You can code!!!

congrats
Prior Lesson