Curriculum

  • 1

    Setting up your Computer to begin Coding

    • Install VS Code

    • (Windows Only) Install git Bash

    • (Windows Only) Install Node

    • (Windows Only) Set default VS Code terminal

    • (OSX and Linux Only) Install NVM and Node

    • Setup a folder for WTA Projects

  • 2

    Intro to our Program

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

    • Where to go to get your questions answered

  • 3

    1) Intro to HTML/CSS

    • Lecture

    • Project: Create your portfolio website (DUE NEXT CLASS)

    • PAPERWORK: Student forms

  • 4

    2) Fundamental CSS

    • VIDEOS: Review basic HTML

    • VIDEOS: Learn about CSS

    • Lecture: Fundamental CSS

    • Project: Beautify Portfolio Page

  • 5

    3) CSS Selectors and Basic Layout

    • CSS Diner

    • Flexbox Froggy

    • Lecture: CSS Selectors and Flexbox

    • Project: Improve portfolio layout

  • 6

    4) Advanced CSS Selectors

    • Learn: Pseudo-selectors (classes) and pseudo-elements

    • Lecture: Pseudo-selectors with FizzBuzz

    • Project: Practice pseudo selectors and elements

  • 7

    5) CSS Grid

    • Videos: CSS Grid

    • CSS Grid Examples

    • Lecture: CSS Grid

    • Project: Responsive Portfolio

  • 8

    6) Source Control and Deployment

    • Activity: Create Netlify Account

    • Activity: Create Github account

    • Activity: Install Git

    • Video: Intro to Git

    • Activity: Save your portfolio page to GitHub

    • Lecture: Git

    • Project: Product Landing Page

  • 9

    7) Advanced CSS: Animations, Transitions, Variables

    • Learn: CSS Animations and Transitions

    • Learn: CSS Variables

    • Lecture: Variables, Animations, and Transitions

    • Project: Animation Codepen

  • 10

    8) JavaScript Types

    • Learn: Basic JavaScript

    • Lecture: JavaScript types

  • 11

    9) JavaScript Control Flow

    • Video: JavaScript Control Flow

    • Lecture: JavaScript control flow

    • Project: FizzBuzz.js

  • 12

    10) The DOM

    • Video: Functions

    • Video: The DOM

    • Lecture: The DOM

    • Project: Cage-ify Me, Captain!!!

  • 13

    11) Capstone

    • Lecture: Student-led topics

    • Project: Capstone