ProfBurnett.com - Master a Skill / Learn for Life

ITI 481 Front-End Web Development Certification Program - Week 10

Week Outline:

Session 19

  • JavaScript Object Notation (JSON)

Session 20

  • Asynchronous JavaScript And XML (AJAX)

Class Presentations, Exercise Files & Solution Sets

Session, Chapter Presentation, Examples Zip, and Solution Set Zip
Session Chapter PowerPoint Presentation Exercise Files Solution Set Files
XIX w3School - JSON
XX w3School - AJAX

Class Exercises

Session 19

Student Exercise 1 - Create JSON File

  • 1. Create a contacts JSON file using your XML data file.
  • 2. Students will upload JSON file to development site.
  • 3. Students will preview development site.
  • 4. Students will upload development site to live site.
  • 5. Students will preview live site.

Student Exercise 2 -

  • 1. Create a JSON Object Call using your XML data file.
  • 2. Create a JSON Array Call using your XML data file.
  • 3. Link the JSON Object Call and the JSON Array Call to your homepage.
  • 4. Students will upload JSON Call pages to development site.
  • 5. Students will preview JSON Call pages on development site.
  • 6. Students will upload development site to live site.
  • 7. Students will preview live site.

Session 20

Student Exercise 1 - Enhance Flickr AJAX App

  • 1. Complete Chapter 12-1 Enhance Flickr Application on page 369.
  • 2. Students will upload Enhance Flickr Application to development site.
  • 3. Students will preview in browser development site.
  • 4. Students will upload development site to live site.
  • 5. Students will preview live site.

Student Exercise 2 - AJAX XML DOM Reques

  • 1. Create XML data file that has five node elements and 8 child nodes.
  • 2. Name your xml file {Filename_Your_Name.xml} - e.g. – music_jane_doe.xml or musicJaneDoe.xml.
  • 3. Display data in an HTML table using Retrieve the content of an XML file as guide and getCatalog.html file template.
  • 3. Students will upload xml file to development site.
  • 4. Students will preview xml file on development site.
  • 5. Students will upload development site to live site.
  • 6. Students will preview live site in browser.

Additional Support Exercises

LinkedIn Exercises

LinkedIn XML-JSON-AJAX Session I Exercises
Session Chapter Level Course
I Beginner XML Essential Training
I Beginner Working with Data on the Web

w3School Exercises

Gur99 Exercises

Session I Support Links


Colleges and Universities