Bab 3 Metode dan Perancangan Sistem Dalam perancangan dan pengimplementasian e-Book Repository berbasis Web Crawler menggunakan HTML5, diperlukan perancangan sistem terlebih dahulu yang bertujuan untuk memberikan gambaran kepada pengguna tentang sistem yang akan dibuat serta memberikan informasi dan desain dari eBook repository berbasis Web Crawler menggunakan HTML5 tersebut. Pada bab ini akan dibahas seluruh tahap perancangan, mulai dari bahan dan materi yang dibutuhkann, metode penelitian yang digunakan serta beberapa penjelasan lainnya yang membuat tahap-tahap dalam mengerjakan penelitian.
18
19
3.1 Metode Perancangan Sistem
Start
URL Target
Proses Eksekusi Web Crawler
Kunjungi Setiap Level hingga selesai pada URL target
Tampilkan hasil Crawling
Proses Breadth First Crawling
Hasil disimpan pada Database
User melakukan Searching
Tampilkan hasil Search
End
Gambar 3.1 Metode Kerja Sistem
20
Tahapan-tahapan dari proses kerja sistem dapat dilihat pada gambar 4 dimulai dengan 1. Memilih URL target yang akan di Crawling 2.
Setelah itu proses eksekusi yang dilakukan oleh Web Crawler untuk mencari e-Book yang pada website yang telah ditentukan untuk di crawling.
3. Proses pencarian pada website,Web Crawler bekerja menggunakan algoritama Breadth First Crawling.Breadth First Crawlingmenelusuri setiap level yang berada pada website hingga selesai dan ditemukannya semua data berupa alamat URL. 4. Selanjutnya data hasil Crawlingakan ditampilkan dan disimpan di database. 5. User menginputkan kata kunci berupa keyword, dan sistem akan mencari kata kunci tersebut pada database, setelah ditemukan akan ditampilkan untuk di download
21
Gambar 3.2 Breadth-first crawling (Gozali & Faezal. 2004).
Breadth-first crawling adalah algoritma yang melakukan pencarian secara melebar yang mengunjungi link secara preorder yaitu mengunjungi suatu link kemudian mengunjungi semua link yang
bertetangga
dengan
link
tersebut
terlebih
dahulu.
Selanjutnya, link yang belum dikunjungi dan bertetangga dengan link yang tadi dikunjungi, demikian seterusnya Pada halaman utama terdapat link ke tiga buah halaman pada level-1 yaitu page-1, page-2 dan page-3 yang akan di indeks berikutnya. Setelah proses indeksing pada level-1 selesai barulah dilanjutkan pada level-2 dan selanjutnya. Keunggulan Breadth First Crawling yaitu: 1. Breadth First Crawling melakukan pencarian secara melebar sehingga data yang dikumpulkan lebih banyak. 2. Tidak akan menemui jalan buntu 3. Menjamin ditemukannya link (jika link memang ada) dan link yang ditemukan pasti lebih baik.
22
Jika ada satu link maka
Breadth First Crawling akan
menemukannya (Kustanto, mutia, Viqarunnisa, 2005).
3.2 Analisis Kebutuhan Analisis kebutuhan digunakan untuk mengetahui dan menterjemahkan semua permasalahan serta kebutuhan perangkat lunak dan kebutuhan sistem yang dibangun. Oleh karena itu, dalam tahap ini dilakukan proses pengumpulan data untuk membangun sistem. Analisis kebutuhan sistem perangkat keras dan perangkat lunak meliputi: 1. Perangkat lunak yang dibutuhkan yaitu: -
Adobe Dreamweaver CS5 dan Netbeans version 6.9.1
-
Sistem Operasi Window XP SP2 / Windows 7
-
Browser Mozilla Firefox version 10.1.1
-
WAMP5 2.2
2. Perangkat keras yang dibutuhkan yaitu: -
Prosesor Intel Pentium IV 3,6HZ atau lebih tinggi
-
Hardisk 10 GB
-
RAM 512 MB
-
Monitor
-
Keyboard dan Mouse
23
3.3 Perancangan Desain Sistem Perancangan sistem dibutuhkan untuk membantu proses pengembang dan untuk dokumentasi perangkat lunak sistem. Dalam perancangan sistem digunakan UML (Unified Modelling Language) yaitu sebuah bentuk modeling sistem yang telah menjadi standar dalam industri untuk visualisasi, merancang dan mendokumentasikan sistem piranti lunak. UML menawarkan sebuah standar untuk merancang model sebuah sistem. Untuk mendesain sistem Penerapan Web Crawler dalam Pencarian e-Book ini, digunakan 4 (empat) buah diagram yaitu, Use Case Diagram, Activiry Diagram, Sequence Diagram, dan Class Diagram. Use Case Diagram Use Case Diagram menggambarkan fungsionalitas yang diharapkan dari sebuah sistem. Yang ditekankan adalah “apa” yang diperbuat sistem, dan bukan “bagaimana”. Sebuah use case merepresentasikan sebuah interaksi antara aktor dengan sistem. Use case merupakan sebuah pekerjaan tertentu, seorang/sebuah aktor adalah sebuah entitas manusia atau mesin yang berinteraksi dengan sistem untuk melakukan pekerjaan-pekerjaan tertentu, use case diagram untuk penerapan Web Crawler dalam pencarian eBook oleh Gambar 3.3
24
<
>
<>
Download e-book
user
<<extend>>
<>
Search e-book <> <>
Run Crawler
Admin
Change URL target
Set Tag View e-book <<extend>> <<extend>> <<extend>> <<extend>>
update Tag
add Tag
delete Tag
show tag
<<extend>>
request e-book
Gambar 3.3 Use Case Diagram
Di dalam use case diagram terdapat 2 aktor yang terdiri dari admin dan user. admin bertugas melakukan running crawler. Setelah running crawler hasil dari pencarian akan di ditampilkan dan secara otomatis hasil tersebut disimpan database temporary yang selanjutnya akan diatur berdasarkan tag. Pada item tag admin menklasifikasikan hasil yang didapat dari proses running crawler ke tag yang ada, agar lebih mudah di dicari nantinya. Pada item tag admin dapat melakukan update tag, add tag, delete tag, dan show tag. Admin juga dapat melakukan change URL target, apabila URL tersebut tidak bisa di Crawling. User dapat melakukan search e-Book untuk mencari eBook sudah di simpan URL-nya di database temporary. User juga dapat melihat e-Book yang ada, yang telah diklasifikasikan
25
berdasarkan tag dan dapat request e-Book yang diinginkan bila eBook tersebut belum ada pada database
Activity Diagram Activity Diagram adalah diagram yang memperlihatkan aliran dari suatu aktifitas ke aktifitas lainnya dalam suatu bisnis yang baru. Activity Diagram digunakan untuk memodelkan aspek dinamis dari sistem. Secara umum activity diagram menggambarkan proses-proses yang terjadi dari dimulainya aktivitas sampai berhentinya aktivitas. Untuk kebutuhan proses dari sistem yang akan dibangun penulis hanya memakai 2 (dua) activity diagram yang terdiri dari admin dan user yang dapat di lihat pada gambar 3.4. Admin
Sistem
start
Logi n username / password i nvalid
Run Crawl er login success
set tag
add tag
update tag
show tag
delete tag
logout
end
Gambar 3.4 Activity Diagram Admin dan Sistem
26
Gambar 3.4 menggambarkan aktivitas-aktivitas yang terjadi pada sistem.
Aktivitas-aktivitas tersebut adalah, login, run
crawler, set tag, add tag, update tag, show tag, delete tag, dan logout. Pada activity diagram admin dan sistem, admin bertugas melakukan login, apabila admin salah memasukan verifikasi username dan password maka akan kembali ke menu login, tetapi benar memasukan verifikasi username dan password
maka
langsung ke menu utama run crawler. Pada item run crawler admin melakukan pengumpulan e-Book dari URL target. Admin juga
melakukan
manage
atau
pengelompokan
e-Book
berdasarkan tag pada item set tag. Di sini admin dapat melakukan add tag, update tag, show tag, delete tag. Setelah itu ada item logout untuk keluar dari forum admin. User
Sistem1
start
Download e-book Input Keyword
View e-book
end
Gambar 3.5 Activity Diagram User dan Sistem
27
Gambar 3.5 menggambarkan aktivitas-aktivitas yang terjadi antar user dan sistem. Aktifitas tersebut adalah input keyword, download e-Book, dan view e-Book. Pada aktivitas input keyword, user menginputkan kata kunci yang diingkan dan setelah ditemukan akan ditampikan secara otomatis pada menu Home. Setelah di temukan user melakukan aktifitas view e-Book atau dapat langsung melakukan download e-Book. User
Sistem
Admin
Prosesing request
Confirm Request
start
Request e-book
end
Gambar 3.6 Activity Diagram User, sistem, dan Admin
Pada gambar 3.6 adalah activity diagram menu Request. Aktivitas-aktivitas pada menu Request antara lain request e-book, prosesing request, dan confirm request. User mengirimkan request e-book pada admin, untuk selanjutnya diproses.
28
Sequence Diagram Sequence diagram menggambarkan interaksi antar obyek di dalam sistem. Sequence diagram menekankan pada urutan waktu saat interaksi terjadi. Sequence diagram terdiri atas dimensi vertikal (waktu) dan dimensi horizontal (obyek-obyek yang terkait). Dalam pengembangan sistem ini terdiri dari 2 (dua) jenis sequence diagram yaitu: sequence diagram admintrator dan sequence diagram user.
: user
SearchUI
ViewControl
: SearchControl
: dbebooktemporary
1: Input Keyword
2: search(keyword) 3: select ebook(tag)
4: Send file( Tampilkan)
5: Tampil Hasil() 6: view hasil()
Gambar 3.7 Sequence diagram user
Pada gambar 3.7 merupakan sequence diagram untuk proses kerja pada
user.
User
pertama kali
melakukan
penginputan kata kunci atau keyword pada seacrhUI. Dari seacrhUI sistem memproses permintaan user lewat kata kunci atau keyword yang dimasukan/diinputkan pada seacrhControl. Pada seacrhControl sistem memproses URL yang berada pada
29
dbebook/database yang telah tersimpan. Dari dbebook hasil dari URL yang telah tersimpan di tampilkan pada seacrhUI dan pada ViewControl, user dapat melakukan view pada isi e-Book tanpa harus mendownload isinya.
Login
: Admin
logout
: Running Crawler
: SearchControl
: URL target
: EditTag
: dbebooktemporary
1: login() 2: Crawler home() 3: Crawling() 4: Crawlering URL()
5: Tampilkan hasil
6: dbebook()
7: edit()
8: Logout
Gambar 3.8 Sequence diagram admin
Pada gambar 3.8 sequence diagram admin, admin pertama harus melakukan proses verifikasi atau login, sistem akan memproses permintaan login dari admin setelah proses login berhasil admin akan masuk di menu Home. Pada menu Home proses selanjutnya adalah running crawler dan admin memilih level kedalam yang akan di crawling dan memerintahkan sistem untuk memproses permintaan pada search control, dari searh control sistem akan meneruskan permintaan crawling pada URL target, setelah itu hasil akan crawling akan ditampilkan dan
30
simpan di dbebook/database. Hasil yang telah disimpan akan di manage atau di edit di menu EditTag. Untuk keluar dari sistem, admin dapat melakukan logout. Sehingga forum admin tertutup. .Class Diagram
Gambar 3.9 class diagram sistem
Pada gambar 3.9 class diagram sistem terdiri dari 2 kelas utama yaitu class e-Book dan class Request. Pada class Run Crawler UI mendapat class darixe-Book, class dari e-Book sendiri memiliki attribut yaitu id, site, link tag, tanggal serta title, sedangkan operations-nya adalah update, delete, insert. Class Run Crawler UI memiliki attribut CrawlerRusult dan operationsnya run dan insert. Home UI juga mendapat class dari e-Book. Home UI memiliki attribut searchResult dan searchInput dan operations-nya adalah search. Request UI mendapat class dari Request, Request UI memiliki attribut inputRequest dan operations-nya adalah save. Class Request sendiri memiliki
31
attribut tanggal dan request serta operations-nya yaitu update, delete, dan insert.
3.4 Peracangan Antarmuka 3.4.1 Rancangan Halaman Utama Rancangan halaman utama sistem e-Book Repository berbasis Web Crawler menggunakan HTML5. Pada menu utama, user dapat menginputkan kata kunci pencarian pada item text box dan mengklik button search atau menekan enter maka hasil pencarian akan di tampilkan pada item Hasil Crawling. Pada item request
user
dapat
merekomendasikan
e-Book
yang
diingkankannya kepada admin bila memang e-Book tersebut belum
tersimpan
pada
database.
Sedangkan
pada
item
administrator, admin bertugas untuk mengelola sistem serta menjalankan Web Crawler. Gambaran rancangan antaramu ditunjukan pada gambar 3.4.1.
32
Home
Request
Admin
PDF Repository | Search Search
Tags Tags
Tags Tags Hasil Search
1
URL
View
URL
View
URL
View
URL
View
2
3
Gambar 3.4.1 Halaman Utama
33
3.4.2 Rancangan Halaman Login Administrator Home
Request
Admin
PDF Repository | Administrator Login Username
Text Box
Password
Text Box Login
Gambar 3.4.2 Halaman Login Administrator
3.4.3 Rancangan Halaman Request Home
Request
Admin
PDF Repository | Request Textbox
Gambar 3.4.3 Halaman Request
34
3.4.4 Rancangan Halaman Administrator
RUN Crawler
Show Requesy
Edit Tags
PDF Repository | Run Crawler Site Pencarian
URL URL URL
Level Depht
∇
Run Crawler Hasil Crawling | Found: 0 Page PDF Level
URL PDF Number Level
Gambar 3.4.4 Rancangan Halaman Administrator
Logout
35
3.4.5 Rancangan Halaman Edit Tags RUN Crawler
Show Requesy
Edit Tags
Logout
PDF Repository | Edit Tags Textbox Tanggal
Link
XXXX-XX-XX YY:YY:YY
PDF
XXXX-XX-XX YY:YY:YY
PDF
XXXX-XX-XX YY:YY:YY
PDF
XXXX-XX-XX YY:YY:YY
PDF
XXXX-XX-XX YY:YY:YY
PDF
Gambar 3.4.5 Rancangan Halaman Edit Tags
Tags [save] Tags [save] Tags [save] Tags [save] Tags [save]
36
3.4.6 Rancangan Halaman Show Request
RUN Crawler
Show Requesy
Edit Tags
Logout
PDF Repository | Show Request Tanggal
Request
XXXX-XX-XX YY:YY:YY
Text
Delete
XXXX-XX-XX YY:YY:YY
Text
Delete
XXXX-XX-XX YY:YY:YY
Text
Delete
XXXX-XX-XX YY:YY:YY
Text
Delete
XXXX-XX-XX YY:YY:YY
Text
Delete
Gambar 3.4.6 Rancangan Halaman Show Request