BAB I

PENDAHULUAN

1.1 Latar Belakang

Perkembangan ilmu teknologi informasi dan komunikasi
berkembang dengan sangat pesat, dengan hal ini penyampaian
informasi memiliki peran yang sangat penting bagi semua
kalangan masyarakat. Hal ini sangat berkaitan dengan
kegiatan manusia yang membutuhkan informasi-informasi
penting secara terkini, aktual, praktis dan mudah. Semua
aspek kehidupan manusia telah dipengaruhi oleh penggunaan
teknologi informasi dan komunikasi. Penggunaan teknologi
informasi dan komunikasi telah mendukung kinerja pada
perusahaan, instansi pendidikan maupun dalam instansi
pemerintahan.
Salah satu contoh penggunaan teknologi informasi yang
perkembangannya cukup pesat ialah Website. Penggunaan
website sudah menjadi suatu perhatian oleh banyak kalangan,
mulai dari pengusaha, akademisi, pemasaran, praktisi media
massa, perusahaan, hingga instansi pemerintahan. Dalam
website ini banyak kalangan yang menggunakan sebagai
media promosi, alat penjualan, memberikan materi informasi
yang berkaitan dengan gambaran secara detail suatu instansi
atau lembaga, hingga sebagai alat menyalurkan pendapat serta
aspirasi atau yang biasa disebut website kuisioner.
Sekolah Tinggi Manajemen Ilmu Komputer (STMIK)
PPKIA Tarakanita Rahmawati merupakan suatu instansi
pendidikan yang memerlukan sistem penilaian dari
mahasiswa yang aktif menjenjang pendidikan di kampus
tersebut. Sistem penilaian ini disebut dengan Pengisian
Angket. Selain sebagai sistem penilaian, pengisian angket
juga merupakan salah satu persyaratan yang harus dilakukan
oleh mahasiswa agar rmendapatkan memo. Kemudian memo
tersebut akan dibawa ke bagian keuangan untuk ditukarkan
dengan kartu ujian.
 Namun terdapat kendala dalam pengisian angket ini, yaitu
mahasiswa masih mengisi kertas angket yang telah disediakan
oleh kampus dan harus mengumpulkannya kembali. Cara ini
dinilai tidak efektif karena biasanya banyak mahasiswa akan
menuju Ruang LPMI yang menyebabkan ruangan menjadi
penuh sesak karena mengantri. Kertas yang digunakan dalam
pengisian angket ini masih menggunakan kertas bekas yang
telah dipakai.
Dalam hal ini, pihak kampus membutuhkan sistem
informasi berbasis web guna mendukung aktifitas dalam
proses pengisian angket. Dengan ini penulis bertujuan untuk
membuat sistem informasi pengisian angket berbasis website.

1.2 Permasalahan
Berdasarkan latar belakang yang telah dijelaskan,
permasalahan utama yang terjadi saat pengisian angket ialah
belum adanya sistem untuk membantu saat pengisian angket
agar dapat dilakukan dengan cepat dan dapat diakses dimana
saja. Bagi beberapa mahasiswa yang malas mereka biasanya
tidak mengisi lembar angket, mereka hanya mencoret saja dan
mengumpulkannya. Jadi besar kemungkinan beberapa kolom
pertanyaan yang tidak terisi. Kemudian dengan cara pengisian
angket seperti ini tidak menjamin kerahasiaannya serta dapat
dengan mudah untuk diduplikasi.

1.3 Rumusan Masalah

Rumusan masalah dalam penelitian ini adalah bagaimana
merancang sebuah sistem untuk membantu proses pengisian
angket bagi mahasiswa secara online.
1.4 Batasan Masalah
Adapun batasan masalah dalam penyusunan Tugas Proyek
Sistem Informasi ini adalah:
1. Sampel data yang digunakan ialah mahasiwa malam
tahun ajaran 2016 yang terdaftar secara aktif kuliah di
STMIK PPKIA Tarakanita Rahmawati .
2. Aplikasi ini merupakan perangkat lunak berbasis web.
3. Layanan yang diberikan untuk mahasiswa berupa
pengisian angket.
4. Objek pengisian angket ialah, penilaian terhadap dosen,
fasilitas kampus, serta praktikum.
5. Laporan rekapitulasi status mahasiswa yang telah
mengisi angket.

1.5 Tujuan dan Manfaat Penelitian

1.5.1 Tujuan Penelitian
Adapun tujuan penelitian dalam penulisan Tugas Proyek
Sistem Informasi ini adalah:
1. Tujuan Institusi
Sebagai persyaratan kelulusan Tugas Proyek Sistem
Informasi (TPSI) pada STMIK PPKIA Tarakanita
Rahmawati.
2. Tujuan Pokok
Untuk menghasilkan sebuah Sistem Aplikasi berbasis
web yang bertujuan dapat memudahkan mahasiswa
dalam pengisian angket di STMIK PPKIA Tarakanita
Rahmawati.

1.5.2 Manfaat Penelitian

Adapun manfaat penelitian dalam penulisan Tugas Proyek
Sistem Informasi ini adalah:
1. Bagi penulis manfaat yang diperoleh adalah menambah
pengetahuan dalam bidang pemrograman dengan
berbasis web untuk mengatasi masalah yang menjadi
kendala bagi STMIK PPKIA Tarakanita Rahmawati.
2. Bagi pembaca,dalam hal ini mahasiswa STMIK PPKIA
Tarakanita Rahmawati,diharapkan dengan penelitian ini
dapat dijadikan sebagai acuan atau referensi untuk
menyusun Tugas Proyek Sistem Informasi,sebagai bahan
yang harus dikembangkan lebih lanjut.
3. Bagi pihak kampus, dalam hal ini diharapakan pihak
kampus dapat mengubah cara penilaian yang lama
dengan sistem informasi berbasis web.

1.6 Metode Penelitian

