AJAX Tutorial Part 1: What is AJAX?

[JohnQ]

" When you teach, you understand " - My dad

 

I am a 3rd year Computer Science student ( One more year till I get my degree ). I am going away from home for 5 months, Project-related. I decided to start this to fill in my free-time abroad. I am also doing this so I don't forget about everything that I've learned. This, I feel is useful . Feel free to correct me if you spot any errors.

 

What is AJAX?

 
You know how any requests you make on any web pages requires a full page reload? and then you have the same contents with just small extra information added.
 

 
AJAX (Asynchronous Javascript and XML) is a technique of making requests to the server asynchronously (i.e. behind the scene without affecting other functioning parts of a system)
 

AJAX makes use of old existing technologies (i.e. Javascript, XMLHTTPRequest object, HTML and CSS) . The idea of loading data asynchronously have been around since HTML 1, but the technique used an outdated concept of using a frame or iframe HTML element. Unlike standard requests to server, AJAX allows a single web page to make concurrent requests at any time. This allows a more responsive and dynamic web system.

 
What do we have so far from the text above?
 
- Requests are usually for the content that is needed by a user.
 
- Response are then displayed on specific part of a web system without affecting the other existing content.
 
- Unlike standard requests to server, AJAX allows a single web page to make concurrent requests at any time.
 
The idea of loading data asynchronously have been around since HTML 1, but the technique used an outdated concept of using a frame or iframe HTML element ( I have never done this before but for those did, can please share? )
 
An illustration:
 

 
Technologies involved in an AJAX-driven web systems:

• XMLHttpRequest: To make requests to server
• Javascript: To handle responses from server
• Server-Scripts: To handle requests from client
• HTML: To structure the result
• CSS: To style the result 

 

Here's an overview:

 

Next : AJAX Tutorial Part 2: XMLHttpRequest Response

[Guest]

A soccer club.