BAB 2

LANDASAN TEORI

2.1. Software Engineering

Software engineering merupakan sebuah disiplin rekayasa yang harus

diperhatikan dari segala aspek dalam memproduksi sebuah software (Sommerville,

2011: 6). Ada empat aktivitas dasar yang pada umumnya dilakukan pada pembuatan

sebuah software, yaitu:

1. Software specification

Tahap pada saat customer mendefinisikan jenis software yang

dibutuhkan dan segala kendala yang ada.

2. Software development

Tahap pengembangan software, saat seluruh kebutuhan diubah

menjadi rancangan dan dilakukan pemrograman.

3. Software validation

Tahap pengecekan apakah software sudah sesuai dengan yang

didefinisikan oleh customer.

4. Software evolution

Tahap modifikasi software yang mencerminkan perubahan customer

dan persyaratan pasar.

2.1.1 Model Process: Waterfall Model

Waterfall model merupakan model process yang pertama kali

dikemukakan tahun 1970 oleh Winston W. Royce pada proses pengembangan

software yang diturunkan dari system engineering process yang lebih umum

(Sommerville, 2011: 30). Dinamakan waterfall karena alurnya mengalir dari

satu fase ke fase berikutnya. Fase – fase utama dalam waterfall model

dijabarkan sebagai berikut:

1. Requirements analysis and definition

Segala kebutuhan dianalisa dan didefinisikan secara rinci yang

kemudian digunakan sebagai spesifikasi sistem.

2. System and software design

Pembuatan desain arsitektur, baik untuk software dan

6

7

hardware, sehingga dapat membangun sistem secara menyeluruh.

Seluruh abstraksi sistem digambarkan lengkap dengan relasinya.

3. Implementation and unit testing

Desain yang sudah tersedia direalisasikan menjadi sebuah

program dengan pembangunan kode (coding). Setelah menjadi sebuah

unit program, akan dilakukan pengujian pada setiap unit untuk

mengetahui apakah setiap unit sudah sesuai dengan spesifikasi.

4. Integration and system testing

Unit – unit program yang sudah sesuai dengan spesifikasi akan

disatukan menjadi sebuah kesatuan sistem. Pengujian akan dilakukan

kembali pada sebuah sistem yang utuh.

5. Operation and maintenance

Pada tahap ini instalasi program dilakukan dan dioperasikan

untuk kepentingan konsumen. Pada prosesnya, maintenance harus

terus berjalan selama pengoperasian program. Perbaikan dilakukan

jika ditemukan error atau kesalahan pada program. Pengembangan

(improvement) dapat dilakukan juga pada tahap ini, sehingga

menghasilkan system requirement baru yang dapat meningkatkan

layanan dari program itu sendiri.

Secara teoretis, waterfall model memiliki alur model linear yang

bertahap. Jika fase sebelumnya belum selesai, tidak disarankan untuk

melanjutkan ke fase selanjutnya. Namun pada prakteknya, hal ini sulit

dijalankan karena pada tahap coding masalah demi masalah kerap ditemukan

sehingga model linear tidak dapat diterapkan. Dibutuhkan jalur umpan balik

(feedback path) untuk menguji fase – fase sebelumnya yang telah dilewati

dan melakukan penyesuaian jika fase selanjutnya mengalami perubahan

(Sommerville, 2011: 30).

Pada prinsipnya (Somerville, 2011: 32), waterfall model digunakan

jika requirement dari software sudah tetap dan tidak akan mengalami banyak

perubahan. Waterfall model juga menghasilkan proses dan dokumentasi yang

lebih jelas karena berjalan dengan fase – fase yang terstruktur. Hal ini

mengizinkan manager untuk memonitor kemajuan pada proses pembuatan

software secara lebih mudah.

8

2.1.2 Interaksi Manusia dan Komputer

Dalam pembuatan sebuah software, desain tampilan antar-muka (user

interface) harus diperhatikan demi terjalinnya interaksi manusia dan

komputer dengan baik. Interaksi manusia dan komputer (Shneiderman, 2010:

22) merupakan disiplin ilmu yang berhubungan dengan perancangan,

evaluasi, dan implementasi sistem komputer interaktif untuk digunakan oleh

manusia. Terdapat aturan dalam merancang interaksi manusia dan komputer,

yaitu delapan aturan emas (Eight Golden Rules). Eight Golden Rules tersebut

adalah:

1. Strive for consistency

Urutan tindakan yang konsisten harus sama dalam situasi yang

mirip atau sejenis, terminologi yang identik dan perintah yang

konsisten harus digunakan.

2. Cater to universal usability

Menyediakan fitur bagi pengguna pemula yang dapat mudah

dimengerti, sebagai contoh diberikan penjelasannya dan fitur bagi

pengguna yang berpengalaman, seperti pengadaan shortcut. Hal ini

dilakukan dalam melayani kebutuhan pengguna yang beragam.

3. Offer informative feedback

Untuk setiap tindakan pengguna, harus ada sistem umpan balik

(feedback). Untuk hal minor, respon dapat dibuat sederhana,

sedangkan untuk hal yang jarang dan penting, respon harus lebih

substansial.

4. Design dialog to yield closure

Urutan tindakan harus diatur sesuai urutan dari awal, tengah,

dan akhir. Feedback yang informatif pada penyelesaian sekelompok

tindakan memberikan pengguna sebuah kepuasan akan penyelesaian

tindakan tersebut.

5. Prevent errors

Sistem harus dibuat untuk membantu pengguna

meminimalkan kesalahan. Jika kesalahan dibuat, sistem harus mampu

mendeteksi kesalahan dan menawarkan sebuah peringatan sederhana

dengan mekanisme yang mudah dipahami untuk penanganan

kesalahan.

9

6. Permit easy reversal of actions

Fitur ini mengurangi kecemasan, karena pengguna tahu bahwa

kesalahan dapat dibatalkan, sehingga dapat mendorong pengguna

untuk mengeksplorasi pilihan.

7. Support internal locus of control

Pengguna yang berpengalaman sangat menginginkan sebuah