Dalam penyusunan proyek Tugas Proyek Sistem Informasi
(TPSI). Ada beberapa metode yang digunakan dalam
penelitian Perancangan Sistem Informasi Pengisian Angkat
Berbasis Web, yaitu :
1. Studi Pustaka
Studi pustaka dilakukan dengan cara menganalisa setiap
tahap pengisian angket yang dilakukan oleh mahasiswa.
Selain itu, dengan cara membaca buku-buku yang
berhubungan dengan Tugas Proyek Sistem Informasi
yang ada pada perpustakaan STMIK PPKIA Tarakanita
Rahmawati.
2. Observasi
a. Survey
Survey langsung kepada bagian LPMI yang berada
pada kampus STMIK PPKIA Tarakanita Rahmawati
untuk mengetahui secara langsung informasi yang
diperlukan.
b. Wawancara
 Wawancara merupakan percakapan antara dua
orang yang salah satunya bertujuan untuk menggali
informasi dan mendapatkan informasi untuk suatu
tujuan tertentu. Wawancara ditujukan kepada kepala
bagian LPMI untuk menggali informasi mengenai
sistem pengisian angket yang berlaku saat ini.
3. Implementasi Program
Dari uraian permasalahan yang di hadapi, maka penulis
mencoba menerapkan ke dalam bentuk program dengan
menggunakan pemrograman sublime dan database
Mysql.
4. Pengujian
Melakukan uji coba terhadap program dan kinerja dalam
pengisian angket.
5. Dokumentasi
Dokumentasi ialah suatu cara yang digunakan untuk
memperoleh data informasi dalam bentuk buku, arsip,
dokumen, tulisan angka serta keterngan yang dapat
mendukung penelitian. Dokumentasi yang digunakan
dalam penelitian ini meliputi lembar pengisian angket
mahasiswa.

1.7 Sistematika Penulisan

Dalam penulisan ini, penulis membagi menjadi 4 bab,
untuk mermudahkan pemberian informasi, maka penelitian ini
dibahas mulai dari hal yang bersifat umum sampai dengan inti
permasalahan dan diakhiri dengan kesimpulan dan saran.
Sistematika penulisan yang disajikan adalah sebagai berikut :
Bab I Pendahuluan
Bab ini merupakan gambaran umum tentang pengambilan
judul, kemudian dilanjutkan dengan pembahasan latar
belakang. Pada bab ini juga menguraikan tentang apa yang
menjadi latar belakang, rumusan masalah, tujuan dan manfaat
Tugas Proyek Sistem Informasi (TPSI), batasan masalah,
metode penelitian dan sistematika penulisan.
Bab II Tinjauan Umum
Bab ini memberikan gambaran tentang konsep dasar teori
yang berhubungan dengan aktifitas penelitian dan sistem
informasi objek.
Bab III Analisa Dan Desain Program
Bab ini berisi tentang analisa dan desain yang diusulkan yaitu:
Bagan Alir (Flowchart), Entity Relationship Diagram (ERD),
Desain Database, Desain Interface.
Bab IV Penutup
Bab ini berisi tentang kesimpulan penelitian dan pembahasan
pada bab-bab sebelumnya, yang memuat saran-saran yang
sifatnya membangun untuk bahan peninjauan selanjutnya.
Daftar Pustaka
Berisi tentang sumber-sumber yang penulis gunakan sebagai
acuan dalam penyusunan Tugas Proyek Sistem Informasi
(TPSI) ini baik berupa materi dari internet, buku panduan,
jurnal atau media lainnya.
 BAB II
TINJAUAN UMUM

1.1 Konsep Dasar Teori

Pada bab ini, penulis mencoba menjelaskan teori-teori
penunjang yang berhubungan dengan judul Tugas Proyek
Sistem Infromasi yaitu Perancangan Sistem Pengisian Angket
Berbasis Web sebagai berikut:

1.1.1 Perancangan Website

Perancangan adalah tahapan perancangan (design) yang
memiliki tujuan untuk mendesain sistem baru yang dapat
menyelesaikan masalah-masalah yang dihadapi suatu
perusahaan atau instansi yang diperoleh dari pemilihan
alternative sistem yang terbaik. Berdasarkan pengertian diatas
penulis dapat menyimpulkan bahwa perancangan adalah suatu
proses untuk membuat dan mendesain sistem yang baru.
Website adalah suatu dokumen berupa kumpulan halaman
web yang saling terhubung dan isinya terdiri dari berbagai
informasi berbentuk teks, suara, gambar, video, dan lainnya,
dimana semua data tersebut disimpan pada server hosting.
Penulis menyimpulkan bahwa website adalah tempat
penyimpanan data dan informasi dengan berdasarkan topik
tertentu. Website disebut juga dengan web atau Homepage.
Dapat disimpulkan bahwa Perancangan web adalah proses
merancang halaman web, situs web atau aplikasi multimedia
untuk Web. Perancangan web mencakup bagaimana isi web
konten ditampilkan, dengan menggunakan sebuah web
browser atau perangkat lunak berbasis web.

1.1.2 HTML
HTML( Hyper Text Markup Languange ) adalah bahasa
pemrograman yang digunakan untuk membuat kerangka atau
layout sebuah website atau yang biasa disebut script untuk
membuat tampilan sebuah web. HTML merupakan bahasa
pemrogramman yang bersifat client side scripting jadi HTML
tidak memerlukan server hanya membutuh web browser untuk
menampilkan script–script HTML-nya1.
Disebut Markup Language karena bahasa HTML
menggunakan tanda (mark), untuk menandai bagian-bagian
dari text. Misalnya, text yang berada di antara tanda tertentu
akan menjadi tebal, dan jika berada di antara tanda lainnya
akan tampak besar. Tanda ini di kenal sebagai HTML tag.
Sintak penulisan HTML tag dasar selalu dimulai dengan
karakter < , dan berakhir >. HTML Biasanya memiliki tag
berpasangan , misalnya <html> …… </html>. Tapi ada juga
beberapa perintah html yang tidak berpasangan contoh <br>
untuk ganti baris, dan <hr> untuk menggambar garis. Tag
Lebih lengkapnya seperti dibawah ini:
Tabel 1.1 Nama Tag di HTML
Nama Tag Keterangan / Kegunaan
Basic
<!DOCTYPE> Tag untuk menentukan tipe dokumen
Tag untuk membuat sebuah dokumen
<html>
HTML
Tag untuk membuat judul dari sebuah
<title>
halaman
Tag untuk membuat tubuh dari sebuah
<body>
halaman
<h1> to <h6> Tag untuk membuat heading
<p> Tag untuk membuat paragraf
<br> Memasukan satu baris putus
Tag untuk membuat perubahan dasar kata
<hr>
didalam isi
<!--...--> Tag untuk membuat komentar
Format

