Introduction to AJAX with JavaScript: Part 1 What is Asynchronous Communication? (with code!)

AJAX (Asynchronous JavaScript and XML) is an technique that combines a set of known technologies in order to create faster and more user friendly web pages. It provides the ability to update small parts of your web application without having to reload the entire page. It is mechanism that allows web pages to feel and act like applications.

Please feel free to fork and use however you like!

This introduction is the first of a two part series that will teach you what asynchronous communication is, why we would want to use it, and a bit of background on the history. We will look at the original way that AJAX worked using the XMLHttpRequest object and explore the process through example. In the second video in the series we will see how it has evolved and apply the most modern version, the JavaScript fetch() API and Promises.

AJAX uses:
- Javascript (for altering the page)
- Create a Ajax object
- Making a request
- Handling the server response
- XML, JSON or other markup/notation for information exchange
- Transport of messages (request and response)
- Server side (Java, PHP, .net, Node etc)
- Receives the message from the client, does something (usually lookup / save information), sends the response.

[michaelcooper]

I've been programming for 43 years and rarely do I find such a clean, straightforward explanation. So many examples use this, but the syntax has confused me. You cleaned all of that up for me without any confusion at all. All the syntax I've used in a rote fashion makes total sense to me. Thank you.

[LetsGeTDeep]

Really good.

Would appreciate more Vanilla JS videos from you!