7

BAB II

LANDASAN TEORI

2.1 Tinjauan Pustaka

2.1.1 Rekayasa Perangkat Lunak

Menurut (Maulana, 2017) “Perangkat lunak merupakan abstraksi fisik yang

memungkinkan kita untuk berbicara dengan mesin perangkat keras. Tanpa adanya

perangkat lunak, maka perangkat keras yang telah diciptakan tidak akan dapat

berguna atau berfungsi dengan optimal”. Deskripsi informasi dari ke dua poin ini

menjelaskan operasi dan penggunaan dari perangkat lunak. Perangkat lunak lebih

mengacu kepada logical dari pada physical system element. Oleh karena itu,

perangkat lunak mempunyai karakteristik yang membedakan dengan perangkat

keras yaitu:

1. Perangkat lunak dikembangkan atau direkayasa bukan diciptakan.

2. Perangkat lunak tidak akan habis atau hilang.

3. Meskipun industri bergerak ke arah komponen berbasis konstruksi tetapi

sebagian besar perangkat lunak tetap dibangun atau dikembangkan.

2.1.2 Pengertian Software Development Life Cycle (SDLC)

Setiap perangkat lunak memiliki siklus hidup pengembangan sistem

(SDLC) yaitu suatu proses periode pembuatan dan perubahan sistem yang disertai

dengan metodologi yang digunakan untuk mengembangkan sistem. Rekayasa

perangkat lunak adalah suatu proses penelusuran, perencanaan, pemodelan,

pengembangan yang dilaksanakan dan dikelola untuk membangun sebuah sistem

8

perangkat lunak. Setiap sistem perangkat lunak memiliki siklus hidup (life cycle)

dimana periode dilakukan pengembangan perangkat lunak untuk menyelesaikan

masalah baru yang timbul, umumnya pengembangan sistem memiliki 5 tahapan

yaitu investigasi dan analisis, modeling, development, implementasi, dan

pengelolaan.

Dalam pengembangan suatu sistem, sulit diprediksi hal-hal apa saja yang

akan terjadi saat pengembangan berlangsung. Keinginan pemilik produk (product

owner) dapat berubah sewaktu-waktu. Gagal beradaptasi dengan perubahan

menjadi salah satu penyebab kegagalan suatu proyek. Menurut (Elvis C. Foster,

2014) pada bukunya yang berjudul Software Engineering A Methodical Approach,

siklus hidup pengembangan, sistem memiliki banyak variasi model. Seperti

diantaranya:

1. Waterfall Model

2. Phased Prototype Model

3. Iterative Development Model

4. Rapid Prototype Model

5. Formal Transformation Model

6. Component-Based Model

7. Agile Development Model

Menurutnya terlepas dari model apa yang di gunakan, pada umumnya siklus

hidup pengembangan sistem memiliki 5 tahapan yaitu :

9

Gambar II.1Lima Tahapan Utama SDLC

Sumber: (Elvis C. Foster, 2014:9)

2.1.3 Metode PengembanganWaterfall

Menurut (Pressman, 2015) “Waterfall merupakan salah satu model klasik

dalam perancangan piranti lunak. Penyusun memilih model waterfall, karena

langkah – langkahnya berurutan dan sistematis”. Menurut (Larasati & Masripah,

2017) “Air terjun (Waterfall) sering disebut juga model sekuensial linier

(sequential linear) atau alur hidup klasik. Model air terjun menyediakan

pendekatan alur hidup perangkat lunak secara sekuensial atau terurut. Metode

Waterfall disebut juga dengan Classic Life Cycle. Metode ini membutuhkan

pendekatan dalam pengembangan perangkat lunak dan mengumpulkan kebutuhan

secara lengkap yang diantaranya, Communication, Planning, Modeling,

Construction dan Deployment.

1. Communication

Langkah ini merupakan analisis terhadap kebutuhan software, dan tahap untuk

mengadakan pengumpulan data dengan melakukan pertemuan dengan

customer, maupun mengumpulkan data-data tambahan baik yang ada di jurnal,

artikel, maupun dari internet.

10

2. Planning

Proses planning merupakan lanjutan dari proses communication (analysis

requirement). Tahapan ini menghasilkan dokumen user requirement atau bisa

dikatakan sebagai data yang berhubungan dengan keinginan user dalam

pembuatan software, termasuk rencana yang akan dilakukan.

3. Modeling

Proses modeling ini akan menerjemahkan syarat kebutuhan ke sebuah

perancangan software yang dapat diperkirakan sebelum dibuat coding. Proses

ini berfokus pada rancangan struktur data, arsitektur software, representasi

interface, dan detail (algoritma) prosedural. Tahapan ini akan menghasilkan

dokumen yang disebut software requirement.

4. Construction

Construction merupakan proses membuat kode. Coding atau pengkodean

merupakan penerjemahan desain dalam bahasa yang bisa dikenali oleh

komputer. Programmer akan menerjemahkan transaksi yang diminta oleh

user. Tahapan inilah yang merupakan tahapan secara nyata dalam

mengerjakan suatu software, artinya penggunaan komputer akan

dimaksimalkan dalam tahapan ini. Setelah pengkodean selesai maka akan

