Ajax, what is it?
Beberapa dari anda mungkin sudah familiar dengan istilah Ajax. Yang pasti bukan Ajax Amsterdam, tapi
Asynchronous JavaScript and XML, salah satu teknologi pengembangan web yang memang lagi populer di kalangan web developer.
Jika anda salah seorang web developer, tentunya anda tahu dengan baik konsep web yang
refresh-based itu... Setiap kali click sesuatu, entah itu link, entah itu button, pasti page-nya bakal pindah atau refresh. Inilah yang ingin dihindari, karena
refresh yang terlalu sering jadi tidak enak dipandang mata (karena
flicker-effect), lagipula bisa memboroskan
bandwidth.
The birth of <frame>
Dulu sempat ada konsep <frame> di html. Intinya, suatu halaman web dipecah jadi beberapa bagian, dan masing-masing bagian itu diproses secara terpisah. Contoh gamblangnya bisa anda lihat di
Java API.
Konsep <frame> ini tadinya diharapkan bisa menghemat bandwidth dan mengurangi
flicker-effect dari suatu web. Tapi ternyata lama-lama konsep ini ditinggalkan. Gw sendiri kurang tahu apa sebabnya, tapi menurut gw sih konsep frame ini menyebabkan komunikasi antar frame jadi sulit.
Nah, Ajax yang belakangan ini populer datang untuk menggantikan frame. Tujuannya kurang lebih sama, tapi implementasinya jauh lebih baik daripada frame.
How does it work?
In a nutshell, Ajax memanfaatkan teknologi JavaScript untuk melakukan request di background, menunggu response secara
asynchronous (hence it's name), dan -setelah responsenya datang- menampilkan hasilnya di web tanpa me-refresh halaman.
Sebagai catatan, response yang diberikan oleh server adalah dalam format XML, walau sebenarnya bisa juga berbentuk
plain-text biasa, seperti pada contoh yang nanti akan gw berikan.
Untuk melakukan implementasi Ajax, anda perlu mengetahui sedikit (sedikit, tidak perlu banyak) tentang Javascript dan XML. Di Javascript, yang penting udah ngerti cara bikin fungsi, looping, yah basic-basicnya ajalah. Kalo XML malah ga perlu belajar menurut gw, cukup mengerti konsepnya saja.
Gw sangat menganjurkan buku
Ajax for Dummies, karena penjelasan mengenai Ajax-nya sangat bagus. Selain itu, buku itu juga menjelaskan apa itu Javascript dan XML, jadi bagi yang newbie di kedua teknologi ini ga perlu kuatir.
Example
OK, sekarang gw bakal kasi contoh paling sederhana dari implementasi Ajax.
Misalkan kita akan membuat "Hello World" di suatu halaman web. Pertamanya halaman web ini kosong. Terus kita tekan satu tombol, lalu muncul tulisan "Hello World", tapi bukan pake JavaScript doang, tapi melibatkan request ke server, misalnya ke PHP.
Pertama-tama, kita buat file
index.html. Ini adalah halaman web yang akan kita akses.
file: index.html<html>
<head>
<script type="text/javascript" src="ajax.js">
</script>
</head>
<body>
<div id="isi">Bakal muncul di sini...</div>
<input type="button" value="Hello!"
onClick="sayHello()" />
</body>
</html>
Lalu kita siapkan file PHP yang nantinya akan dipanggil oleh si Ajax...
file: hello.php<?php
echo "Hello World <br>";
echo "Now is: " . date("r", time());
?>
Terakhir, javascript-nya... Nah yang ini kelihatannya agak ribet, tapi anda baca saja commentnya. Yang ini gw kasi dalam bentuk image, supaya ada
syntax highlighting-nya. Lagipula server gw tidak mengizinkan tulisan-tulisan berbau X M L H t t p R e q u e s t, ga tau kenapa...
Kalau mau
copy-paste,
ambil di sini.
file: ajax.js
We're done!
Code-code di atas silakan anda
copy-paste untuk dicoba. Jangan lupa untuk meletakkan ketiga file dalam 1 folder yang sama.
Selamat mencoba Ajax!
2 hari yang lalu, cita-cita gw untuk menonton Final Fantasy VII Advent Children akhirnya terpenuhi juga. Setelah kira-kira 1 minggu bekerja keras menamatkan FF7, pada akhirnya terbayar juga dengan tontonan full CGI yang semua tokohnya terlihat "cantik" itu.
Yang membuat gw lebih puas adalah kemunculan karakter-karakter optional, yaitu Yuffie Kisaragi (my favorite!!!) dan Vincent Valentine. Gw kira kedua karakter ini tidak akan muncul, seperti pada ending movie-nya FF7. 
) Udah gw ulang ampe berkali-kali msh tetep crash di situ juga...
