Skip to content
Lessons for Intro to JavaScript, as taught in DC
CSS JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
00-installfest
01-command-line
02-data-types
03-control-flow
04-functions
05-objects
06-lab
07-intro-to-dom
08-events
09-templating
10-express
11-crud-and-dbs
12-architecture
13-lab02
14-apis
15-authentication
16-deployment
17-dbs2
18-final-project
19-presentations
assets
final-project
prework
.gitignore
readme.md

readme.md

Intro to JavaScript

Course information

Class will meet Tuesday and Thursday on the 8th floor in classroom 5 from 6:30 - 9:30pm - https://goo.gl/maps/PwyY2

To get up to the 8th floor, show the attached Class Pass at the Security Desk downstairs. You will need to show this on your phone or printed out every time.

Once you're upstairs, tell the folks at the front desk you're here for your first day of Javascript and they'll point you to your classroom.

Office Hours

Zakk: Sundays from 3:00 - 5:00

Christine: Tuesdays & Thursdays from 5:30 to 6:30

What to Bring

A. Your laptop (and charger with your name on it!) B. Snacks in case you get hungry C. A Sweater in case you get cold D. Class Pass printed out or on your phone

Schedule

Overview

Class Title
Lesson 00 Installfest
Lesson 01 The Command Line & Git
Lesson 02 Data Types
Lesson 03 Control Flow
Lesson 04 Functions
Lesson 05 Objects
Lesson 06 Project 1
Lesson 07 Intro to DOM
Lesson 08 Events
Lesson 09 Templating & Build Tools
Lesson 10 Express
Lesson 11 CRUD & Databases
Lesson 12 Application Architecture
Lesson 13 Project 2 - HackerWall
Lesson 14 APIs
Lesson 15 Authentication
Lesson 16 Deploying Your App
Lesson 17 Databases #2
Lesson 18 Project 3 Your App
Lesson 19 Final Project Presentations

Classes

Class 00: Installfest

Welcome to Intro to JavaScript! Our first class will focus on getting set up, learning the course objectives and meeting the instructors, staff and your fellow students.

Learning Objectives

  • Get to know your classmates, instructors, and staff members.
  • Install the tools we'll need to be successful in this course, including Node.js, npm, and Git
  • Explain the structure of the course and tools that will be used.
  • Discuss the benchmarks for assessments in terms of class participation, homework, and unit projects.
  • Answer the question, what makes JavaScript important?
  • Start answering the question, What is JavaScript?

Materials

Class 01: Command Line

In this lesson, we'll cover the basics of navigating the file system on your computer with a tool called the command line. We'll also dive into working with a command line tool called Git and a companion tool called GitHub.

Learning Objectives

  • Learn how to work in the Terminal
  • Learn the basics of Git and GitHub

Materials

Class 02: Data Types

Data types are the most atomic unit of any program. Javascript has many basic data types, which we cover in this lesson, and a couple of complex data types. We'll be introduced to Arrays at the end of the class as our first complex data type.

Learning Objectives

  • Describe the concept of a "data type" and how it relates to variables
  • Declare, assign to, and manipulate data stored in a variable
  • Create arrays and access values in them

Materials

Class 03: Control Flow

Programming is often described as following a recipe - in this lesson, we discuss why it's more nuanced than that by looking at control flow - ways we can control what code gets executed and the conditions under which it gets executed.

Learning Objectives

  • Understand different types of control flow including linear, conditional and iterative
  • Understand how to implement different types of control flow, including if and if/else statements, for loops and while loops

Materials

Class 04: Functions

Now that we know how to work with data and control when certain actions are performed by our program, we need a way to encapsulate code so we can reuse it. Functions let us write code that will perform an action whenever we ask it to do so.

Learning Objectives

  • Understand what functions are and how, when and why to use them
  • Declare our first function
  • Understand parameters and arguments and how they relate to functions
  • Understand the basics of scope
  • Create and call a function that accepts parameters to solve a problem

Materials

Class 05: Objects

Our final class on Javascript as a language covers Objects. This lesson will also cover Object Oriented Programming, a paradigm often held in opposition to Functional Programming, which we talked about in the last class.

Learning Objectives

  • Create and modify JavaScript Objects
  • Use Objects to model complex data
  • Get and Set properties of Objects

Materials

Class 06: Lab

Today's lesson is short and sweet! We'll go over npm and breaking our program out into multiple files then give you the rest of the time to work on the lab!

Lab

Materials

Class 07: Intro to the DOM

It's time to start working in the browser! Today's class will cover how to execute Javascript in the browser, kicking of section 2 of the class.

Learning Objectives

  • Understand the basics of working with the Document Object Model
  • Explain and Understand how to work with the DOM using JavaScript
  • Manipulate the DOM using JavaScript

Materials

Class 08: Events

Today's class goes in depth on event driven development: responding to browser/user events with Javascript and writing event handlers.

Learning Objectives

  • Listen for events using JavaScript
  • Understand how to work with events and how to implement event handlers
  • Learn about event propogation

Materials

Class 09: Templating

We can use JavaScript for more than just the logic of our application: we can also use it as part of building the front end! Templating is a way for us to break up large HTML files into small, manageable parts that we can control using JavaScript.

Learning Objectives

  • Use Handlebars templates to turn JS into HTML
  • build a simple dynamic application using Handlebars and JS

Materials

Class 10: Express

Time to jump back to the server! In this class, we'll learn about how the client and server communicate as well as how to build out a server using Express.

Learning Objectives

  • Explain the two parts of a web application
  • Identify all the parts of HTTP requests and responses
  • Understand server architecture and build a server with Express

Materials

Class 11: CRUD and Databases

By this point, we've built out our views and our server, all we're missing is a way to persist data. We'll learn about MongoDB and Mongoose - tools we can use to setup a database and work with it through our server.

Learning Objectives

  • Understand the differences between different types of databases
  • Describe what CRUD operations are and how they are used
  • Describe an ORM
  • Set up a simple Express application that uses Mongoose as an ORM to connect to a MongoDB database

Materials

Class 12: Application Architecture

We now know almost everything we need to in order to build full scale, feature-rich applications! The last step is to learn how we can organize the different parts of our application.

Learning Objectives

  • Learn about different architecture patterns for building applications

Materials

Class 13: Lab 2

Lab 2

Class 14: APIs

Often when building an app, the data we want to use exists elsewhere and we need a way to use it in our app - we can do this through APIs! This class will cover working with external data sources through AJAX and building APIs with Express.

Learning Objectives

  • Describe what an API is and how to use it
  • Understand how to work with an API
  • Build an API using Express

Materials

Class 15: Authentication

This lesson covers authentication - the process of verifying user identities. As part of our discussion on authentication, we'll also learn about middleware.

Learning Objectives

  • Describe the basics of authentication
  • Use Passport to authenticate users
  • Understand middleware in an express application
  • Describe the basics of authentication
  • Use Passport to authenticate users

Materials

Class 16: Deployment

For our last lesson, we'll cover making our applications live and publishing them so that others can see and use them!

Learning Objectives

  • Understand the difference between static and dynamic applications
  • Learn how to deploy static sites
  • Learn how to deploy a dynamic site

Materials

Class 17: Databases Part 2

In our second lesson on Databases, we'll dive deeper in to MongoDB and learn advanced querying techniques.

Learning Objectives

  • Understand the basics of promises
  • List the various forms of validation we can apply to our model
  • Use subdocuments to associate resources
  • Learn about advanced querying

Materials

Class 18: Final Project: Day 1

Project Requirements

Class 19: Presentations

Students will have 10 minutes to present their final projects. See the presentation requirements here

You can’t perform that action at this time.