pengembangan sistem online penjaringan...

PENGEMBANGAN SISTEM ONLINE PENJARINGAN

UMPAN BALIK LULUSAN DAN PENGGUNA LULUSAN

BERBASIS FRAME WORK

TUGAS AKHIR

Disusun dalam rangka memenuhi salah satu persyaratan

Untuk menyelesaikan program Strata-1 Departemen Teknik Informatika

Universitas Hasanuddin

Makassar

Disusun Oleh :

MUHAMMAD FADLI ARIF D421 11 125

HIZBA MUHAMMAD D421 11 126

DEPARTEMEN TEKNIK INFORMATIKA

FAKULTAS TEKNIK

UNIVERSITAS HASANUDDIN

MAKASSAR

2018

ii

KATA PENGANTAR

Puji syukur penulis panjatkan kehadirat Tuhan Yang Maha Esa dengan

selesainya skripsi ini.

Gagasan yang melatarbelakangi tajuk permasalahan ini timbul dari hasil

pengamatan penulis terhadap kehidupan para petani penyadap nira yang bekerja

mulai sejak terbit fajar sampai larut senja tanpa henti, dengan penghasilan yang

hanya cukup untuk memenuhi kebutuhan minimum mereka. Penulis bermaksud

menyumbangkan beberapa konsep untuk mengangkat kondisi kehidupan mereka

yang umumnya berada di bawah garis kemiskinan ke taraf yang lebih tinggi.

Banyak kendala yang dihadapi oleh penulis dalam rangka penyusunan

skripsi ini, yang hanya berkat bantuan berbagai pihak, maka skripsi ini selesai

pada waktunya. Dalam kesempatan ini penulis dengan tulus menyampaikan

terima kasih kepada Dr. Amil Ahmad Ilham, ST. M.I.T selaku Pembimbing satu

dan Novy Nur R A Mokobombang, ST.Ms.TM selaku pembimbing duayang telah

diberikan mulai dari pengembangan minat terhadap permasalahan penelitian ini.

Dan yang terakhir ucapan terima kasih juga disampaikan kepada mereka

yang namanya tidak tercantum tetapi telah banyak membantu penulis dalam

menyelesaikan skripsi ini.

Makassar, 7Maret 2018

Penulis

iii

ABSTRAK

Alumni sekian hari semakin bertambah, khususnya pada Universitas Hasanuddin Makassar lulusan yang dihasilkan cukup banyak. Mengingat Unhas menghasilkan lulusan sebanyak 3 kali periode dalam setahun. Sehingga perlu adanya pendataan lulusan alumni, apakah terserap kerja, mengumpulkan feedback alumni, hingga mampu melihat data lulusan demi kualitas kampus.Penelitian ini mencoba membuat pengembangan sistem informasi alumni yang lebih baik dari sebelumnya yaitu dengan mengolah data alumni, dan menyimpan data alumni kedalam sebuah database sehingga lebih mudah dalam pengolahan data nantinya karena data sudah di dapatkan dan tersimpan dalam server. Selain itu perlu pula di buatkan sebuah sistem yang mengatur data alumni yang di implementasikan ke dalam web agar lebih mudah dalam proses pencarian data-data alumni. Oleh karena itu , diperlukan suatu konsep pengembangan dari sistem informasi alumni yang mampu membantu pihak kampus dalam mengolah data dan penyampaian informasi alumni agar terjadi umpan balik antar lulusan dan pihak kampus. Sistem sebelumnya menggunakan model pemrograraman php native sehingga lebih merepotkan dalam hal pengembangan sistem, perlunya pembaharuan sistem dengan menggunakan framework dalam hal ini adalah CodeIgniter menjadi salah satu model pengembangan sistem yang lebih baik, mengingat framework saat ini lebih aman dibandingkan dengan pemrograman php native yang lebih merepotkan dikarenakan merombak keseluruhan dari baris kode yang dibuat.

Hasil pengujian fungsional dari aplikasi web tracert alumni berjalan dengan baik dan minim akan kesalahan. Sistem memberikan informasi Hasil survey yang ditanggapi oleh alumni dan direkap serta dilihat oleh admin sehingga memberikan informasi lebih mendalam dari alumni untuk kampus Universitas Hasanuddin Makassar.

Kata kunci :

Alumnni, Database, Web App, Survey, CodeIgniter.

iv

DAFTAR ISI

KATA PENGANTAR ............................................................................................. i ABSTRAK .............................................................................................................. ii

DAFTAR ISI .......................................................................................................... iii

DAFTAR GAMBAR ............................................................................................. vi

DAFTAR TABEL ................................................................................................. vii

BAB I ....................................................................................................................... 1

PENDAHULUAN ................................................................................................... 1

I.1 Latar Belakang ........................................................................................ 1

I.2 Rumusan Masalah .................................................................................. 2

I.3 Tujuan Penelitian ................................................................................... 2

I.4 Batasan Masalah .................................................................................... 3

I.5 Sistematika Penulisan ............................................................................. 4

BAB II ...................................................................................................................... 6

LANDASAN TEORI ............................................................................................... 6

II.I Aplikasi Web .......................................................................................... 6

II.1.1 Web Server.............................................................................. 7

II.1.2 Web Browser .......................................................................... 8

II.2Server Side Scripting .............................................................................. 9

II.3Bahasa Pemrograman ............................................................................. 9

II.3.1 HyperText Markup Language (HTML) ................................ 10

II.3.2PHP ........................................................................................ 11

II.3.3JavaScript .............................................................................. 12

II.3.4jQuery .................................................................................... 12

II.3.5Bootstrap ............................................................................... 13

v

II.4DataBase ............................................................................................... 14

II.4.1MySQL ................................................................................... 16

II.4.2Normalisasi ............................................................................ 17

II.5Definisi UML ........................................................................................ 17

II.6Atom Editor .......................................................................................... 25

II.7Google Chrome (Browser) ................................................................... 26

II.8Black Box Texting ................................................................................. 26

II.9Code Igniter Framework ...................................................................... 28

BAB III .................................................................................................................. 32

METODOLOGI PENELITIAN ............................................................................. 32

III.1 Waktu dan Tempat Penelitian ............................................................ 32

III.2Metode Pengumpulan data .................................................................. 32

III.3Analisis Sistem .................................................................................... 34

III.4Metode Pengembangan Sistem ........................................................... 35

III.5Rancangan Struktural .......................................................................... 38

III.5.1Use Case Diagram ............................................................... 38

III.5.2Diagram Activity .................................................................. 40

III.5.3Sequence Activity ................................................................. 42

III.5.4Tabel Database ..................................................................... 43

BAB IV .................................................................................................................. 44

HASIL DAN PEMBAHASAN .............................................................................. 44

IV.1Gambaran Utama Sistem .................................................................... 44

IV.2Implementasi & Pembahasan Sistem .................................................. 46

IV.2.1Implementasi Halaman Login .............................................. 46

IV.2.2Implementasi Halaman Verifikasi ....................................... 47

vi

IV.2.3Implementasi Halaman List Anggota .................................. 48

IV.2.4Implementasi Halaman List Survey ..................................... 49

IV.2.5Implementasi Halaman Berita ............................................. 50

IV.2.6Implementasi Halaman Utama User Alumni ....................... 51

IV.2.7Implementasi Halaman Utama Survey ................................ 52

IV.3Pengujian Sistem ................................................................................. 52

IV.4Pengujian Survey ................................................................................ 54

BAB V .................................................................................................................... 61

PENUTUP .............................................................................................................. 61

V.1 Kesimpulan ......................................................................................... 61

V.2 Saran .................................................................................................... 62

DAFTAR PUSTAKA ............................................................................................ 63

LAMPIRAN .......................................................................................................... 65

vii

DAFTAR GAMBAR

Gambar 2.1. Arsitektur aplikasi web ............................................................... 7

Gambar 2.2. Contoh Use Case Diagram ....................................................... 22

Gambar 2.5. Contoh Class diagram sederhana .............................................. 23

Gambar 2.6. Activity Diagram ....................................................................... 24

Gambar 2.7. Sequnce Diagram ...................................................................... 25

Gambar 2.8. Gambar Logo Codeigniter......................................................... 28

Gambar 2.9. Aplication Flowchart ................................................................. 30

Gambar 3.1. Gambaran Model Sistem ........................................................... 35

Gambar 3.2. Tahap tahap pada metode Sequential Linear ............................ 36

Gambar 3.3. Use Case Diagram ..................................................................... 38

Gambar 3.4. Activity Diagram User/Alumni ................................................. 40

Gambar 3.5. Activity Diagram Admin........................................................... 41

Gambar 3.6. Sequence Diagram Aplikasi ...................................................... 42

Gambar 3.7. Tabel Database .......................................................................... 43

Gambar 4.1. Halaman Utama Aplikasi Web Tracer Alumni ........................ 44

Gambar 4.2. Web App tracer Halaman User Admin ..................................... 45

Gambar 4.3. Halaman Login Web Alumni Tracer......................................... 46

Gambar 4.4. Halaman Verifikasi Web Alumni Tracer .................................. 47

Gambar 4.5. Halaman List Anggota .............................................................. 48

Gambar 4.6. Halaman List Survey ................................................................. 49

Gambar 4.7. Halaman List Berita .................................................................. 50

Gambar 4.8. Halaman Utama User Alumni ................................................... 51

Gambar 4.9. Halaman Utama Survey ............................................................ 50

Gambar 4.10. Halaman List Pertanyaan Survey .............................................. 55

Gambar 4.11. Halaman Jawaban Survey ......................................................... 58

viii

DAFTAR TABEL

Tabel 2.1. Simbol simbol UML pada beberapa jenis diagram ................... 18

Tabel 5.1. Menampilkan Hasil Pengujian Fungsional Sistem ................... 54

1

BAB I

PENDAHULUAN

I.1 Latar Belakang

Alumni adalah salah satu bagian dari keluarga besar yang akanmembawa

nama baik almamater. Dengan bertambahnya jumlah lulusan tiaptahunnya,

maka sangat dibutuhkan informasi mengenai alumni bagikepentingan civitas

akademika. Selama ini pelayanan mengenai alumnibelum berjalan dengan

maksimal, sehingga dibutuhkan suatu peralatankomputer yang memiliki

