LAPORAN KERJA PRAKTEK

SISTEM APLIKASI TRACER ALUMNI UNIVERSITAS JANABADRA

FAKULTAS TEKNIK BERBASIS WEBSITE

Disusun Oleh :
DWI MARIYA

11330056

JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK
UNIVERSITAS JANABADRA
YOGYAKARTA
2016

HALAMAN PENGESAHAN
LAPORAN KERJA PRAKTEK

SISTEM APLIKASI TRACER ALUMNI UNIVERSITAS JANABADRA

FAKULTAS TEKNIK BERBASIS WEBSITE

Disusun Oleh :
DWI MARIYA
1 1330056

Telah Diperiksa dan Disetujui Oleh :

Dosen Pembimbing

Ketua Jurusan
Teknik Informatika UJB

(Yumarlin MZ., S.Kom., M.Pd

(Jemmy Edwin B., S.Kom., M.Eng)

KATA PENGANTAR

Puji syukur senantiasa kita panjatkan kehadirat Tuhan Yang Maha Esa.
Karena dengan rahmat dan karunia-Nya, penulis dapat menyelesaikan laporan
kerja praktek yang berjudul SISTEM APLIKASI TRACER ALUMNI
UNIVERSITAS JANABADRA FAKULTAS TEKNIK sebagai salah satu
syarat untuk memperoleh gelar Sarjana S-1 pada Program Studi Teknik Jurusan
Teknik Informatika Universitas Janabadra di Yogyakarta.
Dalam proses penyelesaian laporan ini tidak terlepas dari bantuan, dukungan
berbagai pihak, baik memberikan dukungan secara langsung maupun tidak
langsung. Oleh karena itu pada kesempatan ini, penulis menyampaikan ucapan
terimakasih kepada yang terhormat :
1. Bapak Dr., Ir., H. Suharjanto, MSCE selaku Rektor Universitas Janabadra
Yogyakarta.
2. Bapak Risdiyanto, S.T., M.T. selaku Dekan Fakultas Teknik Universitas
Janabadra Yogyakarta.
3. Bapak Jemmy Edwin Bororing, S.Kom., M.Eng selaku Ketua Jurusan
Teknik Informatika Universitas Janabadra.
4. Ibu Yumarlin MZ, S.Kom., M.Pd selaku dosen pembimbing yang telah
membimbing dari awal hingga akhir serta memberi motivasi sehingga kerja
praktek ini dapat terselesaikan.
5. Seluruh Dosen Jurusan Teknik Informatika, Staf dan Karyawan
Fakultas Teknik Universitas Janabadra Yogyakarta.

6. Bapak, ibu, kakak, serta saudara-saudara di Semarang yang tak hentihentinya memberikan doa dan semangat.
7. Bapak dan ibu Wagio selaku pemilik kos, yang selalu memperhatikan.
8. Sahabat-sahabat terbaik, Taufik Hidayatullah dan Jhacko F Soukotta yang
telah banyak membantu dan memberi masukan dalam menyelesaikan
program.
9. Sahabat-sahabat terbaik Septiana Mundianarti, Widiastuti, Sri Suyatmi, Hery
Irfansyah, Olbers Lethfar, Gerfas Embele dan Ishak Da Costa yang telah
banyak membantu, memberi masukan dan tak hentinya memberikan
semangat.
10. Sahabat kost Wagios Nurul Fathya, Since Turalely, Ria Utami, Kiki, Chiva,
Tyas dan Laura Sitinjak yang telah memberikan semangat dan dukungan.
11. Kekasih hati yang telah memberikan dukungan dan semangat.
12. Peliharaan kesayangan Jeje yang selalu menghibur.
13. Kawan-kawan Fakultas Teknik Informatika Universitas Janabadra
yang tidak dapat penulis sebutkan secara satu persatu yang telah banyak
memberikan

dukungan

moril,

semangat

sehingga

penulis

dapat

menyelesaikan laporan ini.

Penulis menyadari walaupun telah berusaha dengan segenap kemampuan,

namun laporan kerja praktek ini masih jauh dari kesempurnaan. Oleh karena itu,
segala kritik dan saran yang bersifat membantu dan membangun, penulis terima
dengan tangan terbuka.

Akhir kata penulis berharap semoga laporan kerja praktek ini dapat
bermanfaat bagi penulis sendiri, rekan-rekan mahasiswa dan pembaca lainnya.

Yogyakarta, 24 Maret 2016

Penulis

DAFTAR ISI

.........................
HALAMAN JUDUL ......................................................................................... i
HALAMAN PENGESAHAN .......................................................................... ii
KATA PENGANTAR ...................................................................................... iii
DAFTAR ISI .................................................................................................... vi
DAFTAR TABEL ............................................................................................ xi
DAFTAR GAMBAR ....................................................................................... xii
BAB I

PENDAHULUAN ........................................................................... 1
1.1
1.2
1.3
1.4
1.5
1.6

BAB II

Latar Belakang ..........................................................................

Rumusan Kerja Praktek .............................................................
Batasan Masalah ........................................................................
Tujuan Penelitian........................................................................
Manfaat Penelitian.......................................................................
Sistematika Penulisan..................................................................

1
2
2
3
3
3

GAMBARAN UMUM UKM DAN LANDASAN TEORI............ 5

2.1 Gambaran Umum........................................................................ 5
2.1.1 Profil Universitas Janabadra............................................... 5
2.1.2 Sejarah Fakultas Teknik Universitas Janabadra................. 6
2.1.3 Program dan Tujuan Pendidikan........................................ 8
2.1.3.1 Program Pendidikan.................................................. 8
2.1.3.2 Visi, Misi dan Tujuan Fakultas.................................. 8

2.2 Landasan Teori............................................................................. 10

2.2.1 Sistem Informasi................................................................ 10
2.2.2 Konsep Dasar Informasi.................................................... 11
2.2.3 Konsep Dasar Sistem Informasi........................................ 12
6

2.2.4 Basis Data (Database)....................................................... 13

2.2.5 Data Flow Diagram (DFD)................................................ 15
2.2.6 Relasi Tabel....................................................................... 16
2.2.7 PHP (Hypertext Processor)............................................... 18
2.2.8 MySql................................................................................ 19
2.2.9 Sejarah MySql................................................................... 20
2.2.10 CSS (Cascading Style Sheet)........................................... 22
2.2.11 Javascript.......................................................................... 23
2.2.12 Apache.............................................................................. 23
2.2.13 Xampp.............................................................................. 24
BAB III ANALISIS DAN PERANCANGAN................................................ 25
3.1 Analisis Sistem............................................................................ 25
3.1.1 Perangkat Lunak (Software............................................... 25
3.1.2 Perangkat Keras (Hardware)............................................. 25
3.2 Model Sistem Aplikasi Tracer Alumni Fakultas Teknik Universitas
Janabadra............................................................................................ 27
3.2.1 Diagram Context................................................................ 27
3.2.2 Data Flow Diagram (DFD)................................................ 28
3.2.2.1 DFD Level 1........................................................... 29
3.2.2.2 DFD Proses Login.................................................. 30
3.2.2.3 DFD Level 2 Proses 2............................................ 32
3.2.2.4 DFD Level 2 Proses 3............................................33
3.2.2.5 DFD Level 2 Proses 4............................................34
3.2.3 Struktur Tabel.....................................................................35
3.2.3.1 Tabel Admin...........................................................36
3.2.3.2 Tabel Profil.............................................................37
3.2.3.3 Tabel Agenda..........................................................38
3.2.3.4 Tabel Berita............................................................40
3.2.3.5 Tabel Kategori........................................................42
3.2.3.6 Tabel Galeri............................................................43
3.2.3.7 Tabel Album...........................................................44
3.2.3.8 Tabel Hubungi........................................................45
3.2.3.9 Tabel Anggota........................................................47
3.2.4 Relasi Tabel........................................................................49
3.3 Perancangan Menu......................................................................50
3.3.1 Perancangan Menu User.....................................................51
3.3.2 Perancangan Menu Admin.................................................52
3.4 Perancangan Antarmuka..............................................................53
3.4.1 Perancangan Antarmuka User..........................................53
3.4.1.1 Rancangan Tapilan Beranda...............................53
3.4.1.2 Rancangan Tampilan Galeri Foto......................54
3.4.1.3 Rancangan Tampilan Hubungi Kami..................55
3.4.1.4 Rancangan Tampilan Daftar Anggota.................57
3.4.1.5 Rancangan Tampilan Login.................................59
3.4.1.6 Rancangan Tampilan Kuisioner.......................... 60

3.4.1.7 Rancangan Tampilan Beranda Anggota.............. 65

3.4.1.8 Rancangan Tampilan Profil................................66
3.4.1.9 Rancangan Tampilan Agenda.............................68
3.4.1.10 Rancangan Tampilan Berita...............................68
3.4.1.11 Rancangan Tampilan Galeri Foto......................70
3.4.1.12 Rancangan Tampilan Hubungi Kami.................71
3.4.1.13 Rancangan Tampilan Anggota...........................72
3.4.2 Perancangan Antarmuka Admin.......................................73
3.4.2.1 Rancangan Tampilan Login Admin.....................73
3.4.2.2 Rancangan Tampilan Beranda Admin................74
3.4.2.3 Rancangan Tampilan Setting Web......................76
3.4.2.4 Rancangan Tampilan Setting Menu....................77
3.4.2.5 Rancangan Tampilan Manajemen Berita............78
3.4.2.6 Rancangan Tampilan Hubungi Kami..................80
3.4.2.7 Rancangan Tampilan Interaksi............................80
3.4.2.8 Rancangan Tampilan Media...............................81
3.4.2.9 Rancangan Tampilan Banner..............................83
BAB IV IMPLEMENTASI.............................................................................84
4.1 Implementasi Program.................................................................84
4.1.1 Halaman Beranda............................................................84
4.1.2 Halaman Galeri................................................................86
4.1.3 Halaman Hubungi Kami..................................................86
4.1.4 Halaman Daftar Anggota.................................................87
4.1.5 Halaman Login Anggota..................................................87
4.1.6 Halaman Kuisioner..........................................................88
4.1.7 Halaman Beranda Anggota..............................................90
4.1.8 Halaman Profil.................................................................91
4.1.9 Halaman Agenda.............................................................91
4.1.10 Halaman Berita...............................................................92
4.1.11 Halaman Galeri Foto.......................................................92
4.1.12 Halaman Hubungi Kami..................................................93
4.1.13 Halaman Anggota............................................................94
4.2.1 Halaman Login Admin......................................................95
4.2.2 Halaman Beranda Admin..................................................96
4.2.3 Halaman Seting Web.........................................................97
4.2.4 Halaman Setting Menu......................................................99
4.2.5 Halaman Manajemen Berita..............................................99
4.2.6 Halaman Hubungi Kami....................................................101
4.2.7 Halaman Interaksi..............................................................101
4.2.8 Halaman Media.................................................................102
4.2.9 Halaman Banner................................................................103
4.2.10 Halaman Lihat Web.........................................................104
BAB V KESIMPULAN DAN SARAN...........................................................105
5.1 Kesimpulan....................................................................................105

5.2 Saran..............................................................................................105
DAFTAR PUSTAKA.........................................................................................107
LAMPIRAN
DAFTAR TABEL

Tabel 1

Tabel Admin..................................................................................... 35

Tabel.2

Tabel Profil....................................................................................... 37

Tabel 3

Tabel Agenda.................................................................................... 38

Tabel 4

Tabel Berita...................................................................................... 40

Tabel 5

Tabel Kategori.................................................................................. 41

Tabel 6

Tabel Galeri......................................................................................43

Tabel 7

Tabel Album.....................................................................................44

Tabel 8

Tabel Hubungi..................................................................................45

Tabel 9

Tabel Anggota..................................................................................46

DAFTAR GAMBAR

Gambar 2.1

Profil Universitas Janabadra........................................................ 5

Gambar 2.2

Simbol DFD................................................................................15

Gambar 2.3

Relasi tabel One to One...............................................................17

Gambar 2.4

Relasi Tabel One to Many...........................................................17

Gambar 2.5

Relasi Tabel Many to Many.........................................................18

Gambar 3.1

Diagram Konteks.........................................................................27

Gambar 3.2

DFD Level 1................................................................................29

Gambar 3.3

DFD Level 2 Proses 1 Login Admin...........................................30

Gambar 3.4

DFD Level 2 Proses 1 Login Alumni..........................................31

Gambar 3.5

DFD Level 2 Proses 2.................................................................32

Gambar 3.6

DFD Level 2 Proses 3.................................................................33

Gambar 3.7

DFD Level 2 Proses 4.................................................................34

Gambar 3.8

Relasi Tabel................................................................................. 49

10

Gambar 3.9

Perancangan Menu......................................................................50

Gambar 3.10 Perancangan Menu User..............................................................51

Gambar 3.11 Perancanga Menu Admin............................................................52
Gambar 3.12 Rancangan Tampilan Beranda.....................................................53
Gambar 3.13 Rancangan Tampilan Galeri Foto................................................55
Gambar 3.14 Rancangan Tampilan Hubungi Kami..........................................56
Gambar 3.15 Rancangan Tampilan Daftar Anggota..........................................57
Gambar 3.16 Rancangan Tampilan Login.........................................................59
Gambar 3.17 Rancangan Tampilan Kuisioner Data Pribadi.............................61
Gambar 3.18 Rancangan Tampilan Kuisioner Riwayat Pendidikan.................63
Gambar 3.19 Rancangan Tampilan Kuisioner Riwayat Pekerjaan...................64
Gambar 3.20 Rancangan Tampilan Beranda Anggota......................................65
Gambar 3.21 Rancangan Tampilan Profil.........................................................67
Gambar 3.22 Rancangan Tampilan Agenda......................................................68
Gambar 3.23 Rancangan Tampilan Berita.........................................................69
Gambar 3.24 Rancangan Tampilan Galeri Foto................................................70
Gambar 3.25 Rancangan Tampilan Hubungi Kami..........................................71
Gambar 3.26 Rancangan Tampilan Anggota.....................................................72

11

Gambar 3.27 Rancangan Tampilan Login Admin.............................................73

Gambar 3.28 Rancangan Tampilan Beranda Admin.........................................74
Gambar 3.29 Rancangan Tampilan Setting Web...............................................76
Gambar 3.30 Rancangan Tampilan Setting Menu.............................................77
Gambar 3.31 Rancangan Tampilan Manajemen Berita.....................................78
Gambar 3.32 Rancangan Tampilan Hubungi Kami..........................................80
Gambar 3.33 Rancangan Tampilan Interaksi.................................................... 81
Gambar 3.34 Rancangan Tampilan Media........................................................ 82
Gambar 3.35 Rancangan Tampilan Banner.......................................................83
Gambar 4.1

Tampilan Halaman Beranda........................................................85

Gambar 4.2

Tampilan Halaman Galeri Foto...................................................86

Gambar 4.3

Tampilan Halaman Hubungi Kami..............................................86

Gambar 4.4

Tampilan Halaman Daftar Anggota.............................................87

Gambar 4.5

Tampilan Halaman Login Anggota.............................................88

Gambar 4.6

Tampilan Halaman Kuisioner Data Pribadi.................................88

Gambar 4.7

Tampilan Halaman Kuisioner Riwayat Pendidikan.....................89

Gambar 4.8

Tampilan Halaman Kuisioner Riwayat Pekerjaan.......................89

Gambar 4.9

Tampilan Halaman Beranda Anggota.........................................90

12

Gambar 4.10 Tampilan Halaman Profil............................................................91

Gambar 4.11 Tampilan Halaman Agenda.........................................................91
Gambar 4.12 Tampilan Halaman Berita............................................................92
Gambar 4.13 Konfirmasi Keluar Galeri Foto....................................................92
Gambar 4.14 Tampilan Halaman Hubungi Kami..............................................93
Gambar 4.15 Tampilan Halaman Anggota........................................................94
Gambar 4.16 Tampilan Halaman Login Admin................................................95
Gambar 4.17 Tampilan Pesan Kesalahan Login Admin Gagal.........................95
Gambar 4.18 Tampilan Halaman Beranda Admin............................................96
Gambar 4.19 Tampilan Halaman Konfirmasi Keluar Admin............................97
Gambar 4.20 Tampilan Halaman Seting Web...................................................98
Gambar 4.21 Tampilan Halaman Seting Menu.................................................99
Gambar 4.22 Tampilan Halaman Manajemen Berita........................................100
Gambar 4.23 Tampilan Halaman Hubungi Kami..............................................101
Gambar 4.24 Tampilan Halaman Interaksi........................................................101
Gambar 4.25 Tampilan Halaman Media...........................................................102
Gambar 4.26 Tampilan Halaman Banner..........................................................103
Gambar 4.27 Tampilan Halaman Lihat Web.....................................................104

13

14