Week |
Day |
Topic |
1 |
L1 |
Foundations of the WWW
- describe the purpose of a web client, such as a browser
- describe the purpose of a web server
- describe how HTTP is used to implement the www Request/Response
model of web client/web server communication
- for each of the HTTP methods (e.g. GET, POST, HEAD, etc), describe
the purpose of the method
- Explain what a "markup language" is
- Describe the history and various versions of HTML
- Describe the difference between HTML and XHTML
|
L2 |
HTML
- Use the various HTML tags, such as <h1>,
<body>, <div>, <table> etc to create a document
- Explain the difference between Block elements and Inline
elements
- Describe how HTML validators are used to check compliance of HTML markup to a standard
- describe how a browser can parse validated HTML document and model it as a
hierarchical structure of various objects
|
L3 |
CSS- Explain how a browser renders HTML elements
- Explain the difference between content and presentation of an
HTML
document
- Use HTML element attributes, such as "class" and "id" in CSS
style rules
- Use CSS style rules to specify the appearance of an HTML
document
- Explain how CSS validators are used to check compliance of CSS
to a standard
|
2 |
L1 |
Introduction to JavaScript
- describe the primary elements and features of the JavaScript
language
- define typeless variables
- write javascript functions
- assign a javascript variable to a function
- embed JavaScript into an html document
|
L2 |
The Browser Object Model-
describe how the browser models various objects, which are presented
through an object-oriented API accessible via JavaScript
- write JavaScript code that accesses the Browser Object Model to
perform various functions
|
L3 |
The Document Object Model and JavaScript- describe how a
browser can parse validated HTML
document and model it as a
hierarchical structure of various objects that are accessible via
JavaScript
- write JavaScript code that accesses the Document Object Model to
perform various functions
|
3 |
L1 |
Dynamic HTML
- write JavaScript code that accesses the Document Object Model to
modify the content of an HTML document
|
L2 |
DOM Events and JavaScript
- write JavaScript code that responds to events, such as button
clicks, originating from the DOM
|
L3 |
CSS layout
- Describe the "cascade" in terms of how a browser
interprets/prioritizes multiple CSS rules
- Describe how to specify different CSS rules depending on browser
target
- Describe CSS specifiers, media selection, layout, and
positioning
- Explain how the CSS rules specifying static, relative,
absolute, fixed, and float affect the position
of various HTML elements.
|
4 |
L1 |
jQuery
- Describe how jQuery uses a "selector" mechanism to locate DOM
elements
- Explain/write jQuery selector expressions that access DOM
elements
|
L2 |
jQuery
- Explain/write jQuery code to respond to DOM events
|
L3 |
jQuery
- Explain/write jQuery code to animate (ie move) the position of a
DOM element
- HTML5: The <canvas> element
- write JavaScript code that accesses <canvas> to draw free-form
graphics
|
5 |
L1 |
JSON- Explain
how data is represented in JSON
- Write JavaScript code that extracts data from a JSON document
|
L2 |
Ajax with jQuery- Write jQuery code to execute Ajax methods
- Explain the difference between synchronous and asynchronous Ajax
invocation
- Write jQuery code to execute Ajax methods asynchronously
|
L3 |
Exam |
6 |
L1 |
Server-side Javasdript: NodeJS
- Write, execute, and debug NodeJS applications
|
L2 |
Server-side Javasdript: NodeJS
- Explain the purpose of the Node Package Manager (NPM)
- Use NPM packages in a NodeJS application
- Explain the purpose of package.json and what is found within
that file
- Explain the purpose of the node_modules folder and what is found
within that folder.
|
L3 |
NodeJS web server- write a server using server-side JavaScript
|
7 |
L1 |
NodeJS and Express
- Explain the purpose of the Express package
- write a server using NodeJS and Express
- Implement favicon support
- Implement routes using app.get()
|
L2 |
NodeJS and Express
- Explain HTTP GET vs HTTP POST
- Explain how forms communicate form data to a NodeJS server
- Implement routes using app.get()
- Implement routes using app.post()
|
L3 |
NodeJS and Express, continued
|
8 |
L1 |
MongoDB
- Explain the advantages of using a database such as MongoDB to
store persistent data over a simple in-memory data store
- Use the Mongo command-line client to create and modify
databases, collections, and documents.
|
L2 |
MongoDB
- Implement MongoDB access from within a NodeJS application using
the Mongoose package
|
L3 |
no class |
9 |
L1 |
Web Frameworks- Explain some disadvantages of the jQuery
approach to implementing client-side Javascript
- Explain the purpose and motivation for typical Web Application
Frameworks such as React
- Explain why the jQuery approach exhibits low cohesion
|
L2 |
React- Explain the purpose of theVirtual DOM in React
- create Virtual DOM elements using React and display them using
ReactDOM
|
L3 |
React JSX- define "transpiling"
- explain the purpose of the Babel transpiler
- explain the purpose of React JSX
- explain how React Components improve cohesion
- use Babel to transpile React JSX code into pure Javascript
|
10 |
L1 |
HTML5: Geolocation
- become familiar with JavaScript code that accesses the Geolocation services of
the Document Object Model
|
L2 |
HTML5: Audio and Video
- become familiar with JavaScript code that accesses the Audio and Video services
of the Document Object Model
|
L3 |
|