1
Galuh, Kresna.2015.Belajar HTML – Konsep Dasar HTML.
https://www.codepolitan.com/belajar-html-dasar. Diakses pada tanggal 08
April 2019
<b> Tag untuk membuat huruf bercetak tebal
Tag untuk membuat jajaran teks menjadi
<center>
ditengah
Tag untuk membuat penekanan teks (tidak
<em>
disupport lagi di HTML5)
Tag untuk membuat font, warna, dan
<font> ukuran untuk teks (tidak disupport lagi di
HTML5)
Tag untuk membuat sebuah bagian dari
<i>
teks yang disesuaikan dengan mood
<strong> Tag untuk membuat teks penting
Tag untuk membuat teks yang memiliki
<u>
Gaya yang berbeda dari teks biasa lainnya
<var> Tag untuk membuat sebuah variabel
Forms
Tag untuk membuat sebuah form HTML
<form>
untuk input pengguna
<input> Tag untuk membuat sebuah kontrol input
Tag untuk membuat sebuah kontrol input
<textarea>
multibaris (text area)
Tag untuk membuat sebuah tombol yang
<button>
dapat diklik
Tag untuk membuat sebuah daftar drop-
<select>
down
Tag untuk membuat sebuah kelompok
<optgroup>
pilihan yang terkait dalam daftar drop-down
Tag untuk membuat pilihan dalam daftar
<option>
drop-down
<label> Tag untuk membuat sebuah label untuk
 sebuah elemen <input>
Grup unsur terkait dalam bentuk
<fieldset>

Frames
Tag untuk membuat sebuah window
<frame> (bingkai) dalam sebuah frameset (tidak
disupport lagi di HTML5)
Images
<img> Tag untuk membuat gambar
Audio/Video
Tag untuk membuat isi suara (tag baru
<audio>
HTML5)
Tag untuk membuat sumber beberapa
<source> media untuk elemen media (<video> dan
<audio>) (tag baru HTML5)
Tag untuk membuat sebuah video atau film
<video>
(tag baru HTML5)
Links
<a> Tag untuk membuat hyperlink
Tag untuk membuat hubungan antara
<link> dokumen dan sumber daya eksternal (paling
sering digunakan untuk link ke style sheet)
Lists
Tag untuk membuat daftar dengan selain
<ul>
nomor
<ol> Tag untuk membuat daftar dengan nomor
<li> Tag untuk membuat sebuah item daftar
Tag untuk membuat deskripsi dari item
<menu>
dalam daftar definisi
 Tag untuk membuat sebuah tombol perintah
<command> bahwa seorang pengguna dapat meminta
(tag baru HTML5)
Tables
<table> Tag untuk membuat tabel
<caption> Tag untuk membuat sebuah caption tabel
<th> Tag untuk membuat sebuah sel header tabel
Tag untuk membuat baris dalam sebuah
<tr>
tabel
<td> Tag untuk membuat sel dalam sebuah tabel
Style/Sections
Tag untuk membuat informasi style untuk
<style>
dokumen
Tag untuk membuat sebuah bagian dalam
<div>
dokumen
Tag untuk membuat sebuah bagian dalam
<span>
dokumen
Tag untuk membuat sebuah header untuk
<header>
dokumen atau bagian (tag baru HTML5)
Tag untuk membuat footer untuk dokumen
<footer>
atau bagian (tag baru HTML5)
Tag untuk membuat bagian dalam dokumen
<section>
(tag baru HTML5)
Programming
<script> Tag untuk membuat script di sisi klien

1.1.3 Sublime Text

Sublime Text adalah teks editor untuk berbagai bahasa
pemrograman termasuk pemrograman PHP. Sublime Text
merupakan teks editor lintas platform dengan Phyon
Application Interface (API).
Sublime Text pertama kali diliris pada tanggal 18 Janari
2008, dan sekarang versi Sublime Text Editor sudah mencapai
versi 3 yang dirilis pada tanggal 29 Januari 2013. Sublime Text
mendukung operation system seperti Linux, Mac Os X, dan
juga Windows.

Kelebihan Sublime Text:

 Goto Anything
Fitur yang sangat membantu dalam membuka file
ataupun menjelajah isi dari beberapa keystrokes.
 Multiple Selections.
Fitur ini memungkinkan user untuk mengubah secara
interaktif banyak baris sekaligus, mengubah nama
variabel dengan mudah, dan memanipulasi file lebih cepat
dari sebelumnya.
 Command Pallete
Dengan hanya beberapa keystrokes, user dapat dengan
cepat mencari fungsi yang diinginkan, tanpa harus
menavigasi melalui menu.
 Distraction Free Mode
Bila user memerlukan fokus penuh kepada aplikasi ini,
fitur ini dapat membantu user dengan memberikan layar
penuh
 Split Ending
Dapatkan hasil yang maksimal dari monitor layar lebar
dengan dukungan editing perpecahan. Mengedit sisi file
dengan sisi, atau mengedit dua lokasi di satu file. Anda
dapat mengedit dengan banyak baris dan kolom yang user
inginkan.
 Instant Project Switch
Menangkap semua file yang dimasukkan kedalam project
pada aplikasi ini. Terintegrasi dengan fitur Goto Anything
 untuk menjelajah semua file yang ada ataupun untuk
beralih ke file dalam project lainnya dengan cepat.