program yang dapat mendukung proses dalammencari informasi mengenai

alumni [12].Di Universitas Hasanuddin sendiri, pengelolaan data

terhadapalumninya masih perlu dikembangkan mengingat sistem yang ada

saat ini hanyalah mengumpulkan data anggota saja dan beberapa fitur belum

jalan dengan baik seperti fitur umpan balik dari alumni terhadap sistem yang

ada sehingga untuk melacak alumni unhas menjadi kurang dapat diketahui

[13].

Maka dari itu perlu dilakukankajian dan penelitian untuk pengembangan

sistem informasi alumni yanglebih baik dari sebelumnya yaitu dengan

mengolah data alumni, danmenyimpan data alumni kedalam sebuah database

sehingga lebih mudah dalam pengolahan data nantinya karena data sudah di

dapatkan dan tersimpan dalam server. Selain itu perlu pula di buatkansebuah

sistem yang mengatur data alumni yang di implementasikan kedalam web

agar lebih mudah dalam proses pencarian data-data alumni.Oleh karena itu ,

2

diperlukan suatu konsep pengembangan dari sisteminformasi alumni yang

mampu membantu pihak kampus dalam mengolahdata dan penyampaian

informasi alumni agar terjadi umpan balik antarlulusan dan pihak

kampus.Sistem sebelumnya menggunakan model pemrograraman php native

sehingga lebih merepotkan dalam hal pengembangan sistem, perlunya

pembaharuan sistem dengan menggunakan framework dalam hal ini adalah

CodeIgniter menjadi salah satu model pengembangan sistem yang lebih baik,

menngingat framework saat ini lebih aman dibandingkan dengan

pemrograman php native yang lebih merepotkan dikarenakan merombak

keseluruhan dari baris kode yang dibuat. Berdasarkan pemaparan tersebut

penulis tertarik mengangkat tugas akhir dengan judul “Pengembangan

Sistem Online Penjaringan Umpan Balik Lulusan Dan Pengguna Lulusan

Berbasis Frame Work”.Sehingga pelayanan dari kampus dapat di tingkatkan

berdasarkan beberapa masukan alumni serta mampu mengetahui penyebaran

alumni dari kampus itu sendiri.

I.2 Rumusan Permasalahan

AdapunRumusanPermasalahandaripenelitianiniadalah:

1. Bagaimana mengembangkan sistem online penjaringan umpan balik lulusan

dan pengguna lulusan berbasis framework?

2. Bagaimana menambahkan fitur yang menampilkan profil lulusan dan hasil

analisa kuisioner dalam bentuk grafik kedalam sistem online penjaringan?

I.3 Tujuan Penelitian

Adapuntujuandaripenelitianinisebagaiberikut:

3

1. Menyediakan akses sistem informasi penjaringan data alumni yang lebih

multifungsional dan efisien untuk mendapatkan hasil statistik yang lebih

akurat.

2. Membuat fitur untuk melihat statistik hasil kuisioner yang nantinya dapat

dijadikan bahan acuan evaluasi.

I.4 Batasan Masalah

Melihat luasnya cakupan masalah yang berkaitan dengan perancangan sistem

layananalumni ini, maka perlu dilakukan pembatasan masalah agar penelitian

lebih terfokus pada tujuan yang diinginkan. Adapun batasan masalahnya

yaitu

1. Menyediakan akses sistem informasi penjaringan data alumni yang lebih

multifungsional dan efisien untuk mendapatkan hasil statistik yang lebih

akurat dan bisa menjadi bahan acuan evaluasi

2. Membuat fitur untuk melihat statistik hasil kuisioner yang nantinya dapat

diunduh dalam bentuk format pdf atau microsoft excel.

3. Aplikasi digunakan hanyalah untuk mengumpulkan umpan balik dari

alumni dengan model pertanyaan dinamis yang dapat disesuaikan oleh

admin dengan pendekatan data kuantitatif.

4

I.5 Sistematika Penulisan

Untukmempermudahpenulisan agar pembahasan yang

disajikanlebihsistematis, makalaporaninidibagidalam lima bab, isimasing-

masingbabdiuraikansecarasingkat di bawahini:

BAB I PENDAHULUAN

Bab ini menjelaskantentangalasanmengambil topic inisebagaiskripsi,

perumusanmasalah, tujuanpenelitian, batasanmasalah, metodepenelitian,

dansistematikapenulisan.

BAB II LANDASAN TEORI

Bab ini membahas tentang landasan teori yang diperoleh dari beberapa

literatur. Seperti pengertian framework, browser, javascript, bootstrap

(semua hal yang digunakan dalam pembuatan aplikasi), dan juga teori

mengenai pengujian aplikasi sebelum dilakukan implementasi.

BAB III METODOLOGI PENELITIAN

Dalambabiniakandibahasmengenaiperancanganaataualur diagram tentang

langkah awal perancangan dalam pembuatan perancangan aplikasi

dokumentasi sistem dengan menggunakan UML (Unfield Modelling

Language), dengan menggunakan beberapa buah diagram seperti Use

case diagram, activity diagram, dan sequence diagram. Di

siniakandibahasberbagaiaspek yang

5

perludipertimbangkandalampembuatanaplikasitersebut, dandijelaskan

pula strukturdantahapan proses aplikasi yang dibuat.

BAB IV HASIL DAN PEMBAHASAN

Bab iniberisicontoheksekusi program,

memberikanpenjelasansecararingkasbeserta teknik pengujian terhadap

sistem yang akan digunakan yang dalam hal ini adalah menggunakan

teknik blackbox.

BAB V PENUTUP

Berisi kesimpulan dari seluruh uraian skripsi serta saran-saran yang

diberikan dalam penggunaan aplikasi dan juga pengembangan sistem

informasi kedepannya.

6

BAB II

LANDASAN TEORI

II.1. Aplikasi Web

Aplikasi web adalah sebuah aplikasi yang dijalankan melalui browser

dengan mekanisme yang sudah ada pada sistem web. Pada awalnya, aplikasi web

hanya dibangun menggunakan bahasa HTML (Hyper Text Markup Lenguage)

dengan menggunakan protokol HTTP (HyperTextTransfer Protocol). Namun,

bahasa pemrograman lain mulai dikembangkan untuk mendukung kinerja HTML

seperti, PHP, CSS, Javascript ASP, ASP.NET. Sebagai implementasinya, aplikasi

web dikoneksikan dengan databasesebagai bahan penyajian data [3].

Sistem web dapat diartikan sebagai aplikasi yang memiliki karakteristik

sebagai berikut:

1. Modelclient-server

2. Menggunakan protokol HTTP dalam komunikasi antara client dan server

3. Mempunyai fungsi untuk mengambil atau menjalankan isi file dokumen

webserver dan menampilkannya di sisi client [3].

Konsep dasar dari aplikasi web cukup sederhana. Pertukaran informasi

antara komputer yang meminta informasi disebut client, dan yang memasukkan

informasi disebut webserver. Aplikasi berbasis web dijalankan sebagai script

semacam ASP atau PHP. Script tersebut akan memberikan informasi dalam

7

format HTML ke webserver untuk diteruskan ke browser sebagai permintaan

client[3].Arsitektur aolikasi web dapat diperlihatkan pada gambar berikut

Gambar 2.1Arsitektur aplikasi web[3]

Secara intenal web server berkomunikasi dengan middlewere kemudian

middlewere yang akan menghubungkan ke basis data. Contoh middlewere adalah

PHP dan ASP.

II.1.1 Web Server

Web Server merupakan sebuah perangkat lunak dalam server yang

berfungsi menerima permintaan (request) berupa halaman web melalui

HTTP atau HTTPS dari client kemudian mengirim kembali (response)

hasilnya dalam bentuk halaman-halaman web yang umumnya berbentuk

dokumen HTML [3].

Dengan kata lain, web server hanya menjadi penyedia layanan dari

permintaan client dan akan menampilkannya di browser. Misalnya client

minta untuk menampilkan list alumni, maka web server akan memanggil

8

database terkait melaui middlewere yang akan menghubungkan ke

database.

Beberapa web server yang biasa digunakan antara lain:

1. Apache Web Server

2. Internet Information Service, IIS

3. Xitami Web Server

4. Sun Java System Web Server.[3]

II.1.2 Web Browser

Web browser adalah aplikasi yang digunakan oleh client dalam

menjelajahi internet.Web browser akan mengirimkan request ke web server

dan menampilkan hasilnya ke client.

Semua halaman web mengandung instrusi-instruksi tentang

bagaimana web akan ditampilan dan browser akan membaca instruksi

tersebut. Instruksi paling umum berupa tag-tag HTML. Pada saat browser

membuka sebuah halaman misalnya http://cot.unhas.ac.id/pak , browser

akan memecah bagian server dari URLnya ke dalam alamat Protokol

Intenet mengunakan basis data distribusi yang dikenal dengan istilah

Domain Name System(DNS). DNS kemudian mencari nama URL tersebut

kemudian memberikan Ipnya. Browser kemudian meminta resource dengan

jalan mengirimkan HTTP request melalui komputer kepada alama IP

tersebut. Browser membuat request tersebut melalui port tertentu supaya

HTP request yang lain dapat tetap ditangani. Komputer yang menerima

http://cot.unhas.ac.id/pak

9

HTTP request akan mengirimkan request tersebut ke aplikasi webserver.

Jika web server dapat memenuhinya, web server akan mengirimkan HTTP

response kepada browser dan memberikan satus sukses. [4]

II.2. Server Side Scripting

Server side scripting merupakan sebuah teknologi pemrograman web

dimana program dikomplasi atau diterjemahkan di server. Dengan server side

scripting, memungkinkan untuk menghasilkan halaman web yang dinamis [4].

Beberapa contoh Server Side Scripting:

1. ASP dan ASP.NET

2. ColdFusion

3. Java Server Page

4. Perl

4. Phyton

5. PHP [4]

II.3. Bahasa Pemrograman

Bahasa pemrograman merupakan kumpulan aturan yang disusun

sedemikian rupa sehingga memungkinkan pengguna komputer membuat program

yang dapat dijalankan dengan aturan tersebut[5].

Pemrograman memberikan instruksi kepada komputer agar bekerja