dilakukan testing terhadap sistem yang telah dibuat tadi. Tujuan testing adalah

menemukan kesalahan-kesalahan terhadap sistem tersebut untuk kemudian

bisa diperbaiki.

5. Deployment

Tahapan ini bisa dikatakan final dalam pembuatan sebuah software atau

sistem. Setelah melakukan analisa, desain dan pengkodean maka sistem yang

11

sudah jadi akan digunakan oleh user. Kemudian software yang telah dibuat

harus dilakukan pemeliharaan secara berkala.

Gambar II. 2Model Pengembangan Waterfall

Sumber: Software Engineering,(Pressman, R.S., 2015)

2.1.4 Unified Modeling Language (UML)

Unified Modeling Language (UML) adalah bahasa standar untuk menuliskan

cetak biru (blueprints) perangkat lunak. UML dapat digunakan untuk

memvisualisasikan, menentukan, membangun, dan mendokumentasikan artefak

dari sistem perangkat lunak-intensif. Dengan kata lain, seperti arsitek bangunan

yang membuat cetak biru (blueprints) yang akan digunakan oleh perusahaan

konstruksi, arsitektur software membuat diagram UML untuk membantu

pengembang dalam membangun perangkat lunak.

1. Use Case Diagram

Sebuah use case menggambarkan bagaimana user berinteraksi dengan sistem

dengan mendefinisikan langkah-langkah yang diperlukan untuk mencapai tujuan

tertentu. Diagram use case adalah gambaran dari semua use case dan bagaimana

use case berhubungan. Ini memberikan gambaran luas dari fungsi sistem.

12

Gambar II. 3Contoh use case diagram

Sumber: Software Engineering, Pressman, R.S. (2010).

Pada diagram ini, gambar stick figure merepresentasikan sebuah aktor yang

terkait dengan satu kategori pengguna (atau elemen interaksi lainnya). Biasanya

sistem yang kompleks memiliki lebih dari satu aktor. Berikut adalah simbol-

simbol yang digunakan pada use case diagram:

Table II. 1Simbol use case diagram

Sumber: Software Engineering, (Pressman, R.S, 2010).

No. Simbol Keterangan

1

Aktor

Merupakan kesatuan eksternal yang berinteraksi dengan

sistem.

2 Use Case Rangkaian/uraian sekelompok yang saling terkait dan

membentuk sistem.

13

No. Simbol Keterangan

3 Generelation Menggambarkan hubungan khusus atau interaksi dalam

objek.

2. Sequence Diagram

sebuah sequence diagram digunakan untuk menunjukkan komunikasi yang

dinamis antara objek selama pelaksanaan tugas, berbeda dengan diagram kelas,

yang menunjukkan struktur statis dari komponen software. (Pressman, R.S. 2010).

Sebuah sequence diagram menunjukkan langkah-langkah yang terlibat

dalam menyoroti sosok dalam sebuah gambar ketika telah diklik. Setiap kotak

pada baris di bagian atas diagram biasanya berhubungan dengan suatu objek,

meskipun ada kemungkinan untuk memiliki kotak model yang lain, seperti kelas.

Di bawah setiap kotak ada garis putus-putus yang disebut lifeline dari objek.

Sumbu vertikal dalam sequence diagram sesuai dengan waktu, dengan waktu

semakin meningkat ke bawah.

Sequence diagram menunjukkan pemanggilan metode menggunakan panah

horizontal dari caller (pemanggil) ke callee, diberi label dengan nama metode dan

parameter (opsional), type, dan return type. Pada saat objek mengeksekusi

metode, kita (secara opsional) dapat menampilkan bar putih yang disebut

activation bar secara menurun pada objek lifeline. Diagram sequence juga secara

opsional menampilkan return dari method yang dipanggil dengan garis putus-

putus berpanah dan labelnya.

Contoh gambar dibawah menampilkan kasus yang mudah dan tidak menunjukan

ada kondisi lain atau pun loop. Jika kontrol struktur logical diperlukan, cara

14

terbaiknya dengan menggambarkan diagram sequence yang berbeda untuk setiap

kasusnya. Ini berarti, jika alur pesan dapat mengambil dua kondisi yang berbeda,

kita menggambar dua gambar diagram sequence, masing-masing untuk setiap

kemungkinan.

Gambar II. 4Contoh Sequence Diagram

Sumber: Software Engineering, (Pressman, R.S. 2010).

Berikut adalah simbol-simbol yang digunakan pada sequence diagram:

Table II. 2Simbol Sequence diagram

Sumber: Software Engineering, (Pressman, R.S. 2010).No. Simbol Nama

1 LifeLine Antarmuka yang saling berinteraksi.

3 Activation Menggambarkan hubungan antara object

dengan message.

15

No. Simbol Nama

4 Message(call) Menggambarkan alur message yang

merupakan kejadian objek pengirim lifeline

ke objek penerima lifeline.

5 Message(return) Menggambarkan alur pengambilan message

ke objek pemanggil dan tanda bahwa objek

penerima telah menyelesaikan prosesnya.

3. Activity Diagram

Menurut (Verdi Yasin, 2012), “Activity Diagram adalah teknik untuk

mendeskripsikan logika prosedural, proses bisnis dan aliran kerja dalam banyak

