Self-Paced Exercises

Complete these exercises.

Bug Fixing

Find and fix all the issues with these projects. Start by forking and running the linked the Repl projects; the webpages themselves explain the bugs.

• Bug 1
• Bug 2
• Bug 3
• Bug 4
• Bug 5
• Bug 6
• Bug 7

Variable Customization

There is a Repl project that builds a webpage from a bunch of different variables. Update the values of those variables to change how the webpage ends up looking!

1. Click here for the Variable Customization Repl project.
2. Fork the project
3. In the project, open the script.js file
4. Update the values of the following variables:
   • backgroundColor
   • textColor
   • pet (figure out which ones have pictures!)
   • person
   • instrument
   • teacher
   • sport
   • anyNumber
   • spinTime

Make sure to keep all variables in the proper form, with:

1. let
2. Variable name
3. Equals sign (=)
4. Variable value
5. Semi-colon

Challenges

After completing the basic variable changes, you can try to make more updates to the page. Some things to try:

• Change the spinning emoji from 😱 to something else
  • Make sure to only change the emoji, not the <p class="spins">!
• Update the basic CSS of the page in the style.css file
• Add a new animal image to the images folder, and change the pet variable to match it
  • It has to end with .jpg for this to work!
• Change the story text, or add a new line to the story
  • This is at the bottom of the script.js file

Research

There are a number of different things to research to expand your knowledge of JavaScript! The possibilities are nearly endless.

• All About Text in JavaScript
  • Strings are the text values that go between quotation marks
  • Try using something like "\n" to make a new line inside of some text
• More Powerful Text Manipulation with Template Literals
  • These let you do more with text values
• Random Number Generators
  • Random numbers are incredibly useful for game development and more
• Dates in JavaScript
  • See how to get the current day, calculate time between days, and more!

Feel free to poke around on the W3 Schools website for more JavaScript tutorials and code examples. There's a lot out there, but don't get overwhelmed! You don't need to understand it fully to explore it and start using it 😇