hal yang dapat memberi keyakinan bahwa mereka bertanggung jawab

atas sistem dan bahwa sistem merespon tindakan mereka.

8. Reduce short-term memory load

Keterbatasan pemrosesan informasi manusia dalam ingatan

jangka pendek mengharuskan tampilan dibuat sederhana. Seperti

tampilan halaman, window motion, peletakan tombol serta

penggunaan jenis icon pada tombol, dan urutan tindakan.

2.1.3 Testing

Menurut Pressman (2010: 482) tujuan dari pengujian adalah untuk

menemukan dan memperbaiki sebanyak mungkin kesalahan dalam program

sebelum akhirnya program diserahkan kepada customer untuk mulai

dioperasikan. Salah satu pengujian yang baik adalah pengujian yang memiliki

probabilitas tinggi dalam menemukan kesalahan. Untuk menguji validitas

software, pengujian dilakukan menggunakan teknik desain test case “Black-

Box”, dengan tujuan menemukan jumlah kesalahan maksimum dengan usaha

dan waktu yang minimum. Hasil yang didapat dari teknik pengujian ini

berupa sebuah laporan yang berisi sebuah desain set test cases untuk menguji

logika, interface, kolaborasi komponen, desain persyaratan eksternal yang

didokumentasikan, definisi hasil yang diharapkan, dan hasil yang terjadi

secara aktual.

2.1.3.1 Black-Box Testing

Menurut Pressman (2010: 495), Black-Box testing atau yang

biasa disebut behavioral testing adalah proses pengujian dengan fokus

pada requirement fungsional software yang memungkinkan developer

untuk mendapatkan set kondisi input yang sepenuhnya dapat

melaksanakan fungsionalitas suatu program sesuai requirement.

10

Black-Box testing dapat digunakan untuk menemukan kesalahan

dalam kategori sebagai berikut:

1. Fungsi yang tidak benar atau fungsi yang hilang.

2. Kesalahan interface.

3. Kesalahan dalam struktur data atau akses database

eksternal.

4. Kesalahan perilaku (behavior) atau kesalahan kinerja.

5. Inisialisasi dan pemutusan kesalahan.

Dengan menerapkan Black-Box testing, dapat diperoleh

sebuah test cases yang memenuhi kriteria seperti:

1. Mengurangi jumlah test cases tambahan yang harus

didesain untuk memenuhi syarat pengujian wajar.

2. Test cases memberitahu tentang ada atau tidaknya

kesalahan pada class.

2.2 Unified Modelling Language (UML)

Menurut Whitten dan Bentley (2007: 371) UML (Unified Modelling

Language) merupakan satu kumpulan konvensi pemodelan yang digunakan untuk

merincikan atau menjelaskan sistem piranti lunak yang dijadikan sebagai standar

pemodelan objek. UML dapat dijadikan panduan bagi developer dalam mengetahui

sudut pandang sebuah sistem dan dikomunikasikan kepada pihak – pihak yang terkait

dengan sistem dalam bentuk diagram. UML merupakan bahasa kesatuan yang

mendeskripsikan model sebuah sistem secara efektif.

2.2.1 Use Case Diagram

Menurut Whitten dan Bentley (2007: 382), use case diagram

merupakan diagram yang menggambarkan interaksi antara sistem, pengguna

atau dengan sistem eksternal lainnya. Dengan kata lain, menggambarkan

siapa pengguna sistem dan bagaimana pengguna berinteraksi dengan sistem.

2.2.1.1 Notasi pada Use Case Diagram

Notasi yang digunakan dalam menggambarkan use case

diagram yaitu:

11

1. Use Case

Use case merupakan suatu tugas bisnis yang diselesaikan

dengan urutan langkah-langkah perilaku baik secara otomatis

atau manual. Use case mendeskripsikan fungsi - fungsi yang

ada pada sistem dari sudut pandang para pengguna eksternal,

dalam cara dan terminologi yang mereka mengerti.

Gambar 2.1 Notasi Use Case pada Use Case Diagram

2. Aktor

Digambarkan dalam bentuk manusia, aktor merupakan segala

sesuatu yang berinteraksi dengan sistem untuk bertukar

informasi.

Gambar 2.2 Notasi Aktor pada Use Case Diagram

3. Relationship

Digambarkan dengan sebuah garis yang menunjuk atau

menghubungkan antara sebuah use case dengan aktor atau

dengan use case lainnya, yang mendefinisikan hubungan

interaksi di antaranya.

12

Gambar 2.3 Interaksi Aktor dengan Use Case

2.2.1.2 Relasi pada Use Case Diagram

Sebuah relasi digambarkan dengan garis antara dua

simbol pada use case diagram. Arti dari relasi dapat berbeda

tergantung bagaimana garis digambarkan dan tipe simbol yang

terhubung. Beberapa relasi yang digunakan dalam use case

diagram:

1. Association

Relasi antara aktor dan use case dimana interaksi terjadi

antara keduanya. Digambarkan dengan sebuah garis

dengan panah yang menyentuh use case atau garis biasa

yang menghubungkan antara notasi aktor dengan notasi

use case. Garis panah dari aktor menuju use case berarti

aktor memberikan data ke fungsi dalam use case,

sedangkan garis biasa berarti aktor hanya menerima atau

membaca data dari use case.

Gambar 2.4 Contoh Relasi Association

13

2. Extends

Relasi extends memperluas fungsionalitas use case apabila

kondisi tertentu dipenuhi.

Gambar 2.5 Contoh Relasi Extends

3. Uses atau Includes

Relasi uses mengurangi pengulangan antara dua atau lebih

use case dengan menggabungkan langkah-langkah dalam

use case.

Gambar 2.6 Contoh Relasi Uses atau Include

4. Depends On

Relasi antara use case yang mengindikasikan bahwa use

case tidak dapat dilakukan sampai use case lainnya sudah

dijalankan.

14

Gambar 2.7 Contoh Relasi Depends On

5. Inheritance

Relasi inheritance digunakan saat dua atau lebih aktor

menggunakan use case yang sama.

