Pembuatan Modul Customer Aplikasi Web Reservasi Penginapan pada Perusahaan "X" (Studi Kasus di Perusahaan CV. Alfa Teknologi Bandung).

(1)

vi

Universitas Kristen Maranatha

ABSTRAK

Perusahaan CV. Alfa Teknologi membutuhkan aplikasi

web

interaktif

untuk pengembangan reservasi penginapan. Sebelumnya perusahaan ini

menggunakan teknologi

Flex

sebagai

front end

, tetapi karena satu dan lain

hal, perusahaan memerlukan tampilan tampilan

web

yang lebih inovatif dan

dinamis untuk lebih menarik minat pelanggan. Dari sinilah Perusahaan CV.

Alfa Teknologi memutuskan untuk mengganti teknologi

front end

dengan

menggunakan

SpringMVC

dibantu dengan library

javascript

seperti

JQuery

dan

Dojo Toolkit

. Teknologi

front end SpringMVC

akan digabungkan dengan

teknologi

back end

seperti

iBatis

dan

Spring

yang sudah ada pada

Perusahaan CV. Alfa Teknologi.

IBatis

merupakan teknologi

open source

yang ditulis dalam

format

XML, tujuannya adalah pemetaan data antara

objek-objek dan

database

. Sedangkan

Spring

merupakan

sebuah

framework

(kerangka kerja)

yang digunakan untuk membangun sebuah aplikasi

Enterprise.

Modul

customer

yang akan dibuat dalam Tugas Akhir memiliki

fitur-fitur sebagai berikut: pencarian penginapan berdasarkan lokasi dan

nama penginapan, pencarian lanjutan, pemilihan jenis kamar dari

penginapan yang dipilih dan konfigurasi tempat tidur sesuai yang disediakan

oleh penginapan yang bersangkutan.

(2)

vii

ABSTRACT

CV. Alfa Technology Company requires the development of interactive

web application for property reservation. This company used Flex as the front

end before. CV. Alfa Technology Company decide to change its front end to

Spring MVC included JQuery and Dojo Toolkit to create more attractive web

application.SpringMVC as the front end technology will combined by the back

end technology such as iBatis and Springs. iBatis is the open source

technology written in XML formatted, for data mapping between objects and

database. Spring is the framework that used to build Enterprise Application.

The main features of this customer modules include: property search by

location and property name, advanced search, rooms and beds configuration

selection.

(3)

viii

DAFTAR ISI

LEMBAR PENGESAHAN ... i

PERNYATAAN PUBLIKASI LAPORAN PENELITIAN ... ii

PERNYATAAN ORISINALITAS LAPORAN PENELITIAN ... iii

PRAKATA ... iv

ABSTRAK ... vi

ABSTRACT ... vii

DAFTAR ISI ... viii

DAFTAR GAMBAR ... xi

DAFTAR TABEL ... xiii

DAFTAR PROGRAM ... xv

BAB I PENDAHULUAN ... 1

1.1 Latar Belakang Masalah ... 1

1.2 Rumusan Masalah ... 2

1.3 Tujuan ... 2

1.4 Ruang Lingkup Kajian ... 3

1.5 Sumber Data ... 3

1.6 Sistematika Penyajian ... 3

BAB II KAJIAN TEORI ... 5

2.1 Flowchart Diagram ... 5

2.1.1 Simbol-Simbol Flowchart ... 5

2.2 ERD (Entity Relationship Diagram) ... 9

2.2.1 Komponen-Komponen yang digunakan dalam Pembuatan ERD ... 11

2.3 Teknologi yang Digunakan ... 14

2.3.1 Teknologi Java EE ... 14

2.3.1.1 Latar Belakang Teknologi Java EE ... 15

2.3.1.2 Arsitektur Java EE ... 16

2.3.1.2.1 Business Object Layer (Business Object Model) ... 16

2.3.1.2.2 Presentation Layer ... 18

2.3.1.2.3 Business Logic Layer ... 18

2.3.1.2.4 Persistence Layer ... 19

(4)

ix

2.3.3 iBatis ... 24

2.3.4 Dojo Toolkit ... 26

2.3.5 JQuery ... 27

