Upload
ibnu-siena-s
View
2.718
Download
28
Embed Size (px)
Citation preview
UNIVERSITAS GUNADARMAFAKULTAS TEKNOLOGI INDUSTRI
PENULISAN ILMIAH
PENGEMBANGAN SITUS WEB SMAN 1 CIOMASDENGAN MENGGUNAKAN TEKNOLOGI
FRAMEWORK CODEIGNITER 1.7.1
Nama : Ibnu Siena SyamNPM : 50406364Jurusan : Teknik InformatikaPembimbing : Dr. Ing. Adang Suhendra., SSi., SKom., MSc.
Diajukan Untuk Melengkapi SyaratMencapai Jenjang DIII/ Setara Sarjana Muda
Universitas Gunadarma2009
PERNYATAAN ORIGINALITAS DAN PUBLIKASI
Saya yang bertanda tangan di bawah ini,
Nama : Ibnu Siena SyamNPM : 50406364Judul PI : PENGEMBANGAN SITUS WEB
SMAN 1 CIOMAS DENGANMENGGUNAKAN TEKNOLOGIFRAMEWORK CODEIGNITER 1.7.1
Tanggal Sidang : 1 September 2009Tanggal Lulus : 1 September 2009
menyatakan bahwa tulisan ini adalah merupakan hasil karya saya sendiri dan dap-at dipublikasikan sepenuhnya oleh Universitas Gunadarma. Segala kutipan dalambentuk apapun telah mengikuti kaidah dan etika yang berlaku. Mengenai isi dantulisan adalah merupakan tanggung jawab penulis, bukan Universitas Gunadarma.Demikian pernyataan ini dibuat dengan sebenarnya dan dengan penuh kesadaran.
Depok, 16-Juli-2009
(Ibnu Siena Syam )
ii
LEMBAR PENGESAHAN
Judul PI : PENGEMBANGAN SITUS WEB SMAN 1 CIOMASDENGAN MENGGUNAKAN TEKNOLOGIFRAMEWORK CODEIGNITER 1.7.1
Nama : Ibnu Siena SyamNPM : 50406364Tanggal Sidang : 1 September 2009Tanggal Lulus : 1 September 2009
Menyetujui
Pembimbing Koordinator PI
(Dr.Ing.Adang Suhendra,SSi.,SKom.,MSc.) (Meilani B. Siregar, SKom.,MMSI.)
Ketua Jurusan Teknik Informatika
(Dr.Ing.Adang Suhendra, SSi., SKom., MSc.)
iii
ABSTRAKSI
Ibnu Siena Syam, 50406364PENGEMBANGAN SITUSWEB SMAN 1 CIOMAS DENGANMENG-GUNAKAN TEKNOLOGI FRAMEWORK CODEIGNITER 1.7.1PI. Jurusan Teknik Informatika, Fakultas Teknologi Industri, Universitas Gunadar-ma, 2009Kata Kunci : Framework, CodeIgniter, Situs web, Sekolah( xi + 99)
Kebutuhan akan informasi tidak terlepas dari kehidupan saat ini. Banyakmedia yang dapat digunakan untuk mendapatkan suatu informasi. Salah satu mediapenyebaran informasi yang paling diminati saat ini adalah media internet. Internetsemakin banyak digunakan oleh masyarakat dunia, tidak terkecuali bagi masyarakatIndonesia, terutama bagi kalangan pelajar dan mahasiswa.
Penyebaran informasi diinternet tidak terlepas dari sebuah layanan yangbernama situs web (website). Melalui website informasi dapat disampaikan baikberbasis teks, gra�k, suara, animasi, gambar bahkan dalam format video tanpadibatasi oleh jarak dan waktu.
Pada kesempatan ini, penulis ingin memanfaatkan media internet untuk mer-ancang dan membuat situs Sekolah Menengah Atas Negeri 1 Ciomas. Situs ini digu-nakan sebagai media informasi, yaitu: informasi sekolah, sejarah dan perkembangan,ekstarkulikuler, visi dan misi, sta� pengajar dan lain-lain.
Situs ini dibuat dengan menggunakan Framework CodeIgniter 1.7.1 denganteknologi MVC yakni Model View Control. Dengan cara kerja sebagai berikut :user berhubungan dengan view, dimana didalam view inilah semua informasi dita-mpilkan. Saat user melakukan permintaan atau request, misal klik tombol makarequest tersebut akan diproses oleh Controller. Apa yang harus dilakukan, data apayang diinginkan, apakah ingin melihat data, atau memasukkan data atau mungkinmelakukan validasi data terlebih dahulu, semua diproses di Controller. KemudianController akan meminta Model untuk menyelesaikan request, entah itu melakukanquery ataupun apapun. Dari Model, data akan dikirim kembali untuk di proseslebih lanjut di dalam Controller dan baru dari Controller data akan ditampilkan diView.
Daftar Pustaka (2005-2009)
iv
KATA PENGANTAR
Segala puji dan syukur penulis ke hadirat Allah SWT yang telah memberikanberkat, anugerah dan karunia yang melimpah, sehingga penulis dapat menyelesaikanPenulisan Ilmiah ini.
Penulisan Ilmiah ini dibuat guna melengkapi salah satu syarat untuk menye-lesaikan jenjang D III / setara Sarjana Muda pada Universitas Gunadarma. Ada-pun judul Penulisan Ilmiah ini adalah "PENGEMBANGAN SITUS WEB SMAN 1CIOMAS DENGANMENGGUNAKAN TEKNOLOGI FRAMEWORKCODEIGNITER1.7.1".
Walaupun banyak kesulitan yang penulis harus hadapi ketika menyusun penulisanilmiah ini, namun berkat bantuan dan dorongan dari berbagai pihak, akhirnya tugasakhir ini dapat diselesaikan dengan baik. Untuk itu penulis tidak lupa mengucapkanterima kasih kepada:
1. Ibu Prof. Dr. ES. Margianti, SE, MM, selaku Rektor Universitas Gunadarma.
2. Bapak Soebiyantoro SSi., MEng., selaku Dekan Fakultas Teknologi Industri.
3. Ibu Bapak Dr. Ing. Adang Suhendra, Ssi., SKom., MSc., selaku Ketua Juru-san Teknik Iformatika dan juga selaku sebagai dosen pembimbing yang telahbanyak memberikan bimbingan, arahan, dan waktunya kepada penulis selamaproses pembuatan Penulisan Ilmiah ini berlangsung hingga selesai.
4. Ibu Meilani B. Siregar, SKom., MMSI., selaku Koordinator Penulisan Ilmiah.
5. Bapak Drs. Agus Purwanto, selaku kepala sekolah SMA Negeri 1 Ciomas sertastaf-staf sekolah atas kerjasama dan telah meluangkan waktu pada saat prosespengambilan data.
6. Untuk Keluarga tercinta, Bapak dan Ibu serta kakak dan adik yang telahmemberikan dukungan moril dan doanya hingga penulis dapat menyelesaikanPenulisan ilmiah ini.
7. Untuk teman-teman satu bimbingan, Tika, Barli, Indra , Manda, dan Radiatas kerjasama dan bantuan selama ini.
8. Untuk Teman-teman kelas ex-1IA01, kelas ex-2IA03, kelas 3IA03 angkatan2006, dan rekan-rekan Monitoring Mahasiswa 2008/2009 yang selalu mem-berikan dukungan dan dorongan dalam penulisan ini.
9. Dan untuk semua yang tidak dapat disebutkan satu persatu, yang telah mem-berikan dukungan dan bantuannya baik langsung ataupun tidak langsungdalam penulisan ini.
v
Akhir kata, hanya kepada Allah SWT jualah segalanya dikembalikan danpenulis sadari bahwa penulisan ini masih jauh dari sempurna, disebabkan karenaberbagai keterbatasan yang penulis miliki. Untuk itu penulis mengharapkan kritikdan saran yang bersifat membangun untuk menjadi perbaikan di masa yang akandatang.
Depok, Juli 2009
Penulis
vi
Daftar Isi
Halaman Judul . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . iPernyataan Originalitas dan Publikasi . . . . . . . . . . . . . . . . . . iiLembar Pengesahan . . . . . . . . . . . . . . . . . . . . . . . . . . . . iiiAbstraksi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ivKata Pengantar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vDaftar Isi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . viiDaftar Gambar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . viiiDaftar Tabel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ixDaftar Lampiran . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xBAB 1 : PENDAHULUAN . . . . . . . . . . . . . . . . . . . . . . . 1
1.1 Latar Belakang . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11.2 Batasan Masalah . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21.3 Tujuan Penulisan . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31.4 Metode Pengembangan Aplikasi . . . . . . . . . . . . . . . . . . 31.5 Sistematika Penulisan Ilmiah . . . . . . . . . . . . . . . . . . . . 4
BAB 2 : LANDASAN TEORI . . . . . . . . . . . . . . . . . . . . . 52.1 Teknologi Informasi dan Komunikasi . . . . . . . . . . . . . . . 52.2 Penyebaran Informasi . . . . . . . . . . . . . . . . . . . . . . . . . 62.3 Situs Web (Website) . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
2.3.1 Pendukung Website . . . . . . . . . . . . . . . . . . . . . . 72.3.2 Kriteria Website . . . . . . . . . . . . . . . . . . . . . . . . 92.3.3 Jenis - jenis Website . . . . . . . . . . . . . . . . . . . . . . 10
2.4 Website Sekolah . . . . . . . . . . . . . . . . . . . . . . . . . . . . 122.5 Bahasa Pemograman Web . . . . . . . . . . . . . . . . . . . . . . 162.6 Framework . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
2.6.1 Arsitektur . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192.6.2 Manfaat Framework . . . . . . . . . . . . . . . . . . . . . . 202.6.3 Pemilihan Framework . . . . . . . . . . . . . . . . . . . . . 202.6.4 Model View Controller (MVC) . . . . . . . . . . . . . . . 212.6.5 Jenis-Jenis Framework . . . . . . . . . . . . . . . . . . . . 23
2.7 Pengenalan Database . . . . . . . . . . . . . . . . . . . . . . . . . 232.7.1 DDL (Data De�nition Language) . . . . . . . . . . . . . 25
2.7.1.1 Create . . . . . . . . . . . . . . . . . . . . . . . . . 252.7.1.2 Alter . . . . . . . . . . . . . . . . . . . . . . . . . . 252.7.1.3 Drop . . . . . . . . . . . . . . . . . . . . . . . . . . 26
2.7.2 DML (Data Manipulation Language) . . . . . . . . . . . 262.7.2.1 Insert . . . . . . . . . . . . . . . . . . . . . . . . . . 262.7.2.2 Select . . . . . . . . . . . . . . . . . . . . . . . . . . 262.7.2.3 Delete . . . . . . . . . . . . . . . . . . . . . . . . . 27
vii
2.7.2.4 Update . . . . . . . . . . . . . . . . . . . . . . . . . 272.7.3 DCL (Data Control Language) . . . . . . . . . . . . . . . 27
2.7.3.1 Grant . . . . . . . . . . . . . . . . . . . . . . . . . . 272.7.3.2 Revoke . . . . . . . . . . . . . . . . . . . . . . . . . 27
2.8 Diagram UML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 282.8.1 Use Case Diagram . . . . . . . . . . . . . . . . . . . . . . . 282.8.2 Class Diagram . . . . . . . . . . . . . . . . . . . . . . . . . 292.8.3 Activity Diagram . . . . . . . . . . . . . . . . . . . . . . . . 302.8.4 Sequence Diagram . . . . . . . . . . . . . . . . . . . . . . . 32
BAB 3 : ANALISA DAN PEMBAHASAN . . . . . . . . . . . . . 343.1 Tinjauan Umum . . . . . . . . . . . . . . . . . . . . . . . . . . . . 343.2 Analisa Masalah . . . . . . . . . . . . . . . . . . . . . . . . . . . . 353.3 Pemecahan Masalah . . . . . . . . . . . . . . . . . . . . . . . . . . 353.4 Perencanaan Situs . . . . . . . . . . . . . . . . . . . . . . . . . . . 363.5 Perancangan Situs . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
3.5.1 Perancangan Database . . . . . . . . . . . . . . . . . . . . 373.5.2 Perancangan Tampilan Situs . . . . . . . . . . . . . . . . 42
3.5.2.1 Rancangan Halaman Web . . . . . . . . . . . . . 443.5.2.2 Halaman Beranda Tamu (guest) . . . . . . . . . 453.5.2.3 Halaman Beranda Anggota (member) . . . . . 473.5.2.4 Halaman Beranda Administrator . . . . . . . . 48
3.5.3 Perancangan Sistem . . . . . . . . . . . . . . . . . . . . . . 533.5.3.1 Use Case Diagram . . . . . . . . . . . . . . . . . . 533.5.3.2 Activity Diagram . . . . . . . . . . . . . . . . . . 553.5.3.3 Diagram Sequence . . . . . . . . . . . . . . . . . . 573.5.3.4 Class Diagram . . . . . . . . . . . . . . . . . . . . 59
3.6 Implementasi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 603.6.1 Framework CodeIgniter . . . . . . . . . . . . . . . . . . . 613.6.2 Struktur Direktori . . . . . . . . . . . . . . . . . . . . . . . 623.6.3 Helper . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
3.6.3.1 Memuat Helper . . . . . . . . . . . . . . . . . . . 653.6.4 Library . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 713.6.5 Permodelan MVC pada CodeIgniter . . . . . . . . . . . 793.6.6 Integrasi Framework . . . . . . . . . . . . . . . . . . . . . . 82
BAB 4 : PENUTUP . . . . . . . . . . . . . . . . . . . . . . . . . . . 974.1 Kesimpulan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 974.2 Saran . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
Bibliogra� . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98Lampiran Output . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99
viii
Daftar Gambar
2.1 Bahasa Pemrograman Web . . . . . . . . . . . . . . . . . . . . . . . . 172.2 Model View Controller . . . . . . . . . . . . . . . . . . . . . . . . . . 222.3 Use Case Diagram . . . . . . . . . . . . . . . . . . . . . . . . . . . . 282.4 Class Diagram . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 302.5 Activiti Diagram . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312.6 Sequence Diagram . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
3.1 Struktur Navigasi Pengunjung . . . . . . . . . . . . . . . . . . . . . . 433.2 Struktur Navigasi Admin . . . . . . . . . . . . . . . . . . . . . . . . . 433.3 Struktur Navigasi Anggota (Member) . . . . . . . . . . . . . . . . . . 443.4 Halaman Beranda Tamu (Guest) . . . . . . . . . . . . . . . . . . . . 453.5 Halaman Beranda Tamu (Guest) . . . . . . . . . . . . . . . . . . . . 463.6 Halaman Beranda Anggota (Member) . . . . . . . . . . . . . . . . . . 473.7 Halaman Beranda Administrator . . . . . . . . . . . . . . . . . . . . 483.8 Halaman Tambah username&password . . . . . . . . . . . . . . . . . 493.9 Halaman Tambah Pro�le Sekolah . . . . . . . . . . . . . . . . . . . . 503.10 Halaman Tambah Guru . . . . . . . . . . . . . . . . . . . . . . . . . 513.11 Halaman Tambah Berita dan Events . . . . . . . . . . . . . . . . . . 523.12 Halaman Tambah Gallery . . . . . . . . . . . . . . . . . . . . . . . . 533.13 Use Case Diagram . . . . . . . . . . . . . . . . . . . . . . . . . . . . 543.14 Activity Diagram Administrator . . . . . . . . . . . . . . . . . . . . . 563.15 Activity Diagram Anggota . . . . . . . . . . . . . . . . . . . . . . . . 573.16 Diagram Sequence Administrator . . . . . . . . . . . . . . . . . . . . 583.17 Diagram Sequence Anggota . . . . . . . . . . . . . . . . . . . . . . . 593.18 Class Diagram . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 603.19 Struktur Direktori CodeIgniter . . . . . . . . . . . . . . . . . . . . . . 633.20 Model MVC CodeIgniter . . . . . . . . . . . . . . . . . . . . . . . . . 823.21 Halaman Home Tamu (guest) . . . . . . . . . . . . . . . . . . . . . . 843.22 Halaman Hubungi Kami . . . . . . . . . . . . . . . . . . . . . . . . . 863.23 Halaman Login . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 883.24 Halaman Home Administrator . . . . . . . . . . . . . . . . . . . . . . 903.25 Halaman Home Member . . . . . . . . . . . . . . . . . . . . . . . . . 913.26 Halaman Pro�le Sekolah . . . . . . . . . . . . . . . . . . . . . . . . . 923.27 Halaman Visi Misi Selangkapnya . . . . . . . . . . . . . . . . . . . . 933.28 Halaman Edit Visi Misi . . . . . . . . . . . . . . . . . . . . . . . . . . 943.29 Halaman Tambah Data . . . . . . . . . . . . . . . . . . . . . . . . . . 95
ix
Daftar Tabel
2.1 Bahasa Pemograman Web . . . . . . . . . . . . . . . . . . . . . . . . 17
3.1 Tabel Admin . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 383.2 Tabel berita_events . . . . . . . . . . . . . . . . . . . . . . . . . . . 383.3 Tabel data_siswa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 393.4 Tabel galery . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 393.5 Tabel guru . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 403.6 Tabel pesan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 403.7 Tabel pro�leskul . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 413.8 Tabel pro�le_skul . . . . . . . . . . . . . . . . . . . . . . . . . . . . 413.9 Tabel pro�le_skul_2 . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
x
Daftar Lampiran
Tampilan Output ............................................................................... 99
xi
Bab 1
PENDAHULUAN
1.1 Latar Belakang
Kebutuhan akan informasi tidak terlepas dari kehidupan saat ini. Banyak me-
dia yang dapat digunakan untuk mendapatkan suatu informasi. Salah satu media
penyebaran informasi yang paling diminati saat ini adalah media internet. Internet
semakin banyak digunakan oleh masyarakat dunia, tidak terkecuali bagi masyarakat
Indonesia, terutama bagi kalangan pelajar, mahasiswa, pengusaha dan pada saat
ini sedang berkembang dan semakin popular, dan juga merupakan suatu kumpulan
jaringan berskala besar atau WAN (Wide Area Network). Dalam arti sebenarnya,
internet merupakan jaringan tanpa batas yang melibatkan jutaan komputer diselu-
ruh dunia dan menjadikan internet sebagai kata kunci dalam proses penyebaran dan
media mencari informasi, diantaranya dalam bidang ekonomi, pendidikan, pemerin-
tahan, sosial dan lain-lain.
Penyebaran informasi diinternet tidak terlepas dari sebuah layanan yang
bernama website. Melalui website informasi dapat disampaikan baik berbasis teks,
gra�k, suara, animasi, gambar bahkan dalam format video.
Seiring dengan perkembangan internet yang semakin pesat membuat Univer-
sitas Gunadarma memberikan suatu pengabdian kepada masyarakat didalam dunia
pendidikan yang berupa pembuatan website Sekolah Menengah Atas baik negeri
maupun swasta yang sesuai dengan visi dan misi Universitas Gunadarma. Den-
gan adanya pembuatan website tersebut kiranya dapat memberikan suatu informasi
yang tepat dan terbaik bagi pelajar dalam memilih Sekolah Menengah Atas tanpa
harus datang ke Sekolah Menengah Atas tersebut.
1
2
Pada kesempatan ini, penulis ingin memanfaatkan media internet untuk mer-
ancang dan membuat situs Sekolah Menengah Atas Negeri 1 Ciomas. Situs ini digu-
nakan sebagai media informasi, yaitu: informasi sekolah, sejarah dan perkembangan,
ekstarkulikuler, visi dan misi, sta� pengajar dan lain-lain.
Dengan dibuatnya website ini diharapkan dapat memudahkan masyarakat
khususnya warga Sekolah Menengah Atas Negeri 1 Ciomas dalam mendapatkan
informasi mengenai sekolah tersebut. Oleh karena itu penulis mencoba membuat
website ini dengan judul "Pengembangan situs web SMAN 1 Ciomas dengan meng-
gunakan teknologi Framework CodeIgniter 1.7.1". Penulisan ilmiah ini, dibangun
dengan menggunakan framework CodeIgniter sebagai software penunjang pembu-
atan website, dikarenakan CodeIgniter memiliki kemudahan dalam pembuatannya,
ringan dan cepat, selain itu CodeIgniter bersifat Open Source (CodeIgniter yang
didistribusikan secara gratis).
1.2 Batasan Masalah
Pada penulisan ini, penulis membatasi pembahasan pada permintaan sekolah
atas websitenya, dengan menggunakan framework CodeIgniter sebagai framework
dasar pembuatan website, Apache sebagai web server, MySQL sebagai basis data,
dan HTML untuk membangun website. Fasilitas yang diberikan pada website ini
yaitu :
• Multiuser.
• Berita dan Events Sekolah.
• Gallery.
• Data Guru dan Siswa.
3
• Hubungi Kami dan Buku Tamu.
Multiuser dibagi menjadi dua yaitu administrator dan anggota (member),
dimana keduanya dapat melakukan insert, update, dan delete isi (content) pada
website.
1.3 Tujuan Penulisan
Tujuan tulisan ini adalah untuk membuat website berisi informasi SMAN 1
Ciomas secara online yang akan memberikan kemudahan dalam mencari informasi
yang dibutuhkan tentang hal-hal yang berkaitan dengan SMAN 1 Ciomas yang
diharapkan dapat lebih efesien dan efektif.
1.4 Metode Pengembangan Aplikasi
Metode yang digunakan dalam penelitian ini, yaitu :
1. Menganalisis kebutuhan user untuk membuat situs web sekolah SMAN 1
Ciomas dengan cara melakukan kunjungan langsung pada sekolah yang bersangku-
tan.
2. Menganalisis suatu masalah yang timbul pada kebutuhan user.
3. Merancang database dan tampilan dari suatu website tersebut.
4. Melakukan proses pembuatan program(coding) dengan menggunakan frame-
work CodeIgniter.
5. Melakukan proses pembuatan program(coding) dengan menggunakan frame-
work CodeIgniter.
4
1.5 Sistematika Penulisan Ilmiah
Penulisan Ilmiah ini diuraikan ke dalam 4 bab, yang diharapkan dapat mem-
permudah dan melengkapi penulisan.
Bab 1 PENDAHULUAN
Bab ini berisi hal-hal yang melatar belakangi penulisan, ruang lingkup, tujuan
penelitian, metode penelitian serta sistematika penulisan ilmiah yang digunakan.
Bab 2 LANDASAN TEORI
Bab ini menguraikan beberapa teori yang menunjang penelitian ilmiah serta
istilah-istilah yang digunakan dalam penulisan ini.
BAB 3 ANALISA DAN PEMBAHASAN
Bab ini membahas analisis kon�gurasi website sekolah yang akan dibuat serta
merancang framework sebagai dasar pembuatan website.
BAB 4 PENUTUP
Bab ini berisi tentang simpulan dan saran dari pembahasan dalam penulisan
ilmiah ini.
Bab 2
LANDASAN TEORI
2.1 Teknologi Informasi dan Komunikasi
Informasi adalah data yang telah diproses menjadi bentuk yang memiliki
arti bagi penerima dan dapat berupa fakta, suatu nilai yang bermanfaat. Jadi ada
suatu proses transformasi data menjadi suatu informasi yaitu input - proses - output.
Kualitas informasi tergantung dari 3 hal, yaitu informasi harus :
• Akurat, berarti informasi harus bebas dari kesalahan-kesalahan dan tidak bias
atau menyesatkan. Akurat juga berarti informasi harus jelas mencerminkan
maksudnya.
• Tetap pada waktunya, berarti informasi yang datang pada penerima tidak
boleh terlambat.
• Relevan, berarti informasi tersebut menpunyai manfaat untuk pemakainya.
Relevansi informasi untuk tiap-tiap orang satu dengan yang lainnya berbeda.
Istilah teknologi informasi mulai populer di akhir tahun 70-an. Pada masa
sebelumnya istilah teknologi informasi biasa disebut teknologi komputer atau pengo-
lahan data elektronis (electronic data processing). Teknologi informasi dide�nisikan
sebagai teknologi pengolahan dan penyebaran data menggunakan perangkat keras
(hardware) dan perangkat lunak (software), komputer, komunikasi, dan elektronik
digital.
Komunikasi dide�nisikan sebagai suatu proses penyampaian informasi (pesan,
ide, gagasan) dari satu pihak kepada pihak lain agar terjadi saling mempengaruhi
diantara keduanya. Pada umumnya, komunikasi dilakukan dengan menggunakan
5
6
kata-kata (lisan) yang dapat dimengerti oleh kedua belah pihak. Namun perkem-
bangan komunikasi sudah bukan hanya melalui kata-kata (lisan), tetapi juga dengan
menggunakan media informasi seperti media cetak dan media elektronik.
Dengan adanya media-media informasi tersebut dibutuhkan sebuah teknologi
untuk mendukukung agar proses komunikasi berjalan lancar. Disinilah peranan
teknologi informasi sangat dibutuhkan.
2.2 Penyebaran Informasi
Proses komunikasi yang pada intinya adalah menyampaikan infomasi dari
suatu pihak ke pihak lain, salah satunya adalah penyebaran informasi atau yang
biasa disebut dengan penyebaran informasi. Tujuan penyebaran informasi adalah
menyampaikan informasi dari suatu pihak kepada khalayak ramai ditujukan agar
semua pihak dapat mengetahui informasi yang diberikan dengan mudah melalui se-
buah media komunikasi. Penyebaran informasi tersebut dapat berupa berita aktual,
dan promosi atau informasi yang diberikan untuk tujuan meningkatkan populari-
tas. Dalam penerapannya, penyebaran informasi dilakukan di hampir semua bidang
yaitu dalam bidang bisnis, hiburan, kesehatan, dan pendidikan. Media komunikasi
terbagi menjadi 3 macam yaitu :
• Media Komunikasi Visual contohnya poster, iklan , brosur, website.
• Media Komunikasi Audio contohnya radio.
• Media Komunikasi Audiovisual contohnya CD interaktif, televisi, video.
Media komunikasi sebagai jembatan penyampaian informasi ke publik. Den-
gan adanya berbagai media komunikasi ini penyampaian segala informasi lebih mu-
dah dan cepat sampai pada publik. Media komunikasi yang efektif saat ini adalah
7
situs web (website), karena website saat ini lebih popular, murah dan cepat serta
terbaru (uptodate).
2.3 Situs Web (Website)
Situs Web (Website) adalah merupakan dokumen yang tersimpan dalam web
server yang memiliki jenis dan topik tertentu. Webpage atau yang lebih kita den-
gar sebagai homepage, adalah suatu halaman khusus dari situs web tertentu yang
tersimpan dalam bentuk �le. Dalam homepage tersimpan informasi dan link yang
menghubungkan informasi ke informasi lain baik itu page yang sama atau pun web
page lain pada website yang berbeda.
2.3.1 Pendukung Website
Hal - hal yang menjadi pendukung jalannya suatu website antara lain adalah
1. Internet
Internet adalah sekumpulan dari beberapa komputer, jaringan dan gateway
yang berkomunikasi antara satu dengan yang lainnya. Komunikasi berlang-
sung dengan memakai dokumen yang formatnya sama yang disebut protokol
TCP/IP. Pusat internet merupakan pengatur komunikasi data kecepatan ting-
gi (high-speed) diantara beberapa komputer. Jumlah komputer yang terkait
bisa mencapai ratusan atau ribuan, dan masing-masing bisa berisikan aneka
ragam informasi. Disamping itu ada beberapa komputer yang tugasnya mem-
bantu penyaluran (me-rutekan) informasi dan data. Dengan kemampuan ini
maka internet dapat menawarkan sejumlah jasa ke pemakai, antara lain : per-
cakapan(chatting), surat elektronik(e-mail), WWW, ftp, newsgroup, gopher,
telnet dan lain sebagainya.
8
2. URL (Uniform Resource Locators)
URL atau Uniform Resource Locators adalah data berisikan alamat internet
dari suatu situs Web atau sumber daya dalamWWW, atau protokol yang digu-
nakan untuk mengaksesnya. Bentuk umum URL ialah http:// yang berisikan
alamat internet dari suatu halaman Web yang dapat disebut sebagai pro-
tokol di internet yang menyebabkan browser dapat mengambil suatu informasi
dari server WWWW. Bentuk lain dari URL ialah gopher:// dan ftp:// yang
merupakan jasa pelayanan internet yang digunakan untuk transfer �le dari
satu komputer ke komputer lain melalui saluran telepon biasa dalam bentuk
WWW.
3. Web Server
Web server adalah sistem untuk menjalankan situs Web yang menempatkan se-
mua informasi di dalam medianya, yang berupa perangkat lunak dan perangkat
keras, untuk menjalankan situs Web yang terkandung didalamnya. Dalam in-
ternet yang menjadi server Web adalah providernya.
4. World Wide Web (WWW)
World Wide Web atau WWW merupakan hubungan antar dokumen pada
server http diseluruh dunia. Dokumen yang ada dalam WWW dikenal sebagai
halaman atau halaman web, yang ditulis menggunakan bahasa HTML. Hala-
man Web identik dengan suatu alamat di internet yang biasa dinamakan URL
(Uniform Resource locators) sebagai penentu nama komputer dan jalur yang
dapat diakses, yang ditransmisikan dari satu titik ke titik lain oleh pemakai
http. Halaman Web biasanya berisikan informasi berupa teks, gambar/image,
gra�k, cuplikan �lm dan suara/lagu.
9
Isi halaman Web itu biasanya berbentuk kecil dan akan ada program kecil
yang menjalankannya sewaktu obyek tersebut diaktifkan. Obyek tersebut di-
namakan Hyperlink. Pengunjung situs (site) juga bisa men-download �le dan
mengirim pesan dan kesan melalui e-mail dengan memanfaatkan link pada
halaman Web.
5. Browser Web
Merupakan software penterjemah �le HTML menjadi halaman Web untuk
kemudian ditampilkan di monitor, elemen dari browser Web yaitu halaman
Web yang berisi teks informatif, citra yang berupa gambar, Hypertext link
yang intraconnect dan interconnect halaman Web.
2.3.2 Kriteria Website
Media website berkembang cepat, ide, proses dan perangkat aplikasi pengem-
bangan website baru bermunculan dengan cepat. Untuk mengawasi dan mengikuti
satu-persatu akan sangat melelahkan, tapi tidak dengan mengikuti suatu garis besar
pedomannya dalam mendesain sebuah situs web yang baik.
Kriteria website yang baik menurut Academy of Digital Arts & Sciences
dalam artikelnya di Adobe.com antara lain.
1. Content
Content yang baik akan menarik, relevan, dan pantas untuk target audiens
situs web tersebut. Content yang baik juga harus dibikin khusus untuk web
bukan hanya diambil dari media lain dan informasi yang disajikan aktual.
Gaya penulisannya pun harus disesuaikan dengan web dan target audiencenya.
10
2. Struktur dan Navigasi
Dua Elemen ini adalah penting untuk menciptakan kepercayaan pengunjung
situs kepada situs web anda, membimbing dan memberikan mereka kendali
setiap saat.
3. Desain Visual
Visual Design yang baik menarik, berkualitas tinggi (berukuran �le yang
masuk akal) dan mendukung content, struktur dan navigasi, sambil menam-
bahkan elemen-elemen penarik perhatian seperti gambar dan animasi.
4. Interaktivitas
Keindahan Web adalah bahwa di web dimungkinkan pengunjung situs anda
berinteraksi dengan situs anda, anda, pengunjung situs web yang lain (inilah
dasar komunitas sebuah situs web), dan dengan komputernya. Interaktivitas
adalah apa yang melibatkan pengguna situs web anda dalam user experience
yang anda rancang dengan situs web anda.
2.3.3 Jenis - jenis Website
Klasi�kasi website berdasarkan
1. Situs Perusahaan
Website yang menekankan informasi suatu perusahaan dalam bentuk company
pro�le di internet.
2. E-learning
Website yang menyediakan informasi sistem pengajaran, sistem pelatihan,
berbasis internet. Dengan E-Learning masyarakat terutama insan pelajar da-
pat mengikuti kegiatan belajar secara online melalui internet.
11
3. E-Commerce
Website yang menyediakan informasi produk dalam bentuk katalog online dan
dilengkapinya dengan sistem order transaksi online.
4. Situs Portal
Website yang banyak sekali memiliki fasilitas dan �tur, sehingga terbentuklah
suatu komunitas online dari website tersebut. contoh yahoo.com yang memi-
liki banyak komunitas seperti yahoo group, yahoo mail, yahoo game, yahoo
�nance, yahoo chat dsb.
5. Situs Pribadi
Website pribadi yang menampilkan informasi pro�l pemiliknya. Juga dapat
berbentuk blog pribadi.
6. Situs Jejaring Sosial
Website yang memiliki fungsi sebagai media interaksi sosial dan sebagai media
komunikasi yang efektif bagi pemerintah untuk mendapatkan masukan lang-
sung dari masyarakatnya. Sudah banyak situs jejaring sosial yang terkenal,
seperti Friendster, Facebook.
7. Situs Pendidikan
Website yang menyediakan informasi kegiatan pendidikan dari suatu lembaga
pendidikan. Situs pendidikan terbagi menjadi 2 kategori yaitu :
(a) Situs Perguruan Tinggi contohnya Sekolah Tinggi, Akademi dan Univer-
sitas.
(b) Situs Sekolah contohnya SD, SMP, SMA.
12
2.4 Website Sekolah
Salah satu jenis website yang akan dibahas pada penulisan ini adalah si-
tus pendidikan untuk kategori situs sekolah khususnya pada tingkat SMA. Website
sekolah memiliki beberapa keuntungan, diantaranya :
1. Memperkenalkan pro�l sekolah.
Membuat orang-orang mengerti dimana, bagaimana dan apa hebatnya seko-
lah, tentu saja harus ada informasi. Pro�l sekolah bisa membuat masyarakat
mengetahui informasi tentang sekolah tersebut seperti:
• Fasilitas yang tersedia.
• Kurikulum intra dan ekstrakurikulernya.
• Dimana lokasi sekolah, apakah lokasinya mudah diakses.
• Prestasi sekolah tersebut.
• Berapakah biaya yang harus dikeluarkan untuk bersekolah di sekolah
tersebut.
• Kegiatan-kegiatan sekolah tersebut.
• Guru-guru di sekolah tersebut.
• Contact information untuk menanyakan segala hal yang berkaitan dengan
sekolah tersebut.
• Dan lain sebagainya.
Betapa banyak informasi yang bisa di tampilkan dan betapa banyak pula man-
faatnya baik dari sisi pemilik situs (sekolah), orang tua calon siswa, orang tua
siswa, bahkan alumni.
13
2. Media komunikasi antara sekolah dengan dunia luar.
Siapapun, dimanapun dan kapanpun orang bisa berkomunikasi dengan seko-
lah melalui media website di Internet. Bentuk komunikasi yang terjalin di-
antaranya:
• komunikasi antar siswa melalui media forum.
• komunikasi antara orang tua siswa/calon siswa dengan sekolah melalui
media email ataupun form kontak di website.
• komunikasi antara sekolah dengan institusi pendidikan di dalam/luar
negeri.
• komunikasi antara sekolah dengan alumni.
3. Media resmi sekolah.
Media resmi sekolah untuk media publikasi informasi resmi ke masyarakat,
seperti:
• Pengumuman.
• Press release.
• Berita resmi sekolah
Ada beberapa hal yang harus kita pertimbangkan pada saat kita ingin mem-
buat sebuah situs sekolah, diantaranya kita harus memperhatikan :
(a) Pemilihan warna.
Warna merupakan salah satu elemen yang penting dalam tampilan se-
buah situs. Situs dengan pemilihan warna yang baik akan membuat
pengakses nyaman dan mempunyai kesenangan tersendiri pada saat dia
mengakses situs dan membaca isi di dalamnya.
14
(b) Desain Struktur Content.
Struktur content yang baik adalah bisa membuat pengunjung merasa
mudah dalam mencari sebuah informasi.
(c) Desain Tata Letak Situs.
Meliputi bagaimana penempatan isi situs secara umum. Isi situs se-
cara umum seperti ada sebuah menu, lalu ada isi (content) , header
(title), Footer, dan isi-isi lainnya menyesuaikan struktur situs yang su-
dah kita rancang sebelumnya. Lalu misalnya ada sebuah foto yang ingin
anda tonjolkan/tampilkan, bagaimana penempatannya? Banner ? dan
elemen-elemen lain dari sebuah situs. Kombinasi tata letak dari semua
elemen-elemen yang ingin ditampilkan akan berpengaruh pada tampilan
dan selanjutnya pengunjung akan menilai tata letak situs anda.
(d) Desain Gra�s
Desain gra�s merupakan elemen utama yang diperhatikan oleh pengun-
jung situs karena disini ada sebuah kondisi dimana pengunjung akan
berkomentar, situs ini bagus atau tidak. Parameter-parameter yang ki-
ta bahas sebelumnya seperti desain layout, struktur content dan lainnya
sangat berpengaruh untuk desain gra�s situs anda. Terutama untuk de-
sain tata letak biasanya menjadi satu dalam proses desain. Itu hanya
masalah cara dan kebiasaan dari masing-masing desainer.
(e) Navigasi
Apakah navigasi yang digunakan memudahkan pengunjung untuk men-
cari informasi dalam situs tersebut ? Navigasi yang baik tergantung
dari struktur menu yang disusun pada saat pembuatan struktur content
secara menyeluruh. Untuk implementasinya di situs bisa menggunakan
15
berbagai macam cara seperti :
• pull down menu.
• jump menu (select form).
• tree menu.
Menu-menu tersebut pada umumnya dibuat dengan pemrograman javascript,
applet maupun yang lainnya dan perlu juga diperhatikan kompatibilitas-
nya dengan browser-browser yang umum dipakai.
(f) Ketepatan isi
Apakah di situs tersebut terbebas dari broken link ? bebas dari error? Pa-
da kasus yang umum hal ini sering terjadi pada saat halaman yang kita tu-
ju tidak ada isinya (The page cannot be found), lalu ada aplikasi-aplikasi
yang mengalami gangguan/error, atau bahkan Membangun & Meman-
faatkan website Sekolah ada yang melakukan percobaan-percobaan/trial
situs di area aktif situs tersebut (try & error). Terkadang para web de-
veloper lupa untuk tidak melakukan developent atau uji coba di area
server yang sudah aktif/running. Tentunya broken link ataupun error ta-
di harus diusahakan seminimal mungkin untuk sebuah situs yang sudah
bisa diakses di internet. Hal tersebut bisa menjadi bug atau titik lemah
sebuah situs yang seringkali menjadi celah para hacker untuk merusak
situs tersebut.
(g) Mobilitas Content
Apakah informasi di situs selalu diperbaharui dan tidak statis ? adakah
sebuah kolom interaktif antara pemilik situs dengan pengunjung situs
atau bahkan antar pengunjung itu sendiri ? Pengunjung tentunya selalu
ingin melihat sesuatu yang baru terutama informasi yang ditampilkan.
16
Bila mereka melihat isi situs selalu sama dan tidak berubah dalam jang-
ka waktu tertentu maka mereka akan menilai situs ini statis dan tidak
menarik lagi untuk mereka kunjungi.
(h) E�siensi
Dalam point ini kita bicara mengenai konsistensi penempatan dan tampi-
lan untuk content desain di setiap halaman. Hal ini akan mempermudah
pengunjung dalam pencarian informasi, tidak membingungkan mereka
dan dengan adanya konsistensi tersebut akan mempercepat loading time
halaman web. Bayangkan bila ada sebuah situs dimana setiap halaman
memiliki perbedaan dalam tata letaknya, misalkan dari sisi penempatan
isi, warna teks, penempatan menu dan lain sebagainya. Pengunjung akan
kebingungan dan harus menyediakan waktunya untuk memahami mak-
sud dan isi situs tersebut "per halaman". Sebuah kejadian yang membuat
pengunjung merasa malas melihat halaman berikutnya.
2.5 Bahasa Pemograman Web
Dalam pembuatan website dapat dibaca oleh browser adalah HTML. HTML
merupakan bahasa standar yang digunakan untuk dokumen WWW. Bahasa HTML
merupakan tag (akhiran) yang menandakan cara browser menampilkan elemen ha-
laman seperti teks dan gambar dan cara browser menanggapi sesuatu tindakan
tertentu dari pemakai seperti Hyperlink dengan hanya meng-klik mouse dan/atau
menekan keyboard. Disamping bahasa HTML ada bahasa pemograman lain yag
dapat disinergikan dengan HTML. Bahasa-bahasa pemograman yang dipakai dapat
dilihat pada tabel berikut:
17
Tabel 2.1: Bahasa Pemograman Web
ASP Java/JSP PHPColdFusion JavaScript PythonFlash/Actionscript Perl Ruby
Menurut situs berdasarkan sumber http://webdesign.about.com/ pemogra-
man yang paling sering digunakan adalah php, berikut adalah hasil polling yang
dilakukan oleh web tersebut.
Gambar 2.1: Bahasa Pemrograman Web
Dari gambar diatas dapat dilihat bahwa bahasa pemograman yang paling
banyak digunakan oleh programmer adalah PHP(PHP HyperText PreProcessor).
PHP adalah bahasa pemrograman yang berjalan pada sisi server (server side) yang
digunakan untuk pengembangan Web dan dapat disatukan dengan HTML. PHP
bersifat dinamis, artinya dengan �le yang sama dapat menghasilkan output yang
berbeda-beda.
18
Alasan mengapa php banyak digunakan oleh pembuat website dapat dilihat
dari kelebihan-kelebihan php, yakni sebagai berikut:
1. Gratis.
2. Kode program (script) terintegrasi dengan �le HTML, sehingga developer bisa
berkonsentrasi pada penampilan dokumen web nya.
3. Tidak ada proses compiling dan linking.
4. Berorientasi obyek (object oriented).
5. Sintaksis pemrogramannya mudah dipelajari karena menyerupai bahasa C.
6. Integrasi yang luas ke berbagai server basis data. Basis data yang didukung
oleh PHP: Oracle, Sybase, MySQL, mSQL, PostgreeSQL, Solid, ODBC, Ad-
abasD, FilePRo, Velocis, Informix, dBase, UNIX dbm.
7. MultiPlatform, PHP hampir dapat digunakan di hampir semua server web
yang ada di pasaran seperti Apache, AOLServer, fhttpd, phttpd, Microsoft IIS
dan lain-lain dengan berbagai sistem operasi seperti Linux, FreeBSD, Unix,
Solaris dan Windows sehingga hambatan teknis dapat lebih ditekan.
Kemudahan-kemudahan yang ada dalam php membuat para pembuat website
leluasa dalam membuat web yang dinamis. Perkembangan teknologi juga telah
melahirkan beberapa metodologi khusus berbasis php yang dapat digunakan untuk
membuat website dengan tujuan memudahkan para pembuat website. Salah satu
metodologi khusus yang digunakan adalah dengan menggunakan Framework.
19
2.6 Framework
Framework adalah sekumpulan library yang diorganisasikan pada sebuah ran-
cangan arsitektur untuk memberikan kecepatan, ketepatan, kemudahan dan konsis-
tensi di dalam pengembangan aplikasi dari de�nisi tersebut, framework mengandung
unsur-unsur berikut :
• Librari
• Arsitektur
• Metodologi
Framework menyediakan pustaka yang lengkap dan terintegrasi. Unsur ini-
lah yang paling banyak memberikan keuntungan bagi pengembang aplikasi. Sebagai
contoh, framework aplikasi web menyediakan library-library dasar berkaitan layanan
web, seperti authentication, database access, html generation, template engine, ses-
sion management, caching, searching, email, http, pdf, zip dan ajax. Framework
juga menyediakan sarana extension untuk pustaka-pustaka yang belum tersedia atau
pustaka yang perlu ditingkatkan kemampuannya.
2.6.1 Arsitektur
Sebuah aplikasi membutuhkan rancangan bagaimana sistem dibangun, yaitu
bagaimana elemen-elemen di dalam aplikasi disusun dan diintegrasikan, seperti pen-
gorganisasian �le dan pustaka, dan bagaimana pustaka-pustaka digunakan. Frame-
work menyediakan struktur aplikasi dan bagaimana interaksi di dalam struktur
tersebut. MVC (Model View Controller) adalah salah satu pola rancangan yang
banyak digunakan dalam arsitektur aplikasi saat ini.
20
2.6.2 Manfaat Framework
Beberapa manfaat yang dapat kita peroleh dengan menggunakan framework
dalam pengembangan aplikasi :
• penggunaan komponen-komponen reusable, waktu pengembangan lebih singkat
penerapan design patterns memudahkan dalam rancangan, pengembangan dan
pemeliharaan sistem.
• stability dan reliability, aplikasi yang kita bangun lebih stabil dan handal kare-
na berbasis pada framework yang sudah teruji stabilitas dan kehandalannya.
• Coding style konsisten, memudahkan dalam membaca kode dan dalam mene-
mukan bugs.
• security concern, framework mengantisipasi dan memasang perisai terhadap
adanya berbagai masalah keamanan yang mungkin timbul
• dokumentasi, framework dapat mendisiplinkan kita untuk menulis dokumen-
tasi untuk apa yang kita tulis
2.6.3 Pemilihan Framework
Pemilihan framework yang salah akan menjadi sebuah bencana bagi penggu-
nanya. Ada beberapa hal yang harus di pertimbangkan dalam memilih framework:
• Pertama dokumentasi dari framework itu sendiri. Dokumentasi sangat pent-
ing adanya mengingat pada umumnya tidak banyak orang/perusahaan yang
membuat framework sendiri dalam membuat applikasi. Oleh karena itu kita
akan sangat tergantung dengan dokumentasi yang di sediakan oleh framework
yang kita pilih.
21
• Berikutnya kesesuaian framework tersebut dengan applikasi apa yang hendak
kita kembangkan. Kita memilih framework dengan fasilitas yang pas dengan
kebutuhan kita.
• Kemudian perhatikan standar - standar framework yang ada, misalkan apakah
framework tersebut MVC, apakah framework tesebut mendukung versi sekian,
apakah mendukung templating dan lain-lain. Semakin banyak hal yang di
support oleh framework tersebut semakin baik. Karena hal tersebut akan
mempengaruhi kualitas dari software yang dikembangkan.
• Lalu yang terakhir adalah faktor kemudahan. Tentunya ini sangat tergantung
dari sumberdaya yang ada.
2.6.4 Model View Controller (MVC)
Secara umum tujuan suatu aplikasi web adalah menampilkan informasi yang
diminta oleh pengguna. Pengguna mengirimkan permintaannya melalui program
browser ke web server, web server akan melakukan pemrosesan atas permintaan
tersebut, kemudian hasilnya akan dikirimkan kembali dan akan ditampilkan juga di
program browser. Berdasarkan mekanisme ini, aplikasi web dapat dibagi menjadi
tiga bagian:
1. Bagian yang berfungsi untuk mengintepretasikan permintaan dari pengguna
(HTTP Request)
2. Bagian yang memodelkan problem domain atau bussines logic
3. Bagian yang mengelola tampilan yang akan dikirimkan ke pengguna.
Dalam pemrograman aplikasi web yang menggunakan PHP terkadang ketiga
bagian program dicampur menjadi satu bagian. Aplikasi web merupakan bagian
22
yang sangat sering mengalami perubahan. Seperti perubahan tampilan, layout, pe-
nambahan menu dan banyak lagi yang tidak ada kaitannya atau tidak memberikan
dampak pada logika dari aplikasi web tersebut. Dengan mencampuradukkan ketiga
bagian tersebut maka setiap kali dilakukan perubahan pada tampilan ada kemu-
ngkinan diperlukan juga perubahan pada bagian logikanya. Hal ini memperbesar
kemungkinan timbulnya kesalahan pada aplikasi.
MVC(Model View Controller) adalah pola dasar yang memisahkan ketiga
bagian program menjadi tiga buah objek yang terpisah. Interaksi antara ketiga
bagian program tersebut dapat digambarkan seperti dibawah ini:
Gambar 2.2: Model View Controller
Controller pada dasarnya merupakan penerima tamu dari permintaan yang
datang (HTTP request). Controller merupakan bagian yang mengatur hubungan
antara bagian model dan bagian view, controller berfungsi untuk menerima request
23
dan data dari user kemudian menentukan apa yang akan diproses oleh aplikasi.
View merupakan bagian yang menangani presentation logic. Pada suatu
aplikasi web bagian ini biasanya berupa �le template HTML, yang diatur oleh con-
troller. View berfungsi untuk menerima dan merepresentasikan data kepada user.
Bagian ini tidak memiliki akses langsung terhadap bagian model.
Model merupakan representasi dari proses bisnis di dalam setiap aplikasi
perangkat lunak. Model adalah bagian yang bertugas mengolah data mentah men-
jadi data yang mengandung arti yang diinginkan oleh pengguna. Model biasanya
berhubungan langsung dengan database untuk memanipulasi data, menangani vali-
dasi dari bagian controller, namun tidak dapat berhubungan langsung dengan bagian
view.
2.6.5 Jenis-Jenis Framework
Berikut ini jenis-jenis framework yang sering digunakan
1. .NET Framework,
2. PHP Framework,
3. Ruby On Rails (untuk membuat aplikasi web dengan bahasa Ruby),
4. Django (untuk membuat aplikasi Web dengan bahasa Python),
5. Google Web Toolkit (GWT),
2.7 Pengenalan Database
Database adalah suatu kumpulan data yang terintegrasi yang di organisas-
ikan untuk memenuhi kebutuhan para pemakai di dalam suatu organisasi. Semua
24
pengaksesan ke database ditangani oleh suatu piranti lunak yang disebut Database
Management System.
Secara �sik suatu database terdiri atas entitas-entitas yang biasanya disebut
tabel. Tiap-tiap tabel tersebut mempunyai atribut-atribut yang disebut �eld. Dan
isi dari tabel tersebut disebut tupel atau record yang merupakan tumpukan baris
yang mempunyai minimal satu atribut dari tabel tersebut.
Structure Query Language, atau biasa disingkat SQL, adalah bahasa yang
digunakan untuk mende�nisikan, memanipulasi, dan mengontrol suatu database.
MySQL adalah database server relasional dibawah lisensi GNU (General Public Li-
cense). Dengan sifatnya yang Open Source, memungkinkan juga user untuk mem-
odi�kasi pada kode sumbernya untuk memenuhi kebutuhan spesi�kasi. MySQL
merupakan database multi-user. Dengan memiliki banyak �tur, MySQL bisa ber-
saing dengan database komersial sekalipun. Tidak mengejutkan, bahwa MySQL
menjadi database pilihan untuk banyak pengguna PHP.
MySQL yang merupakan hasil pikiran dari Michael Monty Widenius, David
Axmark, dan Allan Larson dimulai tahun 1995. Mereka bertiga kemudian mendirikan
perusahaan bernamaMySQL AB di Swedia. Tujuan awal ditulisnya programMySQL
adalah untuk mengembangkan aplikasi web yang akan digunakan oleh salah satu
client MySQL AB. Memang pada saat itu, MySQL AB merupakan sebuah perusa-
haan konsultan database dan pengembang software.
MySQL versi 1.0 dirilis pada mei 1996 dan penggunaannya hanya terbatas
dikalangan intern saja. Pada bulan Oktober 1996, MySQL versi 3.11.0 dirilis ke
masyarakat luas di bawah lisensi "Terbuka tapi Terbatas". Barulah pada bulan Juli
2000, MySQL AB mengumumkan, bahwa mulai MySQL versi 3.23.19 diterapkan
sebagai General Public License (GPU).
Seperti halnya SQL engine yang lain. MySQL mempunyai tiga sub bahasa,
25
yaitu : Data De�nition Language (DDL), Data Manipulation Language (DML) dan
Data Control Language (DCL). DDL berfungsi pada obyek database, seperti mem-
buat tabel, mengubah tabel, dan menghapus tabel. DML untuk objek tabel, seperti
melihat, menambah, menghapus dan mengubah isi tabel. Sedangkan DCL untuk ke-
pentingan sekuritas database, seperti memberikan hak akses ke database dan meng-
hapus hak tersebut dari database.
2.7.1 DDL (Data De�nition Language)
DDL bertugas untuk membuat obyek SQL dan menyimpan de�nisinya dalam
tabel. Contoh dari obyek yang dimaksud diatas adalah tabel, view, dan index.
Pembuatan tabel, perubahan struktur tabel, perubahan nama tabel, serta perintah
untuk menghapus tabel, dilakukan dengan sub bahasa yang tergolong dalam DDL.
Perintah-perintah yang digolongan dalam DDL adalah create, alter, dan drop.
2.7.1.1 Create
Perintah untuk membuat tabel. Bentuk umumnya adalah create table na-
ma_table (nama_�eld1 type, nama_�eld2 type,..., nama_�eld_n type);
2.7.1.2 Alter
Perintah untuk mengubah struktur tabel antara lain :
1. Perubahan nama �eld
Alter table nama_table change nama_�eld_lama nama_�eld_baru tipe_data;
2. Perubahan tipe data
Alter table nama_table modify nama_�eld_baru tipe_data_baru;
26
3. Penambahan �eld
Alter table nama_table add nama_�eld tipe_data_baru;
4. Penghapusan �eld
Alter table nama_tabel drop column nama_�eld;
2.7.1.3 Drop
Perintah menghapus tabel. Bentuk umumnya adalah Drop table nama_table;
2.7.2 DML (Data Manipulation Language)
DML digunakan untuk menampilkan, mengubah, menambah dan menghapus
baris dalam tabel. Perintah - perintah yang digolongkan dalam DML adalah select,
update, insert dan delete.
2.7.2.1 Insert
Perintah memasukkan data. Bentuk umumnya adalah
Insert into nama_table values (isi_�eld1, isi_�eld2,..., isi_�eld_n);
atau
Insert into nama_table (nama_�eld_1, nama_�eld_2, ... ,nama_�eld_n)
values (isi_�eld1, isi_�eld2, ... , isi_�eld_n);
2.7.2.2 Select
Perintah untuk menampilkan data. Bentuk umumnya adalah Select na-
ma_�eld_1, nama_�eld_2, ... , nama_�eld_n from nama_tabel where criteria
order by nama_�eld ascending | descending;
27
2.7.2.3 Delete
Perintah untuk menghapus data. Bentuk umumnya adalah Delete from na-
ma_tabel where criteria;
2.7.2.4 Update
Perintah untuk mengubah data. Bentuk umumnya adalah Update nama_tabel
set nama_�eld_1 = isi_baru_1, nama_�eld_2 = isi_baru_2, ... , nama_�eld_n
= isi_baru_n, where criteria;
2.7.3 DCL (Data Control Language)
Sebagai alat kontrol keamanan terhadap database dan tabelnya digunakan
DCL. Dua perintah utama di dalam DCL adalah grant dan revoke.
2.7.3.1 Grant
Perintah untuk mengizinkan user mengakses tabel dalam database tertentu.
Bentuk umumnya adalah
Grant jenis_statement_yang_diizinkan | all priveleges on nama_database
to nama_user;
2.7.3.2 Revoke
Perintah untuk mencabut kembali izin yang sudah pernah diberikan sebelum-
nya oleh grant. Bentuk umumnya adalah
Revoke jenis_statement_yang_diizinkan | all priveleges on nama_database
from nama_user;
28
2.8 Diagram UML
Abstraksi konsep dasar UML yang terdiri dari structural classi�cation, dy-
namic behavior, dan model management, bisa kita pahami dengan mudah apabila
kita melihat gambar dibawah dari Diagrams. Main concepts bisa kita pandang se-
bagai term yang akan muncul pada saat kita membuat diagram dan view adalah
kategori dari diagram tersebut.
2.8.1 Use Case Diagram
Use case diagram menggambarkan fungsionalitas yang diharapkan dari se-
buah sistem. Yang ditekankan adalah "apa" yang diperbuat sistem, dan bukan
"bagaimana". Sebuah use case merepresentasikan sebuah interaksi antara aktor
dengan sistem. Use case merupakan sebuah pekerjaan tertentu, misalnya login ke
sistem, meng-create sebuah daftar belanja, dan sebagainya. Seorang/sebuah aktor
adalah sebuah entitas manusia atau mesin yang berinteraksi dengan system untuk
melakukan pekerjaan-pekerjaan tertentu.
Gambar 2.3: Use Case Diagram
29
Use case diagram dapat sangat membantu bila kita sedang menyusun require-
ment sebuah sistem, mengkomunikasikan rancangan dengan klien, dan merancang
test case untuk semua feature yang ada pada sistem. Sebuah use case dapat meng-
include fungsionalitas use case lain sebagai bagian dari proses dalam dirinya. Secara
umum diasumsikan bahwa use case yang di-include akan dipanggil setiap kali use
case yang meng-include dieksekusi secara normal. Sebuah use case dapat di-include
oleh lebih dari satu use case lain, sehingga duplikasi fungsionalitas dapat dihindari
dengan cara menarik keluar fungsionalitas yang common. Sebuah use case juga
dapat meng-extend use case lain dengan behaviour -nya sendiri. Sementara hubun-
gan generalisasi antar use case menunjukkan bahwa use case yang satu merupakan
spesialisasi dari yang lain.
2.8.2 Class Diagram
Class adalah sebuah spesi�kasi yang jika diinstansiasi akan menghasilkan se-
buah objek dan merupakan inti dari pengembangan dan desain berorientasi objek.
Class menggambarkan keadaan (atribut/properti) suatu sistem, sekaligus menawarkan
layanan untuk memanipulasi keadaan tersebut (metoda/fungsi). Class diagram
menggambarkan struktur dan deskripsi class, package dan objek beserta hubun-
gan satu sama lain seperti containment, pewarisan, asosiasi, dan lain-lain. Class
memiliki tiga area pokok :
1. Nama (dan stereotype)
2. Atribut
3. Metoda
Atribut dan metoda dapat memiliki salah satu sifat berikut :
30
Gambar 2.4: Class Diagram
1. Private, tidak dapat dipanggil dari luar class yang bersangkutan.
2. Protected, hanya dapat dipanggil oleh class yang bersangkutan dan anak-anak
yang mewarisinya.
3. Public, dapat dipanggil oleh siapa saja.
Class dapat merupakan implementasi dari sebuah interface, yaitu class ab-
strak yang hanya memiliki metoda. Interface tidak dapat langsung diinstansiasikan,
tetapi harus diimplementasikan dahulu menjadi sebuah class.
2.8.3 Activity Diagram
Activity diagrams menggambarkan berbagai alur aktivitas dalam sistem yang
sedang dirancang, bagaimana masing-masing alur berawal, decision yang mungkin
terjadi, dan bagaimana mereka berakhir. Activity diagram juga dapat menggam-
barkan contoh class diagram, menggambarkan proses paralel yang mungkin terjadi
pada beberapa eksekusi. Activity diagram merupakan state diagram khusus, di
31
mana sebagian besar state adalah action dan sebagian besar transisi di-trigger oleh
selesainya state sebelumnya (internal processing). Oleh karena itu activity diagram
tidak menggambarkan behaviour internal sebuah sistem (dan interaksi antar subsis-
tem) secara eksak, tetapi lebih menggambarkan proses-proses dan jalur-jalur aktivi-
tas dari level atas secara umum. Sebuah aktivitas dapat direalisasikan oleh satu use
case atau lebih. Aktivitas menggambarkan proses yang berjalan, sementara use case
menggambarkan bagaimana aktor menggunakan sistem untuk melakukan aktivitas.
Gambar 2.5: Activiti Diagram
Sama seperti state, standar UML menggunakan segiempat dengan sudut
membulat untuk menggambarkan aktivitas. Decision digunakan untuk menggam-
barkan behaviour pada kondisi tertentu. Untuk mengilustrasikan proses-proses par-
alel (fork dan join) digunakan titik sinkronisasi yang dapat berupa titik, garis hor-
izontal atau vertikal. Activity diagram dapat dibagi menjadi beberapa object swim-
lane untuk menggambarkan objek mana yang bertanggung jawab untuk aktivitas
tertentu.
32
2.8.4 Sequence Diagram
Sequence diagram menggambarkan interaksi antar objek di dalam dan di
sekitar sistem (termasuk pengguna, display, dan sebagainya) berupa message yang
digambarkan terhadap waktu. Sequence diagram terdiri antar dimensi vertikal (wak-
tu) dan dimensi horizontal (objek-objek yang terkait). Sequence diagram biasa
digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang
dilakukan sebagai respons 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. Masing-masing
objek, termasuk aktor, memiliki lifeline vertikal.
Gambar 2.6: Sequence Diagram
Message digambarkan sebagai garis berpanah dari satu objek ke objek lain-
nya. Pada fase desain berikutnya, message akan dipetakan menjadi operasi/metoda
dari class. Activation bar menunjukkan lamanya eksekusi sebuah proses, biasanya
diawali dengan diterimanya sebuah message. Untuk objek-objek yang memiliki sifat
33
khusus, standar UML mende�nisikan icon khusus untuk objek boundary, controller
dan persistent entity.
Bab 3
ANALISA DAN PEMBAHASAN
3.1 Tinjauan Umum
Kemajuan suatu bangsa sangat ditentukan oleh kualitas pendidikan. Oleh
karena itu, pendidikan sebagai sarana untuk mencerdaskan kehidupan bangsa memi-
liki peranan yang sangat strategis. Pendidikan berkontribusi dalam mengembangkan
sumber daya manusia (SDM) yang bermutu, dengan indikator berkualiti�kasi ahli,
terampil, kreatif, inovatif, serta memiliki attitude (sikap dan perilaku) yang positif.
Pendidikan sekolah merupakan pusat menimba berbagai ilmu terutama ilmu
pengetahuan serta sebagai lembaga pendidikan. Sehingga sekolah sangat mement-
ingkan kualitas serta mutu belajar, untuk itu informasi yang disampaikan haruslah
mudah dan dimengerti serta dapat diakses oleh masyarakat luas. Agar ketika ingin
memasuki lingkungan sekolah tidak perlu lagi untuk mendatangi sekolah tersebut.
Seiring dengan kebutuhan dan perkembangan teknologi seperti internet, da-
pat dimanfaatkan dalam pembuatan website sekolah. Dimana website sekolah dapat
dijadikan sebagai pusat penyampaian informasi, yang dapat memudahkan masyarakat
dalam mengakses informasi sekolah tersebut, sehingga tidak dibatasi ruang dan wak-
tu.
SMA Negeri 1 Ciomas merupakan salah satu SMA Negeri yang terdapat di
Kabupaten Bogor. Selama perjalanannya telah banyak menghasilkan lulusan yang
berhasil masuk ke PTN yang ada di Bogor maupun di Luar Bogor.
34
35
3.2 Analisa Masalah
Dalam lingkungan sekolah, ada berbagai cara untuk menyampaikan infor-
masi. Biasanya para siswa mendapatkan informasi seputar kegiatan sekolah melalui
madding sekolah yang telah ditempel atau dengan membagikan surat pengumuman,
dan juga dapat dilakukan secara lisan lewat pengumuman tiap kelas.
Informasi yang didapat di sekolah biasanya terbatas karena informasi yang
diberikan tidak sepenuhnya diberikan oleh pihak sekolah. Karena keterbatasan wak-
tu maupun kesibukan para guru maupun sta� sekolah tersebut. Informasi yang
diberikan berupa data guru maupun siswa,dan info terbaru di sekolah.
Dalam SMA Negeri 1 Ciomas informasi yang didapat hanya melalui selebaran
brosur dan madding saja. Sehingga informasi yang didapat masih kurang lengkap
pada pusat informasi dan memungkinkan terjadinya kesalahan dalam penyampaian
informasi seperti pelayanan informasi yang kurang memuaskan dan informasi yang
masih simpang siur. Dan juga hambatan yang dialami dikarenakan banyak orang
yang belum mengetahui SMA Negeri 1 Ciomas dan hanya mengetahui sekolah SMA
Negeri 1 Ciomas melalui mulut ke mulut sehingga orang kurang jelas tentang seluk-
beluk sekolah SMA Negeri 1 Ciomas.
3.3 Pemecahan Masalah
Website yang akan dibuat menyajikan kepraktisan informasi SMA Negeri
1 Ciomas yang dapat meningkatkan kualitas dan kuantitas dengan memanfaatkan
teknologi internet. Begitu juga masyarakat luas dapat melakukan pengaksesan den-
gan cepat tanpa harus mendatangi sekolah tersebut. Dengan adanya web sekolah,
maka siswa dapat melihat informasi maupun pengumuman secara langsung tanpa
harus datang ke sekolah.
36
Dengan pembuatan aplikasi website SMANegeri 1 Ciomas maka dapat meningkatkan
penyajian informasi yang komunikatif serta dapat memperoleh kebutuhan informasi
dengan cepat, mudah dan lebih e�sien. Sehingga SMA Negeri 1 Ciomas tidak hanya
dikenal di daerah Bogor saja, tapi diseluruh Indonesia maupun dunia.
Dalam proses pembuatannya, situs dibuat dengan melalui beberapa tahap,
yaitu:
1. Perencanaan situs.
2. Perancangan situs.
3. Implementasi.
3.4 Perencanaan Situs
Pada tahapan ini penyusun mencari ide untuk menentukan gaya design yang
ingin digunakan. Melalui referensi dari situs Cool Web Design, http://www.cwd.dk,
penulis menemukan gaya design yang cocok untuk penulis implementasikan pada
situs yang penulis buat. Selanjutnya penulis mencari contoh layout sebuah web
untuk menentukan usability dan navigasi yang tepat.
Situs yang penulis buat lebih ditujukan untuk kalangan sendiri, oleh karena
itu yang bisa menjadi member di situs ini adalah guru maupun siswa SMA Negeri 1
Ciomas. Namun pengunjung situs yang yang bukan guru maupun siswa SMA Negeri
1 Ciomas tetap dapat melihat berita-berita maupun events-events dan perkemban-
gan terbaru dari SMA Negeri 1 Ciomas.
Untuk menjadi member di situs SMA Negeri 1 Ciomas ini, siswa maupun guru
langsung menghubungi webmaster. Hal ini digunakan untuk mencegah terjadinya
penambahan atau perubahan data yang tidak diinginkan, karena pemantauan situs
37
yang belum optimal. Member pada situs ini terbagi menjadi dua tingkatan/level.
Dua tingkatan tersebut adalah :
1. Webmaster, merupakan level tertinggi dan mempunyai feature yang lebih
lengkap dibandingkan dengan level-level yang lain. Member yang berada pa-
da level ini biasanya adalah orang yang dapat mengelola suatu situs web dan
mengerti tentang dunia internet secara mendalam.
2. Reguler Member, merupakan member dengan level paling rendah. Feature
yang dimiliki sangat terbatas.
3.5 Perancangan Situs
Tahapan ini merupakan tahapan persiapan pembuatan situs dan terdiri dari
beberapa langkah. Dan akan dijelaskan secara detail pada sub bab berikut.
3.5.1 Perancangan Database
Perancangan database merupakan suatu perancangan yang bertujuan untuk
menggambarkan struktur dan bagian-bagian dari suatu database. Dengan membuat
rancangan database, relasi antar tabel juga akan terlihat.
Dibawah ini merupakan rancangan database di dalam web SMA Negeri 1
Ciomas. Secara umum database web sekolah ini memiliki 9 tabel yang masing-
masing tabelnya memiliki �eld tersendiri. Ke-9 tabel itu antara lain:
1. Tabel admin
Tabel ini digunakan untuk menyimpan username dan password yang digu-
nakan untuk masuk kedalam halaman admin. Baik berstatus admin maupun
user. Field-�eld yang dimiliki sebagai berikut :
38
Tabel 3.1: Tabel Admin
2. Tabel berita_events
Tabel ini digunakan untuk menyimpan artikel berupa berita dan events-events.
Field-�led yang digunakan sebagai berikut :
Tabel 3.2: Tabel berita_events
3. Tabel data_siswa
Tabel yang digunakan untuk menyimpan informasi jumlah siswa laki-laki dan
perempuan setiap kelas pada tahun ajaran tertentu dan jumlah siswa pada
tiga tahun terakhir. Field-�eld yang digunakan sebagai berikut :
39
Tabel 3.3: Tabel data_siswa
4. Tabel galery
Tabel ini digunakan untuk menyimpan gambar. Field yang dimiliki :
Tabel 3.4: Tabel galery
5. Tabel guru
Tabel yang digunakan untuk menyimpan informasi mengenai data-data guru.
Field-�led yang dimiliki sebagai berikut :
40
Tabel 3.5: Tabel guru
6. Tabel pesan
Tabel ini digunakan untuk menyimpan pesan. Field-�eld yang dimiliki :
Tabel 3.6: Tabel pesan
7. Tabel pro�leskul
Tabel ini digunakan untuk menyimpan informasi visimisi, sejarah sekolah,
struktur organisasi, dan sambutan dari kepala sekolah. Field-�led yang dimi-
liki :
41
Tabel 3.7: Tabel pro�leskul
8. Tabel pro�le_skul
Tabel yang digunakan untuk menyimpan pro�l sekolah. Field-�led yang dim-
iliki sebagai berikut :
Tabel 3.8: Tabel pro�le_skul
9. Tabel pro�le_skul_2
Tabel ini digunakan untuk menyimpan informasi mengenai prestasi, program,
dan kerjasama antar lembaga. Filed-�lednya sebagai berikut :
42
Tabel 3.9: Tabel pro�le_skul_2
Maksud dibuatnya tabel-tabel beserta �eldnya itu adalah sebagai tempat dimana
data-data yang akan masuk dan keluar dari sistem disimpan.
3.5.2 Perancangan Tampilan Situs
Rancangan situs web merupakan hal yang diperlukan di dalam proses pem-
buatan aplikasi yang terdapat di dalam suatu situs web. Rancangan ini digunakan
untuk mengkomunikasikan kebutuhan user kedalam suatu desain untuk diisi dengan
�tur-�tur website.
Struktur navigasi merupakan rancangan gambaran hubungan dan rantai kerja
dari beberapa kerja atau beberapa area yang berbeda dan dapat membantu men-
gorganisasikan seluruh halaman dalam web dengan pemberian hyperlink.
44
Gambar 3.3: Struktur Navigasi Anggota (Member)
3.5.2.1 Rancangan Halaman Web
Perancangan halaman di dalam web SMA Negeri 1 Ciomas ini di bagi menjadi
3 tampilan dasar. Ke-3 tampilan dasar ini terletak pada :
• Halaman Beranda Tamu (guest),
• Halaman Beranda Anggota (member), dan
• Halaman Beranda Administrator.
45
3.5.2.2 Halaman Beranda Tamu (guest)
Gambar 3.4: Halaman Beranda Tamu (Guest)
Untuk rancangan halaman tamu yang lainnya merupakan pengembangan dari
halaman beranda tamu. Yang berbeda hanya Content atau isi dari web. Sesuai
46
kebutuhan sehingga secara umum dapat digambarkan seperti gambar 3.5.
Gambar 3.5: Halaman Beranda Tamu (Guest)
48
3.5.2.4 Halaman Beranda Administrator
Gambar 3.7: Halaman Beranda Administrator
Halaman anggota (member) tidak jauh berbeda dengan halaman administra-
tor, yang membedakan halaman angota dengan halaman administrator yaitu dari
sisi struktur navigasinya. Struktur navigasi untuk halaman admin lebih lengkap di
bandingkan dengan halaman anggota. Sedangkan untuk menu username&password
pada halaman administrator semua username dan password ditampilkan. Pada ha-
laman anggota hanya menampilkan username dan password milik anggota tersebut
dan tidak dapat dapat menambah anggota (member). Administrator dan anggota
49
(member) dapat mengolah data pada website. Seperti menambah artikel (berita dan
events), gallery dan pada halaman administrator lebih banyak lagi. Pada halaman
administrator ada beberapa isi (content) web yang hanya dapat dilakukan perintah
edit seperti pada menu kata sambutan, visimisi, sejarah sekolah, pro�l sekolah, dan
struktur organisasi pada menu pro�le sekolah. Dan ada beberapa data yang dapat
di tambah, seperti :
1. Tambah Username & password
Gambar 3.8: Halaman Tambah username&password
Digunakan untuk menambah anggota (member) maupun admin. Penambahan
hanya dapat dilakukan oleh administrator. Status disini dibagi menjadi dua
yaitu admin dan user(anggota).
50
2. Tambah Pro�le Sekolah
Halaman ini digunakan untuk menambah pro�le sekolah. Seperti program
sekolah, kerjasama antar lembaga, dan prestasi.
Gambar 3.9: Halaman Tambah Pro�le Sekolah
3. Tambah Guru
Diisi jika ada tambahan guru, baik guru bantu (honorer) maupun guru pin-
dahan dari sekolah lain. Disini diisi tentang data diri guru.
51
Gambar 3.10: Halaman Tambah Guru
4. Tambah Berita & Events
Halaman ini digunakan untuk menambah berita maupun events, penamba-
han dapat berupa penambahan berita ataupun penambahan events dengan
memilih kategori pada combobox.
52
Gambar 3.11: Halaman Tambah Berita dan Events
5. Tambah Gallery
Tambah Gallery digunakan jika ingin menambahkan foto/gambar. Dalam pe-
nambahan foto ini berdasarkan kategori yaitu, Bangunan & Fasilitas Sekolah,
Kegiatan Sekolah, dan Ekstrakulikuler.
53
Gambar 3.12: Halaman Tambah Gallery
3.5.3 Perancangan Sistem
Perancangan sistem pada pembangunan situs web ini menggunakan UML
yang digunakan untuk merancang model sebuah sistem. Perancangan model sistem
pada situs web ini digambarkan melalui Diagram Use Case, Diagram Sequence,
Diagram Activity, dan Class Diagram.
3.5.3.1 Use Case Diagram
Pada diagram ini terdapat tiga aktor yang merupakan pengguna sistem, yaitu
pengunjung, anggota dan administrator. Pengunjung memiliki use case, yaitu hanya
dapat mengakses informasi sekolah seperti mengakses pro�le sekolah, gallery, mem-
baca berita dan events, menigis buku tamu, dan dapat menghubungi kami yaitu
54
seperti mengirim email.
Gambar 3.13: Use Case Diagram
Anggota dapat mengelola informasi sekolah seperti berita dan events, men-
gelola gallery, dan mengelola account seperti mengubah nama, username, dan pass-
word. Aktor administrator memiliki use case untuk memelihara, mengelola kejadian
yang terjadi selama sistem berlangsung. Selain itu aktor administrator juga memiliki
use case menulis berita dan events, menulis program sekolah, dan menulis prestasi.
55
3.5.3.2 Activity Diagram
Diagram activity administrator yang terlihat pada gambar 3.14, menggam-
barkan bahwa seorang administrator wajib melakukan otenti�kasi dengan melakukan
login terlebih dahulu sebelum dapat mengelola website, apabila admin melakukan
validasi dengan benar maka administrator dapat mengakses menu-menu yang ada
untuk mengelola segala yang berkaitan dengan web SMA Negeri 1 Ciomas. Setelah
selesai, administrator harus keluar dengan melakukan logout.
56
Gambar 3.14: Activity Diagram Administrator
Seperti halnya dengan administrator, semua anggota yang ingin mengakses
menu-menu di halamannya harus melakukan otenti�kasi terlebih dahulu dan men-
gakhirinya dengan melakukan logout.
57
Gambar 3.15: Activity Diagram Anggota
3.5.3.3 Diagram Sequence
Diagram sequence yang terlihat pada gambar menggambarkan administrator
yang dihadapkan pada tampilan halaman login dimana sistem meminta adminis-
trator untuk memasukkan username, password. setelah administrator memasukkan
username, password maka sistem akan mengecek apakah username, password benar
atau salah. Apabila username dan password salah maka akan tampil pesan kesala-
58
han dan sistem akan meminta kembali untuk memasukkan username dan password.
Tetapi jika username dan password yang telah dimasukkan benar maka adminis-
trator akan masuk ke halaman admin. Proses ini sama dengan proses yang terjadi
pada anggota yang ingin masuk ke halaman anggotanya masing-masing
Gambar 3.16: Diagram Sequence Administrator
59
Gambar 3.17: Diagram Sequence Anggota
3.5.3.4 Class Diagram
Class Diagram yang terlihat pada gambar menggambarkan keterhubungan
antar tabel dalam database.
60
Gambar 3.18: Class Diagram
3.6 Implementasi
Tahap ini merupakan tahap pembuatan website SMA Negeri 1 Ciomas den-
gan menerapkan model MVC (Model View Controller) dalam penggunaan Frame-
61
work PHP CodeIgniter 1.7.1.
3.6.1 Framework CodeIgniter
CodeIgniter Adalah Framework PHP yang menggunakan pola MVC (Model
View Controller) CodeIgniter yang dapat digunakan oleh siapa saja untuk keperluan
pembuatan situs web. Struktur CodeIgniter lebih banyak meniru Ruby on Rail
(RoR), sebuah framework pembuatan aplikasi web dengan menggunakan bahasa
pemrograman Ruby. Selain itu, dokumentasinya lebih lengkap dan tentunya mudah
dipahami.
CodeIgniter dikembangkan oleh EllisLab Inc, framewok dibawah lisensi Apache
/ BSD-style open source sehingga Framework ini termasuk aplikasi Open Source
oleh karena itu kita dapat menggunakan, menggandakan, memodi�kasi dan mendis-
tribusikan framework CodeIgniter beserta dokumentasi untuk banyak tujuan.
Framework CodeIgniter berjalan pada PHP versi 4.3.2 atau yang lebih ter-
baru, dan mendukung database diantaranya:
• MySQL
• MySQLi
• MS SQL
• Postgres
• Oracle
• SQLite
• ODBC
62
Keunggulan framework CodeIgniter :
• CodeIgniter sangat ringan, terstruktur, mudah dipelajari, dokumentasi lengkap
dan support yang luar biasa dari forum CodeIgniter.
• Menggunakan pattern MVC yang mempermudah dan meningkatkan �esibilitas
• Menghasilkan url yang search engine friendly
• Mudah untuk membuat library dan helpernya
• Jalan di PHP 4 (4.3.2+) dan 5
• Support banyak database MySQL (4.1+), MySQLi, MS SQL, Postgres, Oracle,
SQLite, dan ODBC.
• Sekuritas aplikasi terjaga
• Banyak library dan helper yang mempermudah pekerjaan
3.6.2 Struktur Direktori
Struktur direktori dari framework CodeIgniter seperti pada gambar 3.19 Di-
rektori Application merupakan direktori yang sangat penting karena pada direktori
ini aplikasi web dibuat.
• Folder system menyimpan semua �le, baik itu �le aplikasi yang kita buat
maupun core frameworknya.
• Folder application: disinilah aplikasi yang akan kita bangun diletakkan
• Folder con�g : tempat menyimpan semua �le kon�gurasi yang ada di aplikasi
mulai dari database, router dan autoload dari aplikasi
63
Gambar 3.19: Struktur Direktori CodeIgniter
• Folder controllers : tempat menyimpan semua �le controller.
• Folder errors : tempat menyimpan semua template error aplikasi
• Folder helpers : tempat menyimpan helper-helper yang bukan berasal dari CI
• Folder hooks : tempat menyimpan hook yang digunakan untuk mengubah alur
fungsi dari core CI
• Folder language tempat menyimpan bahasa-bahasa yang akan di gunakan
64
• Folder libraries tempat menyimpan semua library buatan kita sendiri
• Folder models tempat menyimpan semua model.
• Folder views tempat menyimpan semua �le view applikasi.
• Folder cache tempat menyimpan semua cache yang dibuat caching library.
• Folder codeigniter tempat menyimpan semua semua �le internals CI.
• Folder database tempat menyimpan semua driver database drivers dan class
yang akan digunakan.
• Folder fonts tempat menyimpan semua fonts yang digunakan image manipu-
lation library.
• Folder helpers tempat menyimpan semua helper core CI.
• Folder language tempat menyimpan semua langguage core CI.
• Folder libaries tempat menyimpan semua library core CI
• Folder logs tempat menyimpan semua logs generated oleh CI.
• Folder plugin tempat menyimpan semua plugin core CI.
• Folder sca�olding tempat menyimpan semua �le yang berfungsi sebagai scaf-
folding .
• Folder user_guide berisi userguide/manual penggunaan CI.
Framework CodeIgniter juga menyediakan libray dan helper untuk memper-
mudah pembuatan website.
65
3.6.3 Helper
Helper, sama seperti namanya bertujuan untuk membantu pengguna dalam
membuat website yang berbasis framework khususnya CodeIgniter. File Helper
adalah sekumpulan fungsi sederhana yang disediakan oleh Framework CodeIgniter.
Tidak seperti sebagian besar system pada CodeIgniter. Helper tidak ditulis dengan
format OOP (Object Oriented Programming). Helper fungsi procedural yang seder-
hana. Setiap fungsi helper mewakili satu tugas tertentu dengan tidak bergantung
dengan fungsi yang lain.
Secara default CodeIgniter tidak memuat �le helper. File helper harus dimuat
sehingga dapat diakses oleh Controller dan View.
File helper pada Framework CodeIgniter disimpan didalam direktori sys-
tem/helpers atau di direktori system/application/helpers. CodeIgniter pertama
akan memuat �le helper pada direktori system/application/helpers, apabila tidak
terdapat �le helper pada director tersebut maka CodeIgniter akan memuat �le helper
yang ada pada direktori system/helpers
3.6.3.1 Memuat Helper
Untuk menggunakan helper kita harus memuat helper terlebih dahulu, memu-
at �le helper kita menggunakan fungsi seperti dibawah ini
$this->load->helper('nama_helper');
Penulisan nama Helper tidak menyertakan ekstensi php dari �le helper terse-
but. Jika ingin memuat lebih dari satu �le helper kita dapat menyertakan nama �le
helper dalam array seperti contoh di bawah ini
$this->load->helper( array('nama_helper1', 'nama_helper2', 'na-
ma_helper3') );
66
File helper dapat diakses secara global pada CodeIgniter dan dapat dimuat
secara otomatis ketika web diakses web browser atau dikenal dengan istilah auto-load
yaitu dengan menambahkan nama helper yang diperlukan pada �le autoload.php
pada direktori system/applicaton/con�g contoh penggunaanya seperti dibawah ini
$autoload['helper'] = array('url','form','date', 'text', 'security');
Jenis-Jenis Helper
1. Array Helper
File helper yang terdiri dari fungsi yang membantu penggunaan array. Helper
ini dapat dimuat dengan menggunakan perintah dibawah ini.
$this->load->helper('array');
Fungsi yang tersedia pada helper array:
• element( ) : fungsi untuk mengambil data dari suatu tipe data array
• random_element() : fungsi untuk mengambil data array sebagai input
dan kemudian mengembalikan menjadi elemen acak dari data array terse-
but
2. Cookie Helper
File Helper yang terdiri dari fungsi yang membantu pengerjaan dengan cookies.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah ini
$this->load->helper('cookie');
Fungsi yang tersedia pada helper cookie:
• set_cookie() : fungsi untuk mengisi cookie dengan suatu nilai.
67
• get_cookie() : fungsi untuk mendapatkan isi dari cookie
• delete_cookie() : fungsi untuk menghapus cookie
3. Date Helper
File Helper yang terdiri dari fungsi yang membantu pengerjaan dengan Tang-
gal. Untuk memuat helper ini kita dapat menggunakan perintah dibawah ini
$this->load->helper('date');
Fungsi yang tersedia pada helper date antara lain now(), mdate(), standard_date(),
local_to_gmt(), gmt_to_local(), mysql_to_unix(), unix_to_human(),
human_to_unix(), timespan(), timezones(), timezone_menu()
4. Directory Helper
File Helper yang terdiri dari fungsi yang membantu pengerjaan yang berhubun-
gan dengan direktori. Untuk memuat helper ini kita dapat menggunakan per-
intah dibawah
$this->load->helper('directory');
Fungsi yang tersedia pada helper direktory : directory_map
5. Download Helper
File Helper yang terdiri dari fungsi yang membantu pengerjaan yang berhubun-
gan dengan pengunduhan data. Untuk memuat helper ini kita dapat meng-
gunakan perintah dibawah
$this->load->helper('download');
Fungsi yang tersedia pada helper download : force_download
68
6. Email Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan email.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah
$this->load->helper('email');
Fungsi yang tersedia pada helper email : valid_email, send_email
7. File Helper
File Helper yang terdiri dari fungsi yang membantu pengerjaan yang berhubun-
gan dengan �le. Untuk memuat helper ini kita dapat menggunakan perintah
dibawah
$this->load->helper('�le');
Fungsi yang tersedia pada helper �le : read_�le, write_�le, delete_�les,
get_�lenames, get_dir_�le_info, get_�le_info, get_mime_by_extension, sym-
bolic_permissions, octal_permissions.
8. Form Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan form.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah
$this->load->helper('form');
Fungsi yang tersedia pada helper form : form_open(), form_open_multipart(),
form_hidden(), form_input(), form_password(), form_upload(), form_textarea(),
form_dropdown(), form_�eldset(), form_�eldset_close(), form_checkbox(),
form_radio(), form_submit(), form_label(), form_reset(), form_button(),
form_close(), form_prep(), set_value(), set_select(), set_checkbox(), set_radio().
69
9. HTML Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan HTML.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah
$this->load->helper('html');
Fungsi yang tersedia pada helper html : br(), heading(), img(), link_tag(),
nbs(), ol(), ul(), meta(), doctype().
10. In�ector Helper
File Helper yang menyediakan fungsi yang mengizinkan user untuk mengubah
kata menjadi tunggal(singular), jamak(plural), camel case. Untuk memuat
helper ini kita dapat menggunakan perintah dibawah
$this->load->helper('in�ector');
Fungsi yang tersedia pada helper in�ector : singular(), plural(), camelize(),
underscore(), humanize().
11. Number Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan data
numerik. Untuk memuat helper ini kita dapat menggunakan perintah dibawah
ini
$this->load->helper('number');
Fungsi yang tersedia pada helper number adalah byte_format().
12. Path Helper
File Helper yang menyediakan fungsi yang yang mengizinkan user untuk bek-
erja dengan �le path pada server. Untuk memuat helper ini kita dapat meng-
gunakan perintah dibawah ini
70
$this->load->helper('path');
Fungsi yang tersedia pada helper path adalah set_realpath().
13. Security Helper
File Helper yang menyediakan fungsi yang digunakan untuk keperluan security.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah ini
$this->load->helper('security');
Fungsi yang tersedia pada helper security adalah xss_clean(), dohash(),
strip_image_tags(), encode_php_tags().
14. String Helper
File Helper yang menyediakan menyediakan fungsi yang membantu bekerja
dengan string. Untuk memuat helper ini kita dapat menggunakan perintah
dibawah ini
$this->load->helper('string');
Fungsi yang tersedia pada helper string adalah random_string(), alterna-
tor(), alternator(), reduce_double_slashes(), repeater(), trim_slashes(), re-
duce_multiples(), quotes_to_entities(), strip_quotes().
15. Text Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan text.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah ini
$this->load->helper('text');
Fungsi yang tersedia pada helper text adalah word_limiter(), character_limiter(),
ascii_to_entities(), entities_to_ascii(), word_censor(), highlight_code(), high-
light_phrase(), word_wrap().
71
16. URL Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan text.
Untuk memuat helper ini kita dapat menggunakan perintah dibawah ini
$this->load->helper('url');
Fungsi yang tersedia pada helper URL adalah site_url(), base_url(), cur-
rent_url(), uri_string(), index_page(), anchor(), anchor_popup(), mailto(),
safe_mailto(), auto_link(), url_title(), prep_url(), redirect().
17. XML Helper
File Helper yang menyediakan fungsi yang membantu bekerja dengan data
XML. Untuk memuat helper ini kita dapat menggunakan perintah dibawah
ini.
$this->load->helper('xml');
Fungsi yang tersedia pada helper XML adalah xml_convert().
3.6.4 Library
Pada Framework CodeIgniter terdapat �le library yang digunakan untuk
pembuatan web. Semua �le library yang tersedia terletak pada direktori system/libraries.
Untuk menggunakan library tersebut dengan cara menyertakan pada controller den-
gan menggunakan kode dibawah ini.
$this->load->library('nama_kelas');
Nama_kelas merupakan nama kelas yang digunakan. Berikut ini contoh
untuk memuat library validation class
$this->load->library('validation');
72
Macam - macam Library class
1. Benchmarking Class
CodeIgniter mempunyai Benchmarking Class yang selalu aktif. Benchmarking
class ini sudah di inisialisasi secara otomatis oleh sistem CodeIgniter sehingga
user tidak perlu memuat �le ini.
2. Calendering Class
Calendaring Class memperbolehkan user untuk membuat kalender dengan di-
namis. Kalender dapat dibuat menggunakan template. Dan memperbolehkan
pengontrolan setiap aspek dari design tersebut. Dan user juga dapat melakukan
passing data pada kalender.
3. Con�g Class
Con�g Class menyediakan cara untuk melakukan pengambilan kon�gurasi
preferensi. Preferensi kon�gurasi dapat berasal dari �le con�g pada direk-
tori system/application/con�g/ atau �le yang dibuat oleh user. Con�g class
juga ini sudah di inisialisasi secara otomatis oleh sistem CodeIgniter sehingga
user tidak perlu memuat �le ini.
4. Database Class
Database Class menyediakan cara untuk koneksi dengan database, serta melakukan
operasi-operasi pada database. Untuk menginisialisasi database class ini den-
gan menggunakan kode seperti dibawah ini.
$this->load->database();
Atau juga dapat menambahkan database di bagian libraries pada �le au-
toload.php pada direktori system/application/con�g.
73
5. Email Class
Email Class digunakan dalam keperluan yang berhubungan dengan email seper-
ti mengirim email. Untuk menginisialisasi class ini dengan menggunakan kode
seperti dibawah ini.
$this->load->library('email');
Atau juga dapat menambahkan email di bagian libraries pada �le autoload.php
pada direktori system/application/con�g.
6. Encryption Class
Encryption Class digunakan dalam keperluan yang berhubungan dengan enkrip-
si data. CodeIgniter juga menyediakan enkripsi 2 arah. Dan mendukung
metode enkripsi yang lain seperti MCrypt, SHA, Chipper. Untuk menginisial-
isasi class ini dengan menggunakan kode seperti dibawah ini.
$this->load->library('encrypt');
Atau juga dapat menambahkan encrypt di bagian libraries pada �le autoload.php
pada direktori system/application/con�g.
7. File Uploading Class
File Uploading Class digunakan dalam keperluan yang berhubungan dengan
pengunggahan data. Menginisialisasi class ini dengan menggunakan kode
seperti dibawah ini.
$this->load->library('upload');
Setelah upload class dimuat maka objek akan tersedia dengan menggunakan
$this->upload.
74
8. FTP Class
CodeIgniter juga mempunyai FTP Class yang memperbolehkan data di trans-
fer ke remote server. Data remotes dapat dipindahkan, diubah namanya dan
di hapus. Menginisialisasi class ini dengan menggunakan kode seperti dibawah
ini.
$this->load->library('ftp');
Fungsi - fungsi yang terdapat pada ftp class ini antara lain connect(), upload(),
rename(), move(), delete_�le(), delete_dir(), list_�les(), mirror(), mkdir(),
chmod(), close().
9. HTML Table Class
HTML Table Class menyediakan fungsi pembangkit otomatis tabel HTML
dari array atau hasil pengambilan dari database. Menginisialisasi class ini
dengan menggunakan kode seperti dibawah ini.
$this->load->library('table')
Fungsi - fungsi yang terdapat pada HTML Table class adalah generate(),
set_caption(), set_heading(), add_row(), make_columns(), set_template(),
set_empty().
10. Image Manipulation Class
Image Manipulation class digunakan untuk mengubah ukuran gambar, mem-
buat thumbnail gambar, memotong gambar, merotasi gambar, efek water-
marking. Menginisialisasi class ini dengan menggunakan kode seperti dibawah
ini.
$this->load->library('image_lib')
75
Fungsi - fungsi yang terdapat pada Image Manipulation class adalah resize(),
crop(),rotate(),clear(),watermark().
11. Input Class.
Input class mempunyai 2 kegunaan
• sebagai pra-proses input data untuk sekuriti.
• menyediakan beberapa fungsi helper untuk pengambilan input data dan
untuk keperluan security �ltering dan xss �ltering. Fungsi - fungsi yang
terdapat pada input class adalah xss_clean(), post(), get(), get_post(),
cookie(), server(), ip_address(), valid_ip($ip), user_agent().
12. Output Class.
Output class adalah class kecil yang mempunyai satu fungsi utama. Un-
tuk mengirimkan hasil ke web browser. Output class juga dapat digunakan
dalam proses caching halaman web jika user menggunakan �tur tersebut. Out-
put class dimuat secara otomatis sehingga user tidak perlu diinisialisasi oleh
user. Fungsi - fungsi yang terdapat pada input class adalah set_output(),
get_output(), set_header(), set_status_header(), enable_pro�ler(), cache().
13. Pagination Class.
Pagination class biasa digunakan untuk proses paging. Pada CodeIgniter pag-
ination class sangat mudah digunakan dan mudah untuk diatur oleh user.
Menginisialisasi class ini dengan menggunakan kode seperti dibawah ini.
$this->load->library('pagination')
76
14. Session Class
Session class digunakan untuk keperluan session pada user. untuk Mengin-
isialisasi class ini dengan menggunakan kode seperti dibawah ini.
$this->load->library('session')
Fungsi - fungsi yang terdapat pada Session class adalah userdata(), set_userdata(),
unset_userdata(), set_�ashdata(), �ashdata(), keep_�ashdata(), sess_destroy().
15. Trackback Class
Trackback class menyediakan fungsi yang membolehkan user untuk mengir-
im dan menerima data trackback. Untuk Menginisialisasi class ini dengan
menggunakan kode seperti dibawah ini.
$this->load->library('trackback').
16. Unit Testing Class
Unit Testing Class merupakan library pada CodeIgniter yang digunakan untuk
keperluan unit testing. Class ini terdiri dari sebuah fungsi evaluasi dan dua
fungsi hasil. Ini diperuntukkan untuk mengevaluasi kode dan menentukan
apakah web di buat dengan tipe data yang benar. untuk Menginisialisasi class
ini dengan menggunakan kode seperti dibawah ini.
$this->load->library('unit_test').
17. User Agent Class
User Agent Class merupakan library pada CodeIgniter yang digunakan untuk
mengidenti�kasikan informasi tentang browser, perangkat mobile, atau robot
yang mengunjungi web. Untuk Menginisialisasi class ini dengan menggunakan
kode seperti dibawah ini.
77
$this->load->library('user_agent').
Fungsi - fungsi yang terdapat pada class ini adalah is_browser(), is_mobile(),
is_robot(), is_referral(), browser(), version(), mobile(), robot(), platform(),
referrer(), agent_string(), accept_lang(), accept_charset().
18. URI Class
URI Class merupakan library pada CodeIgniter yang menyediakan fungsi un-
tuk membantu mendaptkan informasi dari URI string. Class ini sudah di
inisialisasi secara otomatis oleh sistem Code Igniter sehingga user tidak perlu
memuat �le ini.
Fungsi - fungsi yang terdapat pada class ini adalah rsegment(), slash_segment(),
slash_rsegment(), uri_to_assoc(), ruri_to_assoc(), assoc_to_uri(), uri_string(),
ruri_string(), total_segments(), total_rsegments(), segment_array().
19. Zip Encoding Class
Zip Encoding Class merupakan library pada CodeIgniter yang menyediakan
fungsi untuk membuat �le arsip ZIP. File arsip bisa diunduh ke komputer
atau disimpan ke sebuah direktori. Untuk Menginisialisasi class ini dengan
menggunakan kode seperti dibawah ini.
$this->load->library('zip').
Fungsi - fungsi yang terdapat pada class ini adalah add_dir(), read_�le(),
add_data(), read_dir(), archive(), download()
20. The Typography Class
The Typography Class merupakan library pada CodeIgniter yang menyediakan
fungsi untuk mnegubah format dari teks. Untuk Menginisialisasi class ini
dengan menggunakan kode seperti dibawah ini.
78
$this->load->library('typography').
Fungsi - fungsi yang terdapat pada class ini adalah auto_typography(), for-
mat_characters(), nl2br_except_pre(), protect_braced_quotes.
21. Loader Class
Loader Class merupakan �le library pada CodeIgniter yang berguna untuk
memuat elemen. Elemen elemen tersebut bisa berupa library, �le view, �le
helper, �le plugins.
• Untuk meload �le view :
$this->load->view('�le_name')
• Untuk meload �le model :
$this->load->model('Model_name')
• Untuk meload database :
$this->load->database('options', true/false)
• Untuk meload �le variable array :
$this->load->vars($array)
• Untuk meload �le �le helper :
$this->load->helper('�le_name')
• Untuk meload �le plugin :
$this->load->plugin('�le_name')
• Untuk meload �le :
$this->load->�le('�lepath/�lename', true/false)
• Untuk meload �le con�g :
$this->load->con�g('�le_name')
79
3.6.5 Permodelan MVC pada CodeIgniter
Saat kita mengakses alamat instalasi CodeIgniter, misalkan di alamat
http://localhost/codeigniter, kita menjumpai halaman selamat datang.
Halaman ini disediakan oleh �le welcome_message.php di dalam folder
system/application/views. File tersebut dikontrol oleh �le welcome.php di folder
system/application/controllers.
Disini, controller welcome.php tidak menggunakan model, karena aplikasinya
sangat sederhana, tidak ada pengolahan data, dan tidak memerlukan interaksi den-
gan visitor.
Bagaimana CodeIgniter mengetahui controller mana yang dipanggil saat ki-
ta mengakses alamat root http://localhost/codeigniter (sebenarnya kita mengakses:
http://localhost/codeigniter/index.php/controller_default)? Hal ini, kita de�nisikan
di dalam �le routes.php dalam folder system/application/con�g.
Seperti sudah disebutkan di awal bahwa CodeIgniter menerapkan lingkungan
pengembangan dengan metode MVC (Model View Controller). MVC memisahkan
antara logika pembuatan kode dengan pembuatan template atau tampilan website.
Pengunaan MVC membuat pembuat sebuah proyek website menjadi lebih terstruk-
tur dan lebih sederhana.
Secara sederhana konsep MVC terdiri dari tiga bagian yaitu bagian Model,
bagian View, dan bagian Controller. Didalam website dinamis setidaknya terdiri
dari 3 hal pokok, yaitu basis data, logika aplikasi dan cara menampilkan halaman
website. Tiga hal tersebut direpresentasikan dengan MVC yaitu model untuk basis
data, view untuk cara menampilkan halaman website dan controller untuk logika
aplikasi.
80
1. Model
Merepresentasikan struktur data dari website yang bisa berupa basis data
maupun data lain, misalnya dalam bentuk �le teks atau �le xml. Biasanya di-
dalam model akan berisi class dan fungsi untuk mengambil, melakukan update
dan menghapus website. Karena sebuah website biasanya menggunakan basis
data dalam menyimpan data maka bagian Model biasanya akan berhubungan
dengan perintah-perintah SQL.
Model bisa dibilang khusus digunakan untuk melakukan koneksi ke basis data
oleh karena itu logika-logika pemrograman yang berada didalam model juga
harus berhubungan dengan basis data. Misalnya saja pemilihan kondisi tetapi
untuk melakukan query yang mana.
2. View
Merupakan informasi yang ditampilkan kepada pengunjung website. Sebisa
mungkin didalam View tidak berisi logika-logika kode tetapi hanya berisi
variabel-variabel yang berisi data yang siap ditampilkan. View bisa dibilang
adalah halaman website yang dibuat menggunakan HTML dengan bantuan
CSS atau JavaScript.
Didalam view jangan pernah ada kode untuk melakukan koneksi ke basis data.
View hanya dikhususkan untuk menampilkan data-data dari hasil dari model
dan controller.
3. Controller
Controller merupakan penghubung antara Model dan View. Didalam Con-
troler inilah terdapat class dan fungsi-fungsi yang memproses permintaan dari
View kedalam struktur data didalam Model.
81
Controller juga tidak boleh berisi kode untuk mengakses basis data. Tugas
controller adalah menyediakan berbagai variabel yang akan ditampilkan di
view, memanggil model untuk melakukan akses ke basis data, menyediakan
penanganan error, mengerjakan proses logika dari aplikasi serta melakukan
validasi atau cek terhadapat input.
Jadi secara singkat urutan sebuat request adalah sebagai berikut : user
berhubungan dengan view, dimana didalam view inilah semua informasi ditampilkan.
Saat user melakukan permintaan atau request, misal klik tombol maka request terse-
but akan diproses oleh Controller. Apa yang harus dilakukan, data apa yang di-
inginkan, apakah ingin melihat data, atau memasukkan data atau mungkin melakukan
validasi data terlebih dahulu, semua diproses di Controller. Kemudian Controller
akan meminta Model untuk menyelesaikan request, entah itu melakukan query ataupun
apapun. Dari Model, data akan dikirim kembali untuk di proses lebih lanjut di dalam
Controller dan baru dari Controller data akan ditampilkan di View.
Jika digambarkan akan seperti gambar berikut :
82
Gambar 3.20: Model MVC CodeIgniter
3.6.6 Integrasi Framework
Seperti yang telah dijelaskan sebelumnya pembuatan website dengan meng-
gunakan framework CodeIgniter bekerja didalam folder system. Didalam folder
system terdapat beberapa folder lain, yang akan sering kita akses adalah folder ap-
plication karena di folder inilah kode-kode (script-script) akan disimpan. Kode-kode
yang dibuat akan disimpan didalam folder yang sesuai. Model disimpan pada folder
models, Controller disimpan pada folder controller, dan View disimpan pada folder
Views.
Controller yang digunakan pada website ini yaitu :
- admin - berita - buku_tamu - cek_login - chek
- data_siswa - events - gallery - kerjasama_antar_lembaga - member
- pesan - prestasi - pro�le_guru - pro�le_sekolah - viewer
83
Model yang digunakan sebagai berikut :
- madmin
- mviewer
Dan untuk view dibedakan menjadi tiga folder, yaitu
1. Folder admin : Pada folder ini berisikan untuk tampilan administrator.
2. Folder member : Folder ini digunakan untuk tampilan anggota (member).
3. Folder guest : Untuk menyimpan tampilan tamu (guest).
Folder Admin yang digunakan yaitu sebagai berikut :
- berita_skul - buku_tamu - data_siswa
- footer - galery_admin - header
- home - kata_sambutan - menu
- pesan - pro�le_guru - pro�le_skul
- userpass
Folder member berisikan �le-�le sebagai berikut :
- berita_skul - galery_member - home
- userpass_user - menu - header
- footer
Dan untuk folder guest �le-�le yang digunakan yaitu sebagai berikut:
- berita - buku_tamu - data_siswa
- events - hal_utama - halaman_admin
- home - kerjasama - pesan
- prestasi - pro�l_skul - pro�le_guru_viewer
- program - sejarah_skul - slide_depan
- slideshow - struktur - visimisi
84
Gambar 3.21: Halaman Home Tamu (guest)
Pada saat mengakses alamat http://sman1ciomas-bgr.sch.id maka halaman
yang tampil pertama kali seperti tampak pada gambar di atas, yaitu halaman home
tamu (guest). Untuk menampilkan halaman tersebut akan diproses oleh sebuah
controller, controller yang digunakan yaitu controller viewer dengan function index.
Pada controller ini tidak memanggil sebuah model, karena query yang digunakan
tidak terlalu complex. Kemudian controller viewer akan memanggil view untuk
85
memberikan tampilan kepada user. View yang digunakan berada pada folder guest,
yaitu �le hal_utama dan home. File hal_utama merupakan sebuah �le yang digu-
nakan untuk menampilkan header, menu (struktur navigasi), isi website, dan footer.
Sehingga �le ini akan selalu digunakan oleh controller-controller yang berhubungan
dengan tampilan tamu (guest). Sedangkan �le home merupakan �le yang digu-
nakan untuk menampilkan isi dari halaman home dan merupakan bagian dari �le
hal_utama.
Ketika user melakukan request seperti mengklik salah satu menu, misalkan
user mengklik menu Hubungi Kami. Maka request tersebut akan di proses oleh
controller pesan dengan function hubungi_kami. Controller ini memanggil sebuah
model, yaitu model mviewer. Dimana pada model ini terdapat beberapa function,
dan function yang digunakan oleh controller pesan dengan function hub_kami yaitu
function captcha. Function captcha digunakan untuk membuat sebuah kode-kode
keamanan, kemudian data akan dikirim kembali ke controller tersebut dan selan-
jutnya controller akan memanggil view pada folder guest dengan nama hal_utama
dan pesan. Seperti telah di jelaskan sebelumnya �le hal_utama merupakan �le uta-
ma untuk tampilan tamu (guest). Sedangkan �le pesan merupakan isi dari menu
Hubungi Kami. Halaman Hubungi Kami dapat dilihat pada gambar dibawah ini.
86
Gambar 3.22: Halaman Hubungi Kami
Setelah user mengisi �eld-�eld yang tersedia pada menu Hubungi Kami dan
mengklik tombol kirim, maka controller pesan dengan function input_pesan akan
di proses. Dimana pada function ini data yang di masukkan (input) oleh user akan
disimpan kedalam database. Untuk memasukkan data tersebut kedalam database
diperlukan sebuah model. Model yang digunakan yaitu model mviewer dengan
function pesan. Dimana pada function inilah data-data yang di masukkan oleh
87
user akan di simpan kedalam database. Kemudian dari model ini data akan dikirim
kembali ke controller untuk diproses lebih lanjut di controller dan selanjutnya akan
ditampilkan di view, dengan �le hal_utama dan pesan.
Dan untuk menu-menu lainnya, menggunakan cara kerja yang hampir sama
dengan menu diatas. Yang membedakan adalah controller yang digunakan dan view
yang digunakan. Setiap menu memiliki controller tersendiri dan view yang tersendiri
pula.
Untuk melakukan perubahan isi website harus melakukan login terlebih dahu-
lu, baik administrator maupun anggota (member). Untuk melakukan login, user
mengklik menu Administrator. Seperti tampak pada gambar dibawah ini :
88
Gambar 3.23: Halaman Login
Untuk login (masuk kedalam halaman administrator maupun halaman anggota)
controller yang digunakan sebanyak dua controller, yaitu controller chek_login dan
controller login. Pada saat user mengklik tombol Login maka controller yang akan
diproses terlebih dahulu adalah controller chek_login. Pada controller ini akan di-
lakukan pengecekan validasi, apakah data yang dimasukkan telah sesuai atau tidak.
Kemudian pada controller ini akan memanggil model madmin dengan function auth.
89
Function ini digunakan untuk melakukan pengecekan pada database, apakah data
yang dimasukkan terdapat pada database atau tidak. Selanjutnya data dikirim kem-
bali ke controller untuk proses lebih lanjut. Jika data yang dimasukkan terdapat
pada database, maka memanggil �le lib_login pada folder libraries. Dimana pada �le
ini akan menyimpan informasi mengenai user tersebut. Kemudian data dikirimkan
kembali ke controller untuk melakukan proses selanjutnya, yaitu dengan memanggil
controller chek. Tetapi jika data tidak ada pada database maka akan memanggil
controller viewer dengan function administrator untuk menampilkan pesan kesala-
han. Ketika berhasil melakukan login yaitu dengan dipanggilnya controller chek,
dimana pada controller ini proses yang dilakukan yaitu memanggil lib_status pada
folder libraries. Pada lib_status akan dilakukan pengecekan apakah user tersebut
berstatus sebagai admin atau user. Jika status user tersebut bertipe admin maka
user tersebut merupakan administrator, tetapi jika status user tersebut bertipe user
maka user tersebut login sebagai anggota (member).
User yang login sebagai administrator maka controller yang akan di proses
adalah controller admin, sedangkan user yang login sebagai anggota (member) maka
controller yang akan diproses adalah controller member. Pada controller admin
maupun controller member menggunakan beberapa function, dimana tiap function
mempunyai perintah dan kondisi tertentu. Ketika proses login telah berhasil dan
user merupakan administrator proses yang pertama kali dijalankan adalah function
home pada controller admin, dan dapat ditampilkan seperti gambar dibawah ini :
90
Gambar 3.24: Halaman Home Administrator
Dan Ketika login sebagai anggota (member) maka proses yang pertama kali
adalah memanggil function home pada controller member, halaman home anggota
sebagai berikut:
91
Gambar 3.25: Halaman Home Member
Tampilan administrator dengan anggota (member) tidaklah terlalu jauh berbe-
da, yang membedakan administrator dengan anggota adalah menu yang ditampilkan.
Menu pada halaman administrator lebih banyak dibandingkan pada halaman anggota
(member).
Ketika administrator mengklik menu pro�le sekolah, maka proses yang terja-
di adalah memanggil controller admin dengan function pro�le_skul. Pada function
ini controller akan memanggil sebuah model dengan nama �le madmin dan function
yang digunakan adalah function ambil_program_semua, ambil_kerjasama_semua,
dan ambil_prestasi_semua. Function-function ini akan melakukan sebuah query
yaitu mengambil data dari database, kemudian data tersebut akan dikirimkan kem-
bali ke controller untuk dilakukan proses selanjutnya, yaitu data tersebut akan di-
92
tampilkan pada view. View yang digunakan untuk status admin ini berada pada
folder admin, dan �le yang digunakan adalah pro�le_skul. Halaman pro�le sekolah
digambarkan pada gambar berikut ini :
Gambar 3.26: Halaman Pro�le Sekolah
Ketika admin mengklik 'selengkapnya' pada pilihan Visi Misi maka controller
yang digunakan adalah controller admin dengan function lihat_detail. Pada func-
tion ini akan melakukan perintah query untuk menampilkan record tertentu dari
database. Karena query yang digunakan tidak terlalu banyak maka pada function
ini tidak menggunakan model. Proses yang terjadi yaitu controller melakukan ek-
93
sekusi kemudian hasil dari eksekusi tersebut akan ditampilkan dengan memanggil
�le pro�le_skul pada folder view admin. Halaman akan tampak seperti gambar
dibawah ini:
Gambar 3.27: Halaman Visi Misi Selangkapnya
Untuk merubah isi dari visi tinggal mengklik 'Edit'. Ketika user melakukan
request untuk edit data, controller yang di proses adalah controller admin dengan
function form_edit. Pada proses edit ini function form_edit tidak memanggil mod-
el, karena query yang dilakukan tidaklah terlalu banyak. Kemudian controller akan
memanggil view untuk menampilkan hasil dari proses yaitu dengan menggunakan
view pro�le_skul. Akan tampak pada gambar di bawah ini :
94
Gambar 3.28: Halaman Edit Visi Misi
Ketika admin mengklik 'Edit Visi' maka controller yang digunakan adalah
controller admin dengan functionnya edit. Pada function ini controller akan me-
manggil model madmin dengan function edit_visi_misi, ambil_program_semua,
ambil_kerjasama_semua, dan ambil_prestasi_semua. Function edit_visi_misi
akan melakukan perubahan pada database pada record tertentu, sedangkan pada
function ambil_program_semua, ambil_kerjasama_semua, dan ambil_prestasi_semua
melakukan query untuk mengambil data dari database dan menghitung jumlah da-
ta yang terdapat pada database. Kemudian dari model akan mengirim data kem-
bali ke controller untuk melakukan proses selanjutnya. Selanjutnya controller akan
menampilkan data tersebut ke user dengan memanggil view pro�le_skul.
95
Pada menu pro�le sekolah, administrator dapat menambah data, yaitu den-
gan mengklik 'Tambah Data'. Data yang dapat di tambah pada menu pro�le sekolah
yaitu, program sekolah, kerjasama antar lembaga, dan prestasi. Halaman tambah
data seperti pada gambar dibawah ini.
Gambar 3.29: Halaman Tambah Data
Ketika admin melakukan request dengan mengklik tombol simpan, maka pros-
es yang terjadi adalah memanggil controller admin dengan function tambah_pro�le_skul.
Controller ini akan memanggil model madmin dengan function tambah_pro�le_skul,
96
ambil_program_semua, ambil_kerjasama_semua, dan ambil_prestasi_semua. Func-
tion tambah_pro�le_skul digunakan untuk memasukkan data-data yang diberikan
oleh view kedalam database, sedangkan ambil_program_semua, ambil_kerjasama_semua,
dan ambil_prestasi_semua digunakan untuk mengambil data dari database dan
menghitung jumlah data yang terdapat di database. Kemudian data-data tersebut
dikirim kembali ke controller untuk di proses lebih lanjut, dan kemudian controller
akan menampilkannya dengan memanggil view pro�le_skul.
Sama halnya dengan menu-menu yang lain. Semua proses akan dijalankan
pada controller admin dan model madmin, yang membedakan hanyalah function-
function yang dipanggil. Dan untuk setiap menampilkan ke user menggunakan view
pada folder admin.
Sementara untuk proses anggota (member) menu yang dapat di gunakan
sedikit berbeda dengan menu yang terdapat pada administrator. Setiap proses yang
terjadi menggunakan controller member dan model yang digunakan adalah madmin.
Dan untuk menampilkan ke user view yang digunakan terdapat pada folder mem-
ber.
Bab 4
PENUTUP
4.1 Kesimpulan
Setelah menyelesaikan proses pembuatan website sekolah SMANegeri 1 Ciomas
dengan menggunakn Framework PHP CodeIgniter, maka penulis mengambil kesim-
pulan bahwa dari segi desain, tampilan , menu ataupun link - link yang disajikan
dalam website sekolah SMA Negeri 1 Ciomas ini sudah bagus namun belum menarik
karena masih sangat sederhana.
Dari segi kegunaan, website ini dapat menjadi alternatife khalayak umum
untuk mengetahui informasi tentang sekolah SMA Negeri 1 Ciomas. Website ini
juga layak dibaca untuk semua kalangan, baik sekolah maupun dari luar sekolah.
Dalam sistem program website ini sudah dapat berjalan dengan baik karena tidak
terdapat error pada program saat pengkoneksian kedalam database dan diharapkan
sesuai dengan keinginan user.
4.2 Saran
Dalam perancangan website ini disadari masih banyak memiliki kekurangan.
Maka dari itu perlu yang harus dikembangkan misal dengan ditambahkan fasilitas
pendaftaran online, ataupun suara-suara, efek atau animasi supaya tampilan dalam
website ini menjadi lebih menarik dan informasi yang lebih banyak lagi.
97
Bibliogra�
[1] Abdul Kadir, Tuntutan Praktis Belajar Database Manggunakan MySQL, ANDI,
Yogyakarta 2008.
[2] Abdul Majid, "Kriteria Isi Web", http://majidnst.wordpress.com/2007/11/05/kriteria-
isi-web/, 05 Juni 2009.
[3] Harry Yunanto, "Dasar-dasar Pembuatan Website Dengan CodeIgniter",
http://www.iorme.net/wp/wp-content/uploads/2008/03/buku-ci-bab1-4.pdf,
06 Mei 2009.
[4] Munawar, Permodelan Visual Dengan UML, Graha Ilmu, Yogyakarta, 2005
[5] Sri Rahayu, "Sekapur Sirih Tentang Framework CI
(CodeIgniter)", http://oke.or.id/wp-content/plugins/dowloads-
manager/upload/�le47dc937797808.pdf, 06 Mei 2009.
[6] URL: http://www.codeigniter.com/user_guide/, 06 Mei 2009.
[7] URL: http://id.wikipedia.org/wiki/Ilmu_komputer, 24 Juli 2009
[8] URL: http://id.wikipedia.org/wiki/Komunikasi,24 Juli 2009.
98