Gambar 2.8 Contoh Relasi Inheritance

2.2.2 Activity Diagram

Menurut Whitten dan Bentley (2007: 390), activity diagram

digambarkan untuk memperlihatkan proses alur bisnis, langkah - langkah

use case, atau logika perilaku objek. Activity diagram serupa dengan flow

15

chart diagram dalam menggambarkan alur aktivitas yang berurutan dari

proses bisnis atau use case. Namun, berbeda dari flow chart karena

memberikan mekanisme yang menggambarkan aktivitas yang terjadi secara

paralel. Oleh karena itu, activity diagram berguna untuk memodelkan aksi-

aksi saat operasi dieksekusi dan memodelkan hasil dari aksi tersebut.

16

Gambar 2.9 Activity Diagram

17

2.2.2.1 Notasi pada Activity Diagram

Notasi yang digunakan dalam activity diagram sesuai dengan

contoh gambar 2.9 adalah sebagai berikut:

1. Initial Node

Digambarkan dengan simbol lingkaran penuh,

merepresentasikan dimulainya sebuah proses.

Gambar 2.10 Simbol Initial Node pada Activity Diagram

2. Action

Digambarkan dengan simbol persegi panjang melengkung

(rounded rectangle) yang merepresentasikan langkah

individual. Urutan dari actions menunjukan kesatuan

activity pada diagram.

Gambar 2.11 Simbol Action pada Activity Diagram

3. Flow

Digambarkan dengan panah yang mengindikasi adanya

proses yang terjadi sepanjang action.

Gambar 2.12 Simbol Flow pada Activity Diagram

18

4. Decisions

Digambarkan dalam bentuk belah ketupat dengan 1 panah

masuk dan 2 atau lebih panah keluar, mengindikasi sebuah

kondisi yang terjadi. Bentuk node ini dapat dilihat pada

gambar 2.13.

5. Merge

Digambarkan dalam bentuk belah ketupat dengan 2 atau

lebih panah masuk yang sebelumnya dipisahkan oleh

decision.

Gambar 2.13 Simbol Decision / Merge pada Activity

Diagram

6. Fork

Digambarkan dalam sebuah persegi panjang hitam dengan

1 alur masuk dan 2 atau lebih alur keluar. Fork

merepresentasikan action yang terjadi secara bersamaan

atau paralel. Bentuk node ini dapat dilihat pada gambar

2.14.

7. Join

Digambarkan dalam sebuah persegi panjang hitam dengan

2 atau lebih alur masuk yang sebelumnya terjadi secara

paralel dan 1 alur keluar untuk melanjutkan proses pada

activity diagram.

Gambar 2.14 Simbol Fork / Join pada Activity Diagram

8. Activity final

Digambarkan dengan sebuah lingkaran penuh di dalam

19

sebuah lingkaran berongga, merepresentasikan berakhirnya

sebuah proses sebuah activity diagram.

Gambar 2.15 Simbol Final Node pada Activity Diagram

2.2.3 Class Diagram

Menurut Whitten dan Bentley (2007: 400), Sebuah class diagram

digunakan untuk menggambarkan objek dan hubungan antar objek. Elemen –

elemen yang ada di dalam class diagram, yaitu:

1. Class

Blok - blok pembangun pada konsep OOP. Sebuah class

digambarkan sebagai sebuah kotak yang terbagi atas tiga bagian.

Bagian atas adalah bagian nama dari class. Bagian tengah

mendefinisikan atribut class. Bagian akhir mendefinisikan

perilaku dari sebuah class.

Gambar 2.16 Elemen Class pada Class Diagram

2. Association

Asosiasi merupakan sebuah relationship paling umum antara dua

class dan dilambangkan oleh sebuah garis yang menghubungkan

antara dua class. Garis ini bisa melambangkan tipe - tipe

20

relationship dan juga dapat menampilkan hukum-hukum

multiplicity pada sebuah relationship, seperti one-to-one, one-to-

many, dan many-to-many.

Gambar 2.17 Elemen Association pada Class Diagram

3. Composition

Jika sebuah class tidak bisa berdiri sendiri dan harus merupakan

bagian dari class yang lain, maka class tersebut memiliki relasi

composition terhadap class tempat dia bergantung tersebut.

Sebuah relasi composition digambarkan sebagai garis dengan

ujung berbentuk belah ketupat penuh.

Gambar 2.18 Elemen Composition pada Class Diagram

4. Dependency

Pada saat tertentu sebuah class menggunakan class yang lain, hal

ini disebut dependency. Umumnya penggunaan dependency

digunakan untuk menunjukkan operasi pada suatu class yang

menggunakan class yang lain. Sebuah dependency dilambangkan

sebagai sebuah panah dengan garis putus - putus.

Gambar 2.19 Elemen Dependency pada Class Diagram

21

5. Aggregation

Agregasi merupakan tipe relasi yang unik, yang salah satu

objeknya adalah “bagian” dari objek lainnya.

Gambar 2.20 Elemen Aggregation pada Class Diagram

22

Gambar 2.21 Contoh Class Diagram

23

2.2.4 Sequence Diagram

Menurut Whitten dan Bentley (2007: 394), sequence diagram

menggambarkan interaksi antar-objek melalui pesan di dalam eksekusi

sebuah use case atau operasi. Sistem sequence diagram membantu

mengidentifikasi pesan high level yang masuk dan keluar dari sistem.

Kemudian, pesan ini akan digunakan masing-masing objek untuk

berkomunikasi dengan objek-objek lainnya.

Notasi yang digunakan dalam sequence diagram adalah actor, system,

lifelines, activation bars, input messages, dan output messages.

Gambar 2.22 Contoh Sequence Diagram

2.2.4.1 Notasi pada Sequence Diagram

Notasi yang digunakan (Whitten & Bentley, 2007: 394-395,

660) dalam menggambarkan sequence diagram adalah sebagai

berikut:

1. Actor

Merepresentasikan aktor yang ada pada use case.

Notasinya ditunjukkan dengan simbol aktor pada use case.

24

Gambar 2.23 Simbol Aktor pada Sequence Diagram

