Session 11 - JavaScript, Part 4

Harvard Extension School  
Fall 2020

Course Web Site: https://cscie12.dce.harvard.edu/

Topics

  1. XHR or Ajax
  2. Data Formats - JSON
  3. JSON - Creating Content with jQuery
  4. Let's make a more generic JS Function
  5. Creating Content with Ajax, jQuery, and JSON
  6. Same Origin Policy and CORS
  7. Other Data Formats for Ajax
  8. Javascript Templates
  9. JavaScript Templates - Example
  10. JavaScript Templates - Apple Picking
  11. JavaScript Templates - Courses
  12. Course Search Example - Live!
  13. Handlebars - A few more notes
  14. Handlebars - Compiled Templates
  15. JavaScript Frameworks
  16. Maps
  17. Google Maps JavaScript API
  18. Map with Several Markers
  19. Javascript Helping with Navigation
  20. Final Project - Scope and Structure

Session 11 - JavaScript, Part 4, slide1
XHR or Ajax, slide2
What the browser does, slide3
What the server does, slide4
A Collection of Technologies, slide5
What can you do with Ajax/XHR?, slide6
Ajax Enables, slide7
Data Formats - JSON, slide8
JSON - Creating Content with jQuery, slide9
Let's make a more generic JS Function, slide10
Creating Content with Ajax, jQuery, and JSON, slide11
Same Origin Policy and CORS, slide12
Same Origin Policy, slide13
CORS - Cross Origin Resource Sharing, slide14
Other Data Formats for Ajax, slide15
XML - eXtensible Markup Language, slide16
HTML, slide17
Javascript Templates, slide18
Better with Templates!, slide19
JavaScript Templates - Example, slide20
JavaScript Templates - Apple Picking, slide21
JavaScript Templates - Courses, slide22
Course Search Example - Live!, slide23
Handlebars - A few more notes, slide24
Handlebars Conditionals, slide25
Handlebars - Compiled Templates, slide26
JavaScript Frameworks, slide27
Vue, slide28
Maps, slide29
Embed a map created using Google's Tools, slide30
Google Maps JavaScript API, slide31
Placing a Marker, slide32
Marker with an Information Window, slide33
Map with Several Markers, slide34
Javascript Helping with Navigation, slide35
Navigation , slide36
"You are here" with CSS, slide37
"You are here" with JavaScript, slide38
Clamshell Navigation, slide39
Final Project - Scope and Structure, slide40
Elements of User Experience Planes, slide41
Scope, slide42
Content, slide43
Think About the User, slide44
Structure, slide45
Structuring Content, slide46
Organize, slide47
Structural Models, slide48
Hierarchical, slide49
Biological, slide50
Skeleton, slide51
Page Components, slide52
Wireframes and Sketches - "Low" to "High" Fidelity, slide53
Navigation Systems, slide54

Presentation contains 54 slides