The final project in the tutorials from the Web Development Bootcamp was to make the RGB Color Guessing Game. This is a great mixture of DOM manipulation as well as working with various data structures, functions, and logic.
There are six pairs (plus a bonus) of HTML/JS files to be completed and submitted.
How are you really feeling? Write a program that asks “How are you feeling?” Then have the program immediately ask again, “How are you really feeling?” Have the program compare the statements. If the statements match, then send a message, “Wow so you really feel insert feeling” If they don’t match send a message, “Ok so you’re not sure if you’re firstFeeling or secondFeeling.”
feeling.html / feeling.js
How fast were you running? Write a program that asks for how many miles a person ran and how many minutes the run took. If either answer was not a number, then let the user know they should try again. If both answers are numbers calculate and report the MPH the user averaged.
running.html / running.js
What’s the weather? Write a program that asks a user what the weather looks like today. Using a switch statement, have your program respond with advice to the following answers, “rain”, “cloudy”, “sunny”, “cold”, “hot”, and for all other answers let the user know, “I don’t have any advice for you today, sorry.”
weather.html / weather.js
FizzBuzz – This is a classic loop problem for which the solution exists in a myriad of languages and methods. Write a program that console.log’s the numbers 1 to 100. Except log for numbers divisible by 3 log “Fizz”, numbers divisible by 5 log “Buzz”, and numbers divisible by both 3 and 5 log “FizzBuzz”.
fizzbuzz.html / fizzbuzz.js
Guessing Game between 1 and 100 – Write a program that generates a random whole number between 1 and 100 and then prompts a user to guess the number. If the guess is less than the answer given, prompt the user with the hint that the number is lower than the one guessed. If the guess is higher than the answer given, prompt the user with the clue that the number is higher than the one guessed. If the user guesses correctly, alert the user that they have guessed the answer. Be sure to report the correctly guessed number in the alert.
guess.html / guess.js
Falling down the stairs – Take the phrase “falling down the stairs” and write a program that console logs the phrase one letter per line, but for each line add one additional space is in front of each letter. This will give the appearance of the letters in the phrase looking like a staircase.
stairs.html / stairs.js
***BONUS*** Climbing Up the Mountain – Take the phrase, “Climbing up the Mountain” and log one letter per line but in reverse. Also the last line should have one space in front, the second to last two spaces, etc. This will give the impression of a the letters going up to a peak. Hint: You will need to employ new string methods.
There are four pairs of HTML/JS files to be completed and submitted.
Create a program that prompts a user three times asking for three favorite deserts. Have the program alert the user with a sentence that names all of these deserts.
desserts.html and desserts.js
Create a program that asks the user how many credits they have completed towards their college degree. Have the program alert the user with a sentence that reports how many credits out of 120 have been completed and how many credits remain.
credits.html and credits.js
Create a program that asks a user for their favorite quote. Have the program alert the user with a sentence that repeats the quote in quotation marks and that they love it too.
quote.html and quote.js
Create a program that asks a user for their first name and then their last name. Have the program alert the user with a sentence shows their full name and tells them how many characters there are in their full name.
Random Color – Create a function randomColor() when called returns a random RGB color value like rgb(173, 65, 203).
Game – Create three functions startGame(), endGame(), and checkGame(). Each function returns the boolean value of gameOver and should affect gameOver as the function name suggests.
Range Array – Create a function rangeArray(start, end)which takes two numbers as arguments. The function returns an array containing all the numbers from the start up to and including the end. For example: rangeArray(3, 9) returns [3,4,5,6,8,9].
Only Numbers – Create a function onlyNums(arr) which takes an array as an argument. The function returns an array that has removed any values except numbers. For example: onlyNums(["fun", 23, 45, undefined, "a", 4]) returns [23, 45, 4].
If you’ve never thought about it, consider looking at the r/learnprogramming subreddit. This is one of many communities out there where people are starting out with a number of different programming languages looking for support in a variety of ways – getting started, finding a project to work on, showcasing tools you use, getting feedback on work, and finding the answer to an-infinite-number-of-problems-encountered-when-trying-to-learn-to-program.
Look through the subreddit’s wiki on “common concerns and fears” and “questions about learning.” Choose a couple topics from these to talk to a partner about. Take notes on their answers as well as yours. Summarize your thoughts, concerns, and questions in your first blog post.
Exercise files to publish on your server, HTML/JS pairs
func-prob-set.js includes isEven(num), factorial(num), and kebabToSnake(str)
arr-prob-set.js includes functions printReverse(), isUniform(), sumArray(), and max().
Problem set files to be published on your server with one HTML file and four JS files connected:
Describe which section you felt most comfortable with and which you felt least comfortable with and why. Give a specific example of JS using enLighter for each.
//Here's my example of code that I feel comfortable with.
//Basic variable declarations - strings, numbers, arrays, booleans, etc...
//my example that I'm least comfortable with
//declaring arguments for a function and calling the function