HOMEWORK

Homework: Due Tuesday, 11/14

1. Finish the prework:
   1. Complete all three of the lessons in Codecademy's JavaScript Fundamentals track. (2-3 hours)
   2. Complete CodeSchool's Try Git exercise. (30-60 minutes)
2. Complete units 1 and 2 from Codecademy's Learn the Command Line (ignore paid content) (30-60 minutes)
3. Codecademy Functions (30-60 minutes)
4. Reading:
   • Eloquent JavaScript Chapter One: Values, Types, and Operators
   • Eloquent JavaScript Chapter Two: Program Structure
   • Eloquent JavaScript Chapter Three: Functions

---

Optional

The Command Line Crash Course (2-3 hours)

Homework: Due Tuesday, 11/21

1. 99 Bottles of Beer (30-90 minutes)

   starter-code > Homework-1 > 99-bottles-of-beer

2. Fizzbuzz (60 min)

   starter-code > Homework-1 > fizzbuzz

   1. Construct a for loop that iterates through and console.logs the numbers 1 - 100.
   2. Add an if/else statement that logs the string "fizz" if the value being iterated over is divisible by 3; otherwise, log the value.
   3. Add an else if clause that logs the string "buzz" if the value being iterated over is divisible by 5.
   4. Add an additional else if clause that logs the string "fizzbuzz" if the value being iterated over is divisible by both 3 and 5.
3. Temperature converter (60-90 min)

   starter-code > Homework-1 > temp-converter

   1. Create a function that accepts a temperature value in Fahrenheit and converts it to Celsius.
   2. Create a second function that accepts a temperature value in Celsius and converts it to Fahrenheit.
4. Reading
   • Todd Motto on JavaScript scope
   • Eloquent JavaScript Chapter Four: Objects & Arrays

---

Optional

• Random address generator (30-60 min)

  starter-code > Homework-1 > BONUS-random-address-generator

• Madlibs

  starter-code > Homework-1 > BONUS-madlibs

  We haven't covered all of the concepts necessary to complete this project, but we will pick them up over the next few weeks. Identify syntax in the code that you recognize, and research any code you encounter that you don't understand. This project will be due in a few weeks, so if you're looking for a preview of upcoming content, this will give you a head start.

Homework: Due Tuesday, 11/28

1. Temperature converter (60-90 min)

   starter-code > Homework-2 > temp-converter

   1. Create a function that accepts a temperature value in Fahrenheit and converts it to Celsius.
   2. Create a second function that accepts a temperature value in Celsius and converts it to Fahrenheit.
2. Read about Hubot (45 min)
   • Hubot Overview
   • Hubot Documentation