kasus”. Oleh karena itu activity diagram tidak menggambarkan behaviour internal

sebuah sistem (dan interaksi antar subsistem) secara eksak, tetapi lebih

menggambarkan proses-proses dan jalur-jalur aktivitas dari level atas secara

umum. Menggambarkan proses bisnis dan urutan aktivitas dalam sebuah proses.

Dipakai pada business modelling untuk memperlihatkan urutan aktifitas proses

bisnis.

Berikut adalah simbol-simbol yang digunakan pada Activity diagram:

Table II. 3Simbol Activity diagram

No. Simbol Nama

1 Initial Node Menunjukkan titik awal kegiatan

2 Final Node Menunjukkan akhir kegiatan

16

No. Simbol Nama

3 State/Activities Mewakili tugas yang dilakukan oleh

perangkat lunak sistem.

4 Fork (Pertaxiangan) Mewakili pemisahan aktivitas yang

bersamaan menjadi 2 atau lebih

5 Join (Penggabungan) Simbol untuk menyinkronkan alur kontrol

yang ada pada tingkatan yang sama.

6 Decision Simbol untuk alur kontrol bertaxiang yang

dikarenakan adanya kondisi.

Sumber: Software Engineering, (Pressman, R.S. 2010).

Berikut merupakan contoh gambar untuk aktivity diagram :

Gambar II. 5Contoh Activity Diagram

17

4. Calss Diagram

Sebuah class diagram menyediakanpandangan statis atau struktural dari sebuah

sistem. Hal ini tidak menunjukkan sifat dinamis dari komunikasi antara objek dari

kelas dalam diagram. Pressman, R.S. (2010). Berikut adalah simbol-simbol yang

digunakan pada Class diagram:

Table II. 4Simbol Class diagram

No. Simbol Nama

1. Class

Class

Ikon yang digunakan untuk mewakili

kelas dan interface.

Class terdiri dari:

1. Class Name

2. Attributes

3. Behaviours

2. Association Relasi antar class dengan makna

umum

3. Generalization Relasi antar class dengan makna

generalisasi-spesialisasi (umum-

khusus)

4. Realization Menunjukkan implementasi

antarmuka

5 Dependency Relasi anatar class dengan makna

kebergantungan antar class

Sumber: Software Engineering, (Pressman, R.S. 2010).

123

18

Unsur-unsur utama dari class diagram adalah kotak, yang merupakan ikon yang

digunakan untuk mewakili kelas dan interface. Setiap kotak dibagi menjadi

bagian-bagian horizontal. Bagian atas berisi nama kelas, bagian tengah berisi

daftar atribut dari kelas, dan bagian bawah berisi fungsi operasi atau perilaku

kelas. Operasi mengacu pada apa yang dapat dilakukan oleh objek kelas. Hal ini

biasanya diimplementasikan sebagai metode kelas. Setiap atribut dapat memiliki

nama, jenis, dan tingkat visibilitas. Jenis dan visibilitas adalah opsional. Jenis ini

mengikuti nama dan dipisahkan dari nama dengan titik dua. Visibilitas

ditunjukkan dengan - (private), # (protected), ~(package), atau + (public).

Gambar II. 6Contoh Class diagram

Sumber: Software Engineering, (Pressman, R.S. 2010).

Diagram kelas juga dapat menunjukkan hubungan antara kelas. Sebuah kelas yang

merupakan subclass dari kelas lain terhubung dengan panah dengan garis yang

solid dengan panah segitiga berongga. Arah panah menunjukan dari subclass ke

superclass. Dalam UML, hubungan tersebut disebut generalisasi. Sebagai contoh,

pada Gambar 2.9, kelas Thoroughbred dan QuarterHorse terbukti subclass dari

kelas abstrak Horse. Panah dengan garis putus-putus untuk poros panah

menunjukkan implementasi antarmuka. Dalam UML, hubungan tersebut disebut

19

realisasi. Sebagai contoh, pada Gambar II.9, mengimplementasikan kelas Horse

atau menyadari antarmuka OwnedObject.

Gambar II. 7Contoh Class diagram

Sumber: Software Engineering, (Pressman, R.S. 2010).

5. Data Flow Diagram (DFD)

DFD yang di dalam bahasa Indonesia disebut sebagai DAD (Diagram Arus Data)

memperlihatkan gambaran tentang masukan proses-keluaran dari suatu

sistem/perangkat lunak, yaitu obyek-obyek data mengalir ke dalam perangkat

lunak, kemudian ditransformasi oleh elemen-elemen pemrosesan , dan obyek-

obyek data hasilnya akan mengalir keluar dari sistem/perangkat lunak (S.

Pressman, 2012). Obyek-obyek data dalam penggambaran DFD biasanya

direpresentasikan menggunakan tanda panah berlabel, dan transformasi-

transformasi biasanya direpresentasikan menggunakan lingkaran-lingkaran yang

sering disebut sebagai gelembung-gelembung (S. Pressman, 2012). DFD pada

dasarnya digambarkan dalam bentuk hirarki, yang pertama sering disebut sebagai

DFD level 0 yang menggambarkan sistem secara keseluruhan sedangkan DFD-

DFD berikutnya merupakan penghalusan dari DFD sebelumnya. DFD

