Hal yang harus diperhatikan dalam penggunaan AJAX adalah: XHTML dan CSS digunakan untuk menandai dan mempercantik tampilan informasi

MODUL 6 Implementasi Web dengan Database TUJUAN PRAKTIKUM : 1. Praktikan memahami prinsip penggunaan ajax. 2. Praktikan mampu mengkoneksikan ajax dengan database.

PERLENGKAPAN PRAKTIKUM 1. Modul Praktikum 2. Eclipse Indigo atau Helios 3. Apache Tomcat Server 7.0 4. Browser (Chrome atau Mozilla Firefox) 5. SQL Server 2008

LANDASAN TEORI Pengenalan AJAX AJAX merupakan singkatan Asynchronous Javascript dan XML. Ajax merupakan teknik pengembangan web untuk membuat suatu aplikasi web yang interaktif. Tujuannya adalah untuk membuat website agar lebih responsif, sehingga seluruh halaman web tidak harus di reload setiap kali pengguna meminta request. Istilah AJAX disebutkan pertama kali oleh Jesse James Garrett pada Februari 2005. Garrett menemukan istilah AJAX ketika ia menyadari perlunya nama untuk mewakili representasi dari teknologi yang diusulkan untuk customer. Hal yang harus diperhatikan dalam penggunaan AJAX adalah: •

XHTML dan informasi.

CSS

digunakan

untuk

•

XMLHttpRequest objek yang digunakan untuk pertukaran data asynchronous dengan web server.

Modul Praktikum Web Based Programming

menandai

Page 1

dan

mempercantik

tampilan

• •

XML, JSON (JavaScript Object Notation) atau teks biasa yang digunakan untuk mentransfer informasi antara server dan client. DOM (Document Object Model) digunakan dengan bahasa scripting client-side, misalnya Javascript atau JScript, untuk menampilkan secara dinamis dan interaksi dengan informasi yang disajikan.

Sebuah aplikasi yang menggunakan AJAX akan menghilangkan sifat kaku dari interaksi di Web dengan memperkenalkan middleware yang biasa disebut AJAX Engine, antara pengguna dan server. Selain memuat halaman web pada awal sesi, browser akan mengeload AJAX Engine yang dituliskan dalam JavaScript. Engine ini menyediakan user interface dan protokol komunikasi asynchronous dengan server. Asynchronous communication ini akan membuat user jarang menemukan halaman browser yang blank (kosong),akan tetapi menunggu server mengembalikan hasilnya.

Dalam aplikasi AJAX, setiap user action yang biasanya akan menghasilkan HTTP request mengambil bentuk panggilan JavaScript untuk AJAX Engine. Jika mesin membutuhkan sesuatu dari server dalam Untuk merespon, seperti mengirimkan data untuk diproses, memuat tambahan kode interface, atau mengambil data baru, mesin akan membuat asynchronous request, biasanya menggunakan XML atau JSON (JavaScript Object Notation). Namun, pendekatan ini tidak menjamin penggunaan yag nyaman untuk semua aplikasi. Jika kebanyakan operasi adalah data-intensif dan memerlukan banyak interaksi dengan server, keuntungan dari implementasi aplikasi web menggunakan AJAX akan sangat tipis. Modul Praktikum Web Based Programming

Page 2

AJAX memiliki kelebihan sebagai berikut. 1.

Pemanfaatan Bandwidth Dengan menghasilkan HTML secara lokal dalam browser, dan hanya mendownload panggilan Javascript dan data actual dari server, halaman web AJAX memuat lebih cepat karena payload ukurannya lebih kecil.

2.

User Interface yang Lebih Responsif Halaman menggunakan AJAX berperilaku lebih seperti aplikasi mandiri dari halaman web yang khas. Halaman akan diperbaharui secara dinamis sehingga memungkinkan respon yang lebih cepat dalam interaksi dengan pengguna. Selain kelebihan, AJAX berikut. a) Browser Integrasi

juga

memiliki beberapa

keuntungan

sebagai

Halaman yang dibuat secara dinamis terkadang tidak sesuai dengan browser. Saat memperbaharui halaman web dinamis, pengguna akan sulit untuk pengguna untuk bookmark keadaan tertentu dari aplikasi. b)

Respon Waktu Interval antara permintaan pengguna dan respon server dipertimbangkan dengan hati-hati selama pengembangan AJAX.

c)

perlu

Search Engine Optimization Website yang menggunakan AJAX untuk memuat data harus diindeks oleh mesin pencari sehingga data yang diberikan setara dalam format yang dapat dibaca oleh mesin pencari, karena umumnya mesin pencari tidak mengeksekusi kode Javascript yang diperlukan untuk fungsi AJAX.

d)

Penyesuaian Javascript AJAX bergantung pada Javascript yang biasanya diterapkan secara berbeda oleh browser satu dengan yang lainnya. Karena itu, situs web yang menggunakan Javascript mungkin perlu diuji di beberapa browser untuk memeriksa masalah kompatibilitas.


Page 3

Koneksi ke Database Jika ingin mengakses database bisa menggunakan JDBC (Java Database Connectivity). JDBC adalah salah satu API (Application Programming Interface) Java yang digunakan untuk menangani koneksi ke database. Kelebihan JDBC : 1. Dapat mengakses beberapa Oracle, MySQL, Access dan lain-lain tergantung dengan jenis JDBC yang dipakai. 2. Dapat berjalan pada sembarang platform yang mempunyai Java Virtual Machine(JVM). Fungsi JDBC : 1. Membangun sebuah koneksi ke data source. 2. Mengirim statement ke data source. 3. Mengeksekusi hasil dari statement.


Page 4

CONTOH Langkah-langkah adalah sebagai berikut : 1. Buka eclipse pada computer dan masuk ke workspace praktikan masing-masing 2. Buat package model dan buat file user.java


Page 5

3. Pilih folder WebContent lalu buat index.jsp Ketikkan syntax berikut :


Page 6


Page 7

4. Pilih folder WebContent lalu buat input.jsp Ketikkan syntax berikut :


Page 8


Page 9

5. Pilih folder WebContent lalu buat view.jsp Ketikkan syntax berikut :


Page 10

6. Buat package controller, kemudian buat servlet PraktikumDB.java Ketikkan syntax berikut :


Page 11


Page 12

7. Buat package berikut:

database,

kemudian buat DatabaseAkses.java


Page 13

Ketikkan syntax


Page 14


Page 15


Page 16

8. Pada Package Database, buat file UserService.java. Kemudian ketikkan code berikut:

9. Aktifkan Apache dan MySql di XAMPP Control Panel. 10. Buat Database “db_kereta”. OK 11. Buat tabel dengan nama “tb_user” dengan isi tabel seperti dibawah.

12. Run index.jsp


Page 17


Page 18

Hal yang harus diperhatikan dalam penggunaan AJAX adalah: XHTML dan CSS digunakan untuk menandai dan mempercantik tampilan informasi

Recommend Documents