Week 8

Homework

Your assignment for this week is to finish all incomplete homework assignments. On Tuesday, I expect everyone to be done with the Blog (solution already posted below) and Movies. If you've done those assignments and are looking for a challenge, take a crack at building this spreadsheet (video).

Additionally, everyone should come to class with THREE final project ideas. Here are two great places to get inspiration:

If your idea involves a data source, please go find everything you can about that data source. You want to show us actually URLs that you can go to that return data back.

Resources

jQuery

jQuery is a powerful, widely used library that makes a lot of common practices in javascript web development a bit easier. Here are some examples of how you can use jQuery for some common things we've already done:

Vanilla JS jQuery
xhr see get function below... $.get(url, success);
get element var span = document.querySelector('span'); var span = $('span').first();
create element var a = document.createElement('a'); var a = $('<a>');
add child span.appendChild(a); span.append(a);
get text var linkText = a.textContent; var linkText = a.text();
set text a.textContent = linkText; a.text(linkText);
get attribute a.getAttribute('href'); a.attr('href');
set attribute a.setAttribute('href', 'http://wikipedia.org/'); a.attr('href', 'http://wikipedia.org/');
add event listener a.addEventListener('click', function() { console.log('click') }; a.on('click', function() { console.log('click') };

The easiest way to add jQuery to your page is by adding the following script tag to your HTML (put this tag before your own scripts):

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>

Here are some examples on how to use jQuery to do basic DOM manipulation.


  $("<li>").text("...").addClass("...").appendTo("ul")

  $("button").on("click", doSomething);

  var cars = [
    { "name": "Porsche" },
    { "name": "Miata" }
  ]

  cars[0]["name"] // => "Porsche"