Skip to content

Instantly share code, notes, and snippets.

ES6 Reading Homework

  • What is ES6?
    • ES6 is the most recent version of ECMAScript, which is a scripting language specification that JavaScript uses for implementation. ES5 was released in 2009, and ES7 is planned for the middle of 2016.
  • What is Transpilation and how does it relate to ES6?
    • Transpilation is taking source code from one language and translating it into another language. It relates to ES6 because some browsers (or versions of browsers) do not support ES6, but they do support ES5. There are tools, such as Babel, that transpile your ES6 code into ES5 so you can use ES6 immediately without fears of unsupported broswers.
  • Looking at the ES6 Features link below, discuss one update from ES5 and if it seems useful/superfluous
  • It's hard to say what is useful and waht is superfluous since I haven't used many of these tools yet... Template Strings is probably superfluous to people who have written JS for a ling time, but coming from Ruby it is obviously more natural (not so many +'s.

1703 Front End Prework

Student Prework Gists

Add your name and a link to your own prework gist as a comment to this gist.

Computer Setup (JS Development)

Turn off Elastic Scroll or "Rubber Banding"

In terminal, use command defaults write -g NSScrollViewRubberbanding -int 0

Xcode & Command Line Tools

Do this first as so many things rely on it. Install through app store.

JS Native Data Types Challenge

Prompt

Extend the native Array data type to allow a groupBy method so that when given an array of objects, you can group each array item by a specified property.

For example, given an array of Turing students:

let students = [

Prompt

Given an n x n array, write a function that returns the array elements arranged from outermost elements to the middle element, traveling clockwise.

const arrayMatrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

Writing and Working With Promises

For this assignment, you'll be reintroduced to Promises and then write your own!

Some Background

Asynchronous code is everywhere in JavaScript, and Promises are a tool that enable us to work with asynchronous code in a manageable way. You've probably consumes promises before, most likely when you used the fetch API, but how are they working under the hood. With fetch, you most likely used something like this for a GET request:

fetch('http://www.some-api/users') 

1611-FE Final Assessment Repos

Leave a comment below with a link to your final assessment repo.

Bracket Matcher - JS Challenge

Ever wonder how your linter knows if you have matching brackets? Well it's time to think of a solution to that!

Given a set of brackets, [, {, (, create a function that determines if the brackets are well-formed (match) or not - even with bracket nesting. For example:

bracket('{}');

// => true

Server-Side Testing

Overview

Server-side testing is another crucial facet of testing. As your app grows in size and complexity, there will be more points of potential failure. Server-side testing focuses on looking at a request coming from a client, processing the request, and testing if the correct response to the client is given.

Why is This Important?

Everyone draw a diagram of how you envision your Jet Fuel app working - the entire process of the request and response cycle from the client to the server and back to the client.

// Without the `sendMessage()` promise-based function, but we want to teach them how to handle if something goes wrong here?
if ('serviceWorker' in navigator && 'SyncManager' in window && 'Notification' in window) {
window.addEventListener('load', () => {
fetchLatestHeadlines();
navigator.serviceWorker.register('./service-worker.js')
.then(registration => navigator.serviceWorker.ready)
.then(registration => {
Notification.requestPermission();
$('#submit-article').on('click', function(event) {