2. System

Digambarkan dalam sebuah kotak yang mengindikasikan

sistem sebagai satu kesatuan. Tanda colon (:) menandakan

nama instance yang sedang berjalan.

Gambar 2.24 Simbol System pada Sequence Diagram

Dalam merancang sequence untuk program berorientasi

objek (OOP), system dibagi menjadi 3 macam, yaitu:

1. Interfaces Class

Mengindikasikan kode interface class. Seperti pada

gambar 2.25, penambahan kata “<<interface>>”

dilakukan agar tidak terjadi kebingungan akan

class apa yang dimaksud.

Gambar 2.25 Contoh Simbol Interface Class

25

2. Controller Class

Sama seperti pada interfaces class, adanya

penambahan kata “<<controller>>” untuk

mengindikasikan bahwa class yang dimaksud

merupakan controller class.

Gambar 2.26 Contoh Simbol Controller Class

3. Entity Class

Menunjukkan entity yang berkolaborasi di dalam

sequence.

Gambar 2.27 Contoh Simbol Entity Class

3. Lifelines

Digambarkan dengan garis putus – putus ke bawah dari

notasi aktor dan sistem. Mengindikasikan life of sequence.

Gambar 2.28 Simbol Lifeline pada Sequence Diagram

4. Activation bars

Sebuah persegi panjang di atas lifeline yang menunjukkan

periode waktu ketika aktor atau sistem aktif di dalam

sequence.

26

Gambar 2.29 Simbol Activation Bars pada Sequence

Diagram

5. Messages

Panah horizontal dari aktor ke sistem yang menunjukkan

input message.

Gambar 2.30 Simbol Messages pada Sequence Diagram

6. Output messages

Panah horizontal dengan garis putus – putus dari sistem ke

aktor yang menunjukkan respon dari sistem.

Gambar 2.31 Simbol Output Message pada Sequence

Diagram

7. Self Call

Sebuah objek yang memanggil method yang dimilikinya

sendiri.

27

Gambar 2.32 Simbol Self Call pada Sequence Diagram

8. Receiver Actor

Aktor lain atau sistem eksternal dapat dimasukkan jika

menerima message dari dalam sistem.

Gambar 2.33 Contoh Penggunaan Simbol Receiver Actor

pada Sequence Diagram

Contoh sequence diagram pada gambar 2.33 menunjukkan

penggunaan simbol receiver actor yang ditunjukan oleh

simbol aktor dengan label Sys Admin, yang menerima

sebuah message berupa data dari dalam sistem.

9. Frame

Sebuah kotak yang melampirkan satu atau lebih pesan

dalam membagi fragmen dari sequence, dapat

menunjukkan kejadian berulang (loops), berkondisi

(alternate/alt), dan pilihan (optional/opt).

28

Gambar 2.34 Simbol Frame pada Sequence Diagram

2.3 Internet dan World Wide Web

Internet dan world wide web merupakan dua hal yang berbeda, namun web

application sangat bergantung kepada keduanya (Stobart, 2008: 4).

2.3.1 Internet

Menurut Budhi Irawan (2005: 69-70), internet merupakan suatu

jaringan komputer global yang terbentuk dari jaringan - jaringan komputer

lokal dan regional yang memungkinkan komunikasi data antar komputer yang

terhubung ke jaringan tersebut. Agar komputer - komputer dalam suatu

jaringan dapat berkomunikasi, maka dibutuhkan suatu protokol atau suatu

aturan standar komunikasi baik antar komputer maupun jaringan komputer.

Protocol TCP/IP (Transmission Control Protocol/Internet Protocol) menjadi

protokol standar yang digunakan pada jaringan internet, karena TCP/IP

dikembangkan untuk dapat diterapkan di hampir segala jenis platform

komputer.

Pertama kali dikemukakan oleh US Department of Defense dalam

proyek ARPANET (Advanced Research Project Agency Network) yang

disponsori oleh ARPA (Advanced Research Project Agency) (Stobart, 2008:

4). ARPA mencatat sejarah dalam dunia internet setelah berhasil membangun

koneksi ARPANET antara dua komputer yang berlainan tempat, yang

29

pertama di University of California Los Angeles dan yang kedua di Stanford

Research Institute (Green, 2010: 21). ARPANET kemudian menjadi cikal

bakal internet hingga pada saat ini.

2.3.2 World Wide Web

World wide web atau lebih dikenal dengan www adalah suatu metode

untuk menampilkan informasi di internet, baik berupa teks, gambar, suara

maupun video yang interaktif dan mempunyai kelebihan untuk

menghubungkan satu dokumen dengan dokumen lainnya yang dapat diakses

melalui browser (Yuhefizar, 2008: 159). World wide web yang digunakan

sampai sekarang pertama kali diperkenalkan oleh Tim Berners-Lee di CERN

(Centre Européenne pour la Recherche Nucléaire / European Organization for

Nuclear Research) pada tahun 1990 (Stobart, 2008: 4).

Menurut Simon Stobart dan David Parsons, world wide web memiliki

beberapa teknologi penting yang digunakan di atas dasar internet, yaitu:

1. Hypertext Transfer Protocol (HTTP)

2. Hypertext Markup Language (HTML)

3. URL, URI, dan URN

2.3.2.1 Web Browser

Web Browser merupakan suatu perangkat lunak yang

memungkinkan pengguna untuk berinteraksi dan melakukan navigasi

World Wide Web (WWW). (D.P. Nagpal, 2006: 528)

Beberapa contoh web browser yang dikenal secara umum

adalah Microsoft Internet Explorer, Netscape Navigator, Mozilla

Firefox, Safari, Opera, Konqueror, dan Google Chrome.

30

2.3.2.2 Web Server

Menurut Janner Simarmata (2010: 88) web server adalah

potongan perangkat lunak yang mendukung berbagai protokol web,

seperti HTTP, HTTPS, dan lain - lain untuk memproses permintaan

client.

2.3.2.3 Hypertext Transfer Protocol (HTTP)

Menurut Janner Simarmata (2010: 52) HTTP atau Hypertext