seperti yang kita kehendaki. Komputer memahami pemrograman sebagai data dan

instruksi dalam bentuk biner (rangkaian bit-bit bernilai 0 atau 1). Sedangkan

manusia memahaminya sebagai logika, aritmetika, algoritma, konsep, model, dan

10

sebagainya. Untuk menjembatani dibuatlah bahasa pemrograman yang

menerjemahkan dari apa yang dikehendaki/dimengerti manusia menjadi instruksi

mesin komputer[6].

II.3.1 HypertText Markup Language (HTML)

HypertText Markup Language (HTML) adalah bahasa markup yang

umum digunakan untuk membuat halaman web. Sebenarnya HTML bukanlah

sebuah bahasa pemrograman. Apabila ditinjau dari namanya, HTML

merupakan bahasa markup atau penandaan terhadap sebuah dokumen teks.

Tanda tersebut digunakan untuk menentkan format ata style dari teks yang

ditandai.[7]

Beberapa hal yang bisa dilakukan dengan HTML adalah sebagai berikut:

Mengatur tampilan dari halaman web dan isinya.

Membuat tabel dalam halaman web.

Mempublikasikan halaman web secara online.

Membuat form yang bisa digunakan untuk menangani regisrasi dan transaksi

via web.

Menambahkan objek-objek seperti citra, audio, video animasi, java applet

dalam halaman web

Menampilkan area gambar (kanvas) di browser.

Model kerja HTML diawali dengan permintaan suatu halaman web

oleh pengguna.berdasarkan URL atau dikenal dengan sebutan alamat internet,

browser mendapatkan alamat dari webseer, mengidetifikasi halaman yang

11

dikehendaki, dan menyampaikan segala informasi yang dibutuhkan oleh web

server. Selanjutnya web server akan mencari berkas yang diminta dan

mengirim isiya ke browser kemudian mengaplikasikan ke layar client.

HTML terdiri dari beberapa bagian yang fungsinya sebagai penanda

suatu kelompok perintah tertentu, misalnya kelompok printah form yang

ditandai dengan kode <form>, judul dengan <title> dan sebagainya. Pada

dasarnya struktur file HTML diawali dengan sebuah tag <html> dan ditutup

dengan </html>. Di dalm tag ini terdapat dua buah bagian besar, yaitu yang

diapit oleh ta head dan body.

II.3.2 PHP

PHP adalah pemrograman interpreter yaitu proses penerjemahan baris

kode sumber menjadi kode mesin yang dimengerti komputer secara langsung

pada saat baris kode dijalankan. PHP disebut juga pemrograman server side

programming, hal ini dikarenakan seluruh prosesnya dijalankan pada server

[3].

Salah satu kelebihan dari PHP adalah mampu untuk berkomunikasi

dengan database. Dengan demikian, menampilkan data yang bersifat dinamis,

yangdiambil dari database, merupakan hal yang mudah untuk

diimplementasikan. Itulah sebabnya sering dikatakan bahwa PHP sangat cocok

untuk membangun halaman-halaman web dinamis. Beberapa kelebihan PHP

dibandingkan dengan bahasa pemrograman yang lain, yaitu :

12

1. Cara koneksi dan query database yang sederhana

2. Dapat bekerja pada sitem operasi berbasis Windows, Linux, Mac OS, dan

kebanyakan varian UNIX.

3. Biaya yang dibutuhkan untuk menggunakan PHP tidak mahal bahkan

gratis.

4. Mudah dibangun karena memiliki fitur dan fungsi khusus untuk membuat

web dinamis. Bahasa pemrograman PHP dirancang untuk dapat

dimasukkan dalam HTML (embedded script)

5. Security system yang cukup tinggi.

6. Waktu eksekusi yang lebih cepat dibandingkan dengan bahasa

pemrograman web lainnya yang berorientasi pada serverside scripting.

7. Akses ke sistem database yang lebih fleksibel dan mudah, seperti pada

MySQL.

II.3.3 JavaScript

JavaScript adalah sebuah bahasa pemograman yang bisa digunakan

untuk menambahkan interaktifitas pada halaman web. JavaScript disertakan

dalam halaman HTML. JavaScript diawali dan diakhikri dengan tag. JavaScript

adalah bahasa pemograman yang dijalankan di computer user, sehingga proses

tidak perlu dilakukan pada server[8].

II.3.4 jQuery

jQuery adalah library JavaScript yang memungkinkan untuk membuat

program web pada suatu halaman web, tanpa harus secara eksplisit

13

menambahkan event atau pun properti pada halaman web tersebut. Dengan

JQuery, suatuhalaman web yang menjadi aplikasi web, jika dilihat source-nya,

akan terlihat seperti dokumen HTML biasa, tidak ada kode JavaScript yang

terlihat langsung. teknik pemrograman web seperti ini disebut sebagai

unobstrusive JavaScript programming [8].

II.3.5 Bootstrap

Bootstrap adalah teknologi HTML dan CSS yang dapat membuat

layout halaman website, tabel, tombol, form, navigasi,dan komponen lainnya

dalam sebuah website hanya dengan memanggil fungsi CSS (class) dalam

berkas HTML yang telah didefinisikan. Selain itu juga terdapat komponen

lainnya yang dibangun menggunakan JavaScript. Jadi intinya, bootstrap

merupakan sebuah framework yang mempermudah developer dalam

mendesain tampilan website [8].

Bootstrap merupakan platform baru yang dikembangkan tim twitter.

Pertama kali muncul pada ajang hackweek dan kini sudah mulai

penyempurnaan. Platform ini hanya menggunakan sedikit coding CSS dan

JavaScript namun tetap bisa membuat website yang powerfull mengikuti

perkembangan browser. Website yang menggunakan bootstrap akan menjadi

website yang fleksibel, nyaman dan tentu saja cepat.Bootstrap juga

memudahkan pengaturan website bagi mereka yang kurang mahir coding atau

tidak punya waktu banyak. Sekumpulan javascript dan CSS yang dibutuhkan

untuk banyak sekali widget ada dalam satu file yang terus diupdate oleh

pengembang. Pemilik website tidak akan lagi disibukkan dengan pengaturan

14

css atau javascript berlebihan. Pengembang hanya perlu menentukan gadget

atau elemen apa yang ingin ditampilkan dalam bentuk HTML standart

bootstrap yang sangat simple. Misalkan dulu untuk menambahkan menu bar,

maka perlu untuk menyisipkan file CSS, HTML bahkan Java Script untuk

effect tertentu. Jika ingin menambahkan dropdown menu, maka per widget,

paling tidak harus menambahkan CSS dan HTML lagi. Belum lagi jika ingin

lebih menarik akan dibutuhkan javascript tambahan. Begitu seterusnya.,tapi

setelah instalasi bootstrap, cukup menambahkan kode HTML nya saja [9].

II.4. DataBase

Database adalah kumpulan data yang terintegrasi dan diatur sedemikian

rupa sehingga data tersebut dapat dimanipulasi, diambil, dan dicari secara cepat.

database sebagai kumpulan informasi yang bermanfaat yang diorganisasikan

Database merupakan suatu kumpulan dari data – data yang saling

berhubungan satu dengan yang lainnya, tersimpan di perangkat keras (hardware)

komputer dan digunakan perangkat lunak (software) untuk memanipulasinya.

Data disimpan dalam database untuk keperluan penyediaan informasi,

diorganisasikan untuk efisiensi kapasitas penyimpanan supaya informasi yang

dihasilkan berkualitas. Database diakses atau dimanipulasikan dengan

menggunakan paket software Database Manajemen System (DBMS)[7]

Dalam praktek, penggunaan istilah database lebih dibatasi pada arti

implisit yang khusus, yaitu :

a. Basis data merupakan penyajian suatu aspek dari dunia nyata.

15

b. Basis data merupakan kumpulan data dari berbagai sumber yang secara logika

mempunyai arti implisit , sehingga data yang terkumpul secara acak dan tanpa

mempunyai arti, tidak dapat disebut sebagai database.

c. Database perlu dirancang,dibangun, dan data dikumpulkan untuk suatu tujuan.

Database dapat digunakan oleh beberapa pemakai dan beberapa aplikasi yang

sesuai dengan kepentingan pemakai.

Dari batasan tersebut diatas, database mempunyai berbagai sumber data

dalam pengumpulan data,bervariasi derajat interaksi kejadian dari dunia nyata.

Dirancang dan dibangun agar dapat digunakan oleh beberapa pemakai untuk

berbagai kepentingan.

Penyusunan database bisa dilakukan secara sederhana dengan

menuliskan data-datanya, atau bisa juga dengan cara modern dengan

menggunakan teknologi komputer. Cara apapun yang digunakan , untuk

memudahkan penyusunan danpenampilan data, maka digunakan bentuk tabel.

Sebuah tabel terdiri dari baris dan kolom. Dalam dunia database, baris

didistilahkan sebagai Record atau Tupple dan kolom didistilahkan sebagai Field

atau Attribute.

Saat ini tersedia banyak perangkat lunak yang ditujukan untuk menglola

database. Perangkat lunak seperti itu biasa dinamakan DBMS (database

management system). Access, MS SQL Server, dan MySQL merupakan

beberapacontoh produk pengelola database. Beberapa diantaranya berkelas

16

databaseserver, yaitu jenis yang secara aktif memantau permintaan akses terhadap

data.Dalam hal ini, database server akan segera menanggapi permintaan data.

II.4.1 MySQL

MySQL merupakan software relational database management

system(RDBMS) atau database server yang dapat mengelola database dengan

sangat cepat, dapat menampung data dalam jumlah yang sangat besar, dapat

diakses oleh banyak user (multi-user), dan dapat melakukan suatu proses secara

sinkron atau bersamaan (multi-threaded) [7].

Lisensi MySQL terbagi menjadi dua, yaitu MySQL sebagai produk

opensource di bawah GNU General Public License (gratis) dan produk

komersial yangtentu memiliki nilai lebih atau kemampuan yang tidak

disertakan pada versi gratis. Pada kenyataannya, untuk keperluan industri

menengah ke bawah, produk opensource masih dapat digunakan dengan baik.

Open source menyatakan bahwa software ini dilengkapi dengan source code