BAB III ANALISIS DAN RANCANGAN SISTEM ... 29

3.1 Flowchart ... 29

3.2 Entity Relationship Diagram (ERD) ... 31

3.2 Use Case Diagram ... 35

3.3 Activity Diagram ... 40

3.3.1 Activity Diagram Cari Properti ... 40

3.3.2 Activity Diagram Lihat Detail Properti ... 41

3.3.3 Activity Diagram Booking Properti ... 42

3.3.4 Activity Diagram Pembayaran Booking ... 42

3.4 Class Diagram ... 43

3.5 Sequence Diagram ... 46

3.5.1 Sequence Diagram Cari Properti ... 47

3.5.2 Sequence Diagram Lihat Detail Properti ... 48

3.5.3 Sequence DiagramBooking Properti ... 49

3.5.4 Sequence Diagram Pembayaran Booking ... 50

3.6 Rancangan Antarmuka Perangkat Lunak ... 50

3.6.1 Rancangan Antarmuka Halaman Utama ... 51

3.6.2 Rancangan Antarmuka Halaman Hasil Pencarian ... 52

3.6.3 Rancangan Antarmuka Detail dan Booking Properti ... 55

3.6.4 Rancangan Antarmuka Pembayaran Booking ... 56

BAB IV HASIL PENELITIAN ... 57

4.1 Implementasi Modul ... 57

4.1.1 Modul Cari Properti ... 57

4.1.2 Modul Lihat Daftar Properti ... 59

4.1.3 Modul Lihat Detail dan Booking Properti ... 61

4.1.4 Modul Pembayaran Booking ... 62

4.2 Implementasi Antar Muka ... 65

4.2.1 Halaman Utama ... 66

4.2.2 Halaman Hasil Pencarian ... 67

4.2.3 Halaman Booking dan Detail Properti ... 69

(5)

x

BAB V PEMBAHASAN DAN UJI COBA HASIL PENELITIAN ... 71

5.1 Test Case ... 71

5.2 Pelaksanaan Pengujian ... 72

5.2.1 White Box ... 72

5.2.1.1 HomeController... 73

5.2.1.2 PropertyController ... 74

5.2.1.3 SearchController ... 76

5.2.1.4 RatesController ... 76

5.2.1.4 PaymentController ... 77

5.2.2 Black Box ... 78

BAB VI SIMPULAN DAN SARAN... 82

6.1 Simpulan ... 82

6.2 Saran ... 83

6.3 Rencana Perbaikan terhadap Saran yang Diberikan ... 83

(6)

xi

DAFTAR GAMBAR

Gambar 1 Contoh ERD dalam format IDEF1X (Oppel, 2004) ... 10

Gambar 2 Contoh Notasi Crow’s Foot (Oppel, 2004) ... 11

Gambar 3 Contoh Entitas (Crow’s Foot Notation, 2012) ... 12

Gambar 4 Penggambaran Relasi Notasi Crow’s Foot (Crow’s Foot Notation, 2012) ... 12

Gambar 5 Kardinalitas dan Modalitas 0 atau lebih (Crow’s Foot Notation, 2012) .... 13

Gambar 6 Kardinalitas dan Modalitas 1 atau lebih (Crow’s Foot Notation, 2012) .... 13

Gambar 7 Kardinalitas dan Modalitas 1 dan hanya 1 (Crow’s Foot Notation, 2012) 13 Gambar 8 Kardinalitas dan Modalitas 0 atau 1 (Crow’s Foot Notation, 2012) ... 13

Gambar 9 Contoh Relasi 1 to 1 (1:1) (Crow’s Foot Notation, 2012) ... 13

Gambar 10 Contoh Relasi 1 to many (1:M) (Crow’s Foot Notation, 2012) ... 14

Gambar 11 Contoh Relasi many to many(M:M) (Crow’s Foot Notation, 2012) ... 14

Gambar 12 Arsitektur Java EE 5 (Begin, 2006, chap.1) ... 16

Gambar 13 Strategi Multilayer (Begin, 2006, chap.1) ... 17

Gambar 14 Arsitektur Spring (Basic Spring Architecture, 2011) ... 21