Transfer Protocol merupakan protokol komunikasi stateless yang

berbasiskan pada TCP yang pada awalnya digunakan untuk

mengambil kembali file dari web server. Pada perkembangannya,

HTTP yang paling umum digunakan adalah HTTP versi 1.1. Versi 1.1

ini mengizinkan client dan server berkomunikasi menggunakan

banyak headers untuk menyampaikan informasi dan deskripsi user-

agent, serta bertindak sebagai alat elementer untuk autentikasi

pengguna.

2.4 Web Based Application

Web based application atau juga dikenal sebagai web app merupakan sebuah

web yang memungkinkan pengguna melakukan sesuatu dan menyimpan sesuatu pada

web server melalui web tersebut (Fowler, 2008: 3-4). Pada dasarnya, web app adalah

aplikasi yang menggunakan web browser sebagai client (Nations, 2013). Selain

karena biaya produksi dan operasional yang relatif murah, web based application

menawarkan beberapa kelebihan yang dapat dilakukan (Stobart, 2008: 2-3), yaitu:

1. Mengizinkan kita untuk mendistribusikan sebuah data melalui world wide

web (www).

2. Mengatur concurrency, sehingga satu sumber web dapat diakses oleh

beberapa pengguna.

3. Pembangunan content yang dinamis.

4. Mencakup keamanan role-based, yang memungkinkan adanya pengaturan

untuk memperbolehkan (allow) dan menolak (deny) akses ke sebuah

resources berdasarkan user-role.

5. Menyediakan akses ke database, yang data dapat disimpan secara

31

permanen dan dapat diakses saat dibutuhkan.

6. Menjalankan layanan transaksi dari database sehingga isi database

menjadi reliable dan konsisten.

7. Dapat dijalankan pada multiplatform.

2.5 Hypertext Markup Language (HTML)

Menurut John Duckett (2010: 2), HTML atau Hypertext Markup Language

merupakan bahasa yang paling umum digunakan dalam pembangunan web. Sesuai

dengan namanya, markup language yang berarti bahasa penandaan, HTML

digunakan untuk menandai secara khusus bagian – bagian yang terdapat dalam

sebuah halaman web. Penandaan pada setiap bagian menggunakan tag.

Gambar 2.35 Contoh File HTML

Pada contoh potongan code HTML gambar 2.35 di atas, penggunaan tag

HTML ditandai dengan pemakaian kurung siku “< >” serta adanya kata atau huruf di

dalamnya. Inilah yang menjadi penanda di dalam sebuah file HTML pada setiap

bagian, menandakan yang mana header, judul, body, paragraph, tabel, dan lainnya.

32

Gambar 2.36 Tampilan File HTML pada Web Browser

Gambar 2.36 menunjukkan hasil tampilan dari code HTML pada gambar 2.35

saat dibuka di web browser. Tidak diperlukan program aplikasi khusus untuk

membangun code HTML, cukup menggunakan text editor seperti Notepad pada

sistem operasi Windows dan TextEdit pada sistem operasi Macintosh.

2.5.1 Tag dan Element HTML

Tag HTML selalu berpasangan, ada pembuka (opening tag)

yang ditandai dengan “< >” dan ada penutup (closing tag) ditandai

dengan “</ >” (Duckett, 2010).

Gambar 2.37 Tag dan Element HTML

Penjelasan terkait dapat dilihat pada gambar 2.37. Adanya

opening tag dan closing tag disertai dengan adanya huruf di antara

kedua tag menjadikannya sebuah elemen HTML.

33

2.5.2 Markup Element HTML

Dalam pemrograman web menggunakan HTML, akan banyak

menggunakan elemen HTML untuk markup. Ada banyak jenis elemen

HTML yang dikelompokkan berdasarkan fungsinya. Jenis – jenis

elemen markup dasar yang disediakan oleh HTML yaitu:

1. Heading dengan 6 tingkat ukuran: <h1>, <h2>, <h3>, <h4>,

<h5>, dan <h6>.

2. Pemisah: Paragraf <p>, preformatted sections <pre> , line

breaks <br/> , dan addresses <address>.

3. Presentational elements: <b>, <i>, <u>, <s>, <tt>, <sup>,

<sub>, <strike>, <big>, <small> , dan <hr/>.

4. Phrase element: <em>, <strong>, <abbr>, <acronym>, <dfn>,

<blockquote>, <q>, <cite>, <code>, <kbd>, <var>, dan

<samp>.

5. List: terdiri dari unordered list, ordered list, dan definition list.

Unordered list menggunakan <ul> dan <li>, ordered list

menggunakan <ol> dan <li>, dan definition list menggunakan

<dl>, <dt>, dan <dd>.

6. Editing element: <ins> dan <del>.

7. Grouping element: <div> dan <span>.

Web browser akan membaca semua elemen markup dan

memprosesnya menjadi tampilan web. Fungsi utama dari markup

elemen ini adalah membuat file yang terstruktur dan memberikan

bentuk tampilan sesuai dengan keinginan programmer.

2.6 Cascading Style Sheet (CSS)

Cascading Style Sheet atau lebih dikenal dengan CSS dalam pemrograman

web berfungsi untuk mengatur style dari halaman web (Duckett, 2010: 244).

Pengaturan termasuk di dalamnya seperti penggunaan tipe dan warna font, ketebalan

dan warna pada garis, peletakan dan ukuran setiap div, penentuan background, dan

lain – lain.

Dalam penulisannya, CSS memerlukan rule yang dapat diatur sesuai

keinginan programmer. rule, dibagi dalam dua bagian:

1. Selector menunjuk elemen mana yang akan diberikan rule CSS.

34

2. Declaration menetapkan bagaimana sebuah elemen yang ditunjuk akan

ditata. Declaration juga terbagi menjadi dua bagian yang dipisahkan dengan

colon (titik dua) “:” dalam penulisannya :

a. Property

Digunakan untuk memilih property apa yang akan digunakan untuk

memberikan efek kepada elemen yang telah ditunjuk.

b. Value

