JavaScript is a ubiquitous programming language on the web. It powers animations, audio/video, geolocation, data visualization, peer-to-peer communication, web storage, and, most recently, servers. Facebook, Twitter, Gmail, and Dropbox, to name a few popular websites, all use JavaScript heavily. In fact, Dropbox explicitly requires "Mastery of javascript" for one of their software engineer positions.

It's clear that JavaScript has real-world applications, and that's exactly what this course focuses on. Each of the projects and in-class activities is based on some existing product. After finishing this course, students will have implemented their own versions of Instagram, Piazza, and Yelp, among other sites. Indeed, this course is focused on pragmatic, applicable knowledge.

Course logistics

ApplicationThe course is limited to 60 students, who will be selected by application. The application is available at https://goo.gl/forms/7UlpiEYC4IriKgD62. The deadline for submission is 10/1/2016 at 11:59PM. Class will still be held during the first week (9/26/16 - 9/30/16).
Date/TimeT/Th 9:30AM - 10:20AM
Units2 Pass/Fail
InstructorsKarthik Viswanathan (kvis@stanford.edu)
Vivek Nair (vnair611@stanford.edu)
TAsRichard Chen (rchen8@stanford.edu)
Staff emailcs42-aut1617-staff@lists.stanford.edu
Office hoursRichard: Mon 4:30PM - 5:30PM at Old Union 120
Karthik: Tue 10:30AM - 11:30AM in Tresidder common area
Vivek: Thur 10:30AM - 11:30AM in Tresidder common area
Grading criteriaSee lecture 1.
Late day policyYou have 3 late days, exactly 24 hours each. Additional extensions are only offered in case of documented medical illness and family emergencies. If you exceed your allotted late days, you will receive no credit for that assignment and for the class overall.
PrerequisitesCS107 (or equivalent experience)
Explore courseshttp://goo.gl/naINjW


Week 1 (9/26 - 9/30)

1.1 JS Fundamentals

Basic syntactic structure and elements of Javascript: variables, types, conditionals, loops, functions. Brief overview of HTML.

1.2 Instagram I Activity

We'll implement a basic version of Instagram together in class! Download the starter files before-hand.

Week 2 (10/3 - 10/7)

2.1 & 2.2 HTML, Callbacks, Objects, DOM I

What exactly are callbacks, and why do we use them? What is HTML, and how does it interface with JavaScript?

Warmup Assignment: 42 Flavors

Week 3 (10/10 - 10/14)

3.1 DOM II, Events

Traversing the DOM with selectors. Attaching handlers to elements that fire when interesting events occur.

3.2 DOM Attributes

Modifying attributes, inserting/deleting elements, and relative traversal.

Assignment 1: Piazza

Week 4 (10/17 - 10/21)

4.1 Task List I Activity

Creating a task list using our knowledge of the DOM, events, and callbacks.

4.2 Task List II Activity

For take two, we'll employ templating and event delegation to decompose and simplify our task list implementation.

Week 5 (10/24 - 10/28)

5.1 HTTP Requests and Responses

What happens when you visit a site in your web browser? What is HTTP and what are the various request types? How do you pass parameters in requests?

Making HTTP requests with JavaScript, domain names, and the same origin policy. Extending our Instagram app by pulling photos off Flickr.

Assignment 2: Yelp

Week 6 (10/31 - 11/4)

6.1 Instagram II Activity

Adding realtime commenting to our Instagram app.

6.2 Node.js and Express

Server-side JavaScript with Node.js and Express. Modules, route handling, and static assets.

Week 7 (11/7 - 11/11)

7.1 Soundcloud Finder

Searching and playing songs dynamically from Soundcloud.

7.2 MongoDB

Integrating MongoDB, a NoSQL document database, into Node.js applications for persistence.

Assignment 3: Newsfeed

Week 8 (11/14 - 11/18)

Shorten me maybe? Creating your own URL shortener, like bit.ly.

8.2 Objects and Prototypal Inheritance

New operator, constructors, this keyword, and prototype chains.

Week 9 (11/28 - 12/2)

9.1 Objects and Prototypal Inheritance (cont.)

New operator, constructors, this keyword, and prototype chains.

Using objects and inheritance to implement the classic game of snake.

Week 10 (12/5 - 12/9)

10. callback(success);

Interview questions, funny videos, and next steps. Good luck with finals!

Bundle of all files


Course reader
Git handout
Templating handout
localStorage handout
Event delegation handout
MongoDB handout