7

BAB II

LANDASAN TEORI

2.1 Konsep Dasar Sistem

Pada Saat Pembuatan Tugas akhir ini penulis membutuhkan teori-teori yang dapat

mendukung kemudahan dalam mempelajari maupun merancang sistem aplikasi yang

diharapkan dapat digunakan seoptimal mungkin. Penulis berharap dengan adanya

sistem yang dibuat, para pengguna lebih mudah dalam bekerja, sehingga dapat

membantu dalam menyelesaikan kesalahan yang dilakukan oleh pengguna dengan

baik. Berikut ini adalah teori-teori yang dapat memperkuat penulisan Tugas Akhir ini.

A. Model Pembelajaran Berbasis Web

1. Pengertian Model Pembelajaran Berbasis Web

“Pembelajaran berbasis web adalah proses belajar mengajar yang dilakukan dengan

memanfaatkan jaringan internet, sehingga sering disebut juga dengan e - learning .

Internet merupakan jaringan yang terdiri atas ribuan bahkan jutaan komputer,

termasuk di dalamnya jaringan lokal, yang terhubungkan melalui saluran (satelit,

telepon kabel) dan jangkauanya mencakup seluruh dunia. Internet memiliki banyak

fasilitas yang dapat digunakan dalam berbagai bidang, termasuk dalam kegiatan

pendidikan. Fasilitas tersebut antara lain : email, Telnet, Internet Relay Chat,

Newsgroup, Mailing List (Milis) , File Transfer Protocol (FTP), atau World Wide Web

(WWW)” (Riska Babo, 2016)

8

2. Karakteristik

Karakteristik pembelajaran berbasis web adalah :

a. materi pembelajaran terdiri atas teks, grafik, dan unsur multimedia seperti video,

audio, dan animasi.

b. adanya aplikasi komunikasi yang realtime dan tidak realtime seperti ruang chat,

forum diskusi, dan konferensi video.

c. menggunakan web browser.

d. penyimpanan, pemeliharaan, dan pengadministrasian materi dilakukan dalam

webserver.

e. menggunakan internet protokol untuk memfasilitasi komunikasi antara perserta

didik dengan materi pembelajaran.

3. Fungsi

Menjadikan para peserta didik lebih mudah dalam kegiatan pembelajaran

khususnya dengan memanfaatkan perangkat teknologi maka kegiatan pembelajaran

yang mereka lakukan dapat berjalan dengan lebih menyenangkan. Dan akhirnya

diharapkan akan dapat meningkatkan semangat belajar yang dimiliki oleh para peserta

didik.

Kelebihan utama dari kegiatan pembelajaran ini adalah mengenai fleksibilitas.

Seorang peserta didik dapat belajar di manapun mereka berada dan kapan saja selama

tersedia koneksi internet. Dengan hal yang semacam ini maka kekakuan dari model

pembelajaran yang selama ini menjadi semacam penjara bagi para peserta didik maka

akan dihapus dengan model pembelajaran berbasis web ini. Selain itu kelebihan

lainnya adalah peserta didik dapat belajar secara mandiri tanpa bergantung selalu pada

tenaga pendidiknya.

9

B. SISTEM

1. Pengertian Sistem

Menurut Romney dan Steinbart dalam (Sri Mulyani 2016:2) “sistem adalah

kumpulan dari dua atau lebih komponen yang saling bekerja dan berhubungan untuk

mencapai tujuan tertentu”.

sistem mempunyai beberapa karateristik sebagai berikut:

a. Batasan (Boundary) Penggambaran dari suatu elemen atau unsur mana yang

termasuk didalam sistem dan mana yang diluar sistem.

b. Lingkungan (Environment) Segala sesuatu diluar sistem, lingkungan yang

menyediakan asumsi, kendala,dan input terhadap suatu sistem.

c. Masukan (input) Sumber daya (data, bahan baku, pelaratan, energi) dari

lingkungan yang dimanipulasi oleh suatu sistem.

d. Keluaran (Output) Sumber daya atau produk (informasi, laporan, dokumen,

tampilan layar komputer, barang jadi) yang disediakan untuk lingkungan sistem

oleh kegiatan dalam suatu sistem.

2. Sistem Berbasis Obyek (OOP)

Menurut Fadallah dan Rosyida (2018:61), Menyimpulkan bahwa “Pemrograman