Memberikan nilai secara spesifik bagi property yang telah dipilih.

Pada file HTML yang tidak ada rule CSS akan terlihat kurang beraturan,

sementara jika diterapkan rule CSS pada elemen – elemen yang ada, akan

menghasilkan tampilan yang lebih baik.

2.7 JavaScript

Menurut John Duckett (2010: 481-482), JavaScript merupakan bahasa

pemrograman yang digunakan dalam pemrograman web. Dengan menggunakan

JavaScript, programmer dapat:

1. Membaca dan menuliskan (read & write) elemen dan teks.

2. Memanipulasi atau memindahkan teks.

3. Menjalankan fungsi perhitungan pada data.

4. Bereaksi terhadap events, seperti saat pengguna menekan sebuah button.

5. Membaca waktu dan tanggal di komputer pengguna.

6. Menetapkan ukuran tampilan beserta resolusi layar dan web browser version

pada komputer pengguna.

7. Melakukan pengecekan pada input yang diberikan oleh pengguna, seperti

pada pengecekan form validation.

Penulisan code JavaScript ditandai dengan tag ‘<script type=”JavaScript”>

</script>’ pada halaman HTML. Code JavaScript dapat dimasukkan secara internal

ataupun eksternal. Penulisan secara internal cukup dengan memasukan code di antara

tag script. Sedangkan secara eksternal, code berupa file yang disimpan berlainan

folder ataupun dari link internet dituliskan seperti berikut:

<script type=”JavaScript” src=”scripts/validation.js”></script>

35

2.8 Jquery

Menurut McFarland (2011: 4) jQuery merupakan pustaka javascript yang

dibuat untuk memudahkan pemrograman javascript. Sebagai contoh, dengan

menggunakan jQuery kode pemrograman yang memerlukan beratus – ratus baris

dapat diselesaikan dengan hanya satu baris kode saja.

2.9 Hypertext Preprocessor (PHP)

Menurut Peter B. MacIntyre (2010: 2), PHP merupakan bahasa scripting

yang seringkali digunakan pada server-side yang dibuat khusus untuk pemrograman

web. PHP harus terhubung pada sebuah web server atau software web server seperti

Apache atau IIS (Internet Information Service). PHP dapat digunakan untuk

menghasilkan informasi HTML secara dinamis. Selain itu, PHP juga dapat

digunakan untuk membangun integrasi dengan database tools seperti MySQL,

SQLite, DB2, Oracle, dan sebagainya.

PHP memiliki kelebihan dibanding bahasa scripting lainnya. Beberapa

kelebihan yang dipaparkan oleh Luke Welling (2009: 4) adalah:

1. Performance

PHP dapat bekerja cepat dengan performa yang sangat baik.

2. Scalability

Skala komoditas yang besar.

3. Integrasi ke database

PHP memiliki native connection yang tersedia untuk berbagai macam

database system.

4. Built-in libraries

PHP memiliki banyak fungsi built-in untuk melakukan tugas yang

berhubungan dengan web task.

5. Low cost

PHP merupakan bahasa scripting open source, sehingga siapapun dapat

menggunakannya secara gratis.

6. Ease of learning and use

PHP mudah untuk dipelajari. Bahasa pemrograman PHP didasari pada

bahasa pemrograman pada umumnya, seperti C, C++, Perl, dan Java.

7. Strong object-oriented (OOP) support

36

PHP versi 5 sudah didukung dengan fitur OOP.

8. Flexibility of development approach

PHP memberikan kemudahan bagi developer dalam implementasi. PHP

sangat mudah untuk beradaptasi dengan framework seperti CodeIgniter.

9. Availability of source code

Developer memiliki akses langsung dengan source code PHP.

10. Availability of support and documentation

PHP memberikan dokumentasi yang jelas dan tersedia komunitas yang

siap membantu jika developer mengalami kesulitan dalam menggunakan

PHP.

2.10 MySQL

Menurut Welling and Thomson (2008, p3) MySQL adalah sebuah relational

database server yang sangat cepat dan dapat menyesuaikan dengan kebutuhan

pengguna.

MySQL merupakan sebuah basis data yang dapat menyimpan, mencari, melakukan

pengurutan, dan mengambil data. Server MySQL mengontrol akses data sehingga

dapat diakses oleh banyak pengguna secara bersamaan, menyediakan akses yang

cepat, dan memastikan hanya penguna yang terotorisasi yang dapat mengakses basis

data. MySQL menggunakan SQL (Standard Library Language). Dalam

penggunaannya, MySQL memiliki 2 lisensi. Pertama, lisensi gratis (open source)

yang dapat digunakan bila penggunaannya masih sesuai dengan lisensi open source.

Kedua, lisensi komersil.

Beberapa keunggulan dalam menggunakan MySQL:

1. Performa

MySQL sangat cepat. Pada tahun 2002, seperti yang dilansir eWeek yang

membandingkan 5 basis data terbaik. Hasil terbaik adalah MySQL dan

Oracle.

2. Biaya murah

MySQL tersedia secara gratis dengan lisensi open source.

3. Mudah digunakan

Kebanyakan RDBMS lain menggunakan SQL, sehingga jika sebelumnya

pernah menggunakan basis data lain maka tidak akan sulit beradaptasi

dengan MySQL.

37

4. Portabilitas

MySQL dapat digunakan dalam banyak sistem Unix, serta Windows.

5. Source code

Dapat mendapatkan dan memodifikasi source code MySQL dari banyak

sumber.

6. Ketersediaan dukungan

Merupakan produk open source yang mempunyai perusahaan yang

menawarkan dukungan, konsultasi, sertifikasi.

2.11 Asynchronous JavaScript And XML (AJAX)

AJAX merupakan cara dalam merancang dan membangun halaman web yang

interaktif dan responsif seperti aplikasi desktop. Halaman AJAX dibangun dengan

menggunakan bahasa yang sudah umum, seperti XHTML, CSS, dan JavaScript

(Riordan, 2008: 5). Selanjutnya, Lee Babin (2007: 6) menyebutkan bahwa pada