menggunakan empat buah simbol, yaitu: semua simbol yang digunakan pada CD

ditambah satu simbol lagi untuk melambangkan data store. Ada dua teknik dasar

20

penggambaran simbol DFD yang umum dipakai, pertama adalah Gane and Sarson

sedangkan yang kedua adalah Yourdon and De Marco. Perbedaan yang mendasar

pada teknik tersebut adalah lambang dari simbol yang digunakan. Gane and

Sarson menggunakan lambang segi empat dengan ujung atas tumpul untuk

menggambarkan process dan menggunakan lambang segi empat dengan sisi kanan

terbuka untuk menggambarkan data store. Yourdon and De Marco menggunakan

lambang lingkaran untuk menggambarkan process dan menggunakan lambang

garis sejajar untuk menggambarkan data store. Sedangkan untuk simbol external

entity dan simbol data flow kedua teknik tersebut menggunakan lambang yang

sama yaitu: segi empat untuk melambangkan external entity dan anak panah untuk

melambangkan data flow.

6. Kegunaan Masing-Masing Simbol Pada Data Flow Diagram

Menurut jurnal yang disusun oleh Rita Afyenni (2014), pada jurnalnya

yang berjudul “Perancangan Data Flow Diagram Untuk Sistem Informasi Sekolah

(Studi Kasus Pada SMA Pembangunan Laboratorium UNP)” menyebutkan, ada

empa buah symbol yang digunakan pada DFD, yang masing-masingnya

digunakan untuk mewakili, diantaranya ;

a. External entity (kesatuan luar) atau boundary (batas sistem), digunakan untuk

menyatakan: suatu kantor, departemen atau divisi dalam perusahaan tetapi di

luar sistem yang dikembangkan; orang atau sekelompok orang di organisasi

tetapi di luar sistem yang sedang dikembangkan; suatu organisasi atau orang

yang berada di luar organisasi misal: langganan, pemasok; sistem informasi

yang lain di luar sistem yang sedang dikembangkan; sumber asli suatu

transaksi; penerima akhir dari suatu laporan yang dihasilkan oleh sistem.

21

b. Data flow (arus data), digunakan untuk menunjukkan arus dari data yang

dapat berupa: masukan untuk sistem ataupun hasil dari proses system. Arus

data sebaiknya diberi nama yang jelas dan mempunyai arti.

c. Process (proses), digunakan untuk menunjukkan kegiatan atau kerja yag

dilakukan oleh orang, mesin atau komputer dari hasil suatu arus data yang

masuk ke dalam proses untuk dihasilkan arus data yang keluar dari proses.

Suatu proses harus menerima arus data dan menghasilkan arus data

d. Data store (simpanan data) ), digunakan untuk menunjukkan simpanan dari

data yang dapat berupa: suatu file atau database di sistem komputer; suatu

arsip atau catatan manual; suatu kotak tempat data di meja seseorang; suatu

tabel acuan manual; suatu agenda atau buku.

panah yang mengarah ke kedua sisinya secara berlawanan arah; atau

menggunakan arus data terpisah.

Gambar II.8.Contoh Diagram Data Flow

22

7. Entity Relationship Diagram

Menurut Suroto Adi dan Desi Maya (2014), ERD merupakan diagram yang

menggambarkan relationship antar entitas yang relevan dari system interest.

Entitas dapat dijelaskan sebagai sesuatu yang menyebabkan seseorang

mengumpulkan data untuk diperoses menjadi informasi pendukung kegiatan

bisnis. Dalam model data “event-driven” digunakan notasi yang sama dengan

model data “viewdriven”, tetapi fokus dan sasaran modeling data berbeda. Model

data event-driven fokus pada kegiatan bisnis untuk seluruh proses bisnis, bukan

hanya melihat fungsi-fungsi organisasi.

Menurut Janner Simarmata dan Imam Paryudi (2012), “ERD dapat

digambarkan dalam basis data dengan kumpulan atribut”, misalnya atribut nim,

nama, alamat dan kota biasanya menggambarkan data mahasiswa tertentu

dalam suatu universitas.

Eko Darmonto (2016) menyebutkan “ Pemodelan data dalam bentuk

relasional pada awalnya digambarkan dengan pendekatan mirip dengan tata

cara pembuatan tulisan dalam bahasa China. Diamana entitas, relasional dan

atributnya digambarkan menggunakan notasi dasar persegi panjang, belah

ketupat dan lingkaran atau elips. Cara penggambaran dengan notasi sebagai

berikut ;

Gambar II.9Atribut yang digunakan dalam ERD

23

Penamaan entitas diharuskan menggunakan kata benda, sedangkan relasi

menggunakan kata kerja. Atribut merupakan karakteristik yang dimemiliki

oleh entitas atau relasi. Pada awalnya, atribut berupa sifat-sifat diskriptif yang

dipunyai oleh masing-masing anggota dari himpunan entitas, Pada

perkembangannya relasi juga dimungkinkan muncul suatu atribut, berikut

contoh penggambaran ERD yang diambil dari jurnal Eko Darmonto (2016)

Gambar II.10Contoh Penyusunan ERD

2.1.5 Website

World Wide Web atau lebih sering dikenal sebagai web adalah suatu layanan