3. Interact with the bots in our class Slack organization (only works in DMs with these bots, or in channels that they are members of, such as #general) (30 min)
   • @slackbot
     • Direct message with a question
   • @plusplus
     • Add ++ after the @ name of a user to give them a point
     • Direct message help to @plusplus to learn other commands to experiment with
   • giphy
     • Type /giphy and a space, followed by a word
     • giphy responds with an animated GIF related to that word
   • @snackbot
   • Direct message cal to @snackbot for the full snack calendar
   • Direct message next to @snackbot for info on the next class when someone is signed up to bring snacks
4. Read the Project 1 description and start thinking about what you'd like your bot to do. (We will configure our computers and start building bots in class next week, so no need to start coding yet.) (30 min)

Homework: Due Tuesday, 12/5

1. Slack bot
   • Finish your Slack bot
   • Create a new GitHub repo for your bot, including:
     • the JS code for your bot
     • updates to the default README.md file that documents what your bot is capable of and how to interact with it
   • Push your code to your repo, then use Slack to send Sasha a link to the repo
2. Outline and create objects (30-60 min)

   starter-code > Homework-3 > object-homework folder

3. Convert between JavaScript objects and JSON (30-60 min)

   starter-code > Homework-3 > json-homework folder

4. Reading
   • Eloquent JavaScript Chapter Twelve: JavaScript and the Browser
   • Eloquent JavaScript Chapter Thirteen: The Document Object Model (DOM)
   • Eloquent JavaScript Chapter Fourteen: Handling Events
   • How jQuery Works
   • Codecademy Introducing jQuery (first lesson)
   • jQuery Documentation: Introduction to Events
   • jQuery Documentation: Handling Events
   • jQuery Documentation: Understanding Event Delegation
   • An Introduction to ES6 Template Literals

Homework: Due Tuesday, 12/12

1. Madlibs (30-60 min)

   Homework-4 >madlib-with-loops

2. 99 Bottles of Beer in the browser window (30-60 min)
   • Remember the 99 Bottles of Beer assignment? For this assignment, you'll be creating a website that programatically displays the lyrics to that song in the browser window.
   • You'll need to create both an HTML file and a JavaScript file.
   • In your HTML file, you'll want to have an unordered list (<ul>) that contains all of your lyrics.
   • Each line of the song should appear inside of a list item (<li>) within that unordered list.
   • Your JavaScript file should programatically append each line of the song to the page--no hard-coding lyrics in HTML!
   • Code this project using vanilla JavaScript methods.
   • Then refactor your code to use jQuery instead (preserving your original code in comments)
3. Reading (60-90 min)
   • jQuery: Event delegation
   • Implicit vs Explicit Iteration in jQuery
   • Eloquent JavaScript Chapter Seventeen: HTTP
   • What is an HTTP request?
   • How to Use jQuery’s $.ajax() Function
   • jQuery Documentation Ajax
   • jQuery Documentation Ajax: Key Concepts
   • jQuery Documentation Ajax: Related Methods

---

Optional

• Dice (30-60 min)

  Homework-4 >BONUS-dice

  • Create an app where every time the user hits the "Roll Dice" button, the screen randomly updates each of the two images to display an image of a die corresponding to the value rolled.
  • Specific instructions in the js > app.js folder

Homework: Due Tuesday, 12/19

1. Current weather (60-90 min)

   Homework-5 > ajax-homework

   Be sure to remove your API keys and app keys from your code before pushing to GitHub

2. Customizable survey form (90 min-2 hours)

   Homework-5 > jquery-homework

3. Pre-work for Project 2: Feedr (2 hours)

   (Final project due Tuesday 1/9)

   • Read project overview
   • Research and choose APIs to use
   • Read API documentation for the APIs you've selected
4. Reading
   • Using Promises
   • Using Fetch
   • Functions are first class objects in JavaScript
   • Callback Functions in JavaScript
   • Understand JavaScript Callback Functions and Use Them

---

Optional

• 99 Bottles of Beer with jQuery (30-60 min)

  Refactor your solution from last week to use jQuery instead of vanilla JS

Homework: Due Tuesday, 1/2

1. Local Landscapes

   Homework-6

   Complete the Local Landscapes app we started in class.

   • Using the (500px API documentation), customize the search results for the app we created today to do the following:
     • Sort photo results by rating (highest rated first)
     • Return 28 photos instead of the default 20
   • Bonus: Display the current user’s information on the site after a successful login.
2. Project 2 (Feedr)

   Pseudocode the basic API functionality & DOM manipulation code

3. Final project
   • Read the project overview.
   • Come up with a basic idea for your final project. Create an outline/project description that details how your project will meet each of the project requirements.
   • Create a list of possible APIs to use.
4. Reading
   • Understand JavaScript’s “this” With Clarity, and Master It
   • Closures in JavaScript (MDN)
   • JavaScript Best Practices - Avoid Globals (W3)
   • Module pattern example (css-tricks.com)

NOTE: The Project 2 and Final Project tasks are milestones that are meant to help you make incremental progress on these large projects, but do not include work that you must submit with your homework. I strongly encourage you to complete these tasks by the deadline to avoid getting overwhelmed by work as the end of the course approaches. I am also happy to review and discuss your work on your projects at any point.

Homework: Due Tuesday, 1/9

1. Project 2 (Feedr)

   Completed project due

   • Send Sasha the URL for your fork of the Feedr repo on GitHub
   • Remember to remove your API keys from your code before pushing to GitHub
2. Final project milestone

   Pseudocode of basic features & draft of HTML/CSS code

3. Reading
   • Using data attributes (MDN)
   • Calling a data attribute with jQuery

---

Optional

• Firebase Web Codelab

  This tutorial guides you through building a web application with Firebase. This is a preview of what we'll be doing in class next week.

• Reading
  • 🎥 Introducing Firebase video series (videos), including the following:
    • 🎥 Introducing Firebase
    • 🎥 Introducing Firebase Realtime Database
    • 🎥 Introducing Firebase Storage
  • Firebase Hosting guide
  • 🎥 Introducing Firebase Hosting (video)

Homework: Due Tuesday, 1/16

1. Final project milestone

   Final HTML/CSS code, draft of basic API functionality and DOM manipulation code

2. Reading

   React Quick Start orientation (12 pages starting with Hello World and ending with Thinking in React)