(kode yang dipakai untuk membuatMySQL), selain tentu saja bentuk

executable-nya atau kode yang dapat dijalankansecara langsung dalam sistem

operasi, dan dapat diperoleh dengan cara mengunduh di Internet secara gratis

[7].

Pengaksesan data dalam database dapat dilakukan dengan mudah

melalui SQL (Structured Query Language). Data dalam database bisa diakses

melalui aplikasi non-web (misalnya dengan Visual Basic) maupun aplikasi web

misalnya dengan PHP [7].

17

II.4.2 Normalisasi

Normalisasiadalah suatu proses yang digunakan untuk

menentukanpengelompokan atribut-atribut dalam sebuah relasi sehingga

diperoleh relasi yangberstruktur baik. Dalam hal ini yang dimaksud dengan

relasi berstruktur baik adalahrelasi yang memenuhi dua kondisi berikut [10]

1. mengandung redudansi sesedikit mungkin, dan

2. memungkinkan baris-baris dalam relasi disisipkan, dimodifikasi, dan

dihapus tanpa menimbulkan kesalahan atau ketidakkonsistenan.

II.5. Definisi UML

Unified Modeling language (UML) adalah sebuah bahasa untuk

menentukan, visualisasi, kontruksi, dan mendokumentasi artifacts dari system

software,untuk memodelkan bisnis,dan system nonsoftware lainnya atau suatu

kumpulan teknik terbaik yang telah terbukti sukses dalam memodelkan sistem

yang besar dan kompleks[11]. Dengan menggunakan UML kita dapat membuat

model untuk semua jenis aplikasi piranti lunak,dimana aplikasi tersebut dapat

berjalan pada piranti keras,system operasi dan jaringan apapun,serta ditulis dalam

bahasa pemrograman apapun.

18

Tabel 2.1 Simbol-simbol UML pada beberapa jenis diagram

DIAGRAM SIMBOL KETERANGAN

Use Case

Diagram

Simbol aktor ini menjelaskan segala

sesuatu yang berinteraksi dengan

sistem, dapat berupa

manusia,perangkatkeras, perangkat

lunak, objek lain dalam sistem dan

entitas luar.

Simbol usecase ini menjelaskan proses

dan urutan kegiatan yang dilakukan

aktor dan sistem untuk mancapai suatu

tujuan tertentu.

Simbol batasan sistem, membatasi

beberapa sistem yang saling

berinteraksi dalam sebuah usecase

diagram.

Simbol navigasi, yang biasanya

menunjukkan sebuah usecase

diaktifkan oleh aktor.

19

Simbol navigasi dengan

stereotype“include” menunjukkan

bahwa usecase asal membutuhkan atau

memanggil atau menggunakan usecase

tujuan saat usecase asal diaktifkan.

Simbol navigasi dengan stereotype

“extend” menunjukkan bahwa usecase

asal bisa saja membutuhkan atau

memanggil atau menggunakan usecase

tujuan saat usecase asal diaktifkan.

Activity

Diagram

Simbol start untuk menyatakan awal

dari suatu proses.

Simbol stop untuk meyetakan akhir

dari suatu proses

Simbol decision digunakan untuk

menyatakan kondisi dari suatu proses.

Simbol action menyatakan aksi yang

dilakukan dalam suatu arsitektur

20

sistem.

Simbol navigasi yang menunjuk ke

arah action berikutnya.

Simbol yang menunjukkan bahwa

action berikutnya adalah action yang

dapat dikerjakan secara paralel.

Simbol yang menunjukkan bahwa

action berikutnya dapat dilaksanakan

saat semua action yang diperlukan

telah diselesaikan.

Deployment

Diagram

Simbol node yang menunjukkan suatu

wadah konseptual yang menampung

semua komponen yang ada pada

arsitektur sistem. Atau menunjukkan

sebuah device.

Simbol komponen yang ikut

berinteraksi.

21

Simbol stereotype menjelaskan

hubungan antar bagian-bagian yang

dihubungkan.

Relasi yang menunjukkan

ketergantungan antar komponen.

Relasi yang menjukkan aliran

komunikasi.

Sumber:Mastering UML with Rational Rose 2008 [11]

a. Use case diagram

Use case diagram menggambarkan fungsionalitas yang diharapkan

dari sebuah sistem.Yang ditekankan adalah “apa” yang diperbuat

system, dan bukan “bagaimana”. Sebuah use case merepresentasikan

sebuah interaksi antara actor dengan sistem. Use case merupakan

pekerjaan tertentu.Misalnya login ke sistem,meng-create sebuah

daftar,dan sebagainya. Seseorang/sebuah actor adalah sebuah entitas

manusia atau mesin yang berinteraksi dengan sistem untuk

melakukan pekerjaan-pekerjaan tertentu. Use case diagram dapat

sangat membantu bila kita sedang menyusun requirement sebuah

sistem, mengkomunikasikan rancangan dengan klien,dan merancang

22

test case untuk semua feature yang ada pada sistem, Seperti gambar

di bawah ini :

Gambar 2.2 Contoh Use Case Diagram[11]

b. Class diagram

Class adalah sebuah spesifikasi yang jika diinstansisasi akan

menghasilkan sebuah objek dan merupakan inti dari pengembangan

dan desain berorientasi objek.Class menggambarkan

keadaan(atribut/properti) suatu sistem,sekaligus menawarkan

layanan untuk memanipulasi keadaan tersebut (metode/fungsi).

Class diagram menggambarkan struktur dan deskripsi class,package

dan objek beserta hubungan atau satu sama lain seperti

containment,pewarisan,asosiasi,dan lain-lain.

Class memiliki tiga area pokok :

1. Nama (dan stereotype)

23

2. Atribut

3. Metoda

Gambar 2.5 Contoh Class diagram sederhana[11]

c. Activity diagram

Activity diagram menggambarkan berbagai alir aktivitas dalam

sistem yang sedang dirancang,bagaimana masing-masing alir

berawal,decision yang mungkin terjadi,dan bagaimana mereka

berakhir.Activity diagram juga dapatmenggambarkan proses parallel

yang mungkin menjadi pada beberapa eksekusi. Activity diagram

merupakan state diagram khusus,dimana sebagian besar stete adalah

action dan sebagian besar transisi di-tringger oleh selesainya state

sebelumnya(internal processing).Oleh karena itu,activity diagram

tidak menggambarkan behavior internal sebuah sistem (dan interaksi

antara subsistem) secara eksak, tetapi lebih

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

secara umum.

24

Gambar 2.6 Activity diagram [11]

d. Sequence diagram

Sequence diagram menggambarkan interaksi objek di dalam dan di

sekitar sistem (termasuk pengguna,display,dan sebagainya) berupa

message yang digambarkan terhadapa dengan waktu. Sequence

diagram terdiri atas dimensi vertical(waktu)dan dimensi

horizontal(objek-objek yang terkait).

Sequence diagram biasa digunakan untuk menggambarkan scenario

atau rangkaian langkah-langkah yang dilakukan sebagai respon dari

sebuah event untuk menghasilkan output tertentu. Diawali dari apa

yang men-trigger aktivitas tersebut,proses dan perubahan apa saja

yang terjadi secara internal dan output apa yang dihasilkan.

25

Gambar 2.7 Sequence diagram[11]

e. Tujuan UML

Menurut A. Suhendar dan Hariman Gunadi [11], Visual Modeling

menggunakan UML dan Rational Rose,menyebutkan bahwa tujuan

utama UML diantaranya untuk :

1. Memberikan model yang siap dipakai,bahasa pemodelan visual

yang ekspresif untuk mengembangkan dan saling menukar model

dengam mudah dan dimengerti secara umum.

2. Memberikan bahasa pemodelan yang bebas dari berbagai bahasa

pemrograman dan proses rekayasa.

3. Menyatukan praktek-praktek terbaik yang terdapat dalam

pemodelan.

II.6. Atom Editor

atom adalah Atom adalah editor teks yang modern, mudah didekati, namun

bisa di-hack ke inti-alat yang bisa Anda sesuaikan untuk melakukan apapun tetapi

26

juga menggunakan secara produktif tanpa pernah menyentuh file konfigurasi [14].

II.7. Google Chrome (Browser)

Google Chrome adalah sebuah peramban web sumber terbuka yang

dikembangkan oleh Google dengan menggunakan mesin rendering WebKit.

Proyek sumber terbukanya sendiri dinamakan Chromium. Versi beta untuk

Microsoft Windows diluncurkan pada 2 September 2008 dalam 43 bahasa. Versi

Mac OS X dan Linux sudah dirilis [15].

II.8. Black Box Testing

Black box testing berfokus pada persyaratan fungsional perangkat lunak.

Dengan demikian, pengujian black-box memungkinkan perekayasa perangkat

lunak mendapatkan serangkaian kondisi input yang sepenuhnya menggunakan

semua persyaratan fungsional untuk suatu program[10]. Pengujian black-box

bukan merupakan alternatif dari teknik white-box, tetapi merupakan pendekatan

komplementer yang kemungkinan besar mampu mengungkap kelas kesalahan

daripada metode white-box.

Pengujian black-box berusaha menemukan kesalahan dalam kategori

sebagai berikut :

1. Fungsi-fungsi yang tidak benar atau salah

2. Kesalahan interface

3. Kesalahan dalam struktur data atau database eksternal

4. Kesalahan kinerja

5. Instalisasi dan kesalahan terminasi

27

Black box testing mengasumsikan kode menjadi sebuah blackbox yang

merespon berbagai inputan. Pengujian berfokus pada output dari berbagai jenis

inputan. Pengujian ini juga berfokus pada tes validasi, batas masalah, tes kinerja,

dan pengujian yang berhubungan dengan keamanan.

Black box testing melibatkan pengujian interface untuk memastikan bahwa

kode tersebut memenuhi persyaratan fungsional dan berfungsi.

Beberapa alasan penggunaan pengujian blackbox pada penelitian ini adalah:

1. Lebih mudah dilakukan dibandingkan dengan metode pengujian

lainnya.

2. Pengujian terhadap sistem dapat dilakukan tanpa harus menelusuri

kedalam kode program.

3. Dengan mengamati output sistem berdasarkan input yang diberikan