Gambar 15 POJO Dependency Injection (Spring, 2011) ... 23

Gambar 16 Spring Dependency Injection (Spring, 2011) ... 24

Gambar 17 Sistem FlowchartBooking Properti ... 30

Gambar 18 Entity Relationship Diagram Aplikasi Reservasi Penginapan ... 32

Gambar 19 Use Case Diagram Sistem Booking Properti ... 36

Gambar 20 Activity Diagram Cari Properti ... 41

Gambar 21 Activity Diagram Lihat Detail Properti ... 41

Gambar 22 Activity Diagram Booking Properti ... 42

Gambar 23 Activity Diagram Pembayaran Booking ... 42

Gambar 24 Relasi Antar Kelas Domain ... 43

Gambar 25 Detail Relasi Kelas Inti Hasil Pencarian Properti ... 44

Gambar 26 Daftar Kelas Service ... 45

Gambar 27 Daftar Kelas DAO ... 46

Gambar 28 Sequence Diagram Cari Properti ... 47

Gambar 29 Sequence Diagram Cari Properti ... 48

(7)

xii

Gambar 31 Sequence Diagram Pembayaran Booking ... 50

Gambar 32 Rancangan Antarmuka Halaman Utama ... 52

Gambar 33 Rancangan Antarmuka Hasil Pencarian Daftar Hotel (List) ... 53

Gambar 34 Rancangan Antarmuka Hasil Pencarian Daftar Harga (Matriks) ... 54

Gambar 35 Rancangan Antarmuka Detail dan Booking Properti ... 55

Gambar 36 Rancangan Antarmuka Pembayaran Booking ... 56

Gambar 37 Screenshot Halaman Utama ... 66

Gambar 38 Halaman Pencarian Daftar Hotel ... 67

Gambar 39 Halaman Pencarian Daftar Harga ... 68

Gambar 40 Halaman Detail dan Booking Properti ... 69

(8)

xiii

DAFTAR TABEL

Tabel I Daftar Simbol Input /Output ... 6

Tabel II Daftar Simbol Proses ... 7

Tabel III Daftar Simbol Storage ... 7

Tabel IV Daftar Simbol Flow ... 8

Tabel V Rincian Tabel Property ... 32

Tabel VI Rincian Tabel TipeKamar ... 34

Tabel VII Rincian Tabel TipeKamar_TglKamarTersedia ... 35

Tabel VIII Rincian Cari Properti ... 37

Tabel IX Rincian Lihat Detail Properti... 37

Tabel X Rincian Lihat Daftar Properti ... 38

Tabel XI Rincian Booking Properti ... 39

Tabel XII Rincian Pembayaran Booking ... 39

Tabel XIII Form Field Pencarian Properti ... 57

Tabel XIV Tombol Form Pencarian Penginapan ... 58

Tabel XV Business Rules Pencarian Penginapan... 59

Tabel XVI Tombol Form Lihat Daftar Properti ... 59

Tabel XVII Business Rules Daftar Properti ... 60

Tabel XVIII Business Rules Booking Properti ... 61

Tabel XIX Form Informasi Tamu ... 62

Tabel XX Business Rules Informasi Tamu ... 62

Tabel XXI Form Informasi Pemesan ... 63

Tabel XXII Business Rules Informasi Pemesan ... 64

Tabel XXIII Business Rules Form Pembayaran ... 64

Tabel XXIV Test Case Aplikasi Reservasi Penginapan ... 71

Tabel XXV Method getAllHomeAttr() ... 73

Tabel XXVI Method getAllKotaProperty() ... 73

Tabel XXVII Method getAllPropertyRegion() ... 74

Tabel XXVIII Method getSearchResult() ... 74

Tabel XXIX Method getPropertyByRegion() ... 75

Tabel XXX Method getPropertyByRegion() ... 75

(9)

xiv

Tabel XXXII Method getRoomRatesByIdProperty() ... 76

Tabel XXXIII Method submitFromRatesPage() ... 77

Tabel XXXIV Method getBiayaExtraBed() ... 77

Tabel XXXV Method submitOrder() ... 78

Tabel XXXVI Hasil Pengujian TC-01 ... 79