1.1.4 CSS
CSS (Cascading Style Sheets) adalah bahasa pemrograman
yang digunakan untuk mendesain sebuah tampilan website.
CSS di gunakan mengatur peletakkan teks, gambar, mengatur
warna font size dan lain sebagainya di dalam web browser.
Inti dari CSS adalah untuk membuat style website supaya
tampilan website kita lebih menarik dan rapi2. HTML dan CSS
adalah satu paket yang tidak bisa di pisahkan. Penulis
menggunakan metode External Style Sheets dalam menginput
kode CSS ke dalam HTML
Metode External Style Sheets.
Metode External Style Sheets digunakan untuk
‘mengangkat’ kode CSS tersebut kedalam sebuah file
tersendiri yang terpisah sepenuhnya dari halaman HTML.
Setiap halaman yang membutuhkan kode CSS, tinggal
‘memanggil’ file CSS tersebut.

Gambar 1.1 Koneksi file CSS dengan HTML

2Andre.2013.Tutorial Belajar CSS. https://www.duniailkom.com/tutorial-

belajar-css-cara-menginput-kode-css-ke-halaman-html/. Diakses pada
tanggal 08 April 2019
 Gambar 1.2 File CSS
Pada metode link external style sheets ini, kita
menggunakan atribut href pada tag <link>, yang akan berisi
alamat dari halaman CSS, dalam hal ini belajar CSS. Karena
dengan menggunakan kode CSS yang dipisahkan, seluruh
halaman web dapat menggunakan file CSS yang sama, dan
jika kita ingin mengubah seluruh tampilan halaman website,
kita hanya butuh mengubah 1 file CSS saja.

1.1.5 Bootstrap
Bootstrap adalah library (pustaka / kumpulan fungsi-
fungsi) dari Framework CSS yang dibuat khusus untuk bagian
pengembangan dari suatu website. Didalam library tersebut
terdapat berbagai jenis file yang diantaranya HTML, CSS, dan
Javascript. Hampir semua developer website menggunakan
framework bootstrap agar memudahkan dan mempercepat
pembuatan website. Karena semuanya sudah ada dalam
frameworknya sehingga para pengembang hanya tinggal
membuat /menyisipkan class nya yang ingin dipakai seperti
membuat tombol, grid navigasi dan lain sebagainya3 .

3Hadi, Diki Alfarabi .2018.Pengertian Bootstrap.

https://www.malasngoding.com/pengertian-bootstrap/.Diakses pada tanggal
31 Maret 2019
 Cara menggunakan bootstrap yaitu kita harus menginstalasi
bootstrap. Bootstrap dapat didownload di website resminya.
Berikut ini adalah struktur isi dari bootstrap:

Gambar 1.3 Struktur Bootstrap

Kemudian jangan lupa tambahkan jquery.js pada saat
menghubungkan file html atau php dengan bootstrap.css.
Karena bootstrap bekerja menggunakan jquery bukan jquery
bekerja menggunakan bootstrap. Berikut ini adalah cara
menghubungkan file html atau php dengan bootstrap.css :

Gambar 1.4 Koneksi File HTML atau PHP dengan Bootstrap

1.1.6 PHP
PHP (Hypertext Preprocessor) bahasa scripting yang
ditunjukan untuk umum, atau open source yang umum
 digunakan yang sangat sesuai untuk pengembangan web.
Bahasa pemrograman PHP digunakan untuk membuat halaman
website menjadi dinamis.
PHP di kembangkan pada tahun 1995 oleh Rasmus Lerdorf.
Pada awalnya PHP merupakan singkatan dari Personal Home
Page. Sesuai dengan namanya, PHP digunakan untuk
membuat website pribadi. Setelah mengalami perkembangan
yang pesar, saat ini PHP adalah singkatan dari Hypertext
Preprocessor.

Kelebihan PHP :
 Banyaknya web server yang mendukung bahasa
pemerograman PHP sehingga konfgurasinya semakin
mudah. Beberapa web server misalnya XAMPP, Apache,
IIS, Xitami, Nginx, dan Lain-Lain
 Pengembangan bahasa pemerograman PHP tergolong
lebih mudah, karena banyak developer yang membantu
mengembangkannya maupun menggunakannya.
 Relatif mudah untuk dipahami, karena sekarang ini
banyak sekali tersebar materi-materi/referensi untuk
mempelajari PHP.
Kekurangan PHP :
 Keamanan yang kurang baik, jika programer tidak
memperhatikan keamanan dari program yang dibuatnya.
 Saat ini untuk encoding kode PHP tergolong sangat
mahal, karena membutuhkan tool tertentu.
 Kurang cocok untuk pengembangan program komputer
bersekala besar5.
Sebagai contoh penggunaan PHP yaitu: jika ingin membuat
list dari nomor 1 sampai nomor 10. Dengan menggunakan
HTML secara manual seperti kode berikut ini:

5Sora.2017.Rangkuman Pengertian PHP dan Kegunanannya.

http://www.pengertianku.net/2017/12/pengertian-php-dan-kegunaannya.html
. Diakses pada tanggal 31 Maret 2019
 Gambar 1.5 Penggunaan PHP pada HTML

Halaman HTML tersebut dapat dibuat dengan mudah

dengan cara men-copy-paste tag <li> sebanyak 10 kali dan
mengubah sedikit angka-angka no urut di belakangnya. Namun
jika yang kita inginkan adalah menambahkan list tersebut
menjadi 100 atau 1000 list, cara copy-paste tersebut menjadi
tidak efektif.
Jika menggunakan PHP, kita tinggal membuat perulangan
for sebanyak 1000 kali dengan perintah yang lebih singkat
seperti berikut ini:

Gambar 1.6 Perintah Perulangan for dengan PHP

 Gambar 1.7 Hasil Perintah Perulangan for dengan PHP

PHP tidak hanya dapat melakukan pengulangan tersebut,

masih banyak hal lain yang bisa kita lakukan dengan PHP,
seperti menginput data ke database, menghasilkan gambar, dan
masih banyak lagi
Tidak seperti kode HTML yang dapat langsung berjalan di
web browser, halaman web yang ditulis dengan PHP harus
diproses dalam sebuah aplikasi yang dinamakan Web Server.
Web server inilah yang akan menerjemahkan kode PHP
menjadi HTML dan mengirimnya ke web browser untuk
ditampilkan.Web servernya menggunakan XAMPP.

