SE-2840 Web Application Development

Daily Detailed Outcomes

Week Day Topic
1 L1 Foundations of the WWW
  1. describe the purpose of a web client, such as a browser
  2. describe the purpose of a web server
  3. describe how HTTP is used to implement the www Request/Response model of web client/web server communication
  4. for each of the HTTP methods (e.g. GET, POST, HEAD, etc), describe the purpose of the method
  5. Explain what a "markup language" is
  6. Describe the history and various versions of HTML
  7. Describe the difference between HTML and XHTML
L2 HTML
  1. Use the various HTML tags, such as <h1>, <body>, <div>, <table> etc to create a document
  2. Explain the difference between Block elements and Inline elements
  3. Describe how HTML validators are used to check compliance of HTML markup to a standard
  4. describe how a browser can parse validated HTML document and model it as a hierarchical structure of various objects
L3 CSS
  1. Explain how a browser renders HTML elements
  2. Explain the difference between content and presentation of an HTML document
  3. Use HTML element attributes, such as "class" and "id" in CSS style rules
  4. Use CSS style rules to specify the appearance of an HTML document
  5. Explain how CSS validators are used to check compliance of CSS to a standard
2 L1 Introduction to JavaScript
  1. describe the primary elements and features of the JavaScript language
  2. define typeless variables
  3. write javascript functions
  4. assign a javascript variable to a function
  5. embed JavaScript into an html document
L2 The Browser Object Model
  1. describe how the browser models various objects, which are presented through an object-oriented API accessible via JavaScript
  2. write JavaScript code that accesses the Browser Object Model to perform various functions
L3 The Document Object Model and JavaScript
  1. describe how a browser can parse validated HTML
     document and model it as a hierarchical structure of various objects that are accessible via JavaScript
  2. write JavaScript code that accesses the Document Object Model to perform various functions
3 L1 Dynamic HTML
  1. write JavaScript code that accesses the Document Object Model to modify the content of an HTML document
L2 DOM Events and JavaScript
  1. write JavaScript code that responds to events, such as button clicks, originating from the DOM
L3 CSS layout
  1. Describe the "cascade" in terms of how a browser interprets/prioritizes multiple CSS rules
  2. Describe how to specify different CSS rules depending on browser target
  3. Describe CSS specifiers, media selection, layout, and positioning
  4. Explain how the CSS rules specifying static, relative, absolute, fixed, and float affect the position of various HTML elements.
4 L1 jQuery
  1. Describe how jQuery uses a "selector" mechanism to locate DOM elements
  2. Explain/write jQuery selector expressions that access DOM elements
L2 jQuery
  1. Explain/write jQuery code to respond to DOM events
L3 jQuery
  1. Explain/write jQuery code to animate (ie move) the position of a DOM element
  2. HTML5: The <canvas> element
    1. write JavaScript code that accesses <canvas> to draw free-form graphics
5 L1 JSON
  1. Explain how data is represented in JSON
  2. Write JavaScript code that extracts data from a JSON document
L2 Ajax with jQuery
  1. Write jQuery code to execute Ajax methods
  2. Explain the difference between synchronous and asynchronous Ajax invocation
  3. Write jQuery code to execute Ajax methods asynchronously
L3 Exam
6 L1 Server-side Javasdript: NodeJS
  1. Write, execute, and debug NodeJS applications
L2 Server-side Javasdript: NodeJS
  1. Explain the purpose of the Node Package Manager (NPM)
  2. Use NPM packages in a NodeJS application
  3. Explain the purpose of package.json and what is found within that file
  4. Explain the purpose of the node_modules folder and what is found within that folder.
L3 NodeJS web server
  1. write a server using server-side JavaScript
7 L1

NodeJS and Express

  1. Explain the purpose of the Express package
  2. write a server using NodeJS and Express
  3. Implement favicon support
  4. Implement routes using app.get()
L2

NodeJS and Express

  1. Explain HTTP GET vs HTTP POST
  2. Explain how forms communicate form data to a NodeJS server
  3. Implement routes using app.get()
  4. Implement routes using app.post()
L3

NodeJS and Express, continued

8 L1 MongoDB
  1. Explain the advantages of using a database such as MongoDB to store persistent data over a simple in-memory data store
  2. Use the Mongo command-line client to create and modify databases, collections, and documents.
L2 MongoDB
  1. Implement MongoDB access from within a NodeJS application using the Mongoose package

 

L3 no class
9 L1 Web Frameworks
  1. Explain some disadvantages of the jQuery approach to implementing client-side Javascript
  2. Explain the purpose and motivation for typical Web Application Frameworks such as React
  3. Explain why the jQuery approach exhibits low cohesion
L2 React
  1. Explain the purpose of theVirtual DOM in React
  2. create Virtual DOM elements using React and display them using ReactDOM
L3 React JSX
  1. define "transpiling"
  2. explain the purpose of the Babel transpiler
  3. explain the purpose of React JSX
  4. explain how React Components improve cohesion
  5. use Babel to transpile React JSX code into pure Javascript

 

10 L1 HTML5: Geolocation
  1. become familiar with JavaScript code that accesses the Geolocation services of the Document Object Model
L2 HTML5: Audio and Video
  1. become familiar with JavaScript code that accesses the Audio and Video services of the Document Object Model
L3