Course Calendar

All code written in class available on GitHub.

  1. Git; HTML History, Syntax & Fundamentals Week One

    1. Monday, August 22 Video

      1. Welcome & introductions
      2. Course policies & calendar
      3. Course technologies

    2. Wednesday, August 24 Video

      1. File systems and basics of version control/Git
      2. A walk through HTML history, with a Git assist
      3. Major historical HTML specs: HTML 2.0 (1995, RFC 1866); HTML 3.2 (1997); HTML 4.01 (1999); XHTML 1.0 (2000/2002)
      4. Current HTML specs: HTML5 (2014); HTML: The Living Standard
      5. HTML Tags: Past, Present, Proposed
      6. HTML syntax & fundamentals

    Assigned Work

    • To Read

      1. Course policies, calendar, and projects [Online students]
      2. HTML5 for Web Designers, 2nd ed., Introduction; Chapters 1-2
      3. Pragmatic Version Control Using Git, Preface; Chapters 1-3 (Part I)
      4. Get familiar with the contents and organization of WebPlatform.org and Mozilla Developer Network’s Web technology for developers

    • To Do

      1. Submit ITMD361 Contract and Survey (link in your @hawk.iit.edu inbox; email instructor at karl.stolley@gmail.com if you did not receive it)
      2. Create Basecamp account (invite will arrive after you submit the Contract and Survey)
      3. Technology setup

  2. Well Formed, Valid Semantic HTML; Global Attributes Week Two

    1. Monday, August 29 Video

      1. Introduce first project
      2. Last of the history of HTML HTML 4.01 (1999); XHTML 1.0 (2000/2002)
      3. Current HTML specs: HTML5 (2014); HTML: The Living Standard; HTML Tags: Past, Present, Proposed
      4. HTML semantics and global attributes
      5. Working with the HTML validator
      6. Deeper into Git: granular commits; branches; merging

    2. Wednesday, August 31 Video

      1. Foundational well formed, valid, semantic HTML page
      2. htmllint (CLI); .htmllintrc configuration
      3. ITMD 361 house-style .htmllintrc
      4. Deeper into Git: remotes
      5. Introduce first Production Problem & turn-in procedure

    Assigned Work

    • To Read

      1. Pragmatic Version Control Using Git, Chapters 4-9 (Part II)
      2. HTML5 for Web Designers, 2nd ed., Chapters 5-6

    • To Do

      1. Production Problem 01: Cloning and Committing to a Git Repository

  3. Responsive Web Design Overview + HTML Foundations Week Three

    1. Monday, September 5 - Labor Day, NO CLASS

    2. Wednesday, September 7 Video

      1. Walk through a web project setup
      2. HTML Headings, Paragraphs, and Lists
      3. Source/text formatting: ALL CAPS; breaks on long lines
      4. Global structural attributes: class and id
      5. Resume markup
      6. Microformats: h-card

    Assigned Work

    • To Read

      1. Marcotte, “Responsive Web Design”
      2. Responsive Web Design 2nd ed., Chapters 1, 4

    • To Do

      1. Post Project 1 draft to Basecamp by Friday, September 9
      2. Production Problem 02: HTML Validation

  4. HTML and Accessible, Responsive Rich Media Week Four

    1. Monday, September 12 Video

      1. Introduction to Responsive Web Design
      2. Setting the viewport, including for Safari 9.0 and later on iOS
      3. Working with accessible image media in HTML5:

    2. Wednesday, September 14 Video

      1. Q & A about images
      2. GitHub Help doc on large files
      3. Git LFS: setup and usage
      4. Working with accessible audio & video in HTML5:

    Assigned Work

  6. CSS: Typography Week Six

    1. Monday, September 26 Video

      1. Introduce Project 2
      2. CSS style & linting; ITMD 361 style
      3. Typographic/modular scales
      4. Setting text on a baseline grids

    2. Wednesday, September 28 Video

      1. Mobile-scale page layout adjustments
      2. Setting text and colors in CSS
      3. Choosing & working with typefaces

    Assigned Work

  7. CSS: Page Layout (Fluid Grids), Responsive/Flexible Media Week Seven

    1. Monday, October 3 Video

      1. Page layout with position and float
      2. Building responsive fluid grids at media-query breakpoints

    2. Wednesday, October 5 Video

      1. Responsive Images

    Assigned Work

    • To Read

      1. Responsive Web Design 2nd ed., Chapters 2, 5

    • To Do

      1. Post video and draft of Project Two to Basecamp

  8. Transition Week Week Eight

    1. Monday, October 10 - Fall Break, NO CLASS

    2. Wednesday, October 12

      1. No Class

    Assigned Work

  9. CSS with Feature Detection; JavaScript: Syntax, Fundamentals, Data Structures Week Nine

    1. Monday, October 17 Video

      1. Revisiting the infamous Grid Disaster of 10/5/2016
      2. Responsive images
      3. Feature detection and flexbox
      4. Node utility: postcss with autoprefixer CLI

    2. Wednesday, October 19 Video

      1. MDN JavaScript Reference
      2. JavaScript fundamentals: syntax, data types, structures, style
      3. Working with the JavaScript console (node, browser)

    Assigned Work

  10. JavaScript: Functional and Object-Oriented Programming Styles Week Ten

    1. Monday, October 24 Video

      1. JSHint (Web)
      2. Functional programming style in JavaScript
      3. Single-responsibility principle and pure functions in functional programming
      4. Using functions to control variable scope
      5. Self-invoking functions to protect the global namespace

    2. Wednesday, October 26

      1. No class; Stolley out sick

    Assigned Work

    • To Read

      1. Eloquent JavaScript 2nd ed., Chapters 5-6, 8-10

  11. DOM Scripting: JavaScript + the Document Object Model; jQuery/Shoestring Week Eleven

    1. Monday, October 31 Video

      1. Working with domains and nameservers
      2. Emergency CSS rehabilitation: baseline grids; layout

    2. Wednesday, November 2 Video

      1. Introduce Projects Three and Four
      2. Object-oriented programming styles: literals and constructor functions
      3. Essential Web APIs: window, document objects
      4. JavaScript DOM libraries: jQuery, Shoestring

    Assigned Work

    • To Read

      1. Eloquent JavaScript 2nd ed., Chapters 12-14, 17-18
      2. HTML5 for Web Designers, 2nd ed., Chapter 4

    • To Do

      1. Production Problem 07: JavaScript Variable Scope, Production Problem 08: jQuery and the Global Namespace

  12. Unobtrusive JavaScript & Progressive Enhancement Week Twelve

    1. Monday, November 7 Video

      1. Unobtrusive JavaScript with event listeners
      2. Progressive enhancement: resizing text content

    2. Wednesday, November 9 Video

      1. Collaborating on GitHub with Pull Requests
      2. JSHint (CLI)
      3. ESLint (CLI)
      4. Progressive enhancement with HTML structure and data- attributes

    Assigned Work

  13. JavaScript: Non-Blocking Asynchronous Patterns, Page Performance Week Thirteen

    1. Monday, November 14

      1. PP 09 issues/collaborating on GitHub with GitHub Organizations
      2. Loading external assets and data asynchronously
      3. HTML forms and form elements
      4. Project Two due by 11:59pm CT

    2. Wednesday, November 16 Video

      1. JavaScript review and Q&A

    Assigned Work

    • To Read

      1. Eloquent JavaScript 2nd ed., Chapter 22

  14. HTTP 1.1, HTTP/2, and REST Architecture Week Fourteen

    1. Monday, November 21 Video

      1. HTTP 1.1, HTTP/2, and REST Architecture

    2. Wednesday, November 23 - Thanksgiving Break, NO CLASS

    Assigned Work

    • To Do

      1. Work on final project
      2. Production Problem 10: GitHub Feature Branch

  15. Parting Material: Server-Side Approaches to Web Development Week Fifteen

    1. Monday, November 28 Video

      1. Assessing server-side libraries/frameworks, using Ruby on Rails as an example

    2. Wednesday, November 30

      1. NO CLASS MEETING. Stolley available electronically to provide help on final projects

    Assigned Work

    • To Do

      1. Finish Final Projects (Three + Redux); Due December 7, 11:59pm