sajian informasi yang menggunakan konsep hyperlink (tautan), yang memudahkan

surfer (sebutan para pemakai komputer yang melakukan browsing atau

penelusuran informasi malalui internet)”. Keistimewaan inilah yang telah

menjadikan web sebagai service yang paling cepat pertumbuhannya.

Menurut (Prayitno & Safitri, 2015) dalam (Yuhefizar 2013:2) pengertian website

adalah “keseluruhan halaman halaman web yang terdapat dari sebuah domain

yang mengandung informasi”.

Web mengizinkan pemberian highlight (penyorotan/penggaris bawahan) pada

kata-kata atau gambar dalam sebuah dokumen untuk menghubungkan atau

menunjukan ke media lain seperti dokumen, frase, movie clip, atau file suara. web

24

dapat menghubungkan dari sembarang tempat dalam sebuah dokumen atau

gambar ke sembarang tempat di dokumen lain.

Dengan sebuah browser yang memiliki Graphical User Interface (GUI), link-link

dapat dihubungkan ke tujuannya dengan menunjuk link tersebut dengan mouse

dan menekannya. Suatu situs web akan dikenal dengan cepat apabila informasi

yang disajikan selalu up-to-date dan lengkap. Disadari juga bahwa untuk

melakukan up-to-date merupakan suatu permasalahan yang tidak mudah untuk

dilakukan, selain membutuhkan waktu juga sangat merepotkan dalam melakukan

penambahan atau pengubahan data yang akan disajikan.

Jika sebuah situs tidak dirancang secara sistematis, maka akan terjadi kesulitan

dan kerepotan dalam melakukan pemeliharaan, meng-update dan melengkapi

data. PHP dan database merupakan solusi yang dapat digunakan dalam

mengelola situs. Hanya dengan melakukan penambahan atau perubahan data

kedalam database tanpa harus melakukan perubahan editing HTML (HyperText

Markup Language). Sebuah situs web bisa berupa hasil kerja perorangan atau

individu, atau menunjukkan kepemilikan dari suatu organisasi, perusahaan.

Biasanya pembahasan dalam sebuah situs web merujuk pada sebuah ataupun topik

khusus, atau kepentingan tertentu. Sebuah situs web bisa berisi pranala yang

menghubungkan ke situs web lain, demikian pula dengan situs web lainnya. Hal

ini terkadang membuat perbedaan antara situs web yang dibuat oleh individu

ataupun perseorangan dengan situs web yang dibuat oleh organisasi bisnis

menjadi tidak begitu jelas. Situs web biasanya ditempatkan pada server web.

Sebuah server web umumnya telah dilengkapi dengan perangkat-perangkat lunak

khusus untuk menangani pengaturan nama ranah, serta menangani layanan atas

25

protokol HTTP yang disebut sebagai HTTP Server seperti Apache HTTP Server,

atau Internet Information Services (IIS). Keuntungan membuat web diantara lain

adalah website dapat digunakan sebagai media promosi dati suatu produk baik itu

barang ataupun jasa, media informasi, dan lain-lain.

2.1.6 Pengertian HTML

HTML (Hypertext Markup Language) adalah bahasa pemrograman dasar dari

sebuah Web dan berperan sebagai tulang punggung dari semua halaman web. Di

dalam HTML dapat menambahkan JavaScript dan PHP ke halaman web, tetapi

untuk infrastruktur dalam pembuatan web adalah dengan menggunakan HTML.

Matthews (2015). Meskipun HTML menyediakan infrastruktur penting pada

halaman web, namun seiringnya waktu HTML mendapatkan tekanan untuk

melakukan update dari beberapa browser dan perangkat, terutama perangkat

mobile. Maka HTML mengeluarkan dengan penambahan fitur yang signifikan.

Sama seperti sebuah software, HTML memiliki beberapa versi. Versi terakhir

yang diperkenalkan adalah HTML5.

HTML5 adalah revisi pertama standar utama untuk HTML dalam 15 tahun.

Menggantikan kedua HTML 4.01 dan XHTML 1.1, serta banyak penambahan ad

hoc dan revisi di penggunaan umum. Sejumlah tag baru dan atribut yang

ditambahkan, seperti <audio>, <video>, <section>, dan <header>. Unsur-unsur

lain telah didefinisikan ulang, dimodifikasi, atau usang (tidak lagi secara resmi

bagian dari bahasa dan penggunaan yang tidak disarankan). Di saat yang sama,

HTML5 mendefinisikan sejumlah situasi pengolahan sehingga dapat ditangani

seragam oleh browser diperbarui untuk HTML5.

26

2.1.7 Pengertian XAMPP

Menurut (Prayitno & Safitri, 2015) dalam (Wahana 2015:1) mengemukanan

bahwa“XAMPP adalah salah satu paket instalasi apache, PHP, dan MySQL secara

instant yang dapat digunakan untuk membantu proses instalasi ketiga produk

tersebut”.

Menurut (Prastiwi & Utomo, 2013) bahwa “XAMPP merupakan bundel paket

instan yang terdiri dari Apache (server), MySql (database) dan PHP. Paket instan

ini banyak digunakan oleh para programmer web karena kemudahannya sehingga

programmer tidak perluu mengonfigurasi dari awal melainkan tinggal pakai”.