dan requirement, mudah untuk mengetahui adanya kesalahan dan

kekeliruan pada suatu sistem.

4. Dengan berbagai input yang diberikan kepada sistem, mampu

memberikan sebuah simulasi kondisi kerja pada sistem ketika

beroperasi, sehingga secara tidak langsung dapat mengetahui

gambaran kinerja sistem ketika beroperasi.

5. Memiliki kemungkinan yang lebih besar dalam mengungkap

kesalahan dari pada metode white-box.

28

II.9. Code Igniter Framework

CodeIgniter adalah sebuah framework PHP yang dapat membantu

mempercepat developer dalam pengembangan aplikasi web berbasis PHP

dibanding jika menulis semua kode program dari awal [2].

Gambar 2.8 Logo CodeIgniter [2]

CodeIgniter pertama kali dibuat oleh Rick Ellis, CEO Ellislab, Inc, sebuah

perusahaan yang memproduksi CMS (Content Management System) yang cukup

handal, yaitu Expression Engine. Saat ini, CodeIgniter dikembangkan dan

dimaintain oleh Expression Engine Development Team. Adapun beberapa

keuntungan menggunakan CodeIgniter, diantaranya:

1) Gratis

CodeIgniter berlisensi dibawah Apache/BSD opensorce.

2) Ditulis Menggunakan PHP 4

Meskipun CodeIgniter dapat berjalan di PHP 5, namun sampai saat ini

kode program CodeIgniter masih dibuat dengan menggunakan PHP 4.

3) Berukuran Kecil

Ukuran CodeIgniter yang kecil merupakan keunggulan tersendiri.

Dibanding dengan framework lain yang berukuran besar.

29

4) Menggunakan Konsep MVC

CodeIgniter menggunakan konsep MVC yang memungkinkan pemisahan

layer application-logic dan presentation.

5) URL yang Sederhana

Secara default, URL yang dihasilkan CodeIgniter sangat bersih dan Serach

Engine Friendly (SEF).

6) Memiliki Paket Library yang Lengkap

CodeIgniter mempunyai library yang lengkap untuk mengerjakan operasi-

operasi yang umum dibutuhkan oleh sebuah aplikasi berbasis web,

misalnya mengakses database, mengirim email, memvalidasi form,

menangani session dan sebagainya. Extensible

7) Sistem dapat dikembangkan dengan mudah menggunakan plugin dan

helper, atau dengan menggunakan hooks.

8) Tidak Memerlukan Template Engine

Meskipun CodeIgniter dilengkapi dengan template parser sederhana yang

dapat digunakan, tetapi hal ini tidak mengharuskan kita untuk

menggunakannya.

9) Dokumentasi Lengkap dan Jelas

Dari sekian banyak framework, CodeIgniter adalah satu-satunya

framework dengan dokumentasi yang lengkap dan jelas.

10) Komunitas

Komunitas CodeIgniter saat ini berkembang pesat. Salah satu

komunitasnya bisa dilihat di (http://codeigniter.com/forum/). Proses aliran

30

data aplikasi pada sistem dapat diilustrasikan seperti terlihat pada gambar

dibawah ini

Gambar 2.9Application Flowchart[2]

Keterangan :

a) Index.php berfungsi sebagai front controller, menginisialisasi base resorce

untuk menjalankan CodeIgniter.

b) Router memerikasa HTTP request untuk menentukan apa yang harus

dilakukan dengannya.

c) Jika Cache aktif, maka hasilnya akan langsung dikirimkan ke browser

dengan mengabaikan aliran data normal.

d) Security. Sebelum Controller dimuat, HTTP request dan data yang

dikirimkan user akan difilter untuk keamanan.

e) Controller memuat model, core libraries, plugins, helpers dan semua

resource yang diperlukan untuk memproses request.

31

f) Akhirnya View yang dihasilkan akan dikirimkan ke browser. Jika Cache

aktif, maka View akan disimpan sebagai Cache dahulu, sehingga pada

request berikutnya langsung dapat ditampilkan.

32

BAB III

METODOLOGI PENELITIAN

Adapun tahap penelitian kami adalah merancanakan waktu penelitian,

pengumpulan data dan studi literatur, Analisis Sistem, tahapan kegiatan, diagram

uml aplikasi, Rancangan interface, Serta rencana kerja penelitian.

III.1. Waktu Dan Tempat Penelitian

Analisis dan perancangan aplikasi ini berlangsung sekitar 3 bulan, yaitu

mulai pada minggu pertama bulan Juli 2017 sampai dengan minggu keempat

bulan September 2017.

III.2. Metode Pengumpulan Data

Pengumpulan data adalah salah satu hal yang penting dilakukan dalam

memperoleh data yang diinginkan. Dengan adanya data yang diambil tersebut,

sangat membantu dalam menghasilkan informasi yang diinginkan. Pada

penelitian tugas akhir ini, penulis mengumpulkan data melalui :

a. Data Primer

Data primer yaitu data yang diperoleh atau dikumpulkan dari

instansi dalam hal ini adalah universitas hasanuddin. Pengumpulan data

primer ini menggunakan metode studi lapangan yaitu:

33

1. Wawancara

Yaitu pengumpulan data yang dilakukan dengan wawancara

langsung dengan pihak pengurusan alumni atau bagian

kemahasiswaan menggunakan interview langsung.

2. Observasi

Yaitu melakukan pengamatan secara langsung ke bagian

kemahasiswaan untuk memperoleh data – data mahasiswa yang

menjadi alumni seperti stambuk semasa kuliah, alamat ataupun data

apa saja yang menjadi inputan wajib ketika alumni melakukan

proses registrasi

b. Data Sekunder

Data sekunder yaitu data yang diperoleh atau dikumpulkan dari

sumber-sumber yang telah ada baik berasal dari artikel dan berbagai

sumber lain yang berhubungan dengan masalah yang penulis teliti.

Pengumpulan data sekunder ini menggunakan metode dokumentasi yaitu

pengumpulan data yang diperoleh dari sumber-sumber artikel yang

diperoleh dari internet dan mempelajari atau membaca pendapat para ahli

yang berhubungan dengan masalah yang diteliti untuk memperoleh

landasan teori yang dapat menujang penelitian serta dari catatan-catatan

yang telah ada sebelumnya. Sumber diperoleh dari data alumni, buku,

kuisiner yang berjalan atau hal penunjang lainnya dari bidang

kemahasiswaan atau sistem yang ada sebelumnya.

34

III.3. Analisis Sistem

Dalam proses perancangan ini, diperlukan model sistem client - server,

serta alat dan bahan yang dapat mendukung keberhasilan perancangan.

Model Sistem dimana dapat berjalan baik dengan Alat dan bahan

perancangan yang digunakan adalah :

A. Hardware, terdiri atas :

1. Laptop Asus A43S dengan spesifikasi :

a. Processor Intel Core i3

b. VGA Nvidia Geforce GT520M 1 GB

c. Harddisk500 GB

d. Memori RAM DDR3 2 GB

B. Software, terdiri atas :

a. ATOM Editor.

b. Code Igniter Framework.

c. Mozilla / Google Chrome (Browser).

C. Gambaran Model Sistem

Secara garis besar aplikasi akan memanfaatkan framework CodeIgniter.

Aplikasi akan di akses oleh alumni dan admin dengan menggunakan

akses internet yang ada. Alumni menginput data mereka beserta

kuisioner sedangkan admin melakukan penginputan pertanyaan, melihat

35

data alumni, dan melihat hasil kuisioner. Agar lebih jelasnya sistem

dapat digambarkan seperti berikut ini :

Gambar 3.1Gambaran Model Sistem

III.4. Metode Pengembangan Sistem

Dalam mengembangkan sistem informasi diperlukan suatu metode

pengembangan sistem. Metode ini akan menuntun kita melalui tahapan

pengembangan sistem yang lebih terorganisir agar sistem yang dikembangkan

sesuai dengan kebutuhan pengguna. Dalam penelitian tugas akhir ini metode

yang digunakan adalah metode sequential linear. Adapun tahap yang ada pada

metode sequential linear, sebagai berikut: analisa, desain, penulisan kode

program, pengujian.

36

Gambar 3.2Tahap-tahap pada metode Sequential Linear

Gambar diatas dapat di jelaskan seperti dibawah ini :

a. Analisa kebutuhan

Langkah ini merupakan analisa terhadap kebutuhan sistem. Untuk

mengetahui kebutuhan sistem yang akan dibangun dapat dilakukan dengan

pengumpulan data. Pengumpulan data dalam tahap ini menggunakan data

primer dengan teknik wawancara dan observasi dan data sekunder dengan

studi pustaka. Namun dalam hal ini penulis mengembangkan sistem yang

sudah ada sebelumnya sehingga meneruskan saja field – field yang

menjadi inputan untuk pengembangan sistem sehingga tidak begitu

memerlukan protocol interview namun lebih menjelaskan data apa saja

yang akan menjadi inputan untuk alumni saat melakukan register dan

pertanyaan dapat dibuat dinamis saat akan menggunakan aplikasi. Sumber

diperoleh dari data alumni, buku, kuisiner yang berjalan atau hal

Code TestAnalysis Design

37

penunjang lainnya dari bidang kemahasiswaan atau sistem yang ada

sebelumnya.

b. Desain sistem

Proses desain akan menerjemahkan syarat kebutuhan seperti data alumni,

alamat, kuisioner yang ada atau lebih tepatnya sistem yang ada

sebelumnya ke sebuah perancangan perangkat lunak yang dapat

diperkirakan sebelum dibuat pengkodean. Proses ini berfokus pada:

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

(algoritma) prosedural. Dalam mendesain ini disesuaikan dengan proses

sistem yang telah ada sebelumnya dari penelitian sebelumnya yakni tracer

study.

c. Penulisan kode program

Pengkodean merupakan penerjemahan desain dalam bahasa yang bisa

dikenali oleh komputer. Pada pengembangan sistem kali ini, proses

pengkodean dilakukan menggunakan bahasa pemrograman PHP,

CodeIgniter Framework dan menggunakan database Mysql. Coding dalam

hal ini adalah menulis barisan kode yang akan diterjemahkan oleh

computer menggunakan browser berdasarkan desain dari aplikasi berupa