Tabel XXXVII Hasil Pengujian TC-02 ... 79

Tabel XXXVIII Hasil Pengujian TC-03 ... 80

Tabel XXXIX Hasil Pengujian TC-04 ... 80

(10)

xv

DAFTAR PROGRAM

(11)

1

BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

Perusahaan CV. Alfa Teknologi membutuhkan aplikasi

web

interaktif

untuk pengembangan reservasi penginapan. Sebelumnya perusahaan ini

menggunakan teknologi

Flex

sebagai

front end

, tetapi karena satu dan lain

hal, perusahaan memerlukan tampilan tampilan

web

yang lebih inovatif dan

dinamis untuk lebih menarik minat pelanggan. Dari sinilah Perusahaan CV.

Alfa Teknologi memutuskan untuk mengganti teknologi

front end

dengan

menggunakan

SpringMVC

dibantu dengan library

javascript

seperti

JQuery

dan

Dojo Toolkit

.

Spring

merupakan

sebuah

framework

(kerangka kerja)

yang

digunakan untuk membangun sebuah aplikasi

Enterprise. Spring

termasuk

framework

yang

lightweight

(ringan) untuk mendukung secara penuh dalam

pengembangan aplikasi

Enterprise

siap pakai

.

SpringMVC

merupakan

komponen dari

Spring

yang menyediakan implementasi

MVC

(

Model View

Controller

) untuk aplikasi

web

.

(12)

2

Universitas Kristen Maranatha

Modul

customer

yang akan dibuat dalam Tugas Akhir ini nantinya

akan memiliki fitur-fitur sebagai berikut: pencarian penginapan berdasarkan

lokasi dan nama penginapan, pencarian lanjutan, pemilihan jenis kamar dari

penginapan yang dipilih dan konfigurasi tempat tidur sesuai yang disediakan

oleh penginapan yang bersangkutan.

1.2 Rumusan Masalah

Pembuatan tugas akhir ini memiliki beberapa rumusan masalah,

sebagai berikut :

1. Bagaimana mengintegrasikan teknologi

Spring

,

SpringMVC, iBatis

,

Dojo Toolkit,

dan

jQuery?

2. Bagaimana mengimplementasikan teknologi tersebut pada aplikasi

reservasi penginapan?

3. Bagaimana mengimplementasikan sistem pencarian penginapan

berdasarkan wilayah, fasilitas yang diberikan penginapan, dan tipe

properti untuk menghasilkan hasil pencarian yang spesifik?

1.3 Tujuan

Berdasarkan masalah yang sudah dirumuskan di atas, maka tugas

akhir ini memiliki tujuan sebagai berikut :

1) Mengintegrasikan teknologi

Spring

,

SpringMVC

,

iBatis

dan

Dojo

Toolkit,

dan

jQuery

.

2) Mengimplementasikan teknologi tersebut pada aplikasi reservasi

(13)

3

Universitas Kristen Maranatha

3) Mengimplementasikan sistem pencarian penginapan berdasarkan

wilayah, fasilitas yang diberikan penginapan, dan tipe properti untuk

menghasilkan hasil pencarian yang spesifik

1.4 Ruang Lingkup Kajian

Pembuatan tugas akhir ini memiliki ruang lingkup sebagai berikut :

1) Aplikasi

web

ini dibuat secara khusus untuk dijalankan di

web browser

Desktop Computer

.

2) Pembuatan aplikasi

web

ini akan ditekankan pada pembuatan

user

interface

interaktif, nantinya penulis akan diberikan

business role

yang

sudah ada di perusahaan tersebut dan tugas penulis adalah untuk

menambah atau memodifikasi modul-modul yang terdapat dalam

back

end

yang sudah dibuat oleh perusahaan agar dapat diintegrasikan

dengan

SpringMVC, Dojo Toolkit

,

jQuery

.

1.5 Sumber Data

Sumber data yang digunakan untuk menyelesaikan tugas akhir ini

adalah dari buku dan

internet,

serta dari Perusahaan CV. Alfa Teknologi

sendiri.

1.6 Sistematika Penyajian

(14)

4

Universitas Kristen Maranatha