Kata XAMPP merupakan singkatan dari :

X : Berarti program ini dapat dijalankan di banyak sistem operasi, misalnya

(Windows, Linux, Mac OS, dan solaris).

A : Apache, merupakan aplikasi web server, dan bertugas untuk menghasilkan

halaman web yang benar kepada user berdasarkan kode PHP yang dituliskan

oleh pembuat halaman web. Jika diperlukan juga berdasarkan kode PHP

yang dituliskan, maka dapat saja suatu database diakses terlebih dahulu

(misalnya dalam MySQL) untuk mendukung halaman web yang dihasilkan.

M : MySQL, merupakan aplikasi database server. Perkembangannya disebut sql

yang merupakan kepanjangan dari Structured Query Language. Sql

merupakan bahasa terstruktur yang digunakan untuk mengolah database.

MySQL dapat digunakan untuk membuat dan mengelola database beserta

isinya. Kita dapat memanfaatkan MySQL untuk menambahkan, mengubah,

dan menghapus data yang berada dalam database.

27

P : PHP, bahasa pemrograman web. Bahasa pemrograman PHP merupakan

bahasa pemrograman untuk membuat web yang bersifat server-side

scripting. PHP memungkinkan kita untuk membuat halaman web yang

bersifat dinamis. Sistem manajemen basis data yang sering digunakan

bersama PHP adalah MySQl. namun PHP juga mendukung system

manajement database Oracle, Microsoft Access, Interbase, d-base,

PostgreSQL, dan sebagainya.

P : Perl, bahasa pemrograman.

2.1.8 MySQL

MySQL (My Structure Query Language) adalah sistem manajemen database

relasional yang menggunakan Query Terstruktur Language (SQL) untuk

menyimpan, bekerja dengan, dan mengambil informasi melalui Internet.

(Matthews, 2015). MySQL disebut "paling populer database open source di

dunia," dengan jutaan website menggunakannya sebagai sumber daya web yang

berjalan pada server web, seperti halnya PHP. Dan MySQL juga dapat dijalankan

pada server yang berdiri sendiri tidak terhubung ke Web. MySQL dibangun untuk

menangani volume besar, akses database multiuser. mysql.com mengatakan

"Banyak organisasi yang tumbuh paling cepat terbesar dan dunia termasuk

Facebook, Google, Alcatel Lucent, dan Zappos mengandalkan MySQL. "MySQL

rendah atau tidak ada biaya, kemudahan penggunaan, kecepatan, kehandalan, dan

kegunaan untuk kecil untuk situs besar membuatnya mudah untuk melihat

mengapa ia memiliki digunakan secara luas.

28

2.1.9 PHP

Menurut Agus Prayitno dan Yulia Safitri dalam Anhar (2015:1) bahwa “PHP

adalah (PHP Hypertext Preprocessor) adalah bahasa pemrograman webberupa

script yang dapat diintegrasikan dengan HTML”. PHP atau memiliki kepanjangan

PHP Hypertext Preprocessor, menurut Saputra, (2012) merupakan “suatu bahasa

pemrograman yang difungsikan untuk membangun suatu website dinamis”. PHP

menyatu dengan kode HTML, maksudnya adalah beda kondisi, HTML digunakan

sebagai pembangun atau pondasi dari kerangka layout web, sedangkan PHP

difungsikan sebagai prosesnya, sehingga dengan adanya PHP tersebut, sebuah

web akan sangat mudah di-maintenance.

PHP berjalan pada sisi server, sehingga PHP disebut juga sebagai bahasa Server

Side Scripting, artinya bahwa dalam setiap/untuk menjalankan PHP , wajib

membutuhkan web server dalam menjalankannya. PHP bersifat Open Source , dan

mampu lintas Platform, yaitu dapat berjalan pada sistem operasi Windows

maupun Linux.

Contoh sintaxnya :

<?PHP

echo "Dengan PHP, website lebih dinamis";

?>

Gambar II. 11 Struktur PHPSumber: Sistem Informasi Nilai Akademik untuk Panduan Skripsi, Saputra. 2012

29

2.1.10 jQuery

jQuery adalah Javacript Library kumpulan kode/fungsi Javascript siap pakai,

sehingga mempermudah dan mempercepat kita dalam membuat kode Javasrcipt”.

Secara standar, apabila kita membuat kode Javascript, maka akan di perlukan

kode yang cukup panjang, bahkan terkadang sangat sulit dipahami, misalnya

