PERANCANGAN WEBSITE
GEREJA GKI SOKA SALATIGA
Diajukan kepada Fakultas Teknologi Informasi
untuk memperoleh gelar Ahli Madya Komputer
Disusun Oleh :
Stefanus Hasudungan Putra Jaya Tampubolon 562010022
PROGRAM STUDI DIPLOMA TEKNIK INFORMATIKA FAKULTAS TEKNOLOGI INFORMASI
UNIVERSITAS KRISTEN SATYA WACANA SALATIGA
ii
PERANCANGAN WEBSITE
GEREJA GKI SOKA SALATIGA
TUGAS AKHIR
Disusun Oleh :
Stefanus Hasudungan Putra Jaya Tampubolon 562010022
PROGRAM STUDI DIPLOMA TEKNIK INFORMATIKA FAKULTAS TEKNOLOGI INFORMASI
UNIVERSITAS KRISTEN SATYA WACANA SALATIGA
vi
KATA PENGANTAR
Puji syukur penulis panjatkan kepada Tuhan Yesus atas
bimbingan, hikmat, dan perlindungan kepada penulis selama
penulis menyusun Tugas Akhir. Penyusunan Tugas Akhir adalah
untuk memenuhi kewajiban akademik dan menjadi salah satu
syarat kelulusan pada Program Studi Diploma Teknik
Informatika Fakultas Teknologi Informasi Universitas Kristen
Satya Wacana.
Tidak sedikit kandala, dan halangan yang penulis hadapi
selama penyusunan Tugas Akhir ini, namun berkat doa,
bimbingan dan dukungan dari berbagai pihak akhirnya Tugas
Akhir ini dapat terselesaikan.
Laporan ini dapat terselesaikan dengan baik berkat doa,
bimbingan, bantuan, dan dukungan dari berbagai pihak. Oleh
karena itu, pada kesempatan kali ini penulis ingin mengucapkan
terimakasih kepada :
1. Bapak Prof. Dr. John Titaley, selaku Rektor
Universitas Kristen Satya Wacana Salatiga.
2. Bapak Dr. Dharmaputra Taludangga Palekahelu,
S.Pd., M.Pd., selaku Dekan Fakultas Teknologi
Informasi, Universitas Kristen Satya Wacana Salatiga.
3. Bapak Sri Winarso Martyas Edi, S.Kom., M.Cs.
selaku Ketua Program Studi Diploma Teknik
Informatika, Fakultas Teknologi Informasi,
vii
selaku pembimbing kerja praktek, yang telah
memberikan saran atas laporan dan kerja praktek.
4. Dosen pengajar Fakultas Teknologi Informasi
Diploma Teknik Informatika, Bapak Drs. Prihanto
Ngesti Basuki, M.Kom., Bapak Felix David, S.Kom,
Bapak Teguh Wahyono, S.Kom., M.Cs.
5. Para dosen, beserta staf pengajar atas bimbingan dan
ilmu yang selama ini sudah diberikan kepada penulis
sebagai bekal dalam menjalankan kerja praktek.
6. Pendeta dan seluruh staff GKI Soka Salatiga yang
telah memberikan kesempatan bagi penulis untuk
menyusun dan merancang Tugas Akhir ini.
7. Ayah dan Ibu serta keluarga tercinta yang telah
memberikan dukungan dan kasih sayang baik secara
moril maupun materiil sehingga penulis dapat
melaksanakan kerja praktek dengan baik.
8. Rekan-rekan Diploma Teknik Informatika angkatan
2010, terimakasih untuk segala dukungan doa dan
semangat yang telah diberikan kepada penulis.
9. Pihak – pihak lain yang tidak dapat penulis sebutkan
satu per satu yang telah memberikan dukungan dan
bantuan selama ini.
Penulis menyadari bahwa penulisan Tugas Akhir ini jauh
dari sempurna, oleh karena itu kritik dan saran yang
viii
penyempurnaan Tugas Akhir ini. Akhir kata penulis
berharap agar laporan ini dapat bermanfaat di kemudian
hari. Tuhan memberkati.
Salatiga, 7 Agustus 2015
ix DAFTAR ISI
Halaman Cover... i
Halaman Judul ... ii
Lembar Pengesahan ... iii
Pernyataan Bebas Plagiasi ... iv
Pernyataan Persetujuan Publikasi ... v
Kata Pengantar ... vi
1.4 Tujuan pembuatan Aplikasi ... 3
1.4.1 Tujuan Umum ... 3
2.2. Hypertext Markup Language (HTML) ... 7
2.3. Hypertext Preprocessor (PHP) ... 8
x
2.5. Database MySQL ... 11
2.6. (Cascading Style Sheet) CSS ... 12
2.7. Java Script ... 14
Bab III. Perancangan Sistem ... 16
3.1 Deskripsi Sistem ... 16
3.2 Spesifikasi Sistem ... 16
3.2.1. Perangkat Lunak ... 16
3.2.2. Perangkat Keras ... 17
3.3. Perancangan Sistem ... 17
3.3.1. Kamus Data... 17
3.3.2. Tabel ... 19
3.3.3. Perancangan Front-end ... 22
3.3.4. Perancangan Back office (Halaman Admin) 31 3.3.5. Perancangan Jaringan ... 38
3.3.6. Diagram Aliran Data ... 39
Bab IV. Hasil dan Analisis ... 44
4.1. Implementasi Sistem ... 44
4.1.1. Homepage Utama ... 44
4.1.2. Halaman Front-end ... 46
4.1.3. Halaman Back-office (Administrator) ... 51
4.2.Hasil Pengujian ... 56
4.3. Analisa Sistem ... 57
Bab V. Kesimpulan dan Saran ... 58
5.1. Kesimpulan ... 58
xi
DAFTAR PUSTAKA ... 60
xii
DAFTAR TABEL
Tabel 3.1. Tabel galeri ... 19
Tabel 3.2. Tabel komentarwarta... 19
Tabel 3.3. Tabel kontak ... 20
Tabel 3.4. Tabel renungan ... 20
Tabel 3.5. Tabel user ... 20
xiii
DAFTAR GAMBAR
Gambar 2.1. Cara Kerja Internet ... 6
Gambar 3.1. Rancangan Homepage Awal ... 22
Gambar 3.2. Rancangan Halaman Tentang... 23
Gambar 3.3. Rancangan Halaman Warta ... 25
Gambar 3.4. Rancangan Halaman Detil Warta ... 26
Gambar 3.5. Rancangan Halaman Renungan ... 28
Gambar 3.6. Rancangan Halaman Kontak ... 29
Gambar 3.7. Rancangan Halaman Dashboard Administrator .. 31
Gambar 3.8. Rancangan Halaman Daftar Warta Administrator ... 32
Gambar 3.9. Rancangan Halaman Input Warta Administrator ... 33
Gambar 3.10. Rancangan Halaman Daftar Renungan Administrator ... 34
Gambar 3.11. Rancangan Halaman Input Renungan Administrator ... 35
Gambar 3.12. Rancangan Halaman Daftar Buku Tamu ... 36
Gambar 3.13. Rancangan Halaman Detil Buku Tamu ... 37
Gambar 3.14. Jaringan Semantik User ... 38
Gambar 3.15. Jaringan Semantik Admin ... 39
Gambar 3.16. Diagram Aliran Data Tampil & Komentar Warta User ... 39
Gambar 3.17. Diagram Aliran Data Tampil Renungan ... 40
xiv
Gambar 3.19. Diagram Aliran Data Input Output
Warta Admin ... 41
Gambar 3.20. Diagram Aliran Data Input Output Renungan Admin ... 42
Gambar 3.21. Diagram Aliran Data Input Output Manajemen Buku Tamu ... 42
Gambar 4.1. Tampilan Homepage Awal ... 45
Gambar 4.2. Tampilan Halaman Tentang ... 46
Gambar 4.3. Tampilan Halaman Warta ... 47
Gambar 4.4. Tampilan Halaman Detil Warta ... 48
Gambar 4.5. Tampilan Halaman Detil Warta ... 49
Gambar 4.6. Tampilan Halaman Detil Warta ... 50
Gambar 4.7. Tampilan Halaman Login Admin ... 51
Gambar 4.8. Tampilan Halaman Dashboard Admin ... 52
Gambar 4.9. Tampilan Halaman Daftar Warta ... 53
Gambar 4.10. Tampilan Halaman Input Warta ... 53
Gambar 4.11. Tampilan Halaman Daftar Renungan ... 54
Gambar 4.12. Tampilan Halaman Input Renungan ... 55
Gambar 4.13. Tampilan Halaman Daftar Buku Tamu ... 55
xv
DAFTAR LAMPIRAN