Curriculum

  • 1

    Prerequisites

    • Instructions for Prerequisite Assignments

    • Udacity: Intro to HTML and CSS

    • CSS Diner
  • 2

    Setting up your Computer to begin Coding

    • Install VS Code

    • (Windows Only) Install git Bash

    • (Windows Only) Install Node

    • (OSX and Linux Only) Install NVM and Node

    • Setup a folder for WTA Projects

    • Install WTA exercises
  • 3

    Week 0

    • Week 0 Intro

    • Text Editors and How To Use Them

    • Review: Make a Personal Website

    • Flexbox Froggy

    • Signup for Udacity: Responsive Web Design Fundamentals (RWDA)

    • RWDA #1: Why Responsive?

    • RWDA #2: Starting Small

    • RWDA #3: Building Up
  • 4

    Intro to our Program

    • Get to Know Slack - Our Class Forum & Messaging Tool

    • Where to go to get your questions answered

    • In-Class Help Queue
  • 5

    Week 1

    • Week 1 Intro

    • Lecture: Fizzbuzz, VS Code Shortcuts, & Pseudo-Selectors

    • Example Code for FizzBuzz

    • Project: Update Your Personal Website (Finish by next class)

    • Flexbox Tower Defense

    • RWDA #4: Common Responsive Patterns

    • Lecture: 'Murica, basic responsive design, and more CSS practice

    • Example code for American Flag

    • Project: Make Personal Website Responsive (Finish by next class)

    • CSS Diner

    • RWDA #5: Optimizations

    • CSS Specificity Article

    • Signup for Udacity: Intro to Javascript

    • ITJ #1: What is Javascript?

    • ITJ #2: Data Types & Variables

    • ITJ #3: Conditionals
  • 6

    Week 2

    • Lecture: Fonts & Icons

    • Create a company landing page (Finish by week 3)

    • VIDEO: Navigating the Command Line

    • VIDEO: Intro to JavaScript Functions

    • VIDEO: Node Exercises

    • VIDEO: Debugging Node

    • Github Tutorial

    • Signup for Netlify

    • Lecture: Source Control & Deployment

    • Activity: Deploy Github site via Netlify

    • Lecture: WTA Exercises

    • WTA Exercises 0-8

    • HTML/CSS Quiz

    • CSS Selector/Specificity Quiz

    • Terminal Navigation Quiz

    • Conditionals Quiz

    • ITJ #4

    • REVIEW: Re-do CSS Diner (again) & Flexbox Froggy
  • 7

    Week 3

    • Lecture: Loops

    • WTA Exercises 9-11

    • ITJ #5

    • ITJ #6

    • Lecture: Arrays

    • WTA Exercises 12-16

    • DOM, Part 1

    • DOM, Part 2
  • 8

    Week 4

    • Lecture: Random DOM Manip with Pokemon

    • Pokemon Sample Code

    • Project: Fizzbuzz (Finish by next class)

    • VIDEO: Random Numbers

    • Lecture: Random #'s

    • WTA Exercises #17-18

    • Node Exercises #19-21

    • DOM, part 3

    • Lecture: DOM Events

    • DOM Events Example

    • Project: Color Changer (Finish before week 5)

    • VIDEO: scope

    • VIDEO: IIFE's

    • ITJ #7
  • 9

    Week 5

    • Lecture: Random Pokemon

    • Example Pokemon Code

    • Project: Baby Name Generator (Finish by week 6)

    • VIDEO: String Methods

    • Lecture: Manipulating Strings

    • WTA Exercises #22-28

    • Sam's Cardinal Sins
  • 10

    Week 6

    • Lecture/Experience: Update Portfolio Site

    • Project: Mad Lib Generator (Finish by week 7)

    • Lecture: Complex Input Validation

    • VIDEO: Input Validation

    • WTA Exercises #29-30

    • WTA Exercise #31-33

    • VIDEO SERIES: Testing, Jasmine, TDD

    • VIDEO: Jasmine Setup

    • VIDEO: Testing Seed Installation

    • VIDEO: Date Validator TDD Starter
  • 11

    Week 7

    • Lecture: Testing and WTA Exercise #34

    • WTA Exercise #34-36

    • VIDEO: Jasmine Spies

    • Lecture: Date Validator & Intro to Calculator

    • Date Validator Sample Code

    • Project #6: Calculator (Finish by end of week 8)

    • WTA Exercises #37-40
  • 12

    Week 8

    • Lecture: Calculator Problems

    • Lecture: Calculator AGAIN!!!

    • Lecture Notes

    • Register for Udacity's "Object-Oriented Javascript" Course

    • OOJ #1

    • OOJ #2

    • OOJ #3

    • OOJ #4
  • 13

    Week 9

    • Lecture: Prototypes

    • Prototype Lecture Notes

    • WTA Exercises #41-44

    • Read: ES 2015 Classes

    • Lecture: ES2015 Classes

    • WTA Exercises #45-47

    • Lecture: 2D Arrays

    • WTA Exercises #49-50

    • WTA Exercise #48

    • Register for ES6 Course

    • Complete ES6 Lessons 1 & 2
  • 14

    Week 10

    • Lecture: Scope & Variables

    • Lecture: Templating, arrow functions, spread operator, decomposition

    • Lecture Notes: String templates, arrow functions, spread operator, decomposition

    • WTA Exercises 51-54

    • Read: forEach

    • Read: Array Higher-Order Methods

    • Lecture: Higher-Order Array Methods

    • Lecture Notes: Higher-Order Array Methods

    • Lecture: Parcel, ESLint, & Gnome Garden Project Intro

    • Project: Digital Gnomes (Due by beginning of week 12)

    • Gnome Garden Starter Code

    • Gnome Project Guide

    • Read: HTTP Requests
  • 15

    Week 11

    • Lecture: ES2015 Import

    • Separate Classes into separate files; reorganize project

    • Lecture: HTTP, Async, Postman, Promises

    • Connect to Gnome API

    • Lecture: Gnome Garden Help
  • 16

    Week 12

    • Lecture: Gnome State Mgmt

    • Lecture: Gnome Garden Creatures

    • Lecture: Gnome Garden Turns

    • Lecture: Gnome API Integration

    • React Intro
  • 17

    Week 13

    • Lecture: Intro to React/Components

    • Stopwatch Sample

    • Project: Create pretty multi-stopwatch site

    • Lecture: Axios & Lists with React

    • Project: Consume API with React/Axios

    • Watch Intro to Redux Videos
  • 18

    Week 14

    • Lecture: Passing props & state

    • Lecture: Intro to Redux

    • Lecture: Handle API Calls with Redux Thunk

    • Project: Create basic Redux Application

    • Read: React Router

    • Read: JWT Authentication

    • Lecture: Using React Router v4

    • Redux, Thunk, & Router Examples

    • Project: Router Project
  • 19

    Week 15

    • Lecture: Authentication

    • Project: Put it all together (Finish by Week 16)

    • The Purrfect Gentleman Starter

    • The Purrfect Gentleman Starter Walkthrough
  • 20

    Week 16

    • Lecture: Intro to Node

    • Lecture: Create & Deploy a Node API

    • Example Vanilla Node API

    • Watch: Intro to Node

    • Project: Node API

    • Watch: Intro to Express
  • 21

    Week 17

    • Lecture: Intro to Express

    • Example Express API w/Joi

    • Project: Create Express API

    • Lecture: Authentication & Authorization with Express

    • Example: Express authentication and authorization

    • Project: Create authenticated API

    • Create Free Atlas Account & Install Stuff

    • Watch: Socket.io
  • 22

    Week 18

    • Guide: Deploying Express to Heroku

    • Lecture: MongoDB & Mongoose

    • Lecture: Using Atlas

    • Example Express Mongo

    • Project: Update project to use MongoDB & Mongoose

    • HW: Design a project

    • Lecture: Websockets & Socket.io

    • Project: Add chat to your previous project

    • Project: Capstone

    • What's Next?