fungsi Javascript untuk membuat stripe (warna selang-seling pada baris suatu

table adalah sebagai berikut:

Gambar II. 12 Tampilan Script JavascriptSumber: Proyek Website Super Wow!, (Lukmanul Hakim.2013)

Di sinilah peran jQuery sebagai Javasrcipt Library, dimana kita bisa langsung

memanggil fungsi yang terdapat didalam Library tersebut, menariknya kita hanya

memerlukan satu/dua baris untuk membuat warna selang-seling pada suatu tabel,

yaitu:

Gambar II. 13Tampilan Script jQuery

Sumber: Proyek Website Super Wow!, (Lukmanul Hakim .2013)

30

Kesimpulannya, jQuery menyederhanakan kode Javascript. Hal ini sesuai dengan

slogannya ‘Write less, do more’ cukup tulis sedikit, tapi bisa melakukan banyak

hal.

Gambar II. 14Tampilan Logo jQuery Dan Slogannya

Sumber: Proyek Website Super Wow!, (Lukmanul Hakim .2013)

Kemampuan yang dimiliki jQuery, diantaranya:

a. Mempermudah akses dan manipulasi elemen tertentu pada dokumen.

Biasanya diperlukan baris program yang cukup panjang untuk mengakses

suatu elemen dokumen. Namun, jQuery dapat melakukannya hanya dalam

beberapa baris program saja, karena jQuery mempunyai Selector yang sangat

efisien untuk mengakses suatu elemen tertentu pada dokumen yang

selanjutnya bisa dimanipulasi sesuai dengan keinginan kita.

b. Mempermudah modifikasi/perubahan tampilan web.

Biasanya, untuk memodifikasi tampilan halaman web digunakan CSS.

Permasalahannya, CSS sangat dipengaruhi oleh web browser yang digunakan,

sehingga sering terjadi halaman web yang dibuat sudah rapi dan bagus

tampilan di browser Mozilla, namun ketika ditampilkan di Opera menjadi

berantakan. Namun, jQuery dapat menyesuaikan style CSS pada suatu

browser, sehingga permasalahan tersebut dapat dihindari.

c. Mempersingkat Ajax (Asynchronous Javascript and XML).

Kemampuan favorit dari Ajax adalah mampu mengambil informasi dari server

tanpa melakukan refresh pada halaman web, artinya halaman web terlihat

berganti secara otomatis. Apabila kita menuliskan kode Ajax secara manual,

31

biasanya diperlukan baris yang cukup panjang, namun jQuery dapat

mempersingkatnya menggunakan Ajax call, perbandingannya 25 baris kode

Ajax dapat dipersingkat menjadi 5 baris kode saja menggunakan jQuery.

d. Memiliki API (Application Programming Interface).

Dengan API, jQuery dapat memanipulasi content pada suatu halaman web,

seperti perubahan teks, manipulasi gambar (resize, rotate, crop), penyusunan

daftar (list), pengurutan list, paging, dan lain-lain.

e. Mampu merespon interaksi antara user dengan halaman web dengan lebih

cepat.

f. Menyediakan fasilitas untuk membuat animasi sekelas flash dengan mudah.

2.1.11 CSS (Cascade Style Sheet)

Cascade Style Sheet (CSS) merupakan salah satu bahasa pemrograman web yang

bertujuan untuk membuat web menjadi lebih menarik dan terstruktur”. Pada CSS

bisa merubah warna tabel, besar font, atau tata letak menu yang terkendali dari

CSS sehingga semua jendela web yang berkaitan dengan perubahan tersebut

secara otomatis dapat berubah, dengan CSS tidak perlu membuat style pada setiap

file PHP, karena cukup dengan satu file CSS telah dapat mengontrol semua style

yang di inginkan pada setiap file PHP yang akan ditampilkan nanti di web

browser.

2.1.12 Bootstrap

Menurut (Alatas, Husein. 2013) menerangkan bahwa “Bootstap merupakan

framework ataupun tools untuk memudahkan aplikasi web ataupun situs web

responsive secara cepat, mudah dan gratis”. Bootsrap sendiri terdiri dari CSS dan

HTML untuk menghasilkan grid, layout, typography, table, form, navigation dan

32

lain-lain. Di dalam bootsrap juga sudah terdapat jquery plugin untuk

menghasilkan komponen UI yang cantik seperti transitions, modal, dropdown,

scrollspy, tooltip, tab, popover, alert, button, carousel dan lain-lain.

Dengan bantuan bootstrap kita dapat membuat responsive website dengan mudah

dan dapat berjalan sempurna pada browser-browser populer seperti chrome,

firefox, safari, dan opera serta internet explorer. Bootsrap sendiri diciptakan oleh

dua orang programmer twitter, yaitu Mark Otto dan Jacob Thorton pada tahun

2011. Pada saat itu programmer twitter menggunakan berbagai macam tool dan

library yang di kenal dan suka untuk melaksanakan pekerjaan, sehingga tidak ada

standarisasi dan akibatnya sulit untuk dikelola sehingga Mark Otto dan Jacob

Thorton tergerak untuk menciptakan satu tool atau framework yang dapat

digunakan bersama di lingkungan internal twitter. Oleh karena faktor historis

tersebut, walaupun nama resminya hanyalah bootsrap namun terkenal di kalangan

developer sebagai twitter bootsrap. Sejak diluncurkan pada agustus 2011, bootsrap

telah berevolusi dari sebuah proyek yang hanya berbasis CSS, menjadi sebuah

tool ataupun framework yang lebih lengkap yang juga berisikan javascript

plugin,Icon,Forms dan button.

Gambar II. 15Tampilan Hasil Bootstrap Responsive Fixed Layout Pada Ukuran Layar

SmartphoneSumber: Responsive Web Design dengan PHP & Bootstap (Husein Alatas.2013)

33

2.1.13 Editplus

Editplus adalah aplikasi editor untuk kode dan teks yang dapat berjalan

diberbagai platform operating system dengan menggunakan teknologi Phyton API.

Terciptanya aplikasi ini terinspirasi dari aplikasi Vim, Aplikasi ini sangatlah

fleksibel dan powerfull. Fungsionalitas dari aplikasi ini dapat dikembangkan

dengan menggunakan sublime-packages. Editplus bukanlah aplikasi open source

dan juga aplikasi yang dapat digunakan dan didapatkan secara gratis, akan tetapi

beberapa fitur pengembangan fungsionalitas (packages) dari aplikasi ini

merupakan hasil dari temuan dan mendapat dukungan penuh dari komunitas serta

memiliki linsensi aplikasi gratis.

Editplus mendukung berbagai bahasa pemrograman dan mampu

menyajikan fitur syntax highlight hampir di semua bahasa pemrogramman yang

didukung ataupun dikembangkan oleh komunitas seperti; C, C++, C#, CSS, D,

Dylan, Erlang, HTML, Groovy, Haskell, Java, JavaScript, LaTeX, Lisp, Lua,

Markdown, MATLAB, OCaml, Perl, PHP, Python, R, Ruby, SQL, TCL, Textile

and XML. Biasanya bagi bahasa pemrograman yang didukung ataupun belum

terdukung secara default dapat lebih dimaksimalkan atau didukung dengan

menggunakan add-ons yang bisa didownload sesuai kebutuhan user.

2.1.14 Metode Pengujian Black Box

Menurut (Rosa & salahuddin 2013) bahwa "Pengujian Black-box dilakukan

dengan membuat kasus uji yang bersifat mencoba semua fungsi dengan memakai

perangkat lunak apakah sesuai dengan spesifikasi yang di butuhkan". Metode

Black Box merupakan strategi testing dimana hanya memperhatikan atau

memfokuskan kepada faktor fungsional dan spesifikasi perangkat lunak. Berbeda

34

dengan metode white box, black box testing tidak membutuhkan pengetahuan

mengenai alur internal (internal path), struktur atau informasi dari SoftwareUnder

Test (SUT). Pengujian black box berusaha menemukan kesalahan dalam kategori

diantaranya:

1. Fungsi-fungsi yang salah atau hilang

2. Kesalahan interface

3. Kesalahan dalam infrastruktur

4. Kesalahan peforma

5. Kesalahan inisialisasi dan terminasi

2.2 Penelitian Terkait

Adapun artikel atau tulisan yang berhubungan dengan penelitian ini antara lain:

1 (Mulyati & Alif, 2014). “Perencanaan Tarif Ideal Pengiriman Barang Di Pt

Syncrum Logistics Untuk Rute Milkrun Cibitung Berdasarkan Metode

Perhitungan Biaya Operasional Kendaraan (Bok)”. Aplikasi ini dirancang

untuk manajemen keuangan pada PT. Syncrum Logostic.

2 (Indah Mardliyah, 2012). “Sistem Informasi Managemen Persewaan Mobil

Pada Rental Mobil Indika Secara Online”. Dalam skripsi ini penulis

membangun sistem managemen pengelolaan mulai dari data mobil, daftar

pelanggan, pemesanan, sampai proses sewa sampai dengan proses

pengembalian.

3 (Dahlan Abdullah, Cut Ita Erliana, 2013), “Bisnis Rental Mobil Melalui

Internet (E-Commerce) Menggunakan Algoritma Sha-1 (Sequre Hash

Algorithm-1)”. Pada penulisan ini penulis mencoba membuat sebuah Aplikasi

35

Rental Mobil dengan menggunakan Algoritma SHA-1 (Secure Hash

Algorithm-1), yang akan di implementasikan pada sistem login. Tujuan dari

pembuatan aplikasi ini yaitu untuk membantu perusahaan atau usaha rental

mobil dalam mempromosikan jasanya yang dapat diakses secara online

sehingga memberikan pelayanan yang maksimal untuk masyarakat atau

pelanggan.

4 (Adisti Machmudah, Ronny S. Susilo, Henry Bambang Setyawan, 2013),

“Rancang Bangun Sistem Informasi Penentuan Rute Dan Biaya Transportasi

Pada Ukm New Sehati”. Sistem ini dapat menghasilkan output berupa susunan

rute pengiriman ke beberapa pelanggan berdasarkan pesanan pelanggan,

kapasitas alat transportasi, biaya transportasi yang dikeluarkan, laporan tujuh

hari ke depan, dan laporan pengiriman sesuai range tanggal yang diminta.

Laporan tujuh hari ke depan digunakan untuk mengetahui transaksi

pengiriman selama tujuh hari ke depan. Laporan pengiriman digunakan untuk

mengetahui jumlah barang yang keluar dan informasi biaya transportasi.

Aplikasi ini dibantu dengan google map untuk mengetahui titik lokasi

pelanggan yang melakukan pemesanan.

5 (Teguh Tri Prasetio, 2013), “Simulasi Alat Pelacak Dan Locking Kendaraan

Menggunakan Gps “Global Position System” Melalui Akses Google Map”.

Sistem ini dibangun untuk pelacak lokasi kendaraan dengan teknologi GPS ini

ditujukan untuk user atau pengguna yang ingin mengetahui lokasi terakhir

kendaraan.