dasarnya, AJAX memanfaatkan objek XMLHTTPRequest JavaScript untuk

mengirimkan asynchronous request (tanpa harus melakukan refresh halaman)

terhadap web server. Dengan menggunakan XMLHTTPRequest, web application

dapat mengumpulkan atau mengirimkan informasi ke web server, sehingga web

server dapat memproses request dari pengguna dan mengirimkan respon pada

halaman web secara dinamis.

Gambar 2.38 Alur Request dan Response Tradisional

38

Gambar 2.39 Alur Request dan Response dengan AJAX

Perbedaan terlihat sangat jelas antara proses request dan response pada web

application saat tidak menggunakan dan menggunakan AJAX. Pada gambar 2.38

proses yang terjadi masih menggunakan proses tradisional, web application atau web

page melakukan request terhadap web server, dan mendapatkan kembali response

setelah terjadi proses refresh page. Alur pada web application yang menggunakan

AJAX dapat dilihat pada gambar 2.39. Selama proses request dan response dengan

web server, tidak terjadi refresh atau perpindahan page. Hal ini mengizinkan

pengguna untuk tetap fokus terhadap task pada halaman yang sedang dibukanya.

2.12 JavaScript Object Notation (JSON)

JavaScript Object Notation yang disingkat JSON adalah cara untuk

merepresentasikan objek JavaScript dalam bentuk teks biasa (Riordan, 2008: 380).

Menurut Ryan Benedetti dan Ronan Cranley (2011: 350), JSON tidak bergantung

pada bahasa pemrograman tertentu. Transfer data dengan JSON lebih efisien

dibandingkan dengan XML, dan merupakan kumpulan nama atau nilai, seperti

associative arrays. Nilai pada JSON dapat berupa strings, angka, arrays, objects,

boolean values (true atau false) atau null. Untuk mengakses informasi pada JSON,

cukup menggunakan notasi titik (.), sama halnya dengan cara akses pada objek

lainnya. Array pada JSON memiliki ciri yang sama, misalnya length, dengan array

Javascript lainnya.

39

2.13 Framework

Framework merupakan suatu struktur berisikan kumpulan perintah atau

fungsi dasar yang membentuk aturan - aturan tertentu dan saling berinteraksi satu

dengan yang lain (Wardana, 2010: 3). Dengan menggunakan framework, developer

tidak perlu membangun kode dari nol karena hanya perlu membangun kode dan

menjalankannya dengan bantuan fungsi yang telah disediakan. Beberapa kelebihan

dalam menggunakan framework dalam membangun sebuah aplikasi adalah:

1. Mempersingkat waktu pembuatan aplikasi.

2. Kode lebih mudah untuk dibaca (terstruktur).

3. Kode lebih mudah untuk diperbaiki.

4. Tidak perlu membuat kode penunjang seperti; koneksi database, validasi

form, GUI, dan keamanan karena telah disediakan.

5. Membuat developer lebih fokus ke alur permasalahan kode.

6. Adanya keteraturan peletakan kode.

2.14 CodeIgniter

CodeIgniter merupakan framework untuk membangun web dengan bahasa

pemrograman PHP. CodeIgniter menyediakan kumpulan libraries untuk tugas yang

biasa dibutuhkan, dengan tampilan dan struktur yang sederhana untuk mengakses

libraries. Dengan berkurangnya jumlah coding yang perlu dibutuhkan,

pengembangan proyek pun akan lebih cepat. Adapun beberapa kelebihan dalam

menggunakan CodeIgniter, yaitu:

1. Tidak perlu mempelajari template bahasanya.

2. Tidak perlu menggunakan command line dalam penggunaannya.

3. Hampir tidak diperlukan konfigurasi lagi.

4. Memiliki performa yang sangat baik.

5. Memiliki kecocokan yang sangat luas dengan account hosting yang

menjalankan berbagai jenis versi dan konfigurasi PHP.

6. Merupakan solusi yang mudah.

7. Tidak perlu mengikuti aturan coding yang terbatas. (Ellislab, Inc.)

2.14.1 Model View Controller (MVC)

Model View Controller atau MVC merupakan konsep dasar

yang digunakan CodeIgniter. MVC (Presman, 2010: 386) merupakan

40

salah satu arsitektur desain tiga layer yang memisahkan antar-muka,

navigasi, dan perilaku aplikasi. Komponen – komponen MVC adalah:

1. Model

Model berisi semua konten spesifik aplikasi dan logika

pemrosesan, termasuk isi object, akses ke sumber data atau

informasi eksternal, dan semua fungsi pemrosesan.

2. View

View berisi fungsi spesifik antar-muka yang memungkinkan

penyajian isi (content) dan pengolahan logika, termasuk

seluruh isi object, akses ke sumber data/informasi eksternal,

dan semua fungsi yang ditujukan bagi end-user.

3. Controller

Controller berfungsi untuk mengatur akses dengan model dan

view serta mengkoordinasi aliran data di antara keduanya.

Gambar 2.40 Alur MVC

2.14.2 Object-Oriented Programming

Menurut Matt Weisfield (2009: 5-8) Object-Oriented

Programming (OOP) merupakan pemrograman yang berorientasikan

pada objek. Semua atribut dan perilaku dibungkus di dalam class dan

object.

41

1. Class

Class merupakan sebuah blueprint (cetak biru) dari

sebuah object (Weisfeld, 2009: 14). Class dibutuhkan

sebagai dasar dalam membuat object. Class terdiri dari dua

hal, yaitu attribute dan method. Attribute (atribut)

merupakan definisi dari sebuah class, sedangkan method

(metode) merupakan perilaku (behaviour) dari sebuah

class.

2. Object

Object dalam OOP merupakan building blocks.

Pada dasarnya sebuah program yang menggunakan konsep

OOP merupakan sebuah kumpulan dari object (Weisfeld,

2009: 10).

2.15 Bootstrap

Twitter, Inc., selalu mengembangkan proyek open source yang tersimpan di

GitHub, komunitas dimana para developer untuk proyek open source berkumpul dan

