Tugas mata kuliah Teknologi Web (lagi). Kali ini bertema wrapper. Bahasa sederhananya mengekstrak informasi dalam suatu halaman website dan menyimpannya ke dalam bentuk yang dapat dibaca oleh komputer. Di sini kami ditugaskan untuk mengektrak informasi tersebut menggunakan manual wrapper berbasis java dan filenya disimpan dalam bentuk XML agar bisa diintegrasikan menggunakan sistem pencarian lucene seperti tugas sebelumya (re: FindLyrics)
Kali ini patner kelompokku: Qiqi dan Lewis. Setelah berkali-kali gonta-ganti website, akhirnya kami memutuskan untuk mengektrak informasi UKM (Usaha Kecil dan Menengah) yang ada di salah satu halaman www.jakarta.go.id. Berikut screenshotnya, untuk lebih jelasnya bisa klik http://www.jakarta.go.id/jakv1/ukm/index/
Kita (atau manusia) ketika melihat halaman tersebut tentu bisa langsung tau kan, oh nama perusahaannya ini, alamatnya di sini, nomor teleponnya sekian sekian, dan seterusnya. Agar komputer juga bisa menangkap informasi dalam halaman tersebut maka kita perlu membuat program wrappernya, sehingga komputer mengerjakan bagian yang sulit, manusia mengerjakan bagian yang mudah, bukan sebaliknya.
Langkah pertama yang perlu kita lakukan adalah menentukan start mark dan end mark dalam struktur html sebagai penanda field yang ingin kita ambil informasinya. Ini pekerjaan yang bisa dibilang susah-susah gampang. Gampang kalau struktur html websitenya rapi, kalau enggak ganti website aja *eh. Hehehe.
Untuk memudahkan pencarian penanda ini sebaiknya menggunakan menu Tools > Developer Tool pada browser Chrome atau klik kanan Inspect Element pada Firefox. Contoh penggunaannya seperti gambar di bawah. Ketika kode di htmlnya kita sorot, maka bagian website yang dimaksud akan diblok.
Pada gambar tersebut dapat kita lihat untuk field nama start mark-nya <b> dan end mark-nya </b>. Lakukan langkah yang sama untuk mengekstrak informasi-informasi lainnya yang terdapat dalam website. Di sini kami mengekstrak 11 field, yaitu nama, alamat, kecamatan, kota, nomor telepon, kegiatan usaha, keterangan usaha, badan hukum, nomor SIUP dan NPWP. Berikut contoh data yang berhasil kami ekstrak dalam XML file.
Sebenarnya pada website tersebut terdapat ribuan halaman, tapi kami hanya mengambil informasi UKM dari 100 halaman pertama saja, karena keterbatasan waktu dan kecepatan koneksi yang you-know-what -_-
Lagi-lagi untuk mengerjakan tugas ini kami hanya diberi waktu 1 minggu. Makin banyak yang ngoding iya sih jadi makin ribet, tapi ya emang harus dimanfaatkan seluas-luasnya sumber daya yang ada, salah satu jalannya dengan bagi tugas. Waktu buat wrappernya bareng-bareng, trus buat pernak-pernik lucene search enginenya bagi tugas. Aku kebagian buat highlight dengan class yang udah disediain java, jadi ga perlu nambah library highlight dari lucene segala.
Hilitenya baru bisa jalan dengan benar H-2 jam deadline pengumpulan tugas dari pak ketua. Pagi-pagi pas baru bangun tidur tiba-tiba dapet ilham, trus langsung buka laptop ngoding. Ckckk. Berhari-hari sebelumnya codingannya gagal terus, padahal udah yakin bener codingnya, sampai liat video tutorial demi pernak-pernik yang satu ini. Alhamdulillah ga sia-sia, malam sebelumnya pas ngumpul udah pengen nyerah aja merelakan tanpa hilite berhubung cara yang satunya juga ga bisa dipakai. Intinya jangan berhenti penasaran aja sebelum codingan kita berhasil :D
UKM Searcher ini adaptasi dari FindLyrics, jadi ya tampilannya cuma ganti kulit, tapi tetep ada pernak-pernik tambahannya juga kok :D
Fitur tambahan pertama, menu search by category, karya sentuhan tangan saya pfft. Sebenernya lucene udah menyediakan fitur ini, jadi kita tinggal memasukkan keyword "kecamatan:jatinegara" untuk memfilter pencarian hanya berdasarkan "kecamatan". Kodingnya tinggal nambahin depannya doang :v
Fitur tambahan kedua, bagian list drop down keyword itu, karya lewis, tapi masih terbatas drop down keyword buat nama perusahaan aja. Kodingnya lumayan panjang, nanti kalau rajin belajar mempersingkat kodingnya kali ya :D
Re-coding highlight. Waktu pernak-pernik yang ini jalan dengan baik dan benar tuh rasanya... :3 Ohiya, keliatan kan tampilannya jauh lebih rapi? Nah, itu dikoding juga htmlnya pakai tabel, karya lewis. Untuk liat 1 dokumen aja mesti di-scroll, layar programnya harusnya digedein kali ya, atau dibikin list nama aja dulu, trus waktu diklik baru muncul selengkapnya. Oke, ditampung dulu idenya.
Nah, bagian koding Qiqi dibalik layar, ga keliatan langsung di user interface-nya. Kodingnya melakukan pengecekan lastModified. Jadi, programnya ga melakukan wrapping terus menerus setiap kali programnya dijalankan, trus juga ga melakukan indeks terus setiap programnya di-run. Cukup dicek, kalo lastModifiednya berubah baru dia mengindeks.
Tadi pagi (11/02/2014) semua kelompok kebagian jatah presentasi program, ga kayak tugas sebelumnya, berhubung sebelumnya presentasi di depan dosen pengganti. Entah kenapa menyukai sesi presentasi program ini, ibaratnya mendapat sebuah penghargaan dengan mempresentasikan sesuatu yang udah kita buat dengan susah payah selama seminggu terakhir. Meskipun ditanya-tanya tentang program itu dan kelabakan jawabnya. Menarik. Bisa liat karya temen-temen yang lain juga, jadi bisa menambah wawasan lah gimana bentuk program itu sebaiknya dibuat.
Okee, sekian presentasi tertulisnya. Selamat dini hari. Cepat datang wahai kantuk.
Tidak ada komentar:
Posting Komentar