| Week |
Session |
Preparation |
Due |
Topics |
Resources |
| 0 |
1
Thu Aug 31
|
|
- By the end of Day 1 class (We'll do most of these together):
- Sign and submit the contract (you will receive a printed copy in class)
|
- Course introduction
- Roll Call
- Establish in-class "lab partners"
- Install Relevant Tools
|
|
| 0 |
2
Fri Sep 1
|
- Review the Syllabus, bring questions to class.
- HTML & CSS (that stands for the HTML & CSS: design and build websites book) Skim Chapter 1
- HTML & CSS Chapters 2 and 3. Read these carefully.
- A lot of reading, but reading is all you have to do for this class for the first three sessions.
|
|
- HTML Structure, Text, and List elements
- br tag
- em and strong tags
- list tags
- Attributes and values
- Elements with no content and no closing tag
- hr tag
- dl, dt, and dd tags
- q and blockquote tags
- del and ins tage
- abbr and code tags
- sup and sub tags
- Exercises on Basic HTML
|
|
| 1 |
3
Tue Sep 5
|
- HTML & CSS Chapters 4, 5, and 8. Read these carefully.
|
|
- HTML link and image elements, extra markup
- Block vs. inline elements
- img tag
- link elements
- HTML character entities
- HTML Comments
- HTML-encoding text that contains special characters
- meta tag
- div and span elements
|
|
| 1 |
4
Thu Sep 7
|
- HTML & CSS Chapters 10, 11, and 12. Read these carefully.
|
|
- CSS Introduction
- Associating style rules with HTML elements
- CSS Properties affect how elements are displayed
- Two ways to incorporate CSS code
- CSS selectors
- How CSS rules cascade
- Inheritance
|
|
| 1 |
5
Fri Sep 8
|
|
- In-class quiz on Basic HTML
|
- Specifying colors with CSS
- How to specify colors
- Color terminology and contrast
- Background color
- Formatting text with CSS
- Size and typeface of text
- bold, italics, capitals, underlines
- Spacing between lines, words, and letters
|
|
| 2 |
6
Tue Sep 12
|
- HTML & CSS Chapters 13, 6, and 14. Read these carefully.
|
|
- The CSS Box model
- Control the dimensions of boxes
- Explain the CSS box model for borders, margin, and padding
- Create borders around boxes
- Set margins, and padding for boxes
- Display and hide boxes
|
|
| 2 |
7
Thu Sep 14
|
|
|
- Tables
- Creating HTML tables
- Determining what information suits tables
- Representing complex information in tables
- Using CSS to specify table width
- Adding borders and backgrounds to table cells
|
|
| 2 |
8
Fri Sep 15
|
- JavaScript & JQuery book: Chapters 1, 2. Read these chapters before class.
|
|
- How JavaScript makes web pages interactive
- What is a script and how to create one
- How computers fit in with the world around them
- How to write a script for a web page
|
|
| 3 |
9
Tue Sep 19
|
- JavaScript & JQuery book: Chapter 3. Read before class.
|
|
- Basic JavaScript Instructions
- JavaScript statements
- JavaScript comments
- JavaScript variables
- Basic JavaScript Instructions
- Data types JavaScript
- Operators in JavaScript
- JavaScript functions
- JavaScripts Objects and Methods
|
|
| 3 |
10
Thu Sep 21
|
|
|
|
|
| 3 |
11
Fri Sep 22
|
|
|
- JavaScript functions
- Write JavaScript functions that return one or more values
- Create anonymous functions in JavaScript using function expressions
- Immediately invoke function expressions
- Describe how memory and variables work in JavaScript
- Explore JavaScript function calling patterns
|
|
| 4 |
12
Tue Sep 26
|
- JavaScript & JQuery book: Skim Chapter 4, read chapter 5.
|
|
- JavaScript functions
- Explore JavaScript function calling patterns
- JavaScript Closures
|
|
| 4 |
13
Thu Sep 28
|
|
|
- Template literal
- Optional parameters and default values
- JavaScript Classes Objects
|
|
| 4 |
14
Fri Sep 29
|
|
- In-class quiz on JavaScript
|
- The Document Object Model
- The DOM tree
- The DOM is an API
- Locating nodes that represent the elements you want to work with
- Traversing the DOM
- Using an element's text content, child elements, and attributes
- Adding and removing elements from the DOM tree
- Working with attribute nodes
|
|
| 5 |
15
Tue Oct 3
|
- JavaScript & JQuery book: read chapter 6.
|
- Project Milestone 1. Initial Project Planning doc
- In-class exercise on DOM events
|
- DOM events
- What happens when an event occurs
- Different event types
- Steps of event handling
- Binding an event to an element
- Using parameters with event listeners
- Using properties of the event object
- Using methods of the event object
|
|
| 5 |
16
Thu Oct 5
|
- JavaScript & JQuery book: read chapter 8
- HTML & CSS book: read chapter 7
|
|
- Forms and AJAX
- How forms work
- Form controls
- HTML5 form controls and form validation
- AJAX and its use in asynchronous communication
- using jQuery AJAX wrapper to make AJAX requests
|
|
| 5 |
17
Fri Oct 6
|
- JavaScript & JQuery book: read chapter 7
|
- Project Milestone 2. Mocks
|
- jQuery
- What is jQuery and what are the merits of using it
- Ways to include jQuery in a web page
- Using CSS-style selectors and other jQuery selectors to select HTML elements
- Doing things with jQuery selection
- Rewriting JavaScript application using jQuery
|
|
| 6 |
18
Tue Oct 10
|
|
|
|
|
| 7 |
19
Tue Oct 17
|
- Read Express in Action book chapters 2, 8.1 - 8.2
|
|
- Node Javascript runtime
- Introduction to MongoDB
|
|
| 7 |
20
Thu Oct 19
|
- Read Express in Action book chapters 1, 3, 5
|
|
- Building server back-end application with express.js
- Describe the express framework
- Install express local in a project
- Start building a simple express application that interacts with a MongoDB database
|
|
| 7 |
21
Fri Oct 20
|
|
- Project Milestone 3. Sprint 0 Plan
|
- Building server back-end application with express.js
- Build and expose a back-end API with express.js, Node.js, and MongoDB
- Use Postman (an API testing tool) to test the back-end API
|
|
| 8 |
22
Tue Oct 24
|
|
|
- Express middleware & routing
- Express middleware
- How middleware works at a high level
- Express built-in middleware
- Third-party middleware libraries
- Various components of routing
- Route methods
- Route paths
- Route parameters
- Route handlers
- Response methods
- Different ways to do routing
|
|
| 8 |
23
Thu Oct 26
|
|
- Project Milestone 4. Datastore Model Object Design, Sprint 0 Results, and Sprint 1 Plan
|
- REST API
- What is REST?
- 6 constraints that characterize REST
- Rules for building a REST API
- Associating status codes with responses to REST API requests
|
|
| 8 |
24
Fri Oct 27
|
|
|
- Connecting front-end application with back-end
- Single-origin policy
- Supporting cross-domain requests
- Providing CORS support in back-end server
- Using Ajax in front-end application to request data from remote back-end server
|
|
| 9 |
25
Tue Oct 31
|
|
- Project Milestone 5. Sprint 1 Results and Sprint 2 Planning
|
|
|
| 9 |
26
Thu Nov 2
|
|
|
- Review for exam 3
- Pushing a website live on the Internet
- Deploying a server API application to Heroku
- Deploying a database to mLab
- Connecting a server back-end application to a mLab hosted database
- Deploying a front-end web application to Firebase
|
|
| 9 |
27
Fri Nov 3
|
|
|
|
|
| 10 |
28
Tue Nov 7
|
|
|
- Completion of Web app deployment lab
- Project work time
|
|
| 10 |
29
Thu Nov 9
|
|
|
- Modules, libraries, frameworks and other tools that can facilitate creativity and productivity
- Course evaluation
- Project work time.
- Show me current state of your project.
|
|
| 10 |
30
Fri Nov 10
|
|
- Project Milestone 7. In-class Final Presentation
Project Milestone 8a. Technical Documentation
Project Milestone 8b. Code Submission
Project Milestone 9. Evaluations
|
- Project demos/presentations; attendance is required.
|
|