berorientasi objek adalah suatu cara baru dalam berpikir serta berlogika untuk

menghadapi masalah-masalah yang akan dicoba diatasi dengan bantuan komputer”.

C. Website

Menurut Rohi abdulloh (2018:1), “ Website dapat di artikan sebagai kumpulan

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

dan vidio atau gabungan dari semuanya yang disediakan melalui jalur koneksi

internet.”

10

Dokumen-dokumen yang dikekola dalam web bisa beraneka jenis (Pengolah kata,

lembar kerja, tabel basis data, presentasi, hypertext dan lain-lain). Jenis dokumen yang

paling umum adalah dokumen hypertext yang dibentuk berdasarkan format HTML

(hypertext markup language). Link kedokumen yang lain (baik lokal maupun jarak

jauh atau remote) dapat diletakkan sebagai bagian dari teks. Begitu juga dengan objek

gambar yang dapat pula di acu dan ditampilkan melalui perintah format yang khusus

untuk itu. Nantinya, pemakai sistem web akan teks yang telah terformat bersama

objek-objek gambar, dan bukannya teks awal beserta perintah-perintah formatnya.

Dokumen yang ditampilkan merupakan dokumen hypertext yang dengan program

peramban (browser) dokumen hypertext seorang pemakai dapat memilih (meng-klik)

suatu area teks yang memiliki link kedokumen lain dan begitu pemilihan dilakukan

dokumen yang ditunjuk pun segera ditampilkan. program peramban yang populer

digunakan saat ini adalah MS Internet Explorer, Mozilla Firefox, dan Google Chrome.

1. Web Server

