Web Programming

SYST10199 - 3 UNITS - DAN

Building Web Apps with JavaScript and NodeJS

General Links

Course Outline - Word doc
Class Plan - Word doc

Weeks 03, 05, 09, 12 Checkoffs (4) - [10%]
Week 04 Assignment 1 - JS GAME - [10%]
Week 06 Assignment 2 - JS LINES - [10%]
Week 07 Midterm Exam (Lessons 1-6) - [25%]
Week 10 Assignment 3 - FORMS - [10%]
Week 13 Assignment 4 - NODE - [10%]
Week 14 Final Exam (Lessons 9-13) - [25%]

Dan Zen E-mail - E-mail Address
Dan Zen Museum - Offsite
Sheridan Interactive Media - Offsite

Lesson Links

Lessons

Display All | Display Current

Module 1 - CLIENT - JavaScript (Weeks 1-7)

display

Lesson 1 - Intro and JavaScript Basics

overview, variables, conditionals, loops, arrays, object literals

Lesson Plan - Word doc
Main Web Application Technologies - PPT doc
JavaScript and HTML 5 APIs - PPT doc
JavaScript Frameworks - PPT doc
Programming Basics - Info Page

ZIM JavaScript Canvas Framework - offsite
ZIM Code Template and Coding Information - offsite
ZIM Examples Canvas examples - offsite
ZIM Docs Expandible Documentation - offsite
ZIM Learn Code and Video Tutorials - offsite
ZIM Editor Online Editor and Examples - offsite
ZIM Beam Code sharing - offsite

See Read Programming Basics

See ZIM Skool Lesson 1

ZIM Skool - Offsite
W3 Schools JS - Offsite

JavaScript - Offsite
JavaScript Guide - Offsite
Object Oriented JavaScript - Offsite
JavaScript Reference - Offsite
JavaScript DOM Introduction - Offsite
JavaScript Web API - (advanced) Offsite
JavaScript Web API - Window - Offsite
JavaScript Web API - Document - Offsite

Lesson 2, 3 - JavaScript Interaction

functions, scope, interval, timeout, events

Lesson Plan - Word doc
Asteroids - ZIP
Functions - PPT doc
Scope - PPT doc
Intervals and Timeouts - PPT doc
Events - PPT doc

HTML 5 Games - Offsite

Lessons 4 - DOM and CSS

getElementByID(), addEventListener(), style, element manipulation

Lesson Plan - Word doc
DOM Basics - Info Page

Mozilla - JavaScript DOM Introduction - Offsite
Mozilla - JavaScript NODE API - Offsite

Lessons 5 - OOP - Object Oriented Code

Classes, Objects, Properties, Methods, Inheritance, Getter/Setter, Modules

Lesson Plan - Word doc
OOP Theory - Info Page
OOP Code - Code Page
Modules - PPT doc
Libraries - PPT doc

Mozilla - Object-oriented Programming - Offsite
Modules - W3 Schools - Offsite

Lessons 6 - Review

review of Programming Basics, DOM and OOP

Lessons 7 - Midterm Exam

lessons 1-6 Lockdown Browser with Respondus Monitor (if remote)

Module 2 - CLIENT - FORMS (Weeks 8-9)

display

Lesson 8 - Forms

Form, Input, TextArea, Select, Buttons, new HTML 5, ARIA

Lesson Plan - Word doc
Form Details - Info Page
Forms Example - see SURVEY link - HTML
Accessibility and ARIA - Info Page

Forms - W3 Schools Offsite
Accessible Rich Internet Applications - W3C Offsite
Using ARIA - W3C Offsite

Lessons 9 - Form Data

Validation, Regular Expressions, localStorage, JSON, CGI Format

Lesson Plan - Word doc
Collect CGI Data from Forms with JS - Code Page
Regular Expressions - Info Page
Form Validation and Manipulation - Info Page
Client Data - Info Page

URL Encoding - W3 Schools Offsite
Mozilla - Regular Expressions Offsite

Module 3 - SERVER - NODE (Weeks 10-14)

display

Lesson 10 - NodeJS Basics

NodeJS, Node Package Manager (NPM), Express (server)

Lesson Plan - Word doc
NodeJS - Info Page
Express - Code Page

NodeJS Offsite
Node Package Manager Offsite
NodeJS - Sheridan Resources (Wendi Jollymore) Offsite
Glossary Offsite

Lesson 11 - NodeJS Data

JSON, Fetch (Like AJAX), sessions

Lesson Plan - Word doc
Data - Code Page

Fetch API (Mozilla) Offsite
Sheridan Resources (Wendi Jollymore) Offsite

Lesson 12 - NodeJS Database

cPanel, MySQL

Lesson Plan - Word doc
Database - Code Page

MySQL Tutorial (W3 Schools) Offsite
Sheridan Resources (Wendi Jollymore) Offsite

Lesson 13 - Study Period

No class - study for Final Exam

Lesson 14 - Final Exam

closed book on Lockdown Browser with Respondus Monitor (if remote)