AJAX Basics
AJAX is an important front-end web technology that lets JavaScript communicate with a web server. It lets you load new content without leaving the current page, creating a better, faster experience for your web site’s visitors. In this course, you’ll learn how AJAX works and how you can use JavaScript to communicate with a web server. We’ll use plain JavaScript as well as jQuery to create AJAX requests and use the response to dynamically update your web pages. Along the way, you’ll build mini-projects to reinforce your learning. We wrap up the course with a small project, showing you how to apply what you’ve learned to pull images from Flickr and display them on your web site.
AJAX Concepts
You’ll learn the basics of AJAX, see how Google, Twitter and Reddit use AJAX to make their sites more responsive and interactive, and master the four steps of an AJAX request.
Introducing AJAX – 5:02
How AJAX Works – 4:45
A Simple AJAX Example – 10:46
GET and POST – 6:21
AJAX Response Formats – 3:42
AJAX Security Limitations – 5:26
Programming AJAX
Learn to use callbacks to respond to server responses, how the JSON format works and how to use JavaScript to parse JSON data. Build a simple “employees status” widget for a company intranet.
Introducing the Project – 1:43
AJAX Callbacks – 6:51
Introducing JSON – 5:52
Parsing JSON Data – 7:33
Processing JSON Data – 8:14
Stage 2 Challenge – 1:52
Stage 2 Challenge Answer – 3:01
jQuery and AJAX
Learn how jQuery makes programming AJAX faster and more fun. You’ll learn the many different jQuery shorthand methods as well as other useful jQuery methods like $.each()
Introducing jQuery – 4:21
jQuery’s AJAX Shorthand Methods – 5:55
The Office Status Project Revisited – 9:01
Posting Data with jQuery – 5:06
The jQuery AJAX Method – 3:24
Handling Errors – 5:20
Stage 3 Challenge – 1:03
Stage 3 Challenge Answer – 2:49
AJAX and APIs
Learn how an API — Application Programming Interface — lets you retrieve information from another web site such as Twitter or Google Maps. In this stage you’ll build a photo search application that searches Flickr for photos and displays thumbnails of the images on a web page … using AJAX, of course!
What Is an API? – 2:33
Flickr’s API – 5:23
Beginning the Project – 2:57
Adding jQuery – 4:08
Making the AJAX Request – 6:29
Displaying the Photos – 6:36
Stage 4 Challenge – 2:57
Stage 4 Challenge Answer – 5:24