bekerja sama (Twitter, Inc.). Bootstrap merupakan salah satu framework untuk

pengembangan front-end sebuah web yang sangat terkenal di seluruh dunia, yang

bertujuan untuk membantu pengembangan web menjadi lebih cepat dan lebih mudah.

Bootstrap merupakan sebuah proyek open source. Bootstrap dibuat pertama kali oleh

designer dan developer Twitter, Mark Otto dan James Thornton, pada pertengahan

tahun 2010. Kemudian Bootstrap dirilis untuk publik pada 19 Agustus 2011. Pada

perilisan versi kedua, Bootstrap menambahkan fitur responsive sebagai pilihan yang

dapat digunakan. Lalu pada versi ke-tiga, fitur responsive dibuat menjadi default

dengan pendekatan yang diutamakan pada perangkat mobile (Bootstrap).

Dikarenakan pengembangannya sangat signifikan, Bootstrap merupakan

proyek yang paling diawasi dari semua proyek yang ada pada GitHub (Cochran,

2012: 2).

2.16 Responsive Web Design

Menurut Ethan Marcotte (2011: 5), Responsive Web Design adalah

pendekatan yang memungkinkan desain dan pengembangan website dapat

mengakomodasi berbagai ukuran layar, platform dan orientasi yang berbeda.

42

Menurut Ethan marcotte, terdapat 3 teknik dalam melakukan desain web responsif:

1. Flexible grid layout

Teknik ini memungkinkan lebar dan layout website menyesuaikan ukuran

layar secara fleksibel.

2. Flexible images

Teknik ini memungkinkan ukuran gambar menyesuaikan ukuran layar secara

fleksibel.

3. Media dan media queries

Merupakan bagian dari CSS yang memperindah tampilan website yang dibuat

sesuai dengan ukuran layar.

2.17 Perpustakaan

George M. Eberhart (2006: 2) mendefinisikan, “Perpustakaan adalah koleksi

sumber daya dalam berbagai format yang diselenggarakan oleh para ahli dalam

bidang informasi atau ahli lainnya yang menyediakan kemudahan secara fisik,

digital, akses bibliografi atau intelektual dan menawarkan ditargetkannya layanan

dan program dengan misi mendidik, menginformasikan, atau menghibur berbagai

khalayak dan tujuan merangsang pembelajaran individu dan memajukan masyarakat

secara keseluruhan.”

Dari pernyataan di atas, dapat disimpulkan bahwa perpustakaan merupakan

sebuah wadah atau tempat koleksi buku, jurnal, majalah, dan hal lainnya sebagai

kumpulan informasi yang berisikan ilmu pengetahuan dan hiburan yang dibutuhkan

manusia.

2.18 DDC (Dewey Decimal Classification) dan Call Number

Menurut Shivendra Singh (2011: 149), setiap aset perpustakaan mempunyai

call number yang biasanya digunakan untuk menemukan lokasi aset pada rak. Call

Number terdiri dari dua bagian, di antara lain: nomor DDC (Dewey Decimal

Classification) dan nomor buku.

Nomor buku terdiri dari angka dan huruf yang menambahkan detail buku

dibandingkan dengan nomor DDC. Untuk buku yang mempunyai DDC yang sama,

nomor buku dapat menjadi pembeda antara dua buku tersebut.

Nomor DDC merepresentasikan kategori subjek. Karakteristik nomor DDC antara

lain :

43

1. Nomor adalah bilangan desimal. Pada bagian sebelah kiri titik desimal terdiri

dari 3 angka dengan jarak dari 000 – 999.

2. Di sebelah kanan titik desimal terdapat angka pilihan yang membuat nomor

ddc semakin spesifik.

3. Contoh nomor DDC: 765.15, 705., 005.11345, 794.1

2.19 ISBN (International Standard Book Number)

Menurut Perpustakaan Nasional Republik Indonesia (2012), ISBN

(International Standard Book Number) adalah kode pengidentifikasian buku yang

bersifat unik. Informasi tentang judul, penerbit, dan kelompok penerbit tercakup

dalam ISBN. ISBN terdiri dari deretan angka 13 digit, sebagai pemberi identifikasi

terhadap satu judul buku yang diterbitkan oleh penerbit. Oleh karena itu satu nomor

ISBN untuk satu buku akan berbeda dengan nomor ISBN untuk buku yang lain.

Nomor ISBN terdiri dari 13 digit dan dibubuhi huruf ISBN didepannya. Nomor

tersebut terdiri atas 5 (lima) bagian. Masing-masing bagian dicetak dengan

dipisahkan dengan tanda hyphen (-). Kelompok pembagian nomor ISBN ditentukan

dengan struktur sebagai berikut:

ISBN 978-602-8519-93-9

1. Angka pengenal produk terbitan buku dari EAN (Prefix identifier) = 978

2. Kode kelompok (group identifier) = 602 (Default)

3. Kode penerbit (publisher prefix) = 8519

4. Kode Judul (title identifier) = 93

5. Angka pemeriksa (check digit) = 9

Fungsi ISBN:

1. Memberikan identitas terhadap satu judul buku yang diterbitkan oleh penerbit

2. Membantu memperlancar arus distribusi buku karena dapat mencegah

terjadinya kekeliruan dalam pemesanan buku

3. Sarana promosi bagi penerbit karena informasi pencantuman ISBN

disebarkan oleh Badan Nasional ISBN Indonesia di Jakarta, maupun Badan

Internasional yang berkedudukan di London

2.20 ISSN (International Standard Serial Number)

Menurut ISSN International Centre (2014), ISSN (International Standard

Serial Number) merupakan delapan buah angka yang digunakan untuk membedakan

44

koran, jurnal, majalah dan segala jenis media baik yang dicetak ataupun elektronik.

ISSN terdiri dari dua kelompok yang masing – masing terdiri dari empat angka dan

dipisahkan oleh tanda penghubung. ISSN digunakan untuk mengidentifikasi

publikasi, tetapi tidak termasuk informasi tentang asal – usul atau isi publikasi, dan

tidak menjamin kualitas atau validitas isi.