Week 0: The Workshop Week 0

Unit: Pre-Course Foundation

Interaction Question: What is JavaScript, and how do I talk to a web page?

Learning Outcomes

  • Set up a GitHub repository from template with GitHub Pages enabled
  • Explain what JavaScript does in relation to HTML and CSS (the behavioral layer)
  • Navigate Chrome/Firefox DevTools, specifically the Console and Elements panels
  • Execute simple JavaScript expressions in the browser console
  • Recognize basic JavaScript syntax: variables, functions, event listeners
  • Link an external JavaScript file to an HTML document
  • Read console error messages and identify the source of common problems

Curriculum Activities

Engage

  • Engage: Portfolio Audit
    weeks/week-0/engage/engage-0-1-portfolio-audit.md

Learn

  • Learn: Codedex Console Tutorial
    weeks/week-0/learn/learn-0-1-codedex-console.md
  • Learn: Console Explorer
    weeks/week-0/learn/learn-0-2-console-explorer.md

Build

  • Build: The Setup
    weeks/week-0/build/build-0-1-the-setup.md
  • Build: The Behavioral Layer
    weeks/week-0/build/build-0-2-the-behavioral-layer.md

Reflect

  • Reflect: Variables & Strings
    weeks/week-0/reflect/reflect-0-1-visual-notes.md

Lectures

  • Lecture 1: The Behavioral Layer
    weeks/week-0/lectures/lecture-1-the-behavioral-layer.md
  • Lecture 2: From Console to Files
    weeks/week-0/lectures/lecture-2-from-console-to-files.md

Resources

  • Behavioral
    weeks/week-0/resources/dev-tools-fieldguide/behavioral.html
  • Bridge
    weeks/week-0/resources/dev-tools-fieldguide/bridge.html
  • Connecting
    weeks/week-0/resources/dev-tools-fieldguide/connecting.html
  • Console
    weeks/week-0/resources/dev-tools-fieldguide/console.html
  • Errors
    weeks/week-0/resources/dev-tools-fieldguide/errors.html
  • Index
    weeks/week-0/resources/dev-tools-fieldguide/index.html
  • Reference
    weeks/week-0/resources/dev-tools-fieldguide/reference.html
  • Start
    weeks/week-0/resources/dev-tools-fieldguide/start.html
  • Visual
    weeks/week-0/resources/dev-tools-fieldguide/visual.html
  • 01. Setting Up
    weeks/week-0/resources/sources/codex.io-week0.md
  • Week 0 Resources: The Workshop
    weeks/week-0/resources/week-0-resources.md

Canvas Alignment

Module: week 0: The On-Ramp // DevTools, console, script linking

  • active Day 1 // Jan 5th
  • active Build: The Set Up
  • active Learn: Console Explorer
  • active Build: The Behavioral Layer
  • active Day 2
  • active Engage: Portfolio Audit
  • active Learn: Codex Console Fundamentals
  • active Reflect: week 0 -- Visual Notes via freeCodeCamp - Theory Variables & Strings
  • active Build 1-2 // Portfolio in Figma + Style Tile
  • active Learn 1-3 // html academy chtp. 2 Introduction to Javascript chapters 10 - 17