aplikasi berbasis web dengan menggunakan bahasa pemrograman web

berbasis code igniter framework.

d. Pengujian Aplikasi

38

Setelah pengkodean selesai maka akan dilakukan pengujian terhadap

sistem yang telah dibuat tadi. Pengujian sistem dilakukan menggunakan

metode Black Box yaitu menguji fungsi setiap tombol yang kemudian akan

ditampilkan dalam tabel uji aplikasi pada bab IV. Pengujian bertujuan

untuk menemukan kesalahan-kesalahan terhadap sistem tersebut dan

kemudian diperbaiki. Pengujian fungsional sangat cocok untuk digunakan

dalam pengembangan aplikasi ini mengingat focus dari pengujian

blackbox adalah menguji fungsionalitas aplikasi apakah semua menu telah

berfungsi dan juga tombol – tombol yang dibuat telah berfungsi

sebagaimana mestinya.

III.5. Rancangan Struktural

III.5.1 Use Case Diagram

Gambar 3.3 Use-case diagram

Pada gambar di atas, use-case diagram menunjukkan bahwa pada

sistemaplikasi ini adaduaactor yang masing-masing memiliki hak akses, yaitu

39

User(Alumni), pengguna lulusan dan Admin (pihak dari kampus). Actor hanya

ada 3 dikarenakan alumni merupakan mahasiswa yang statusnya telah lulus dan

berhak mengakses atau mendaftar dalam web ini yang nantinya akan di verifikasi

oleh admin. Pengguna lulusan untuk melihat data alumni, serta actor admin dalam

hal ini yang akan melakukan penginputan pertanyaan atau kuisioner sehingga jika

ada akademisi atau actor lain yang ingin memberikan pertanyaan haruslah

diserahkan ke admin sehingga lebih mudah di monitoring dan terarah. Penjelasan

actor sebagai berikut:

1. User (Alumni)

Alumni dapat mengetahui dalam sistem ini melakukan proses register

dimana data yang di isikan antara lain berupa nama, nim, tahun masuk, tahun

lulus, ipk dan data lainnya yang dibutuhkan. Ketika sudah mendapatkan akses

login, alumni dapat melakukan proses pengisian kuisioner guna memberikan

informasi masukan mengenai kampus ataupun perihal lainnya sesuai dengan

kuisioner yang dibuat oleh admin.

2. Pengguna Lulusan

Pengguna lulusan berupa pihak BUMN, swasta, dan instansi yang ingin

melihat data lulusan (alumni) unhas yang dapat dikerjakan atau menjadi calon

pekerja di instansi mereka masing - masing.

3. Admin

Admin memiliki peran dalam melakukan proses verifikasi data alumni

yang mendaftar. Verifikasi dibutuhkan agar user yang mendaftar bukanlah user

abal – abal melainkan alumni dari UNHAS. Admin juga dapat menghapus serta

40

melihat data alumni, membuat pertanyaan survey serta melihat hasil statistic

data dari kuisioner.

III.5.2 Diagram Activity

Gambar 3.4Activity diagramUser / Alumni

Dalam activity diagram ini diperlihatkan aktivitas dalam sistem dimana user

alumni melakukan proses register terlebih dahulu, kemudian login dengan

username dan password yang di daftarkan serta step terakhir adalah dengan

mengisi tanggapan dari pertanyaan survey yang dibuat oleh admin. Selain dari itu

activity diatas juga memperlihatkan ketika pengguna lulusan ingin melihat alumni

unhas yang belum memiliki pekerjaan dapat mengakses menu alumni lulusan

sehingga dapat melihat alumni unhas yang dapat dijadikan sebagi calon pekerja.

41

Gambar 3.5Activity diagramAdmin

Dalam activity diagram ini diperlihatkan aktivitas dalam sistem dimana yang

memegang peranan penting adalah admin yang melakukan penginputan data

survey,verifikasi data, hingga melihat list anggota ataupun melihat report dari

survey.

42

III.5.3SequenceActivity

Gambar 3.6Sequence diagram Aplikasi

Dalam diagram ini akan memperlihatkan interaksi user yang dilakukan antara

admin dalam hal ini adalah adalah alumni, sistem dan juga user alumni. Dalam

diagram ini juga diperlihatkan interakasi antara web app dengan seluruh user baik

admin ataupun alumni. Model dalam data berupa verifikasi, survey, hingga hasil

data yang dilihat dari surve. Dalam hal ini juga memperlihatkan proses bagaimana

proses verifikasi dapat dilakukan oleh admin dengan melihat user alumni yang

terlebih dahulu telah mendaftar kedalam sistem. Dalam diagram juga memperlihat

bahwa user dapat melakukan pengisian data tanggapan ketika dari admin telah

melakukan soalnya untuk suirvey. Dan pengguna lulusan dapat melihat data

alumni dimana cukup mengakses menu alumni kemudian melihat secara

keseluruhan data alumni.

43

III.5.4Tabel Database

Gambar 3.7Tabel Database

Secara keseluruhan aplikasi dibangun menggunakan database yang terdiri dari

table antara lain , table berita, survey, user, pertanyaan, selesai, jawaban, pilihan.

Setiap table memiliki peran masing – masing seperti table user berfungsi untuk

menyimpan seluruh data dari user baik dari admin hingga user alumni. Table

berita berfungsi untuk menyimpan berita yang ingin disampaikan pada halaman

ketika user mengakses web. Table jawaban digunakan untuk menyimpan jawaban

yang ada dari user alumni ketika melakukan tanggapan kedalam survey. Table

survey digunakan untuk menyimpan data – data survey baik pertanyaan dan list

jawaban yang digunakan oleh survey. Dan berbagai table lainnya akan digunakan

sesuai dengan fungsinya masing – masing.

44

BAB IV

HASIL DAN PEMBAHASAN

IV.1 Gambaran Umum Sistem

Sistem aplikasi yang dibuat ini tersusun atas 2 (dua) user yang saling

berkomunikasi melalui aplikasi antara lain : user alumni dan user admin. User

alumni melakukan proses pendaftaran dengan mengisikan data – datanya seperti

username, password, nama, jurusan, nim, tahun masuk hingga tahun keluar yang

nantinya akan digunakan oleh admin untuk melakukan verifikasi dari

dashboardnya hingga user alumni dapat melakukan proses masuk. User alumni

tidak dapat masuk kedalam sistem jika data yang dimilikinya belum diverifikasi

oleh admin.

Gambar 4.1 halaman utama aplikasi web tracer alumni

45

Dashboard Alumni berisi data beberapa menu antara lain menu home untuk

masuk kedalam halaman awal dari user alumni. Menu lainnya adalah menu survey

dimana user dapat melakukan proses pengisian tanggapan yang nantinya akan

dilihat oleh admin untuk hasilnya akan dilihat dalam bentuk report data.

Gambar 4.2 Web App tracer Halaman User Admin

Halaman admin berisi menu list verifikasi, menu list anggota, list survey, list

atur berita, dan logout. Menu list verifikasi digunakan untuk admin untuk

melakukan proses verifikasi dari admin dengan mengecek data – data user alumni

yang ada dalam sistem saat melakukan proses register. Menu list anggota adalah

untuk melihat data – data anggota yang telah terverifikasi dimana pada halaman

ini user dapat melakukan proses update, delete data user, list survey digunakan

untuk melihat data survey baik dalam menambahkan ataupun menghapus survey

46

yang dibuat oleh admin. menu list berita digunakan untuk melihat seluruh berita,

membuat ataupun menghapus berita yang dibuat oleh admin. berita nantinya akan

ditampilkan pada halaman utama dari user.

IV.2Implementasi & Pembahasan Sistem

IV.2.1 Implementasi Halaman Login

Gambar 4.3Halaman Login Web Alumni Tracer

Interface ini digunakan untuk masuk kedalam web app alumni tracerdimana

user terlebih dahulu memasukkan username dan password. Interface ini di

terapkan dengan menggunakan bahasa pemrograman html dan php dengan

syntaks terlampir.

47

IV.2.2 Implementasi Halaman Verifikasi

Gambar 4.4Halaman Verifikasi Web Alumni Tracer

Interface ini digunakan untuk melakukan proses verifikasi bahkan menghapus

user yang melakukan proses pendaftaran abal – abal dan bukan dari alumni

unhas. Interface ini di terapkan dengan menggunakan bahasa pemrograman

html dan php dengan syntaks terlampir.

48

IV.2.3 Implementasi Halaman List Anggota

Gambar 4.5Halaman List Anggota

Interface ini digunakan untuk melihat siapa saja anggota jika sudah tidak aktif

dalam kegiatan ataupun data ada yang salah maka admin dapat melakukan

penghapusan data alumni melalui interface ini. Interface ini di terapkan

dengan menggunakan bahasa pemrograman html dan php dengan syntaks

terlampir.

49

IV.2.4 Implementasi Halaman List Survey

Gambar 4.6Halaman List Survey

Interface ini digunakan untuk melihat survey apa saja yang telah dibuat, baik

menambahkan survey data, bahkan menghapus survey yang telah dibuat.

Interface ini di terapkan dengan menggunakan bahasa pemrograman html dan

php dengan syntaks terlampir.

50

IV.2.5 Implementasi Halaman Berita

Gambar 4.7Halaman List Berita

Interface ini digunakan untuk melihat Berita apa saja yang telah dibuat, baik

menambahkan Berita data, bahkan menghapus Berita yang telah dibuat.

Interface ini di terapkan dengan menggunakan bahasa pemrograman html dan

php dengan syntaks terlampir.

51

IV.2.6 Implementasi Halaman Utama User Alumni

Gambar 4.8Halaman Utama User Alumni

Interface ini digunakan ketika user alumni pertama kali login kedalam sistem

setelah memasukkan username dan password yang benar. Interface ini di

terapkan dengan menggunakan bahasa pemrograman html dan php dengan

syntaks terlampir.

52

IV.2.7 Implementasi Halaman Utama Survey

Gambar 4.9Halaman Utama Survey

Interface ini digunakan ketika user alumni pertama melakukan proses

tanggapan ke survey yang nantinya akan diteruskan kepada admin . Interface

ini di terapkan dengan menggunakan bahasa pemrograman html dan php