1.1.7 XAMPP
XAMPP ialah perangkat lunak bebas yang mendukung
banyak sistem operasi, merupakan campuran dari beberapa
program. Yang mempunyai fungsi sebagai server yang berdiri
sendiri (localhost), yang terdiri dari program MySQL database,
Apache HTTP Server, dan penerjemah ditulis dalam bahasa
pemrograman PHP dan Perl.
Nama XAMPP merupakan singkatan dari X (empat sistem
operasi), Apache, MySQL, PHP dan Perl. Program ini tersedia
di bawah GNU General Public License dan bebas, adalah
mudah untuk menggunakan web server yang dapat melayani
tampilan halaman web yang dinamis. Jika ingin mendapatkan
xampp dapat mendownload langsung dari situs
resminya.Dengan menginstall XAMPP, secara tidak langsung
kita telah menginstall keempat aplikasi tersebut.

Gambar 1.8 XAMPP Control Panel

1.1.8 MySQL
MySQL adalah sebuah implementasi dari sistem
manajemen basisdata relasional (RDBMS) yang
didistribusikan secara gratis. Setiap pengguna dapat secara
bebas menggunakan MySQL, namun dengan batasan
perangkat lunak tersebut tidak boleh dijadikan produk turunan
yang bersifat komersial6.
Keistimewaan MySQL :
 Portabilitas. MySQL dapat berjalan stabil pada berbagai
sistem operasi seperti Windows, Linux, FreeBSD, Mac
Os X Server, Solaris, Amiga, dan masih banyak lagi.
 Perangkat lunak sumber terbuka (open source). MySQL
didistribusikan sebagai open source sehingga dapat
digunakan secara gratis. PHP dengan menggunakan teks
editor (DreamWeaver/Notepad++/Sublime,dll) dengan
MySQL:

6Ahmad, Moh. Pengertian MySQL. https://www.indosite.com/pengertian-

mysql/ .Diakses pada tanggal 31 Maret 2019
 Gambar 1.9 Koneksi PHP dengan MySQL Database

1.1.9 Web Database

Web Database merupakan suatu sistem untuk menyimpan
informasi yang kemudian dapat diakses melalui website.
Sistem database yang paling umum digunakan di Internet
adalah MySQL dikarenakan integrasinya dengan PHP (PHP
merupakan server side programming language yang paling
banyak digunakan).
Pada tingkat yang paling sederhana, web database
merupakan satu atau beberapa kumpulan tabel yang berisi data.
Masing-masing tabel memiliki field-field berbeda untuk
menyimpan berbagai jenis informasi. Tabel-tabel ini kemudian
dapat saling dihubungkan untuk memanipulasi data
menggunakan cara-cara tertentu.
Menggunakan database memungkinkan website dapat
diupdate dengan mudah dan tanpa perlu mengedit kode HTML
untuk setiap halaman yang ingin diubah. Berikut ini adalah
cara membuat Database Mysql dengan Phpmyadmin lewat
aplikasi XAMPP:
1. Langkah pertama yang harus dilakukan adalah download
XAMPP dulu. Anda bisa mendownload XAMPP diweb
resminya.
2. Jalankan XAMPP Control Panel. Pada tampilan XAMPP
Control Panel ini, klik tombol Start pada bagian Apache
dan MySQL, seperti yang terlihat pada gambar dibawah
ini:
 Gambar 1.10 Tampilan XAMPP Control Panel

3. Buka browser lalu ketikkan localhost/phpmyadmin/

Gambar 1.11 Tampilan localhost/phpmyadmin/

4. Pilih Basis data –> Masukkan nama database –> Buat.

Jika menggunakan bahasa inggris pilih Database – masukkan
database – create. Setelah database dibuat, otomatis akan
muncul di sidebar sebelah kanan phpmyadmin

Gambar 1.12 Pembuatan Database di phpmyadmin

5. Pilih database Sekolah yang telah kita buat tadi

Gambar 1.13 Daftar Database yang telah dibuat

6. Didalam database, buat tabel bernama “siswa” dan isi

jumlah kolom sesuai yang dibutuhkan. Pada contoh
gambar dibawah ini jumlah kolom nya ada 4. Lalu
kirim/OK.

Gambar 1.14 Pembuatan Tabel pada Database

7. Isi field nya, sebagai contoh di dalam table siswa akan ada
field id, nama, nis, dan kelas dengan tipe yang berbeda.
Lalu klik Save
 Gambar 1.15 Pengisian Field pada Database

1.1.10 Hubungan antara HTML, CSS, PHP dan MYSQL

Melihat dari pengertian – pengartian di atas dapat
disimpulkan bahwa HTML dan CSS satu paket bahasa
pemrograman yang digunakan untuk membuat tampilan
sebuah website, sedangkan PHP dan MYSQL digunakan untuk
membuat halaman website yang dibuat HTML + CSS menjadi
dinamis. PHP berfungsi sebagai penghubung HTML dan
MYSQL. Peran PHP MYSQL dalam membaut web dinamis
adalah MYSQL sebagai penampung datanya seperti konten –
konten yang dapat berubah–ubah dalam web dinamis maka
mysql lah yang manampung datanya, sedangkan PHP
digunakan untuk menghubungkan query – query yang ada
dalam mysql baik untuk menampilkan data dalam web atau
menyimpan.

2.1 Sistem Informasi Objek

2.1.1 Sistem Informasi
Sistem dapat diartikan sebagai kumpulan orang atau
beberapa orang yang saling bekerja sama dan secara terstruktru
untuk memenuhi tujuan-tujuan tertentu. Sedangkan definisi
informasi adalah suatu data yang diolah agar menjadi leboh
berguna bagi orang lain serta lebih membantu dalam
mengambil keputusan terhadapt suatu masalah tertentu7.
Oleh karena itu dapat diambil kesimpulan bahwa sistem
informasi adalah suatu sistem yang terdapat kumpulan
informasi berdasarkan keterkaitan terhadap operasional suatu

7Azam,Moch. 2017.Pengertian Sistem Informasi beserta Komponen dan Contoh Penerapan

Sistem Informasi. https://www.nesabamedia.com/pengertian-sistem-

informasi/.Diakses tanggal 23 Maret 2019
organisasi atau instansi dan digunakan untuk mengambil
keputusan tertentu.

