ProfBurnett.com - Master a Skill / Learn for Life

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

Week Outline:

Session 19

  • JavaScript Object Notation (JSON)

Session 20

  • Asynchronous JavaScript And XML (AJAX)

Session 21

  • Chapter 8 - Responsive Web Design (RWD)

Class Presentations, Exercise Files & Solution Sets

Session, Chapter Presentation, Examples Zip, and Solution Set Zip
Session Chapter PowerPoint Presentation Exercise Files Exercise Solutions
XIX JSON Session XXI
XX w3School - AJAX
XXI Chapter 8 - How to Use Responsive Web Design (RWD) Chapter 8
 		Chapter 8

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.
    Use the code from the w3School JSON Server example
    (https://www.w3schools.com/js/js_json_server.asp)
  • 2. Create a JSON Array Call using your XML data file.
    Use the code from the w3School JSON Server example
  • 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 - AJAX XML DOM Request

  • 1. Use your XML file created in Session 18
  • 2. Create a AJAX Application from your XML file.
    See AJAX Applications on w3Schools Site
    (https://www.w3schools.com/js/js_ajax_applications.asp)
  • 3. Students will upload AJAX Application to development site.
  • 4. Students will preview AJAX Application on development site.
  • 5. Students will upload development site to live site.
  • 6. Students will preview live site in browser.

Session 21

Student Exercise 1

  • 1. Complete Chapter 8 - Exercise 8-1, Page 317 using Dreamweaver.
  • 2. Download Chapter 8 exercise zip file to your desktop.
  • 3. Unzip Chapter 8 exercise zip files and folders into your local development Chapter 8 folder.
  • 4. Students will upload test files to development site.
  • 5. Students will preview in browser development files.
  • 6. Students will upload files to live site.
  • 7. Students will preview in browser live files.

Additional Support Exercises

LinkedIn Exercises

LinkedIn JavaScript & jQuery Beginner Exercises
Session Chapter Level Course
V 8 Beginner jQuery Essential Training
V 8 Beginner jQuery for Web Designers
V 8 Beginner jQuery Mobile Essential Training

Additional LinkedIn Beginner Exercises

LinkedIn JavaScript & jQuery Beginner Exercises
Session Chapter Level Course
Beginner JavaScript: Patterns
Beginner jQuery: Building an Interface

w3School Exercises

Effect Exercises

Gur99 Exercises

SoloLearn Exercises

Advanced and Master LinkedIn Exercises

Session I Support Links

W3CSchools.com

jQuery

jQuery Alternatives

jQuery Form

jQuery Plugins

jQuery Carousel Plugins

jQuery Slideshows Plugins

jQuery Displaying Images Plugins

jQuery Plugins from Malsup

jQuery UI Widget Factory

Free Web Design IDEs

Free Web Development IDEs

Cloud-Based Web Development Sites

Online Website Builder Sites

How Browsers Work

Colleges and Universities