BAB II LANDASAN TEORI` · 6 BAB II LANDASAN TEORI` 2.1 Konsep Dasar Web Dalam sebuah proses perancangan web program dibutuhkan landasan atau teori yang dapat mendukung untuk mununjang

6

BAB II

LANDASAN TEORI`

2.1 Konsep Dasar Web

Dalam sebuah proses perancangan web program dibutuhkan landasan atau teori

yang dapat mendukung untuk mununjang keberhasilan suatu program sebagai bahan

penjelasan kepada pengguna. Pembahasan mengenai konsep dasar dari program yang

dibahas dalam ruang lingkup penulisan tugas akhir ini adalah pencatatan yang masih

menggunakan cara manual menjadi terkomputerisasi.

2.1.1 Internet

Internet adalah sebagai jaringan komputer yang sangat luas dan besar dan

mendunia, menghubungkan pemakai komputer dari satu negara ke negara lain di

seluruh dunia, dimana di dalamnya terdapat berbagai sumber informasi dan fasilitas-

fasilitas layanan internet yaitu diantaranya (Hastanti, Purnama, & Wardati, 2015), :

1. Browsing

Kegiatan ini seperti layaknya berjalan-jalan di mal sambil melihat-lihat ke toko-

toko tanpa membeli apapun.

2. Elektronik mail (E-mail)

Fasilitas ini digunakan untuk berkirim surat dengan orang lain, tanpa mengenal

batas, waktu, ruang bahkan birokrasi. searching yaitu kegiatan mencari data atau

informasi tertentu di internet.

7

3. Catting

Fasilitas ini digunakan untuk berkomunikasi secara langsung dengan orang lain di

Internet. Pada umumnya fasilitas ini sering digunakan untuk bercakap-cakap atau

mengobrol di internet World Wide Web (WWW).

4. Newsgroup

Fasilitas ini digunakan untuk berkoferensi jarak jauh, sehingga anda dapat

menyampaikan pendapat dan tanggapan dalam internet.

5. Download

Proses mengambil file dari komputer lain melalui internet ke komputer kita.

6. Upload

Proses meletakkan file dari komputer kita ke komputer lain melalui internet.

7. Transfer Pprotocol (FTP)

Fasilitas ini digunakan untuk melakukan pengambilan arsip atau file secara

elektronik atau transfer file dari satu komputer ke komputer lain di internet.

8. Telnet

Fasilitas ini digunakan untuk masuk ke sistem komputer tertentu dan bekerja pada

sistem komputer lain.

9. Ghoper

Fasilitas ini digunakan untuk menempatkan informasi yang disimpan pada

internet server dengan menggunakan hirarki.

2.1.1 Website

Menurut Abdullah (2018:1), “Website dapat diartikan sebagai kumpulan

halaman yang berisi informasi data digital baik berupa teks, gambar, animasi, suara

dan video atau gabungan dari semuanya yang disediakan melalui jalur koneksi internet

8

sehingga dapat diakses dan dilihat oleh semua orang di seluruh dunia. Halaman

website dabat dibuat menggunakan bahasa standar yaitu HTML skrip HTML ini akan

diterjemahkan oleh web browser sehingga dapat ditampilkan dalam bentuk infomasi

yang dapat dibaca oleh semua orang”

1. Website Dinamis

Menurut Abdullah (2018:2), “Website dinamis yaitu jenis website yang isinya terus

diperbaharui secara berkala pengelola web atau pemilik website. Website jenis ini

banyak dimiliki oleh perusahaan atau perorangan yang aktifitasnya memang

berkaitan dengan internet. Contoh paling mudah dari jenis ini yaitu web blog dan

website berita”

2. Web Browser

Menurut Abdullah (2018:4), “Web browser digunakan untuk menampilkan dan

mengetes hasil program. Beberapa script CSS3 & HTML5 ada yang hanya support

pada web browser tertentu dan tidak support pada yang lain, sehingga

menggunakan lebih dari satu web browser akan lebih baik. Walaupun untuk

kebanyakan browser versi terbaru sudah support hampir semua fitur CSS3 dan

HTML5”

3. Web Server

Menurut Abdullah (2018:4), “Web Server merupakan perangkat lunak yang

berfungsi untuk menerima permintaan (request) melalui protokol HTTP atau

HTTPS dari client kemudian mengirimkan kembali dalam bentuk halaman-

halaman. Contoh yang termasuk web server adalah Apache. Dalam penggunaanya,

biasanya sudah jadi satu paket dengan PHP dan MySQL Contoh paket yang sudah

berisi Apache. PHP dan MySQL diantaranya Xampp dan Appserv”

9

4. Text Editor

Menurut Abdullah (2018:4), “Text Editor memiliki fungsi yang sama dengan web

authoring yaitu mengetikkan skrip program, hanya saja tidak bersifat WYSIWYG

sehingga untuk menampilkan hasilnya memerlukan web namun, karena lebih

ringan dan lisensinya yang kebanyakan open source banyak juga yang lebih

memilih menggunaan text editor dibanding aplikasi sekelas Adobe Dreamweaver.

Yang termasuk dalam aplikasi jenis ini yaitu Notepad, Notepad++, Sublime Text”

2.2 Bahasa Pemrograman

Beberapa bahasa pemrograman yang digunakan oleh penulis dalam pembuatan

website tugas akhir, diantaranya :

2.2.1 PHP

Menurut EMS (2014:59), “PHP adalah singkatan PHP Hypertext Preprocessor.

Saat pertama kali dikembangkan oleh programmer bernama Rasmus Lerdoff, PHP

awalnya adalah singkatan dari Personal Home Page Tools. Namun setelah

dikembangkan oleh Zeey Suraski dan Andi Gutmans, dan fiturnya bertambah, maka

PHP diubah singkatannya menjadi yang sekarang ini”

2.2.2 HTML

Menurut (Abdullah (2018:7), “HTML Merupakan singkatan dari Hypertext

Markup Language yaitu bahasa standar web yang dikelola penggunaanya oleh W3C

(World Wide Web Consortium) berupa tag-tag yang menyusun setiap elemen

2.2.3 JQuery

Menurut Abdullah (2018:233), “Jquery merupakan salah satu dari sekian banyak

JavaScript, library yaitu kumpulan fungsi JavaScript yang siap pakai, sehingga

mempermudah dan mempercepat dengan membuat kode JavaScript. Dengan

10

menggunakan Jquery, skrip JavaScript yang panjang dapat disingka menjadi beberapa

baris kode saja”

2.2.4 JavaScript

Menurut Abdullah (2018:193), “JavaScript merupakan bahasa pemrograman

web yang pemrosesanya dilakukan di sisi client. Karena berjalan di sisi client.

JavaScript dapat dijalankan hanya dengan menggunakan browser. Berbeda dengan

PHP yang bekerja di sisi server, untuk menjalankan skrip JavaScript tidak

memerlukan refresh pada browser. JavaScript biasanya dijalankan ketika ada event

tertentu yang terjadi pada halaman web. Baik event yang dilakukan oleh user, maupun

event yang terjadi karena adanya perubahan pada halaman website”

2.2.5 CSS

Menurut Bekti, n.d (2015:47.), “CSS (Cascading Style Sheet) adalah suatu

teknologi yang digunakan untuk memperindah tampilan halaman website (situs).

Singkatnya dengan menggunakan CSS ini Anda dengan mudah mengubah secara

keseluruhan warna dan tampilan yang ada disitus Anda. Penggunaan CSS ini tidak

lepas dari kode-kode HTML”

2.3 Basis Data

Menurut Sukamto & Shalahuddin (2015:43), “Sistem basis data adalah sistem

terkomputerisasi yang tujuan utamanya adalah memelihara data yang sudah diolah

atau informasi dan membuat informasi tersedia saat dibutuhkan. Pada intinya basis

data adalah media untuk menyimpan data agar dapat diakses dengan mudah dan cepat”

1. SQL

Menurut Sukamto & Shalahuddin (2015:46), “SQL (Structured Query

Language) adalah bahasa yang digunakan untuk mengelola data pada RDBMS, SQL

11

awalnya dikembangkan berdasarkan teori aljabar relasional dan kalkulus. SQL mulai

berkembang pada tahun 1970an. SQL mulai digunakan sebagai standar yang resmi

pada tahun 1986 oleh ANSI (American Standards Institude) dan pada tahun 1987 oleh

ISO (International Organization for Standardization) dan disebut sebagai SQL-86”

2. MySQL

MySQL (My Structure Query Language) adalah salah satu DataBase Management

System (DBMS) dari sekian banyak DBMS seperti Oracle, MS SQL, Postagre SQL

dan lainnya. MySQL berfungsi untuk mengolah database menggunakan bahasa

SQL. MySQL bersifat open source sehingga kita bisa menggunakannya secara

gratis. Pemrograman PHP juga sangat mendukung atau support dengan database

MySQL (Fatmawati, 2016)

2.4 Model Pengembangan Perangkat Lunak

Model yang digunakan pada pengembangan perangkat lunak ini menggunakan

model waterfall. Menurut Sukamto & Shalahuddin (2015:28), “Model SDLC air terjun

(waterfall) sering juga disebut model sequensial linier (sequential linier) atau alur

hidup klasik (classic life cycle)”. Model air terjun menyediakan pendekatan alur hidup

perangkat lunak secara sekuensial atau terurut dimulai dari analisis, desain,

pengodean, pengujian, dan tahap pendukung (support)” berikut adalah model gambar

air terjun

Sumber: Sukamto dan Shalahuddin (2015:29)

Gambar II.1

Model Waterfall

12

1. Analisis kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk menspesifikasi

kebutuhan perangkat lunak agar dapat di pahami perangkat lunak seperti apa yang

dibutuhkan user. Spesifikasi kebutuhan perangkat lunak pada tahap ini perlu di

dokumentasikan.

2. Desain

Desain perangkat lunak adalah proses multi langkah yang fokus pada bagian

desain pembuatan program perangkat lunak termasuk struktur data, arsitektur

perangkat lunak, representasi antar muka, dan prosedur pengodean. Tahap ini

mentranslasi kebutuhan perangkat lunak dari tahap analisis kebutuhan ke

representasi desain agar dapat diimplementasikan menjadi program pada tahap

selanjutnya. Desain perangkat lunak yang dihasilkan pada tahap ini juga perlu

didokumentasikan.

3. Pembuatan Kode Program

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari tahap

ini adalah program komputer sesuai dengan desain yang telah di buat pada tahap

desain.

4. Pengujian

Pengujian fokus pada perangkat lunak secara dari segi lojik dan fungsional dan

memastikan bahwa semua bagian sudah di uji. Hal ini dilakukan untuk

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan sesuai

dengan yang diinginkan

5. Pendukung (support) atau pemeliharaaan (maintenance)

Tidak menutup kemungkinan sebuah perangkat lunak mengalami perubahan

ketika sudah dikirim ke user. Perubahan bisa terjadi karena adanya kesalahan yang

13

muncul dan tidak terdeteksi saat pengujian atau perangkat lunak harus beradaptasi

dengan lingkungan baru. Tahap pendukung atau pemeliharaan dapat mengulangi

proses pengembangan mulai dari analisis spesifikasi untuk perubahan perangkat

lunak yang sudah ada, tapi tidak untuk membuat perangkat lunak yang baru

2.5 Teori Pendukung

2.5.1 Struktur Navigasi

Menurut Ardiansyah (2016:61), “Struktur Navigasi dapat diartikan sebagai alur

dari suatu program yang menggambarkan rancangan hubungan antara area yang

berbeda sehingga memudahkan proses pengorganisasian seluruh elemen-elemen

website, karena setiap model navigasi dapat memberikan solusi tuk kebutuhan yang

berbeda. Macam-macam struktur navigasi antara lain (Imaniawan & Wati, 2017) :

Sumber: Imaniawan & Wati, 2017

Gambar II.2

Contoh Struktur Navigasi

14

1. Linear Navigation Model

Linear navigation model digunakan oleh sebagian besar Website. Informasi

diberikan secara sekuensial dimulai dari satu halaman. Beberapa desainer

menggunakan satu laman untuk masuk atau keluar website.

2. Hierarki Model

Hierarki model diadaptasi dari top-down design. Konsep navigasi ini dimulai dari

satu node yang menjadi home page. Dari home page dapat dibuat beberapa cabang

ke halaman utama. Apabila di perlukan, dari tiap halaman utama dapat

dikembangkan menjadi beberapa cabang lagi. Hal ini seperti struktur organisasi

dalam perusahaan.

3. Spoke-and-hub model

Spoke and hubmodel hanya menggunakan satu node untuk berhubungan dengan

node lain. Pada model ini hanya terdapat dua macam link, yaitu dari home page ke

halaman tertentu, dan dari halaman tersebut kembali ke home page

4. Full Web Model

Full webmodel memberikan kemampuan hyperlink yang banyak. Full webmodel

banyak digunakan karena user dapat mengakses semua topik dengan sub topik

dengan cepat. Namun kelemahan dari model ini, yaitu dapat berakibat user

kehilangan cara untuk kembali ke topik sebelumnya.

2.5.2 ERD

Menurut Rusmawan (2019:64), “ERD (Enterprise Relationship Diagram)

merupakan model data berupa notasi grafis dalam pemodelan data konseptual yang

menggambarkan hubungan antara penyimpanan. Model data sendiri merupakan

sekumpulan cara, peralatan untuk mendeskripsikan data-data yang hubunganya satu

15

sama lain, semantiknya, serta batasan konsistensi. Model data terdiri dari model

hubungan entitas dan model relasional”

Sumber: Rusmawan (2019:64)

Gambar II.3

Contoh Enterprise Realationship Diagram

2.5.3 Komponen ERD

Menurut Sukamto & Shalahuddin (2015:50), Berikut ini komponen-komponen

ERD hubungan entitas terdiri dari :

1. Entitas (Entity)

Entitas merupakan data inti yang akan disimpan benda yang memiliki data dan

harus disimpan datanya agar dapat diakses oleh aplikasi komputer, penamaan

entitas biasanya lebih ke kata benda dan belum merupakan nama tabel

2. Atribut (Atribute)

Field atau kolom data yang butuh disimpan dalam suatu entitas

3. Atribut Kunci Primer

Field atau kolom data yang butuh disimpan dalam suatu entitas dan digunakan

sebagai kunci akses record yang diinginkan biaanya berupa id, kunci primer dapat

16

lebih dari satu kolom, asalkan kombinasi dari beberapa kolom tersebut dapat

bersifat unik (berbeda tanpa ada yang sama)

4. Atribut Multinilai / Multivalue

Field atau kolom data yang butuh disimpan dalam suatu entitas yang dapat memiliki

nilai lebih dari satu

5. Relasi (Relationship)

Relasi yang menghubungkan antar entitas, biasanya diawali dengan kata kerja

6. Asosiasi

Penghubung antara relasi dan entitas di mana di kedua ujungnya memiliki

multiplicity kemungkinan jumlah pemakaian. Kemungkinan jumlah maksimum

keterhubungan antara entitas satu dengan entitas yang lain disebut dengan

kardinalitas

2.5.4 Kardinalitas/Derajat Relasi

Menurut Fathansyah (2015:78), “Kardinalitas Relasi menunjukkan jumlah

maksimum entitas yang dapat berelasi dengan entitas pada himpunan entitas yang lain.

Kardinalitas yang terjadi di antara dua himpunan entitas (misalnya A dan B)” :

1. Satu ke Satu (One to One)

Yang berarti setiap entitas pada himpunan entitas A berhubungan dengan paling

banyak dengan satu entitas pada himpunan entitas B dan begitu juga sebaliknya

setiap entitas pada himpunan entitas B berhubungan dengan paling banyak dengan

satu entitas pada himpunan entitas A

2. Satu ke Banyak (One to Many)

Yang berarti setiap entitas pada himpunan entitas A dapat berhubungan dengan

banyak entitas pada himpunan entitas B, tetapi tidak sebaliknya, dimana setiap

17

entitas pada himpunan entitas B berhubungan dengan paling banyak dengan satu

entitas pada himpunan entitas A

3. Banyak ke Satu (Many to One)

Yang berarti setiap entitas pada himpunan entitas A berhubungan dengan paling

banyak dengan satu entitas pada himpunan entitas B tetapi tidak sebaliknya,

dimana setiap entitas pada himpunan entitas A berhubungan dengan paling

banyak satu entitas himpunan entitas B

2.5.5 Logical Relationship Structure (LRS)

LRS merupakan transformasi dari penggambaran ERD dalam bentuk yang lebih

jelas dan mudah untuk dipahami. Penggambaran LRS hampir mirip dengan

penggambaran normalisasi file, hanya saja tidak digambarkan simbol asterix (*)

sebagai simbol primary key (kunci utama) dan foreign key (kunci tamu). (Rosidin &

Lubis, 2017)

Sumber: Rosidin & Lubis, 2017

18

Gambar II.4

Contoh Logical Relationship Structure

2.5.6 Implementasi dan Pengujian Web

Menurut Sukamto & Shalahuddin (2015:275), “ Black Box Testing (pengujian

kotak hitam) yaitu menguji perangkat lunak dari segi spesifikasi fungsional tanpa

menguji desain dan kode program. Pengujian dimaksudkan untuk mengetahui apakah

fungsi-fungsi, masukan dan keluaran dari perangkat lunak sesuai dengan spesifikasi

yang dibutuhkan.