BAB I PENDAHULUAN

Bab ini terdiri atas Latar Belakang, Rumusan Masalah, Tujuan, Ruang

Lingkup Kajian, Sumber Data, dan Sistematika Pembahasan.

BAB II KAJIAN TEORI

Bab ini terdiri atas seluruh teori yang dipakai dan relevan dengan

penelitian.

BAB III ANALISIS DAN RANCANGAN PERANGKAT LUNAK

Bab ini terdiri atas Analisis, Gambaran Keseluruhan dan Perancangan

Perangkat Lunak.

BAB IV HASIL PENELITIAN

Bab ini terdiri atas Implementasi seluruh hasil rancangan di Bab III

mulai dari implementasi kelas/modul, simpanan data sampai dengan antar

muka.

BAB V PEMBAHASAN DAN UJI COBA HASIL PENELITIAN

Bab ini terdiri atas Rencana Pengujian yang terdiri atas

test case

dan

pelaksanaan pengujian yang dapat menggunakan salah satu atau kedua

metode yaitu

White Box

maupun

Black Box

.

BAB VI SIMPULAN DAN SARAN

(15)

82

BAB VI

SIMPULAN DAN SARAN

6.1 Simpulan

Kesimpulan yang dapat ditarik berdasarkan evaluasi dari bab-bab

sebelumnya dan dari hasil akhir adalah sebagai berikut:

1. Aplikasi reservasi penginapan berhasil dikembangkan dengan

teknologi

Spring

,

SpringMVC, iBatis

,

Dojo Toolkit,

dan

JQuery

.

2. Teknologi

Spring

,

SpringMVC, iBatis

,

Dojo Toolkit,

dan

JQuery

dapat terintegrasi dengan baik.

3. Aplikasi dapat melakukan pencarian penginapan berdasarkan

wilayah, fasilitas yang diberikan penginapan, dan tipe properti untuk

menghasilkan hasil pencarian yang spesifik.

Adapun beberapa hambatan yang ditemui selama pengembangan

aplikasi reservasi penginapan adalah sebagai berikut:

1. Harus mempelajari teknologi baru yang sumbernya masih sangat

sedikit.

2. Penulis harus menyesuaikan dengan teknologi

back-end

yang

sudah dibuat oleh perusahaan sehingga pembuatan aplikasi kurang

fleksibel (dari sisi penulis).

3. Pembuatan UI banyak berpusat pada teknologi berbasis

Javascript

,

yang menurut penulis banyak kesulitan untuk menemukan

error

-nya.

(16)

83

Universitas Kristen Maranatha

6.2 Saran

Saran yang didapatkan setelah hasil evaluasi untuk perbaikan di

masa datang ataupun untuk pengembangan aplikasi adalah sebagai

berikut:

1. Pembelajaran teknologi dengan mendatangkan

tutor

dari

vendor

teknologi yang bersangkutan.

6.3 Rencana Perbaikan terhadap Saran yang Diberikan

Untuk melakukan implementasi terhadap saran-saran yang

diberikan, diperlukan tambahan aturan-aturan baru, serta penelitian lebih

terperinci untuk mendapatkan data pengetahuan yang lebih detail dan

memerlukan waktu beberapa bulan untuk mengembangkan aplikasi

(17)

xiii

DAFTAR PUSTAKA

Basic

Spring

Architecture.

Retrieved

May

24,

2011,

from

http://www.roseindia.net/spring/springarchitecture.shtml

.

Begin, Clinton, et al. 2006.

iBATIS In Action

. New York : Manning.

Beighley, Lynn. 2010.

JQuery For Dummies

: Wiley Publishing, Inc.

Breidenbach, Ryan. 2007.

Spring in Action

. Edisi Kedua. New York :

Manning.

Goncalves, Antonio. 2009.

Beginning Java EE 6 Platform With Glashfish 3

From Novice To Professional

. New York : Appress.

Crow’s

Foot

Notation.

Retrieved

April

3,

2012,

from

http://www2.cs.uregina.ca/~bernatja/crowsfoot.html#_msocom_2

.

Oppel, A. J. (2004).

Databases demistified

. California : McGraw

Hill/Osborne.