2.1.2 Sejarah Singkat STMIK PPKIA Tarakanita

Rahmawati
STMIK PPKIA bercikal bakal dari sebuah lembaga kursus
LPKIA (Lembaga Pendidikan Komputer Indonesia Amerika)
Malang, yang saat ini telah menjadi sebuah Sekolah Tinggi.
Sejak tahun 1992 LPKIA malang telah merubah dirinya
menjadi PPKIA (Pusat Pendidikan Komputer Indonesia
Amerika). Kemudian mengembangkan diri di kota Jember,
Denpasar dan terakhir di Kota Tarakan Kalimantan Timur
pada tahun 2000.
Nama "Tarakanita" diambil atas dasar posisi lembaga ini
yang terletak di kota Tarakan dan "Rahmawati" adalah
penggabungan nama dari ibunda dan pemilik Yayasan Bina
Citra Muda, yaitu Ibu HJ.Rahma (alm.) yang bertempat di
Kr.balik RT 6 Tarakan dan Ibu Hj. Dra.Sri Ramayanawanti
,Mpd. yang saat ini berdomisi di kota Malang.
Saat itu program study atau jurusan manajemen informatika
untuk jenjang D3 yang di laksanakan. Pendidikan tinggi
setingkat akademi tersebut bernama Akademi Manajemen
Informatika dan Komputer (AMIK) PPKIA Tarakanita
Rahmawati. Sesuai ijin operasional yang di keluarakan oleh
mendiknas RI No: 238/D/O/2002.
Mendapatkan kepercayaan untuk meningkatkan statusnya
menjadi Sekolah Tinggi yang mampu melaksanakan
pendidikan Sastra 1 (S1). Sekolah Tinggi Manajemen
Informatika dan Komputer (STMIK) PPKIA Tarakanita
Rahmawati . Pada bulan juli 2011, pihak pengelola STMIK
PPKIA Tarakanita Rahmawati mengajukan proses akreditasi
kepada Badan Akreditasi Nasional Perguruan Tinggi (BAN-
PT), persyaratan untuk tiga program studi, yaitu D3-
Manajemen Informatika, S1-Sistem Informasi dan S1-Teknik
Informatika diterima oleh BAN-PT sesuai dengan bukti
pengurusan akreditasi dengan No: 35/296/1485/D3/2011,
54/295/1485/S1/2011 dan 124/292/S1/2011.

2.1.3 Visi dan Misi STMIK PPKIA Tarakanita

Rahmawati
STMIK PPKIA Tarakanita Rahmawati tumbuh dan
berkembang dengan Visi dan Misi sebagai berikut :

VISI :
“Mencerdaskan kehidupan berbangsa dan bernegara
sesuai Pancasila dan UUD 1945, demi menciptakan
masyarakat Indonesia yang berkemampuan tinggi di
bidang Teknologi Informasi yang beragama dan berbudi
luhur, serta menciptakan nilai-nilai moral yang membawa
perubahan bagi kehidupan bermasyarakat, berbangsa dan
bernegara.”

MISI :
B.I.R.U
 Bright : Membentuk peserta didik yang berdaya pikir
cemerlang.
 Intelligent : Membentuk peserta didik yang pandai dan
banyak solusi.
 Religious : Membentuk peserta didik yang beragama dan
ber-akhlak baik.
 Upstanding : Membentuk peserta didik yang jujur dan
berbudi luhur.
Dengan dasar misi tersebut, maka STMIK PPKIA
Tarakanita Rahmawati banyak dikenal dengan Kampus Biru.

2.1.4 Lembaga Penelitian dan Pengabdian kepada

Masyarakat (LPPM)
Visi :
Lembaga Penelitian dan Pengabdian kepada Masyarakat
(LPPM) STMIK PPKIA Tarakanita Rahmawati, sebagai
bagian tidak terpisahkan dari Sekolah Tinggi Manajemen
Informatika dan Komputer (STMIK) PPKIA Tarakanita
Rahmawati, melaksanakan aktifitasnya berdasarkan Visi dan
Misi dari STMIK PPKIA Tarakanita Rahmawati. Visi dan
Misi Lembaga Penelitian dan Pengabdian kepada Masyarakat
(LPPM) merupakan penjabaran detail dari kewajiban Sekolah
Tinggi Manajemen Informatika dan Komputer (STMIK)
PPKIA Tarakanita Rahmawati dalam melaksanakan Penelitian
dan Pengabdian kepada Masyarakat.

Misi :
 Meningkatkan kegiatan penelitian bagi Dosen melalui
penambahan skema penelitian yang selaras dengan
kebutuhan keilmuan yang ditekuninya, demi peningkatan
kemampuan keilmuan Mahasiswa;
 Meningkatkan kegiatan pengabdian kepada Masyarakat
oleh Dosen melalui penambahan skema pengabdian yang
dapat selaras dengan kebutuhan Dosen untuk
meningkatkan kebermanfaatan keilmuan bagi peningkatan
kehidupan masyarakat;
 Meningkatkan perolehan pendanaan bagi penelitian dan
pengabdian kepada masyarakat melalui sumber internal
maupun eksternal, demi keberlanjutan peningkatan
keilmuan dan peningkatan kehidupan masyarakat melalui
teknologi informasi;
 Meningkatkan kerjasama penelitian dan pengabdian
kepada masyarakat melalui skema yang ada maupun
skema baru dengan kesepakatan bersama, demi
terwujudnya kemanfaatan nyata antara akademisi dan
masyarakat