dengan syntaks terlampir.

IV.3Pengujian Sistem

Pengujian sistem dilakukan dengan cara menguji fitur-fitur yang dimiliki oleh

aplikasi . Hasil pengujian diperlihatkan pada table dibawah ini :

No Test Factor Hasil Keterangan

1 Menampilkan halaman

Login

Berhasil menampilkan halaman login

dengan mengetik url dari web app

2 Setelah login masuk ke

halaman utama

Berhasil login dan user telah masuk ke

halaman utama web app

53

3 Menekan pilihan Menu

verifikasi

Berhasil menampilkan halaman verifikasi

user

4 Menekanpilihan Menu List

Anggota

Berhasil menampilkan halaman isi menu list

anggota

5 Menekanpilihan menu

survey

Berhasil menampilkan halaman isi menu isi

survey

6 Menekanpilihan menu

survey

Berhasil menampilkan halaman isi menu isi

survey

7 Menekanpilihan menu berita Berhasil menampilkan halaman isi menu

berita

8 Menekan Tombol Verifikasi

Di halaman list verifikasi

Berhasil menyimpan data user yang telah di

verifikasi

8 Menemkan Tombol Tambah

Berita

Berhasil menampilkan data berita di

halaman berita

9

Menekan Tombol Tambah

Survey Dihalaman menu

survey

Berhasil menyimpan kuisioner yang akan

ditanggapi oleh user.

10 Menyimpan tombol hapus

dihalaman survey

Berhasil menhapus survey yang ada di

halaman survey

11 Menekan Tombol Hasil di

halaman survey

Berhasil menampilkan hasil dari survey

yang ditanggapi

12 Menekan Tombol Verifikasi Berhasil menampilkan halaman untuk

54

dihalaman survey pengeditan survey

13 Menekan tombol hapus di

daftar pengguna

Berhasil menhapus daftar pengguna dalam

system

14 Menekan tombol hapus di

halaman verifikasi

Berhasil menhapus user yang akan

diverifikasi, tetap berjalan di jalur final

Tabel 5.1. Menampilkan hasil pengujian fungsional sistem

dari pengujian yang dilakukan diatas ketika user alumni ataupun admin ketika

mengakses web application diharuskan untuk login terlebih dahulu, kemudian

dilanjutkna dengan user alumni yang diwajibkan untuk melakukan register

terlebih dahulu yang nantinya akan diverifikaasi oleh admin. Dari hasil pengujian

diatas, hasil pengujian berhasil dilakukan dan hasil yang di dapatkan minimnya

akan kesalahan sehingga dapat dikatakan bahwa aplikasi ini berjalan dengan baik.

IV.4Pengujian Survey

Pengujian survey ini menggunakan beberapa pertanyaan survey yang nantinya

hasilnya akan ditampilkan dalam Grafik batang sesuai dengan pertanyaan yang dibuat

kedalam survey. Sebagai contoh kami menginputkan survey dalam menu List Pertanyaan

Kuisioner dengan judul survey “Transisi ke Dunia Kerja”. Kuisioner ini dibuat untuk

mengetahui respon dari alumni ketika selesai dalam bangku perkuliahan apakah sudah

mendapatkan pekerjaan ataukah masih belum mendapatkan pekerjaan setelah lulus dari

kampus. Dan beberapa pertanyaan lainnya untuk mengetahui alumni lulusan dalam hal

transisi dunia kerja

57

Gambar 4.10Halaman List Pertanyaan Survey

58

Dan adapun hasil dari jawaban survey berdasarkan list pertanyaan yang dibuat ini

akan ditanggapi oleh alumni dan akan disajikan dalam bentuk diagram batang

sebagai berikut :

60

Gambar 4.11Halaman jawaban Survey

Dalam hasil pengujian diatas dapat disimpulkan bahwa ketika alumni menjawab

pertanyaan dari kuisioner yang dibuat secara otomatis sistem akan mengkalkulasi

jawaban dari keseluruhan alumni yang selanjutnya akan ditampilkan dalam

diagram batang data, sehingga data yang ada dapat lebih mudah dipahami

berdasarkan jawaban – jawaban yang diberikan oleh alumni.

61

BAB V

PENUTUP

V.1 Kesimpulan

Berdasarkan hasil penelitian, maka dapat disimpulkan beberapa hal yaitu :

1. Dalam mengembangkan sistem online penjaringan umpan balik lulusan dan

pengguna lulusan berbasis frameworkbeberapa hal yang menjadi problem

adalah penyusunan ketika membuat pertanyaan ketika disatukan

menggunakan pilihan ganda ataupun essay perlu perhatian ekstra ketika akan

memberikan report dalam form pertanyaan

2. fitur yang menampilkan profil lulusan dan hasil analisa kuisioner dalam

bentuk grafik kedalam sistem online penjaringan ini dapat ditampilkan

dengan baik jika penggunaan form berupa model pertanyaan pilihan ganda

3. Hasil pengujian fungsional dari aplikasi web tracer alumni berjalan dengan

baik dan minim akan kesalahan.

4. Sistem memberikan informasi Hasil survey yang ditanggapi oleh alumni dan

direkap serta dilihat oleh admin sehingga memberikan informasi lebih

mendalam dari aalumni untuk kampus Universitas Hasanuddin Makassar.

5. Alumni dapat masuk kedalam sistem setelah terlebih dahulu melakukan

proses register dan diverifikasi oleh admin.

62

V.I1 Saran

Berdasarkan hasil penelitian, maka memberikan saran pengembangan

sistem kedepannya yaitu :

Dalam mengembangkan sistem online penjaringan umpan balik lulusan

dan pengguna lulusan berbasis frameworkini dapat dikembangkan dalam

aplikasi android atau aplikasi mobile sehingga user dapat mengaksesnya

secara khusus melalui smartphone

63

Daftar Pustaka

[1] Nazruddin. 2011. Android Pemrograman mobile smart phone & Tablet PC.

Bandung : Informatika.

[2] Hakim, Lukmanul., 2010, Membangun Web Berbasis PHP dengan

Framework CodeIgniter.Yogyakarta : Lokomedia.

[3] Hidayatullah, Priyanto dan Khairul, Jauhari.2014. Pemrograman Web. Penerbit Informatika. Bandung.

[4] Astamal, Rio. 2008. Dasar-dasar Web Programming, [e-book], diakses tanggal 15 Juli 2017, dari <http://lug.stikom.edu/wp-content/uploads/ebook/dasar2-web-programming-1.0.pdf>.

[5] Utami, Ema dan Sukrisno. 2005. 10 Langkah Belajar Logika dan AlgoritmaMenggunakan Bahasa C dan C++ di GNU/Linux. Yogyakarta : AndiYogyakarta

[6] Sismoro, Heri dan Iskandar, Kusrini. 2004. Struktur Data dan Pemrogramandengan Pascal. Yogyakarta : Andi Yogyakarta

[7] Kadir, Abdul. 2009. Dasar Perancangan & Implementasi Database Relational.Penerbit Andi. Yogyakarta.

[8] Bedsepti, Peggy. 2014, Pengantar Teknologi Informasi, Penerapan

Bootsrap, stain batu sangkar

[9] HM, Jogiyanto. 1993. Analisis dan Desain Sistem Informasi PendekatanTerstruktur. Andi Offset Yogyakarta

[10] Pressman, Roger S. 2012. Rekayasa Perangkat Lunak Buku 1, Edisi 7. Penerbit Andi Yogyakarta

[11] Suhendar A & Gunadi Hariman. 2008.Mastering UML with rational

Rose.Jakarta: Informatika.

[12] Ahmad Miswar & Fachmi Rahayu. 2016. Perancangan Sistem Database

Dan Tracer Study Alumni. Makassar : Fakultas Teknik Universitas

Hasanuddin.

[13] Website Alumni Fakultas Teknik. Diakses tanggal 15 Agustus 2017, dari