Menurut Rohi abdulloh (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 web”.

2. Web Browser

Menurut rohi abdulloh (2018:4) “web browser digunakan untuk menampilkan dan

mengetes hasil program”.

Sekarang ini telah banyak browser yang beredar dan dapat digunakan dengan versi

yang lebih kompatibilitas yang banyak terhadap HTML diantaranya adalah Internet

Explorer, Opera, Mozilla Firefox dan lain-lain.

11

3. Internet

Menurut Hidayatullah dan Kawistara dalam (Mariana Purba, 2015), “Internet

adalah jaringan global yang menghubungkan komputer-komputer diseluruh dunia,

dengan internet sebuah komputer bisa mengakses data yang terdapat pada komputer

lain dibenua yang berbeda”.

4. Mozilla Firefox

Menurut Hakim dalam (Zuhri 2013:14), “Mozilla firefox adalah aplikasi

penjelajah web antar platform bersifat grafis yang dikembangkan oleh Yayasan

Mozilla dan ratusan sukarelawan, sebelum rilis versi 1.0 pada 9 november 2004,

firefox telah mendapakan sambutan yang sangat bagus dari pihak media termasuk

dari Forbes dan Wall Street Journal. Dengan lebih dari 5 juta download dalam 12

hari pertama rilisnya dan 6 juta hingga 24 november 2004.”

D. Bahasa Pemrograman

Bahasa pemrograman suatu perangkat lunak menggunakan bahasa-bahasa

pemrograman yang digunakan untuk merancang atau membuat program sesuai

keinginan dan kegunaan. Berikut penjelasan tentang Bahasa pemrograman yang

penulisan gunakan dalam pembuatan web:

1. PHP (Perl Hypertext Preprocessor)

Menurut Rohi Abdulloh (2016:3), “PHP singkatan dari Perl Hypertext

Preprocessor yang merupakan server-side programing, yaitu bahasa pemrograman

yang diproses di sisi server”.

Fungsi utama PHP dalam membangun website adalah untuk melakukan

pengolahan data pada database. Data website akan dimasukkan ke database, diedit,

dihapus, dan ditampilkan pada website yang diatur oleh PHP.

12

2. CSS (Cascading Style Sheet)

Menurut Rohi Abdulloh (2016:2), “CSS singkatan dari Cascading Style Sheets,

yaitu skrip yang digunakan untuk mengatur desain website. Walaupun HTML

mempunyai kemampuan untuk mengatur tampilan website, namun

kemampuannya sangat terbatas. Fungsi CSS adalah memberikan pengaturan yang

lebih lengkap agar struktur website yang dibuat dengan HTML terlihat lebih rapi

dan elegan.

3. Sublime Text

Menurut Bos Dalam (Palevi, Mulyani, & Khoir, 2018) “Menjelaskan bahwa

“Sublime Text” Merupakan salah satu text editor yang sangat powerful yang dapat

meningkatkan produktivitas dan mengembangkan kualitas kode yang tinggi”.

4. HTML (Hyper Text Markup Language)

Menurut rohi abdulloh (2018:7) , “HTML merupakan singkatan dari Hypertext

Markup Language yaitu bahasa standard web yang dikelola penggunaannya oleh W3C

(World Wide Web Consortium)”.

HTML singkatan dari Hyper Text Markup Language, yaitu skrip yang berupa tag-

tag untuk membuat dan mengatur struktur website. Beberapa tugas utama HTML

dalam membangun website diantaranya sebagai berikut:

a. Menentukan layout website.

b. Memformat text dasar seperti pengaturan paragraf, dan format font.

c. Membuat list.

d. Membuat tabel.

e. Menyisipkan gambar, video, dan audio.

f. Membuat link.

g. Membuat formulir.

13

5. jQuery

Menurut Rohi abdulloh (2018:2) “jQuery Merupakan Library Function Javascript

yang memudahkan programer dalam menggunakan Javascript”

Jquery dibuat oleh John Resig pada tahun 2006. Banyak website yang

memanfaatkan library ini untuk menyederhanakan fungsi-fungsi yang ada di

Javascript atau Ajax. Sesuai dengan slogannya jQuery sendiri “Write Less, Do More”,

menulis sedikit namun mengerjakan banyak hal, sehingga anda dapat menghemat

coding program, yang sebelumnya menggunakan javascript beberapa baris kode,

namun dengan jQuery hanya satu baris saja. Penggunaan jQuery ini sebenarnya cukup

mudah karena semuanya sudah terbungkus dalam bentuk library dan plugin, dan kita

hanya meng etahui cara penerapannya saja dalam sebuah website.

6. JavaSript

Menurut Rohi abdulloh (2016:3) “Berbeda dengan php yang di proses di sisi

Server, javacript diproses pada komputer client. Karena memprosesnya dilakukan

di komputer client, membuat javacript lebih interaktif di banding php. Peran

javacript dalam membuat website adalah memberikan efek animasi yang menarik

dan interaktivitas dalam penanganan even yang dilakukan oleh pengguna

website”.

7. Codeigniter

Menurut jubilee enterprise (2015:1) “Codeigniter (bisa disingkat CI) merupakan

fremework aplikasi web yang gratis, ringan, dan sangat memudahkan”

Codeigniter jika dibandingkan dengan framework lain adalah sebagai berikut :

1. Gratis (Open-Source) Kerangka kerja Codeigniter memiliki lisensi dibawah

Apache/BSD open-source sehingga bersifat bebas atau gratis.

2. Berukuran kecil, ukuran yang kecil merupakan keunggulan tersendiri jika

dibandingkan framework lain yang berukuran besar dan membutuhkan

resource yang besar dan juga dalam eksekusi maupun penyimpanannya.

14

3. Menggunakan konsep M-V-C Codeigniter merupakan konsep M-V-C (Model-

View-Controller) yang memungkinkan pemisahan antara layer application-

logic dan presentation.

E. Basis Data

Menurut Pamungkas (2017:2) “basis data merupakan suatu kumpulan data

terhubung yang disimpan secara bersama sama pada suatu media, yang

diorganisasikan berdasarkan sebuah skema atau struktur tertentu, dan dengan software

untuk melakukan manipulasi untuk kegunaan tertentu”.

1. DBMS (Database Management System)

Menurut Pamungkas (2017:4) “Sistem Manajemen Basis Data DBMS

Merupakan perangkat lunak yang di desain untuk melakukan penyimpanan dan

pengaturan basis data”.

DBMS juga dirancang untuk memdahkan memanipulasi data. DBMS sudah

menjadi peran atau kunci utama serta bagian standar di bagian pendukung sebuah

perusahaan. Adapun bahasa dalam Database Management System (DBMS) yaitu

Data Definition Language (DDL), Data Manipulation Language (DML), Data Control

Language (DCL)

2. Xampp

Menurut Rohi abdulloh (2016:7) “Xampp adalah salah satu paket instaler yang

berisi Aphace yang merupakan web server tempat menyimpan file-file yang

diperlukan website, dan Phpmyadmin sebagai aplikasi yang digunakan untuk

perancangan database MySQL”.

Sebagai informasi kata XAMPP merupakan singkatan dari:

X: berarti program ini dapat dijalankan diberbagai platform, misalnya Windows,

Linux, mac OS, dan Solaris.

15

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. Pengembangnya disebut Structured

Query Language (SQL). SQL merupakan bahasa terstruktur yang digunakan untuk

mengolah database beserta isinya. Pengguna dapat memanfaatkan MySQL untuk men

ambahkan, mengubah dan menghapus data yang berada dalam database.

P: PHP, bahasa pemrograman lainnya yang serupa, dan lain sebagainya.

3. MySQL

Menurut Susanto dalam (Mariana Purba, 2015), “My Structured Query Langguage

(MySQL) adalah sebuah perangkat lunak sistem manajemen basis data yang

multithread, multi-user, dengan sekitar 6 juta instalasi diseluruh dunia. MySQL

AB membuat MySQL tersedia sebagai perangkat lunak gratis dibawah lisensi

GNU GPL (General Public License)”

MySQL menawarkan berbagai keunggulan dibandingkan database server lain.

Berikut ini adalah beberapa keunggulan MySQL:

1. Mampu menangani jutaan user dalam waktu yang bersamaan.

2. Mampu menampung lebih dari 50.000.000 record.

3. Sangat cepat mengeksekusi perintah.

16

F. Model Pengembangan Perangkat Lunak

Pembuatan program ini metode yang digunakan dalam pengembangan perangkat

lunak menggunakan model waterfall (Tabrani & Aghniya, 2019), yang terbagi atas

lima tahap, antara lain:

a. Requirement Analysis

Dalam langakah ini merupakan analisa terhadap kebutuhan sistem.

Pengumpulan data dalam tahap ini bisa melakukan sebuah penelitian, wawancara atau

study literatur. Seseorang system analisis akan menggali informasi sebanyak-

banyaknya dari user sehingga akan tercipta sebuah sistem komputer yang bisa

melakukan tugas-tugas yang diinginkan oleh user tersebut. Tahapan ini akan

menghasilkan dokumen user requirement atau bisa dikatakan sebagai data yang

berhubungan dengan keinginan user dalam pembuatan sistem.

b. Design System

Proses design akan menterjemahkan syarat kebutuhan kesebuah perancangan

perangkat lunak yang dapat diperkirakan sebelum dibuat koding. Proses ini berfokus

pada : struktur data, arsitektur perangkat lunak, representasi interface, dan detail

(algoritma) prosedural. Tahapan ini akan menghasilkan dokumen yang disebut

software requirement. Dokumen inilah yang akan digunakan programmer untuk

melakukan aktivitas pembuatan sistemnya.

c. implemention

Coding merupakan penerjemahan design dalam bahasa yang bisa dikenali oleh

komputer.Dilakukan oleh programmer yang akan meterjemahkan transaksi yang

diminta oleh user. Tahapan inilah yang merupakan tahapan secara nyata dalam

mengerjakan suatu sistem.Dalam artian penggunaan computer akan dimaksimalkan

dalam tahapan ini. Setelah pengkodean selesai maka akan dilakukan testing terhadap

17

sistem yang telah dibuat tadi. Tujuan testing adalah menemukan kesalahankesalahan

terhadap system tersebut dan kemudian bisa diperbaiki.

d. Integration & Testing

Tahapan ini bisa dikatakan final dalam pembuatan sebuah sistem. Setelah

melakukan analisa, design dan pengkodean maka sistem yang sudah jadikan

digunakan oleh user.

e. Operation & Maintenance

Perangkat lunak yang susah disampaikan kepada pelanggan pasti akan mengalami

perubahan. Perubahan tersebut bisa karena mengalami kesalahan karena perangkat

lunak harus menyesuaikan dengan lingkungan (periperal atau system operasi baru)

baru, atau karena pelanggan membutuhkan perkembangan fungsional.

18

2.2 TEORI PENDUKUNG (Tools System)

A. ERD (Entity Relationship Diagram)

Menurut Maniah & Hamidin (2017:62) “Model Entity Relation Diagram

digunakan untuk mentransformasikan data data yang ada di dunia nyata ke dalam

bentuk notasi notasi sebagai perangkat konseptual menjadi diagram data yang

dikenal dengan diagram Entity-Relationship (Diagram E-R) atau dalam istilah lain

ERD (Entity Relationship Diagram).

Sumber: Mulyani (2016:44)

Gambar II.1

Contoh Diagram ERD

1. Komponen ERD (Entity Relationship Diagram)

a. Entitas

Suatu yang nyata atau abstrak yang mempunyai karakteristik dimana kita akan

menyimpan data.

b. Atribut

Ciri umum semua atau sebagian besar instansi pada entitas tertentu.

c. Relasi

Hubungan alamiah yang terjadi antara satu atau lebih entitas.

19

d. Garis atau Link

Garis penghubung atribut dengan kumpulan entitas dan kumpulan entitas dengan

relasi.

2. Kardinalitas

a. Satu ke satu (One to One)

Setiap elemen dari Entitas A berhubungan paling banyak dengan elemen pada

Entitas B. Demikian juga sebaliknya setiap elemen B berhubungan paling banyak satu

elemen pada Entitas A.

b. Satu ke banyak (One to Many)

Setiap elemen dari Entitas A berhubungan dengan maksimal banyak elemen pada

Entitas B. Dan sebaliknya setiap elemen dari Entitas B berhubungan dengan paling

banyak satu elemen di Entitas A.

c. Banyak ke satu (Many to One)

Setiap elemen dari Entitas A berhubungan paling banyak dengan satu elemen pada

Entitas B. Dan sebaliknya setiap elemen dari Entitas B behubungan dengan maksimal

banyak elemen di entitas A.

d. Banyak ke banyak (Many to Many)

Setiap elemen dari Entitas A berhubungan maksimal banyak elemen pada Entitas

B demikian sebaliknya.

20

3. LRS (Logical Record Stuctured)

Menurut Friyadie dalam Taufik dan Ermawati (Tabrani & Aghniya, 2019),

Menjelaskan bahwa, “Sebelum tabel dibentuk dari field atau level internal, maka harus

dibuatkan suatu bentuk relational model yang dibuat secara logic atau level external

dan konsep, dari pernyataan tersebut dengan Logical Record Stuctured (LRS)”.

Sumber: (Tabrani & Aghniya, 2019)

Gambar II.2

Contoh Diagram LRS (Logical Record Stuctured)

21

B. UML (Unified Modeling Language)

Menurut Mulyani ( 2016:35), Menyimpulkan bahwa, “UML adalah sebuah teknik

pengembangan sistem yang menggunakan bahasa grafis sebagai alat

pendokumentasian dan melakukan spesifikasi pada sistem”.

1. Diagram Aktifitas (Activity Diagram)

Menurut Tohari (Tabrani & Aghniya, 2019), Mendefinisikan bahwa, “Activity

diagram memodelkan workflow proses bisnis dan urutan aktifitas dalam sebuah

proses. Diagram ini sangat mirip dengan folowchart karena memodelkan workflow

dari suatu aktifitas lainnya atau dari aktifitas ke status”.

Sumber: (Tabrani & Aghniya, 2019)

Gambar II.3

Contoh Diagram Activity

22

2. Diagram Use Case (Use Case Diagram)

Menurut Tohari (Tabrani & Aghniya, 2019), Menyimpulkan bahwa, “Use case

adalah rangkaian atau uraian sekelompok yang saling terkait dan membentuk sistem

secara teratur yang dilakukan atau diawasi oleh sebuah aktor”.

Sumber: (Tabrani & Aghniya, 2019)

Gambar II.4

Contoh Diagram Use Case

23

3. Diagram Kelas (Class Diagram)

Menurut Mulyani (2016:101) “class diagram merupakan kumpulan kumpulan dari

beberapa class dan relasinya”.

Sumber: Mulyani (2016:45)

Gambar II.5

Contoh Diagram Class

4. Diagram Sequence (Sequence Diagram)

Menurut Tohari (Tabrani & Aghniya, 2019), Menyimpulkan bahwa, “Sequence

Diagram Menggambarkan Interaksi antara sejumlah objek dalam urutan waktu”.

Sumber: (Tabrani & Aghniya, 2019)

Gambar II.6

Contoh Diagram Sequence