2.1.5 Angket
Angket atau Kuesioner merupakan instrumen penelitian
yang berupa daftar pertanyaan untuk memperoleh keterangan
dari sejumlah responden (sumber yang diambil datanya
melalui angket), angket atau kuesioner dapat disebut
wawancara tertulis karena isi kuesioner merupakan satu
rangkaian pertanyaan tertulis yang ditujukan kepada responden
dan diisi sendiri oleh responden.
Jenis Angket Yang digunakan adalah Angket terbuka.
Angket Terbuka yaitu angket yang system menjawabnya tidak
menggunakan pilihan ganda maupun yes or no sehingga
responden (narasumber) bisa leluasa mengisi pertanyaan dalam
angket tersebut dengan jawaban dan pendapat mereka sendiri
tanpa dibatasi oleh alternative jawaban dari angket tersebut.
Pengukuran kepuasan mahasiswa di lingkungan STMIK
PPKIA Tarakanita Rahmawati dilakukan dengan tujuan yaitu
(1) mengetahui tingkat kepuasan mahasiswa terhadap layanan
secara umum, (2) mengetahui tingkat kepuasan mahasiswa
terhadap 3 aspek kepuasan utama yaitu: kepuasan terhadap
fasilitas yang tersedia, kepuasan terhadap layanan dan
kepuasan terhadap proses pembelajaran dan (3) mengetahui 2
aspek kepuasan tambahan, yaitu kepuasan terhadap
pelaksanaan Praktikum.
Responden yang menjadi sample dalam penelitian ini
merupakan wakil dari 3 Jurusan yaitu Sistem Informasi (SI),
Teknik Informatika (TI) dan Manajemen Infomatika (MI).
 BAB III
ANALISA DAN PERANCANGAN

3.1 Bagan Alir (Flowchart)

Bagan alir (flowchart) adalah suatu bagan (chart) yang
menunjukkan (flow) didalam program atau prosedur sistem secara
logika. Bagan alir menjelaskan secara rinci mengenai langkah-
langkah dari proses program. Bagan alir digunakan terutama
untuk alat bantu komunikasi dan untuk dokumentasi. Flowchart
disusun dengan simbol-simbol, simbol ini dipakai sebagai alat
bantu untuk menggambarkan proses didalam program, adapun
simbol yang digunakan dapat dilihat pada tabel dibawah ini :

Tabel 1.2 Simbol dalam Flowchart

Simbol Nama Keterangan
Input / Simbol Input/Output data
Output dan informasi
Data
Proses Simbol Proses
komputerisasi/ internal
program
Garis Alur Simbol garis alir
menunjukkan arah alur
diagram
Terminator Simbol untuk memulai dan
mengakhiri program
Predefinied Simbol untuk menunjukkan
Process suatu operasi yang
(Sub rinciannya ditunjukkan
Program) ditempat lain
Simbol Titik Simbol persiapan digunakan
(Point untuk mempersiapkan
Terminal) penyimpanan sebagai tempat
pengolahan didalam storage
Penghubung Simbol yang menunjukkan
1 halaman penghubung ke halaman
yang masih sama
Penghubung Simbol yang menunjukkan
Beda penghubung ke halaman
halaman yang berbeda
Flowchart Beranda Awal

Mulai

Pilih Menu Utama

Admin :
1. Login Admin
2. Login Mahasiswa
3. Keluar

Ya 4
Pilih Login Tampilan
Admin Login Admin
3

Tidak 5

Ya
Pilih Login Tampilan
Mahasiswa Rekapitulasi 7
6

Tidak 8

Ya
Tampilan
Pilih Keluar
Keluar
9 10
11
Tidak

Selesai
Algoritma :
1. Mulai
2. Tampil pilihan Beranda Awal
3. Lakukan pengujian pada Login Admin. Jika Ya, maka
lakukan pengujian pada Login Admin
4. Proses selesai
5. Jika Tidak, maka lakukan pengujian pada Login Mahasiswa
6. Jika Ya, maka tampilkan Login Mahasiswa
7. Proses selesai
8. Jika Tidak, maka lakukan pengujian pada Keluar
9. Jika Ya, maka Tampilkan Keluar
10. Jika Tidak, maka proses Selesai
Flowchart Login Mahasiswa

Mulai

Masukkan nim
& kata sandi
2

3 Maaf Nim/Kata 4
Login Benar sandi yang anda
Tidak masukkan salah

Benar 5

Tampilan Menu
Utama Mahasiswa

Selesai

Algoritma :
1. Mulai
2. Inputkan NIM dan Kata Sandi
3. Uji, Apakah saat Login benar
a. Jika Tidak, tampilkan pesan “ Maaf ! NIM / Kata sandi
yang anda masukkan salah!”
b. Jika Ya, maka tampilkan atau masuk ke Tampilan Menu
Utama Mahasiswa.
4. Kembali Masukkan nim dan kata sandi
5. Selesai
Flowchart Tampilan Menu Utama Mahasiswa

Mulai

Pilih Menu Utama

Mahasiswa:
1. Beranda
2. Angket
3. Keluar

Ya Tampilan
Pilih Beranda
3 4

Tidak 5

Ya
Pilih Angket Tampilan Angket
6 7

Tidak 8

Ya
Pilih Keluar Tampilan Keluar
9 10
Tidak
11

Selesai
Algoritma :
1. Mulai
2. Tampil pilihan Beranda
3. Lakukan pengujian pada Beranda. Jika Ya, maka
tampilkan Beranda
4. Proses selesai
5. Jika Tidak, maka lakukan pengujian Angket
6. Jika Ya, maka tampilkan Angket
7. Proses selesai
8. Jika Tidak, maka lakukan pengujian Keluar
9. Jika Ya, maka tampilkan Keluar
10. Proses Selesai
Flowchart Pengisian Angket

Mulai

Menu Angket

Input Nama Dosen, Mata Kuliah,

Peguasaan Dosen, Kemampuan
Dosen, Metode Dosen,
Kedisiplinan Dosen, Keramahan
Dosen, Kerapian Dosen, Saran
untuk kampus, Saran untuk
fasilitas kampus

Ya Data Angket
Simpan Data Angket Anda Berhasil
4 Disimpan
5

6 Tidak

Selesai

Algoritma :
1. Mulai
2. Tampilan Menu Angket
3. Input Nama Dosen, Mata Kuliah, Penguasaan Dosen,
Input Kemampuan Dosen, Metode Dosen, Kedisiplinan
Dosen, Keramahan Dosen, Kerapian Dosen, Saran untuk
Kampus, dan Saran untuk Fasilitas Kampus
4. Lakukan pengujian “Simpan data Angket ?”. Jika Ya,
tampilkan pesan “Data Angket Anda Berhasil Disimpan!”
5. Proses Selesai
6. Jika Tidak Proses Selesai
Flowchart Keluar