(http://eng.unhas.ac.id/iatif/).

[14] Atom Editor. Diakses tanggal 20 Agustus 2017, dari (https://atom.io/).

http://eng.unhas.ac.id/iatif/

https://atom.io/

64

[15] Google Chrome Browser. Diakses tanggal 20 Agustus 2017, dari

(https://www.google.com/intl/id/chrome/browser/features.html).

65

LAMPIRAN

66

1. Implementasi Halaman Login

<html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Ikatan Alumni Teknik Informatika</title>  <link href="<?php echo base_url(); ?>assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url(); ?>assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url(); ?>assets/css/core.min.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url(); ?>assets/css/components.min.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url(); ?>assets/css/colors.min.css" rel="stylesheet" type="text/css">   <script type="<?php echo base_url(); ?>text/javascript" src="assets/js/plugins/loaders/pace.min.js"></script> <script type="<?php echo base_url(); ?>text/javascript" src="assets/js/core/libraries/jquery.min.js"></script> <script type="<?php echo base_url(); ?>text/javascript" src="assets/js/core/libraries/bootstrap.min.js"></script> <script type="<?php echo base_url(); ?>text/javascript" src="assets/js/plugins/loaders/blockui.min.js"></script>   <script type="text/javascript" src="assets/js/core/app.js"></script>  </head> <body>  <div class="page-container login-container">  <div class="page-content">  <div class="content-wrapper">  <div class="content">  <form action="<?php echo base_url(); ?>index.php/login/validate_credentials" method="post"> <div class="panel panel-body login-form">

67

<div class="text-center"> <div class="icon-object border-slate-300 text-slate-300"></div> <h5 class="content-group">Login to your account <small class="display-block">Masukkan Username dan Password anda </small></h5> </div> <?php if($salah) { echo "Password atau Username Anda Salah"; }?><br> <div class="form-group has-feedback has-feedback-left"> <input type="text" class="form-control" name="username" placeholder="Username"> <div class="form-control-feedback"> <i class="icon-user text-muted"></i> </div> </div> <div class="form-group has-feedback has-feedback-left"> <input type="password" class="form-control" name="password" placeholder="Password"> <div class="form-control-feedback"> <i class="icon-lock2 text-muted"></i> </div> </div> <div class="form-group"> <button type="submit" class="btn btn-primary btn-block">Masuk </button> </div> <div class="text-center"> <a href="<?php echo base_url(); ?>index.php/login/daftar">Daftar</a> </div> </div> </form>   <div class="footer text-muted"> © 2017. </div>  </div>  </div>  </div>  </div>  </body> </html>

68

2. Implementasi Halaman Verifikasi

<?php // echo var_dump ($terserah); // echo itu cetak, var_dump itu dumping nilai dalam variable, $terserah itu variable dari controller; ?> <div> <div class="col-md-2"></div> <div class="col-md-8 panel panel-flat"> <div class="panel-heading"> <h5 class="panel-title">Daftar Pendaftar Yang Belum Diverifikasi</h5> </div> <table class="table table-bordered datatable-pagination"> <thead> <tr> <th>Nama</th> <th>Email</th> <th>NIM</th> <th>Username</th> <th>Jenis Kelamin</th> <th>Tahun Masuk</th> <th>Tahun Tamat</th> <th>Action</> </tr> </thead> <tbody> <?php foreach ($ver_list as $item) { ?> <tr> <td><?php echo $item['nama']; ?></td> <td><?php echo $item['email']; ?></td> <td><?php echo $item['NIM']; ?></td> <td><?php echo $item['username']; ?></td> <td><?php echo $item['jenis_kelamin']; ?></td> <td><?php echo $item['tahun_masuk']; ?></td> <td><?php echo $item['tahun_lulus']; ?></td> <td><a href="<?php echo base_url();?>index.php/admin/verifikasi/<?php echo $item['id_user']; ?>">Verifikasi</a><br> <a href="<?php echo base_url();?>index.php/admin/delete/<?php echo $item['id_user']; ?>">Delete</a></td> </tr> <?php } ?> </tbody>

69

</table> </div> </div>

3. Implementasi Halaman List Anggota

<?php // echo var_dump ($terserah); // echo itu cetak, var_dump itu dumping nilai dalam variable, $terserah itu variable dari controller; ?> <div> <div class="col-md-2"></div> <div class="col-md-8 panel panel-flat"> <div class="panel-heading"> <h5 class="panel-title">Daftar Pengguna</h5> </div> <table class="table table-bordered table-striped table-hover"> <thead> <tr> <th>Nama</th> <th>Email</th> <th>NIM</th> <th>Username</th> <th>Jenis Kelamin</th> <th>Tahun Masuk</th> <th>Tahun Tamat</th> <th>Action</> </tr> </thead> <tbody> <?php foreach ($ver_list as $item) { ?> <tr> <td><?php echo $item['nama']; ?></td> <td><?php echo $item['email']; ?></td> <td><?php echo $item['NIM']; ?></td> <td><?php echo $item['username']; ?></td> <td><?php echo $item['jenis_kelamin']; ?></td> <td><?php echo $item['tahun_masuk']; ?></td> <td><?php echo $item['tahun_lulus']; ?></td>

70

<td><a href="<?php echo base_url();?>index.php/admin/delete/<?php echo $item['id_user']; ?>">Delete</a></td> </tr> <?php } ?> </tbody> </table> </div> </div>

4. Implementasi Halaman List Survey

<body> <div id="wrapper"> <div id="wrapper-content">  <div class=" container panel panel-flat bg-coal"> <div class="panel-heading"> <h6 class="panel-title">Survey</h6> </div> <div class="panel-body"> <?php foreach ($survey_list as $item) { ?> <div class="col-lg-6"> <ul class="media-list content-group"> <li class="media stack-media-on-mobile"> <div class="media-left"> <div class="thumb"> </div> </div> <div class="media-body"> <h6 class="media-heading"><?php echo $item['Judul'];?></h6> <ul class="list-inline list-inline-separate mb-5"> <li>Dibuat pada <?php echo $item['timestamp'];?></li> </ul> <p><?php echo $item['tentang'];?></p><br> <a href="<?php echo base_url();?>index.php/admin/soal/<?php echo $item["id_survey"];?>">List Soal</a> <a href="<?php echo base_url();?>index.php/admin/edit_survey/<?php echo $item["id_survey"];?>">Edit Survey</a> <a href="<?php echo base_url();?>index.php/admin/hasil_survey/<?php echo $item['id_survey']; ?>">Hasil</a>

71

<a href="<?php echo base_url();?>index.php/admin/delete_survey/<?php echo $item['id_survey']; ?>">Delete</a> </div> </li> </div> <?php } ?>  </div> <div><a href="<?php echo base_url();?>/index.php/admin/add_survey/">Tambah survey</a></div> </div>  </div></div>

5. Implementasi Halaman Berita

<body> <div id="wrapper"> <div id="wrapper-content">  <div class=" container panel panel-flat bg-coal"> <div class="panel-body"> <?php foreach ($berita_list as $item) { ?> <div class="col-lg-6"> <ul class="media-list content-group"> <li class="media stack-media-on-mobile"> <div class="media-left"> <div class="thumb"> <a href="#"> <img src="assets/images/placeholder.jpg" class="img-responsive img-rounded media-preview" alt=""> <span class="zoom-image"><i class="icon-play3"></i></span> </a> </div> </div> <div class="media-body"> <h6 class="media-heading"><a href="<?php echo base_url();?>index.php/admin/lihat_berita/<?php echo $item["id_berita"];?>"><?php echo $item['judul'];?></a></h6>

72

<ul class="list-inline list-inline-separate mb-5"> <li>Dibuat pada <?php echo $item['timestamp'];?></li> </ul> <p><?php echo $item['tentang'];?></p> </div> </li> </div> <?php } ?>  </div> <div><a href="<?php echo base_url();?>/index.php/admin/add_berita/">Tambah Berita</a></div> </div>  </div> </div>

6. Implementasi Halaman Utama User Alumni

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Ikatan Alumni Teknik Informatika</title>   <link href="<?php echo base_url();?>assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url();?>assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url();?>assets/css/core.min.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url();?>assets/css/components.min.css" rel="stylesheet" type="text/css"> <link href="<?php echo base_url();?>assets/css/colors.min.css" rel="stylesheet" type="text/css">

73

 <link href="vendor/prettyphoto/css/prettyPhoto.css" rel="stylesheet" type="text/css"> <link href="vendor/owl-carousel/css/owl.carousel.css" rel="stylesheet" type="text/css"> <link href="vendor/owl-carousel/css/owl.theme.css" rel="stylesheet" type="text/css">  <link rel="stylesheet" type="text/css" href="css/extralayers.css" media="screen" /> <link rel="stylesheet" type="text/css" href="vendor/revslider/css/settings.css" media="screen" />   <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/loaders/pace.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/core/libraries/jquery.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/core/libraries/bootstrap.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/loaders/blockui.min.js"></script>   <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/visualization/d3/d3.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/visualization/d3/d3_tooltip.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/forms/styling/switchery.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/forms/styling/uniform.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/forms/selects/bootstrap_multiselect.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/ui/moment/moment.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/daterangepicker.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/core/libraries/jquery_ui/datepicker.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/core/libraries/jquery_ui/effects.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/notifications/jgrowl.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/ui/moment/moment.min.js"></script>

74

<script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/daterangepicker.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/anytime.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/pickadate/picker.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/pickadate/picker.date.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/pickadate/picker.time.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/pickers/pickadate/legacy.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/pages/picker_date.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/core/app.js"></script>   <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/tables/datatables/datatables.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/plugins/forms/selects/select2.min.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/core/app.js"></script> <script type="text/javascript" src="<?php echo base_url();?>assets/js/pages/datatables_basic.js"></script>  </head> <body>  <div class="navbar navbar-inverse"> <div class="navbar-header"> <a class="navbar-brand" href="<?php echo base_url();?>index.php/home"><span>HOME</span></a> <ul class="nav navbar-nav visible-xs-block"> <li><a data-toggle="collapse" data-target="#navbar-mobile"><i class="icon-tree5"></i></a></li> <li><a class="sidebar-mobile-main-toggle"><i class="icon-paragraph-justify3"></i></a></li> </ul> </div> <div class="navbar-collapse collapse" id="navbar-mobile"> <ul class="nav navbar-nav navbar-right">

75

<li><a href="<?php echo base_url();?>index.php/home/berita"><span>Berita</span></a></li> <?php if(!$this->session->userdata('userlevel')) { ?> <li><a href="<?php echo base_url();?>index.php/login"><span>Login</span></a></li> <li><a href="<?php echo base_url();?>index.php/login/daftar"><span>Daftar</span></a></li> <?php } if($this->session->userdata('userlevel')==1) { ?> <li><a href="<?php echo base_url();?>index.php/survey"><span>Survey</span></a></li> <li><a href="<?php echo base_url();?>index.php/login/logout"><span>Logout</span></a></li> <?php } if($this->session->userdata('userlevel')==9) { ?> <li><a href="<?php echo base_url();?>index.php/admin"><span>List Verifikasi</span></a></li> <li><a href="<?php echo base_url();?>index.php/admin/list_anggota"><span>List Anggota</span></a></li> <li><a href="<?php echo base_url();?>index.php/admin/berita"><span>Atur Berita</span></a></li> <li><a href="<?php echo base_url();?>index.php/login/logout"><span>Logout</span></a></li> <?php } ?> </ul> </div> </div>  <div class="page-container bg-teal-400"> <div class="page-content"> <div class="content-wrapper"> <div class="content">

7 Implementasi Halaman Utama Survey

<div class="col-md-2"></div>

76

<form action="#" method="post" class="col-md-8"> <?php for ($i=0; $i<$jumlah; $i++) { echo ($i+1)." ".$pertanyaan[$i]['pertanyaan']; ?><br> <?php if ($pertanyaan[$i]['jenis']==1) { ?> <?php foreach ($pertanyaan[$i]['jawaban'] as $jawaban) { ?> <input type="radio" name="jawaban[<?php echo $i; ?>]" value="<?php echo $jawaban['Isi']; ?>"><?php echo $jawaban['Isi']; ?><br> <?php } ?><br> <?php } ?> <?php if ($pertanyaan[$i]['jenis']==0) { ?> <input type="text" class="form-control" name="jawaban[<?php echo $i; ?>]" maxlength="255"> <br> <?php } ?> <?php } ?> <button type="submit" value="Submit">Submit</button> </form>

pengembangan sistem online penjaringan...

Documents