Mulai

Pilihan Tampil
Keluar :
1. Ya, Saya keluar
2. Tidak

Ya
Tampilan Login
Pilihan 1 Ya
Mahasiswa
3 4

Tidak 5

Selesai

Algoritma:
1. Nilai
2. Tampil pilihan keluar
3. Jika pilihan Ya,maka TampilanLogin Mahasiswa.
4. Proses selesai
5. Jika tidak,proses selesai.
Flowchart Login Admin

Mulai

Masukkan Id
Admin & kata
sandi

Maaf Id
Tidak Admin /Kata
Login Benar
sandi yang anda
3 masukkan salah

Benar
5

Tampilan Menu Utama

Admin

Selesai

Algoritma :
1. Mulai
2. Inputkan Id Admin dan Kata Sandi
3. Uji, Apakah saat Login benar
4. Jika Tidak, tampilkan pesan “ Maaf ! Id Admin / Kata
sandi yang anda masukkan salah!”
5. Jika Ya, maka tampilkan atau masuk ke Tampilan Menu
Admin .
6. Kembali Masukkan nim dan kata sandi
7. Selesai
Flowchart Tampilan Menu Utama Admin
Mulai

1
Pilih Menu Utama
Admin:
1. Beranda Admin
2.Tambah NIM
3. Rekapitulasi
Angket
4. Keluar.
2

Ya Tampilan
Pilih Beranda Beranda
Admin Admin
3 4
Tidak 5
Ya
Pilih Tambah Tampilan
NIM Tambah NIM
6 7

Tidak 8
Ya
Pilih Angket Tampilan
Rekapitulasi Rekapitulasi 10
9

Tidak 11

Ya
Pilih Keluar Tampilan
Keluar
12 13
Tidak 14

Selesai
Algoritma :
1. Mulai
2. Tampil pilihan Beranda Admin
3. Lakukan pengujian pada Beranda Admin. Jika Ya, maka
tampilkan Beranda Admin
4. Proses selesai
5. Jika Tidak, maka lakukan pengujian Rekapitulasi
6. Jika Ya, maka tampilkan Rekapitulasi
7. Proses selesai
8. Jika Tidak, maka lakukan pengujian pada Keluar
9. Jika Ya, maka tampilkan Keluar
10. Proses Selesai
11. Jika Tidak, maka proses Selesai
Flowchart Tambah NIM

Mulai

Menu Tambah
Nilai

Input NIM,
Password
Nama

3
Ya Data
Simpan Data NIM Baru
NIM Baru Berhasil Di
4 Simpan
5
Tidak 6

Selesai

Algoritma :
1. Mulai
2. Tampilan Menu Tambah Nilai
3. Melakukan Input NIM, password, nama baru
4. Lakukan Simpan Data NIM baru
5. Jika Ya, Tampilkan pesan “ Data NIM Baru berhasil di
simpan”.
6. Jika Tidak, Maka proses selesai
Flowchart Rekapitulasi

Mulai

Menu Rekapitulasi

Input Data Filter

3
Ya Ya
Angket
Tampilkan Cetak Berhasil
4 Dicetak 6
5
7
Tidak

Selesai

Algoritma :
7. Mulai
8. Tampilan Menu Rekapitulasi
9. Melakukan Input Data sebagai filter
10. Lakukan Pengujian dan tampilkan database. Jika Ya,
Maka Cetak.
11. Tampilkan pesan “ Angket Berhasil Dicetak”.
12. Proses Selesai
13. Jika Tidak, Maka proses selesai
Flowchart Keluar Login Admin

Mulai

Pilihan Tampil
Keluar :
1. Ya, Saya keluar
2. Tidak

Ya
Tampilan
Pilihan 1 Ya
Login Admin
3 4
Tidak
5

Selesai

Algoritma:
1. Nilai
2. Tampil pilihan keluar
3. Jika pilihan Ya,maka Tampilkan Login Admin.
4. Proses selesai
5. Jika tidak,proses selesai.
Desain Database
Desain yang digunakan adalah sebagai berikut :

1. Tabel Tb_mahasiswa
Field Primary
File Name Type Keterangan
Size Key
Nomor Induk
nim Char 9 *
Mahasiswa
password Varchar 5 Password
nama Varchar 35 Nama

2. Tabel Tb_angket
Field Primary
File Name Type Keterangan
Size Key
Penomoran
id_angket AutoNumber *
Angket
Nomor Induk
nim Char
Mahasiswa
tgl Date/Time - Tanggal
nmdosen Varchar 40 Nama Dosen
matkul Varchar 25 Mata Kuliah
Penguasaan
penguasaan Text -
Dosen
Kemampuan
kemampuan Text -
Dosen
Metode
metode Text -
Pengajaran
Kedisiplinan
disiplin Text -
Dosen
Keamanan
keamanan Text -
Dosen
kerapian Text - Kerapian
 Dosen

Saran
Saran Text -
Mahasiswa
fasilitas Text Fasilitas Di
-
Kampus
praktikum Text - Praktikum

3. Tabel Tb_admin
Field Primary
File Name Type Keterangan
Size Key
Id_admin Char 9 * Id Admin
password Char 5 Password
nama Varchar 35 Nama

Diagram Relasi Entity

Entity Relationship (ER) adalah objek yang dapat
dibedakan dalam dunia nyata. Sedangkan Relationship
hubungan yang terjadi antara satu atau lebih entity.
Entity Relationship (ER) pada pembuatan perancangan
sistem informasi pengisian angket berbasis web ini
menggunakan PHP dan database MySQL adalah seperti yang
terlihat pada gambar dibawah ini:

Tb_Mahasiswa
nim (PK)
password Tb_Angket
id_angket
nim (FK)
tgl
nmdosen
matkul
Tb_Admin
Id_admin
password
nama
Tampilan Login Admin

Tampilan Rekapitulasi Angket Admin

Tampilan Menu Tambah NIM di Admin

Tampilan Login Mahasiswa

Tampilan Menu Beranda Mahasiswa

Tampilan Menu Angket Mahasiswa

Tampilan Menu Status Mahasiswa