Skripsi
Diajukan untuk Memenuhi Salah Satu Syarat Memperoleh Gelar Sarjana Sains
Program Studi Ilmu Komputer
Oleh :
Florentina Evy Kurniawati NIM : 023124043
PROGRAM STUDI ILMU KOMPUTER JURUSAN MATEMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SANATA DHARMA YOGYAKARTA
Skripsi
Diajukan untuk Memenuhi Salah Satu Syarat Memperoleh Gelar Sarjana Sains
Program Studi Ilmu Komputer
Oleh :
Florentina Evy Kurniawati NIM : 023124043
PROGRAM STUDI ILMU KOMPUTER
JURUSAN MATEMATIKA FAKULTAS MIPA
UNIVERSITAS SANATA DHARMA
YOGYAKARTA
2007
Itulah sumber kekuatan.
Ambilah waktu untuk bermain,
Itulah rahasia tetap muda.
Ambilah waktu untuk mambaca,
Itulah sumber hikmat
Ambilah waktu untuk berteman
Itulah jalan menuju kebahagiaan
Ambilah waktu untuk berdiam
Itulah kesempatan untuk mencari Allah
Ambilah waktu untuk mencintai dan dicintai
Itulah anugerah Allah yang besar
Ambilah waktu untuk tertawa
Itulah musik jiwa
Ambilah waktu untuk berdoa
Itulah kekuatan terbesar di permukaan bumi ini
Skripsi ini kupersembahkan untuk :
Tuhan Yesus
Terima kasih untuk semua yang terjadi atas diriku
Kedua orang tuaku
Terima kasih atas doa, dukungan, dan kesabarannya selama ini.
ini tidak memuat karya/bagian karya orang lain, kecuali yang telah disebutkan dalam kutipan dan daftar pustaka, sebagaimana layaknya karya ilmiah.
Yogyakarta, 31 Juli 2007 Penulis
Florentina Evy Kurniawati
website kabupaten membuat potensi kecamatan tidak terpublikasi secara luas. Pengembangan web template untuk kecamatan melalui skripsi ini, diharapkan akan mengatasi persoalan di atas, sehingga kecamatan bisa mempublikasikan diri di internet dengan cepat dan mudah.
Pengembangan web template ini menggunakan metodologi waterfall, yang tahap – tahapnya meliputi analysis, design, coding, testing dan maintenance. Penulis mengembangkan sistem sampai pada tahap testing. Hasil implementasi berupa sebuah sistem yang terdiri dari 3 subsistem, yaitu website penyedia web template dan hosting, web template member dan website member. Implementasi menggunakan HTML, CSS, Java Script, PHP, MySQL, dan web serverApache.
Berdasarkan angket yang disebarkan ke 30 responden, disimpulkan bahwa sistem ini bermanfaat bagi kecamatan, terutama untuk promosi dan penyebaran informasi kepada masyarakat luas yang membutuhkan. Sistem ini juga mudah digunakan dan cukup memberikan fasilitas yang dibutuhkan dalam sebuah website kecamatan.
districts’s potencies could not be published widely. The development of districts web template through this thesis, hopefully could overcome the problem, so that any district could publish its information quickly and easily through the internet.
The development of the web template uses waterfall methodology. The steps include analysis, design, coding, testing, and maintenance. The system consists of 3 sub-system, those are : the website of web template and hosting provider, the web template for members and the website for members. The implemented using HTML, CSS, Java Script, PHP, MySQL, and Apache web server.
Based on the questioners which have been distributed to 30 respondents, it can be concluded that this system is usefull for districts, especially for promotion and information dissemination for the society. This system could used easily. It also provides enough facilities needed for a district website.
segala karunia-Nya sehingga penulis dapat menyelesaikan skripsi dengan judul “Pengembangan Web Template Untuk Kecamatan”.
Dalam kesempatan ini, penulis ingin mengucapkan terima kasih yang sebesar-besarnya kepada semua pihak yang turut memberikan dukungan, semangat dan bantuan hingga selesainya skripsi ini :
1. Ibu A. Rita Widiarti,S.Si, M.Kom selaku dosen pembimbing atas kesabaran, bimbingan, waktu dan saran yang diberikan.
2. Ibu P. H Prima Rosa, S.Si, M.Sc selaku Kaprodi, atas bimbingan dan waktu yang diberikan.
3. Bapak Iwan Binanto, S.Si sebagai dosen penguji atas saran dan kritikan yang diberikan.
4. Bapak St. Eko Hari Parmadi, S.Si, M.Kom sebagai dosen penguji atas saran dan kritikan yang diberikan.
5. Staff kecamatan Bapak Y. Ari Gotama dan Ibu Tutik Handayani atas waktu yang diberikan untuk wawancara, menguji sistem serta mengisi kuisioner. 6. Laboran Laboratorium Komputer atas bantuannya selama penulis demo
program kepada dosen pembimbing.
7. Kedua orang tuaku, FX. Joko Susilo dan Agustin Sri Sulandari, kedua adikku Stevanus Cahya Hanggara Putra dan Henrica Briana Lukita atas dukungan dan semangat yang diberikan.
8. Komputerku tercinta, makasih dah nemenin aku dalam suka dan duka. Printerku yang dulu dah nyaris ‘RIP’, makasih dirimu mau tak paksa kerja keras bwat nge-print hampir 200 halaman jam 4 pagi, he..he…
9. My Room, kamu saksi perjuanganku selama ini……
10.My high quality friend, Agatha Uni Asmarani. Betapapun aku ingin seperti dirimu, tetap saja aku adalah aku dan kamu adalah kamu. Aku bangga telah mengenal dan jadi temanmu. Semoga aku bisa bertemu denganmu sebelum dirimu pergi ke Australi.
12.Teman - teman terbaek, Pipit, Lilis, Elva, akhirnya kita mengakhiri juga perjuangan dalam menyelesaikan skripsi, saatnya menyusun masa depan ☺. Deta, makasih atas bantuannya selama ini, pinjaman motor n mau denger keluh kesahku. Eli, makasih atas waktu untuk mendengarkan curhat penulis n nemenin penulis jalan-jalan. Sigit ‘Pman’ thanks atas terjemahan abstraknya n mo dengerin saat diriq curhat, cayo Bro, selesaikan skripsimu…..
13.Teman – teman ikom’02, anak-anak bimbingan Bu Rita, Esti, Lusi, Agnes Noven, Ikok, akhirnya kita lulus juga he..he… Uus, Marto, Oscar, Pritty thanks atas semangatnya. Agus, thanks atas bantuannya saat diriq ujian. Dora, Sari, Tiwie, Wida, Novia, Sisil, Kris, Hari, Tina, Ocha, Imeth, dan temen – temen ikom’02 lainnya yang tidak dapat penulis tuliskan satu demi satu, makasih ya dah ngasih semangat.
14.‘Mad Man’ makasih dah nunjukin kenyataan dunia, dari yang paling negatif sampe yang paling positif. Itu sangat berguna bagi penulis ☺
15.Orang-orang ilmuwebsite, Al-k n b_scorpio thanks atas diskusi – diskusi tentang web selama ini. Boleh minta code-nya ga? ☺.
16.Teman-teman KKN di Sabrang yang laen, Janek, Asih, Kuncup, Meme, Perik, terima kasih atas kebersamaan selama masa-maa KKN dulu.
17.Teman – teman kos Griya Talenta, Eka, Lian, Ina, Nandutz, Siwie, Elvi, Desi dan anak-anak bawah laennya, makasih atas semangatnya.
18.Serta semua pihak yang telah membantu kelancaran dalam penulisan tugas akhir ini. Penulis mengucapkan banyak terima kasih.
Penulis
HALAMAN PERSETUJUAN PEMBIMBING……….... ii
HALAMAN PENGESAHAN ………. iii
HALAMAN PERSEMBAHAN ……….. iv
PERNYATAAN KEASLIAN KARYA ……….. v
ABSTRAK……….... vi
ABSTRACT ……….. vii
KATA PENGANTAR ………. viii
DAFTAR ISI ………. x
BAB III ANALISA DAN PERANCANGAN SISTEM
3.1 Analisa ………... 20
3.1.1 Analisa Masalah ………... 20
3.1.2 Gambaran Umum Sistem ………. 20
3.1.3 Analisa Kebutuhan ……….. 21
3.2.3.1 Analisa Kebutuhan Sistem ……… 21
3.2.3.2 Analisa Kebutuhan Hardware Software ……….. 25
4.3 Implementasi Database pada Phpmyadmin ………. 102
4.4 Implementasi Template ……… 105
4.5 Implementasi Proses ……….. 116
BAB V HASIL DAN PEMBAHASAN ANGKET ……….. 163
5.1 Angket ……… 163
5.2 Tahap – tahap Pengumpulan Data ………. 163
5.3 Sasaran Penyebaran Angket ……….. 164
5.4 Form Angket ………. 164
5.5 Hasil dan Pembahasan ……….. 166
BAB VI PENUTUP ……… 170
6.1 Kesimpulan ……… 170
6.2 Saran ……….. 172
DAFTAR PUSTAKA ………. 173
LAMPIRAN
DAFTAR TABEL
Tabel 3.1 Fasilitas Member untuk Mengelola WebTemplate …………. 22
Tabel 3.2 Kamus Data ………. 76
Tabel 3.3 Tabel Menu Subsistem Member ………...…. 90
Tabel 3.4 Tabel Submenu Subsistem Member ... 90
Tabel 3.5 Tabel Halaman Subsistem Member ... 90
Tabel 3.6 Tabel Berita Subsistem Member ... 91
Tabel 3.7 Tabel Komentar Subsistem Member …... 91
Tabel 3.8 Tabel Admin Subsistem Member ...……… 92
Tabel 3.9 Tabel Menu_admin Subsistem Member ……… 92
Tabel 3.10 Tabel Modul Subsistem Member ………...……… 92
Tabel 3.11 Tabel Kolom Subsistem Member …... 93
Tabel 3.12 Tabel Agenda Subsistem Member ... 93
Tabel 3.13 Tabel Aspirasi Subsistem Member ... 93
Tabel 3.14 Tabel Template Subsistem Member …... 94
Tabel 3.15 Tabel Judul_web Subsistem Member ...……….. 94
Tabel 3.16 Tabel Footer Subsistem Member …...………... 94
Tabel 3.17 Tabel Counter Subsistem Member ... 94
Tabel 3.18 Tabel Adminmenu Subsistem Website Penyedia ……… 95
Tabel 3.19 Tabel Adminsuper Subsistem Website Penyedia... 95
Tabel 3.20 Tabel Counter Subsistem Website Penyedia ..………. 95
Tabel 3.21 Tabel Halaman Subsistem Website Penyedia …..……… 96
Tabel 3.22 Tabel Member Subsistem Website Penyedia ….………. 96
Tabel 3.23 Tabel Modul Subsistem Website Penyedia ... 97
Tabel 3.24 Tabel Tamu Subsistem Website Penyedia ... 97
Tabel 5.1 Hasil Angket Fasilitas Interaktif ………. 166
Tabel 5.2 Hasil Angket Fasilitas CMS ……… 166
Tabel 5.3 Hasil Angket Fasilitas yang Belum Disediakan ……….. 167
Tabel 5.4 Hasil Angket Tampilan Warna ……… 167
Tabel 5.5 Hasil Angket Tampilam Huruf ……… 167
Tabel 5.6 Hasil Angket Tampilan Kejelasan Tulisan ……….. 168
Tabel 5.7 Hasil Angket Tampilan Gambar ………. 168
Tabel 5.8 Hasil Angket Tampilan Tata Letak ………. 168
Tabel 5.9 Hasil Angket Tampilan Keseluruhan Situs ………. 169
Tabel 5.10 Hasil Angket Manfaat Sistem ………. 169
DAFTAR GAMBAR
Gambar 3.1 Rancangan Struktur Template ………... 26
Gambar 3.2 Rancangan Form Login Adminsitator Website Penyedia … 28 Gambar 3.3 Rancangan Halaman Utama Buku Tamu Manager ………. 29
Gambar 3.4 Rancangan Form Pemberian Tanggapan ………. 29
Gambar 3.5 Rancangan Halaman Utama Member Manager …….... 30
Gambar 3.6 Rancangan Form Pendaftaran Member ………... 30
Gambar 3.7 Rancangan Form Testing Tulis Aspirasi ………... 31
Gambar 3.8 Rancangan Form Testing Tulis Berita ………... 31
Gambar 3.9 Rancangan Form Testing Komentar Berita ………. 32
Gambar 3.10 Rancangan Form Testing Pencarian Berita dan Halaman Menu ……… 32
Gambar 3.11 Rancangan Form Login Member ………. 33
Gambar 3.12 Rancangan Form Edit Data Login ………... 33
Gambar 3.13 Rancangan Halaman Utama Menu Manager ... 33
Gambar 3.14 Rancangan Form Tambah Menu ………... 34
Gambar 3.15 Rancangan Form Tambah Submenu ………... 34
Gambar 3.16 Rancangan Halaman Utama Halaman Manager …………. 35
Gambar 3.17 Rancangan Form Tambah Halaman ……… 35
Gambar 3.18 Rancangan Halaman Utama Modul Manager ... 36
Gambar 3.19 Rancangan Form Tambah Modul ……… 36
Gambar 3.20 Rancangan Halaman Utama Berita Manager ... 37
Gambar 3.21 Rancangan Form Tulis Berita ……….. 37
Gambar 3.22 Rancangan Halaman Utama Berita Masuk yang Belum Divalidasi ………. 38
Gambar 3.23 Rancangan Halaman Utama Kolom Manager ………. 38
Gambar 3.24 Rancangan Form Tambah Kolom ………... 38
Gambar 3.25 Rancangan Halaman Utama Agenda Manager …………... 39
Gambar 3.26 Rancangan Form Tambah Agenda ……….. 39
Gambar 3.27 Rancangan Halaman Utama Aspirasi Manager ……... 40
Gambar 3.28 Rancangan Form Pemberian Tanggapan ………. 40
Gambar 3.29 Rancangan Halaman Utama TemplateManager …………. 41
Gambar 3.30 Rancangan Form Edit Judul Web ……… 41
Gambar 3.31 Rancangan Form Edit Footer ……….. 41
Gambar 3.32 Rancangan Halaman Utama TemplateManager …………. 42
Gambar 3.33 Rancangan Form Tulis Buku Tamu ……… 42
Gambar 3.34 Rancangan Form Pencarian Member ………... 42
Gambar 3.35 Diagram Konteks ………. 43
Gambar 3.36 DAD Level 1……… 45
Gambar 3.37 DAD Level 2 Subsistem 1 Sisi Adminsitrator Website Penyedia ………... 46
Gambar 3.38 DAD Level 2 Subsistem 1 Sisi Member Proses
Pendaftaran ……….. 47
Gambar 3.39 DAD Level 2 Subsistem 1 Sisi Member Proses Aktivasi .... 47
Gambar 3.40 DAD Level 2 Subsistem 1 Sisi Pengunjung Web ………… 48
Gambar 3.41 DAD Level 2 Subsistem 2 Sisi Member ……….. 49
Gambar 3.79 Rancangan Struktur Menu Administrator Website
Penyedia ………... 82
Gambar 3.80 Rancangan Struktur Menu Member ……… 83
Gambar 3.81 Rancangan Struktur Menu Pengunjung Web ……………… 84
Gambar 3.82 ERD Pada Subsistem Member ………. 86
Gambar 4.1 Struktur Direktori Sistem ………. 98
Gambar 4.2 Struktur Direktori Website Penyedia ………... 99
Gambar 4.3 File – file Sistem Website Penyedia ………. 100
Gambar 4.4 Struktur Direktori Template ………. 100
Gambar 4.5 File – file Style pada Setiap Template ………. 101
Gambar 4.6 Struktur File – file Sistem pada Direktori Template ……… 102
Gambar 4.7 Implementasi Struktur Database Website Penyedia ……… 103
Gambar 4.8 Implementasi Struktur Database Member …………... 104
Gambar 4.9 Implementasi Halaman Utama Website Penyedia ……….. 112
Gambar 4.10 Implementasi Halaman Utama WebTemplateDefault ….. 113
Gambar 4.11 Implementasi Halaman Utama WebTemplateDarkgreen .. 114
Gambar 4.12 Implementasi Halaman Utama WebTemplateDarkbrown . 115 Gambar 4.13 Form Tulis Buku Tamu ………... 116
Gambar 4.14 Form Pencarian ………... 117
Gambar 4.15 Form Pendaftaran ………... 119
Gambar 4.16 Form Aktivasi ……….. 124
Gambar 4.17 FormLogin Administrator Website Penyedia ………... 125
Gambar 4.18 Halaman Utama Buku Tamu Manager ……… 126
Gambar 4.19 Form Tanggapan Buku Tamu ………. 127
Gambar 4.20 Halaman Utama Member Manager ………..... 128
Gambar 4.21 Halaman Detail Member ……….. 129
Gambar 4.22 Form Testing Tulis Aspirasi ………... 130
Gambar 4.23 Form Testing Tulis Berita ………... 131
Gambar 4.24 Form Testing Tulis Komentar Berita ………... 133
Gambar 4.25 Form Testing Pencarian Data Berita dan Halaman ………. 134
Gambar 4.26 FormLogin Member ………... 135
Gambar 4.27 Form Edit Data Login ……………… 137
Gambar 4.28 Halaman Utama Menu Manager …………... 138
Gambar 4.29 Form Tambah Menu ………... 140
Gambar 4.30 Form Edit Menu ……….. 141
Gambar 4.31 Form Tambah Submenu ……….. 142
Gambar 4.32 Form Edit Submenu ... 143
Gambar 4.33 Halaman Utama Halaman Manager ……… 144
Gambar 4.34 Form Tambah Halaman ………... 144
Gambar 4.35 Form EditHalaman ………. 145
Gambar 4.36 Halaman Utama Modul Manager ... 147
Gambar 4.37 Form Tambah Modul ………... 147
Gambar 4.38 Form Edit Modul ………. 148 Gambar 4.39 Halaman Utama Berita Manager ………………... 149 Gambar 4.40 Form Tulis Berita ………... 149 Gambar 4.41 Form EditBerita yang Sudah Dipublikasikan ………. 150 Gambar 4.42 Form EditBerita Masuk ……….. 152 Gambar 4.43 Halaman Utama Kolom Manager …………... 153 Gambar 4.44 Form Tambah Kolom ……….. 154 Gambar 4.45 Form EditKolom ………. 155 Gambar 4.46 Halaman Utama Agenda Manager ……….. 156 Gambar 4.47 Form Tambah Agenda ………. 156 Gambar 4.48 Form Edit Agenda ………... 157 Gambar 4.49 Halaman Utama Aspirasi Manager …………... 158 Gambar 4.50 Form Pemberian Tanggapan Aspirasi ………. 158 Gambar 4.51 Halaman Utama Template Manager ……… 159 Gambar 4.52 Form Edit Judul Web ………... 160 Gambar 4.53 Form Edit Footer …………. 161 Gambar 5.1 Form Angket ……… 165 Gambar 5.2 Pertanyaan Tambahan untuk Staff Kecamatan ……… 166
1.1. Latar Belakang
Dewasa ini, internet merupakan teknologi yang populer. Perusahaan, instansi pemerintahan, instansi pendidikan, entertainment, media masa bahkan individu berlomba-lomba menampilkan diri di internet. Ada yang sekedar tampil untuk memberikan informasi, ada yang sudah memberikan fasilitas interaktif dengan pengunjung web, dan ada juga yang sudah melibatkan transaksi online. Tujuan dari keikutsertaan di dalam komunitas internet selain untuk memberikan informasi secara online adalah untuk mempromosikan diri maupun meningkatkan citra diri.
Begitu juga dengan kecamatan. Meskipun kecamatan mengelola wilayah yang lebih sempit daripada kabupaten, bukan berarti kecamatan tidak layak untuk mempublikasikan diri di internet. Saat ini, informasi online tentang kecamatan biasanya disisipkan pada website kabupaten dan tentu saja informasi yang ditampilkan hanya terbatas. Hal itu bukan suatu masalah apabila kecamatan tersebut tidak mempunyai potensi yang layak untuk dipublikasikan dan dikembangkan. Tetapi jika kecamatan tersebut mempunyai potensi yang layak untuk dipublikasikan dan dikembangkan entah dari sektor apapun, maka akan sangat disayangkan jika hanya dipublikasikan ala kadarnya di website kabupaten.
Oleh karena itu, dikembangkannya sebuah web template untuk kecamatan diharapkan akan membantu kecamatan yang mempunyai banyak potensi agar dapat mempublikasikan diri dengan cara membuat website kecamatan dengan cepat dan mudah. Sistem yang dikembangkan terdiri dari website penyedia web template dan
hosting, web template member dan website member. Web template member adalah calon website member yang didapatkan dari proses pendaftaran pada website penyedia web template dan hosting. Web template member ini masih harus dikelola oleh member agar menjadi sebuah website yang lengkap dan siap diakses pengunjung. Proses pengelolaan web template ini menggunakan sistem untuk mengelola isi
website atau CMS (Content Management System). Selanjutnya, CMS berguna untuk merawat dan meng-update website member. Sedangkan prototipe hosting akan menggambarkan keadaan dimana web template tersebut sudah mempunyai space di internet. Hosting disertakan otomatis pada web template.
1.2. Rumusan Masalah
Bagaimana mengembangkan sebuah web template untuk kecamatan sehingga mempermudah pihak kecamatan dalam membuat, mengelola, serta merawat
website kecamatan?
1.3. Batasan Masalah
Berdasarkan latar belakang yang telah diuraikan di atas, penulisan skripsi ini dibatasi pada :
a. Pengembangan sistem yang dapat membantu mempercepat dan mempermudah kecamatan dalam membuat website kecamatan.
b. User sistem terdiri dari :
Administrator website penyedia template dan hosting
Bertugas untuk merawat dan meng-update website penyedia. Member
Member adalah kecamatan yang telah berhasil melakukan pendaftaran. Pengunjung web
Pengunjung web akan mengakses informasi serta menggunakan fitur interaktif baik pada website penyedia maupun pada website member.
c. Web template akan diperoleh jika member berhasil melakukan pendaftaran pada
d. Webtemplate menyediakan fitur CMS untuk member yang akan digunakan untuk mengelola template menjadi website yang lengkap dan siap dipublikasikan. Selanjutnya, CMS berguna untuk merawat dan meng-update isi website.
e. Webtemplate yang sudah diisi informasi akan benar-benar bermanfaat jika sudah
online di internet. Dalam pembuatan skripsi ini, penulis hanya mengembangkan webhosting sampai tahap prototipe.
f. Pembahasan akan difokuskan pada website penyedia dan web template member. Untuk website member tidak akan dibahas secara detail, karena fasilitas member pada website member sama dengan fasilitas webtemplate member.
1.4. Metodologi
Dalam penulisan skripsi ini, penulis menggunakan metodologi waterfall, yang langkah – langkahnya adalah sebagai berikut :
1. Analysis
Proses pengumpulan kebutuhan diintensifkan dan difokuskan, khususnya pada perangkat lunak. Untuk memahami sifat program yang dibangun, perekayasa perangkat lunak harus memahami domain informasi, tingkah laku, unjuk kerja, dan antarmuka yang diperlukan.
2. Design
arsitektur perangkat lunak, representasi interface, dan detail algoritma. Desain didokumentasikan dan menjadi bagian dri konfigurasi perangkat lunak.
3. Coding
Desain harus diterjemahkan ke dalam bentuk mesin yang bisa dibaca. Langkah pembuatan kode melakukan tugas ini. Jika desain dilakukan dengan cara yang lengkap, pembuatan kode dapat diselesaikan secara mekanis.
4. Testing
Sekali kode dibuat, pengujian program dimulai. Proses pengujian berfokus pada logika internal perangkat lunak, memastikan bahwa semua pernyataan sudah diuji, dan pada eksternal fungsional, yaitu mengarahkan pengujian untuk menemukan kesalahan-kesalahan dan memastikan bahwa input yang dibatasi akan memberikan hasil aktual yang sesuai dengan hasil yang dibutuhkan.
5. Maintenence
Perangkat lunak akan mengalami perubahan setelah disampaikan kepada pelanggan. Perubahan akan terjadi karena perangkat lunak harus disesuaikan untuk mengakomodasi perubahan-perubahan di dalam lingkungan eksternalnya. Pemeliharaan perangkat lunak mengaplikasikan lagi setiap fase program sebelumnya dan tidak membuat yang baru lagi.
1.5. Tujuan dan Manfaat
Tujuan dari penulisan skripsi ini adalah untuk mengembangkan sebuah sistem berupa web template yang akan mempermudah pihak kecamatan untuk membuat website kecamatan. Manfaat yang ingin dicapai dari penulisan skripsi ini adalah agar pihak kecamatan bisa membuat website kecamatan dengan mudah dan cepat karena sudah disediakan template dan sistem pengelola isi.
1.6. Sistematika Penulisan
Bab I. Pendahuluan
Pada bab ini berisi latar belakang penulisan skripsi, rumusan masalah, batasan masalah,metodologi penelitian, tujuan dan manfaat, dan sistematika penulisan.
Bab II. Dasar Teori
Pada bab ini akan membahas dasar teori dari sistem yang dikembangkan, meliputi : 2.1 Internet dan World Wide Web
Membahas tentang sejarah dan cara kerja dari World Wide Web 2.2 Web, halaman web, dan website
Membahas definisi dari 3 isitilah di atas. 2.3 WebTemplate
Membahas definisi webtemplate. 2.4 CMS(Content Management System)
2.5 WebHosting
Membahas definisi web hosting dan cara kerja prototipe web hosting yang dibuat penulis.
2.6 Pemrograman web
Membahas tentang pemrograman client dan serverside. 2.7 HTML (Hypertext Markup Language)
Membahas struktur penulisan dan cara kerja HTML. 2.8 Java Script
Membahas struktur penulisan Java Script. 2.9 Pemrograman PHP(Hypertext Preprosessor )
Membahas struktur penulisan dan cara kerja PHP. 2.10 Database MySQL
Membahas cara membuat database dengan MySQL dan perintah – perintah
query.
2.11 Teknologi CSS(Cascading Style Sheet)
Membahas style- style yang bisa ditempatkan ke dalam dokumen HTML. 2.12 Appserv
Bab III. Analisa dan Perancangan Sistem
Pada bab ini akan membahas analisa dan perancangan sistem yang meliputi : 3.1 Analisa
Meliputi analisa masalah, gambaran umum sistem dan analisa kebutuhan. 3.2 Perancangan
Meliputi rancangan user interface, proses, struktur menu dan database.
Bab IV. Implementasi
Bab ini berisi implementasi direktori, database, user interface, dan proses.
Bab V. Hasil dan Pembahasan Angket
Bab ini membahas hasil dan pembahasan angket yang disebarkan kepada responden.
Bab VI. Kesimpulan dan Saran
2.1 Internet dan World Wide Web
Internet adalah sistem komputer yang saling berhubungan yang mentransmisikan data menggunakan packet switcing menggunakan protokol standar Internet Protokol (IP) dan dapat diakses oleh publik secara bebas.
Internet disusun oleh berbagai macam jaringan komputer baik yang komersial, akademik, domestik maupun pemerintahan.( Akhbar, 2006 )
World Wide Web merupakan bagian dari internet yang paling berkembang dan paling populer, sehingga orang awam sering menyamakan keduanya. World Wide Web sendiri adalah kumpulan penyedia layanan web di seluruh dunia yang dapat meyediakan data yang dapat digunakan bersama-sama(Akhbar, 2006).
WWW bekerja berdasarkan mekanisme berikut :
1. Protokol adalah standard aturan yang digunakan untuk berkomunikasi pada komputer jaringan. Hypertext Transfer Protocol(HTTP) adalah protokol untuk WWW.
2. Address merupakan aturan penamaan alamat web yaitu URL(Uniform
Resource Locator) yang digunakan sebagai standard alamat internet.
3. HTML(Hypertext Transfer Protokol) merupakan bahasa standar yang digunakan untuk membuat dokumen yang bisa diakses melalui web.
WWW bekerja dengan cara menampilkan file-file HTML yang berasal dari server web pada sebuah program yang berjalan di sisi client yaitu browser. Browser adalah aplikasi yang digunakan untuk berselancar di dunia internet. Browser dapat memandu pengguna internet untuk berpindah antar situs maupun halaman web dengan prinsip keterkaitan/hyperlink.(Akhbar, 2006) Browser mengirimkan permintaan (request) kepada server web yang kemudian akan dijawab oleh server berupa kode-kode HTML yang akan dikirimkan kembali ke browser. Kode – kode HTML ini berisi perintah-perintah yang akan membentuk sebuah tampilan yang akan diterjemahkan oleh browser menjadi sebuah tampilan halaman web.
2.2 Web, Halaman Web, dan Website
Web adalah fasilitas dari internet yang dapat menampilkan data – data yang berupa teks, gambar, bunyi, animasi dan multimedia lainnya melalui
internet. Halaman web bisa dikatakan sebagai elemen – elemen yang menyusun sebuah website. Sedangkan website merupakan sebuah alamat tertentu di WWW yang menyediakan informasi atau layanan tertentu. (Akhbar, 2006)
2.3 WebTemplate
sistem yang bernama CMS (Content Management System). Sedangkan halaman presentasi akan diatur menggunakan sistem template agar mempunyai halaman presentasi (desain) yang seragam atau konsisten di setiap halaman web-nya
2.4 CMS(Content Management System)
Secara umum, CMS dapat diartikan sebagai sebuah sistem yang memberikan kemudahan kepada para penggunanya dalam mengelola dan mengadakan perubahan isi sebuah website dinamis tanpa sebelumnya dibekali pengetahuan tentang hal-hal yang bersifat teknis (Ahmad Luthfie, 2005). Dengan demikian, penggunanya setiap saat dapat menggunakannya secara leluasa untuk membuat, menghapus atau bahkan memperbaharui isi website. Manfaat umum CMS adalah :
a. Manajemen data
Manajemen data adalah fungsi utama dari CMS. Semua data atau informasi yang sudah ditampilkan maupun belum dapat dimanajemen dan disimpan dengan baik. Untuk memanajemen data, diperlukan database yang akan menyimpan semua data yang dibutuhkan, sehingga proses memasukkan data baru, melakukan perubahan data maupun menghapus data dapat dilakukan dengan mudah dan cepat.
b. Mengatur siklus hidup website
penampilan di website. Biasanya sebelum ditampilkan, bagian atau isi di-review terlebih dahulu oleh editor agar validitasnya terjamin.
Dalam penulisan skripsi ini, penulis mengembangkan sistem dari CMS
open source yang sudah ada, yaitu AuraCMS versi 1.62.
2.5 WebHosting
Web hosting adalah jasa penempatan file-file untuk website di web server agar bisa diakses oleh pengguna internet diseluruh dunia.(www.linuxhosting.web.id/faq.php ). Dalam penulisan skripsi ini, penulis hanya membuat aplikasi web hosting sampai tahap prototipe. Cara kerja dari prototipe webhosting ini adalah meng-copy-kan file – file sistem dan template ke direktori member yang akan diletakkan pada direktori utama sistem pada localhost dan membuatkan database baru untuk member. Selanjutnya, web template bisa diakses oleh member untuk dikelola melalui URL yang sudah diberikan pada saat account member diberikan setelah pendaftaran.
2.6 Pemrograman Web
Berdasarkan tempat dimana program dijalankan, pemrograman web dibagi menjadi 2 macam, yaitu server side dan client side.
2.6.1 Server Side
Program yang berjalan pada server side, proses penerjemahan kode programnya dilakukan di server yang selanjutnya dikirimkan ke browser sudah dalam bentuk HTML. Contohnya adalah PHP (Hypertext Preprosessor), ASP (Active Server Page), JSP (Java Server Pages), Perl (Practical Extraction and Report Language), CFM (ColdFusion).
2.6.2 Client Side
Program yang berjalan pada client side, proses penerjemahan kode programnya dilakukan di client, sehingga server hanya mengirimkan kode program yang di request oleh client, selanjutnya browser yang akan menerjemahkannya menjadi halaman web. Contohnya adalah Java Script, HTML, VB Script.
2.7 HTML (Hypertext Markup Language)
HTML dikenal sebagai bahasa standar untuk membuat halaman web, perintah-perintah HTML diletakkan dalam file berekstensi *.html dan ditandai dengan sebuah tag (tanda) berupa karakter “<” dan “>”. Bahasa HTML tidak mengenal jumping atau lompatan seperti bahasa pemrograman prosedural lainnya seperti Pascal atau C. Kode-kode HTML diterjemahkan oleh browser menjadi sebuah halaman dari atas ke bawah tanpa ada lompatan. Setiap dokumen HTML
program HTML bisa mengunakan Notepad, Microsoft Front Page, Winsyntax atau Macromedia Dreamweaver.
Sebuah dokumen HTML dibagi menjadi 2 bagian, yaitu header dan body.
Bagian head diawali dengan <head> dan diakhiri dengan </head>, sedangkan
bagian body diawali dengan <body> dan diakhiri dengan </body>. Bagian head
berisi judul dokumen dan informasi dasar lainnya, sedangkan body berisi data dokumennya, pengaturan format teks, format halaman web (dalam bentuk frame atau tabel) dan pembentukan link.
2.8 Java Script
Java Script merupakan salah satu contoh program yang berjalan pada sisi client. Java Script merupakan sebuah bahasa scripting yang dikembangkan oleh Netscape.Dengan Java Script kita bisa dengan mudah membuat sebuah halaman web yang interaktif. Program Java Script dituliskan pada file HTML (*.htm atau *.html) dengan menggunakan tag kontainer <SCRIPT>. Dengan kata lain, tidak perlu menuliskan program JavaScript pada file terpisah.
2.9 Pemrograman PHP (PHP:Hypertext Preprosessor)
pengunjung website atau komputer client, akan disimpan pada database web
server dan dapat ditampilkan kembali apabila diakses oleh user.
Penulisan kode program PHP berada dalam satu file dengan kode-kode program HTML. Untuk membedakan kode-kode-kode-kode program PHP dengan HTML, kode PHP diletakkan antara tanda <? Atau <?php dan diakhiri dengan ?>. File yang mengandung kode php akan diberi ekstensi *.php, pada saat file yang berekstensi *.php ini diakses, server akan mengenalinya sebagai file PHP dan akan menerjemahkannya menjadi tag-tag HTML pada browserclient.
Beberapa keunggulan yang dimiliki oleh PHP :
1. PHP memilki tingkat lifecycle yang cepat sehingga selalu mengikuti perkembangan teknologi internet.
2. PHP mampu berjalan di beberapa webserver seperti Apache, Microsoft IIS, PWS, dan Xitami
3. PHP mampu berjalan di berbagai platform seperti Linux, Windows, dan Solaris.
4. PHP mendukung akses ke beberapa database seperti MySQL, mSQL, PosgreSQL, dan MicrosoftSQL server.
5. PHP bersifat gratis.
2.10 Database MySQL
berjalan di berbagai platform. PHP menyediakan fasilitas untuk koneksi ke hampir semua database termasuk MySQL.
2.10.1 Koneksi ke Database MySQL
Agar dapat mengakses data pada database dalam program PHP, harus dilakukan koneksi terlebih dahulu dengan database MySQL. Fungsi untuk melakukan koneksi ke database adalah Mysql_Connect(). Bentuk
penulisannya : Mysql_Connect(nama_host, nama_user, password);
Nama_host adalah lokasi tempat MySQL dipublikasikan, nama_user adalah string dengan isi data nama user yang terdaftar dalam MySQL yang digunakan untuk mengakses data pada MySQL, password adalah string yang berisikan
password yang digunakan untuk mengakses database. Fungsi mysql_connect()
akan menghasilkan nilai true jika koneksi berhasil dilakukan, akan bernilai false jika koneksi gagal dilakukan.
2.10.2 Membuat Database
Database digunakan sebagai tempat untuk menyimpan data. Fungsi yang digunakan untuk membuat database adalah mysql_create_db(). Bentuk
penulisannya : Mysql_Create_db(nama);
Nama adalah string yang akan menjadi nama database.
2.10.3 Membuat Tabel
Tabel dibuat di dalam database yang berfungi untuk mengatur dan menyimpan informasi. Bentuk penulisan untuk membuat tabel adalah : create table nama_tabel(nama_field1 tipe_data1, nama_field2
Nama_tabel adalah nama tabel yang akan dibuat, nama_field1, nama-field2 adalah nama-nama field yang digunakan, tipe_data1, tipe_data2 adalah
tipe data dari field-field yang digunakan.
2.10.4 Memasukkan Data ke Tabel
Bentuk penulisan untuk memasukkan data ke dalam database adalah :
insert into nama_tabel (field1, field2,…) values
(‘data1’,’data2’,…) ;
Nama_tabel adalah nama tabel yang akan diakses dan ditambah datanya,
field1,field2 adalah nama kolom yang ada dalai tabel dan dapat diisi data pada tiap-tiap field-nya, data1,data1 adalah string yang berisi data dan akan dimasukkan ke dalai field-field tertentu.
2.10.5 Mencari dan Menampilkan Data Dalam Tabel
Bentuk penulisan untuk mencari dan menampilkan satu atau lebih data di database adalah SELECT field1, field2, … from nama tabel WHERE syarat1,syarat2, … ORDER BY nama_field
Field1, field2 adalah kolom yang akan diakses, nama_tabel adalah nama tabel yang akan diakses dan dibaca datanya, syarat1, syarat2 adalah string yang berisi syarat data bagaimana yang akan diakses misalnya data yang diawali karakter a, nama_field adalah nama_field yang menjadi dasar pengurutan data yang diakses.
2.10.6 Mengubah Data Tabel
Bentuk penulisan untuk mengubah data yang sudah ada adalah UPDATE nama_tabel SET field=nilai_baru, field2=nilai_baru, … WHERE
syarat1, syarat2,…
Nama_tabel adalah nama tabel yang datanya akan diubah, field adalah nama_kolom yang akan diubah, nilai_baru adalah data dalam bentuk string atau variabel yang dijadikan data pengubah data yang telah ada, syarat adalah ketentuan yang harus dipenuhi dalam setiap data yang diubah.
2.10.7 Menghapus Data Tabel
Bentuk penulisan untuk manghapus data tabel adalah DELETE FROM nama_tabel WHERE syarat1,syarat2,…
Nama_tabel adalah nama tabel yang akan dihapus datanya, syarat adalah ketentuan data yang akan dihapus.
2.10.8 Menampilkan Hasil Query Dalam Bentuk Array
Bentuk penulisannya : mysql_fetch_row(pengenal hasil).
2.10.9 Menghitung Jumlah Baris dalam Hasil Query
Bentuk penulisannya : mysql_num _rows(pengenal hasil).
2.11 Teknologi Cascading Style Sheet (CSS)
pendefinisian style. CSS menggunakan kode-kode yang tersusun untuk menetapkan style pada elemen HTML atau dapat juga digunakan membuat style baru yang biasa disebut dengan class.
Dengan kata lain, CSS digunakan untuk melengkapi file HTML, dan tugas utamanya adalah menetapkan aturan tampilan/style yang akan digunakan pada sebuah website, sehingga dapat dikatakan bahwa CSS merupakan template dari dokumen HTML yang menggunakannya.
2.12 Appserv
Appserv merupakan aplikasi gabungan 3 software server yaitu web server Apache, PHP, dan database MySQL yang berjalan di server lokal. Dengan meng-instal Appserv, tidak perlu mengkonfigurasi satu per satu ketiga software server tersebut, karena sudah dikonfigurasi otomatis saat Appserv ter-instal. Agar file-file web yang menggunakan PHP dan MySQL bisa ditampilkan, maka harus diletakkan di C:\AppServ\www. File-file web yang menggunakan PHP dan MySQL bisa dibuka di browser dengan mengetikkan
3.1. Analisa
3.1.1 Analisa Masalah
Minimnya informasi tentang kecamatan yang disisipkan dalam website kabupaten membuat potensi kecamatan tidak terpublikasi secara maksimal. Oleh karena itu, dengan adanya pengembangan sistem yang menyediakan webtemplate sekaligus hosting untuk kecamatan diharapkan mampu mengatasi persoalan di atas.
3.1.2 Gambaran Umum Sistem
Sistem terdiri dari subsistem website penyedia web template dan hosting, subsistem web template member, dan subsistem website member. Subsistem web template member didapatkan dari proses pendaftaran yang dilakukan pada subsistem website penyedia template dan hosting. Web template member sudah termasuk hosting di dalamnya.
Dalam webtemplate member, sudah disediakan fasilitas berupa template dan CMS. Karena web template member masih kosong, maka perlu diisi informasi terlebih dahulu oleh member. Proses pengisian web template ini akan menggunakan CMS yang sudah disediakan. Selama proses pengisian ini, sebaiknya member belum mem-publish webtemplate-nya, agar pengunjung tidak mendapati website yang kosong atau belum lengkap. Oleh karena itu, terdapat proses aktivasi yang akan dilakukan member setelah web template-nya diisi dan
siap untuk dipublikasikan. Status member sebelum aktivasi adalah member belum aktif.
Jika member sudah melakukan aktivasi maka webtemplate akan menjadi
website yang siap untuk diakses oleh pengunjung. Pengunjung bisa mengakses website member melalui URL, atau melalui link yang disediakan pada daftar link member terbaru pada website penyedia, atau dari hasil pencarian member pada
website penyedia. Setelah menjadi website, CMS berguna untuk proses perawatan dan update website. Status member setelah aktivasi adalah member aktif.
Jika dalam kurun waktu 3 bulan, member tidak melakukan aktivasi, administrator website penyedia berhak untuk menghapus data member.
3.1.3 Analisa Kebutuhan
3.1.3.1Analisa Kebutuhan Sistem
Analisa kebutuhan sistem dapat dibedakan berdasarkan user yang terlibat, yaitu :
a. Administrator Website Penyedia Web Template dan Hosting
Fasilitas untuk user ini adalah login, update buku tamu, update member dan logout. Update buku tamu meliputi pemberian tanggapan dan hapus buku tamu. Update member meliputi lihat detail member dan hapus member apabila member tidak melakukan aktivasi dalam waktu 3 bulan atau member menyalahgunakan webtemplate untuk kepentingan bukan untuk membuat website kecamatan.
b. Member
Member menggunakan sistem ini untuk melakukan pendaftaran yang dilakukan pada website penyedia template dan hosting, mengelola web template yang didapatkan dari proses pendaftaran, mengaktivasi web template-nya menjadi website yang siap diakses oleh pengunjung, dan merawat serta meng-update website setelah diaktivasi. Fasilitas yang disediakan sistem untuk mengelola web template adalah sebagai berikut :
No Fitur Keterangan
1 Testing tulisaspirasi Diperlukan untuk mengetes fasilitas pemberian tanggapan terhadap aspirasi.
2 Testing tulis berita Diperlukan untuk mengetes fasilitas validasi berita masuk.
3 Testing tulis komentar berita
4 Testing Pencarian berita dan halaman menu.
Diperlukan untuk mengetes fasilitas pencarian berita dan halaman menu.
5 Testing Lihat Data Diperlukan untuk mengetes data apa saja yang bisa dilihat dari sisi pengunjung.
6 Login Fasilitas untuk masuk ke halaman
administrasi yang akan digunakan untuk mengelola webtemplate.
7 Edit Data Login Fasilitas untuk mengedit data login
8 Menu Manager Fasilitas untuk mengelola menu, mulai dari tambah, edit, dan hapus menu.
9 Halaman Manager Fasilitas untuk mengelola halaman yang akan digunakan sebagai isi dari menu. Terdiri dari tambah, edit, dan hapus halaman.
10 Modul Manager Fasilitas untuk mengelola modul. Terdiri dari tambah, edit, dan hapus modul.
11 Berita Manager Fasilitas untuk mengelola berita. Terdiri dari tulis berita, edit dan hapus berita yang sudah dipublikasi, serta mengelola berita masuk dari pengunjung yang terdiri dari publikasikan, edit, dan hapus berita masuk. 12 Kolom Manager Fasilitas untuk mengelola kolom. Terdiri
bisa dimanfaatkan untuk menulis pemberitahan atau pengumuman tertentu. 13 Agenda Manager Fasilitas untuk mengelola agenda kegiatan
kecamatan, terdiri dari tambah, edit dan hapus agenda.
14 Aspirasi Manager Fasilitas untuk mengelola aspirasi, terdiri dari pemberian tanggapan aspirasi, dan hapus aspirasi.
15 TemplateManager Fasilitas untuk mengganti judul web, footer, dan template.
16 Logout Fasilitas untuk keluar dari halaman
administrasi.
Tabel 3.1
Fasilitas Member untuk Mengelola WebTemplate
c. Pengunjung web
Pengunjung web menggunakan sistem untuk menggunakan fitur – fitur interaktif seperti :
3.1.3.2Analisa Kebutuhan Hardware Software
Kebutuhan hardware dan software yang diperlukan penulis selama mengembangkan sistem adalah :
Kebutuhan hardware :
1 unit komputer dengan sistem operasi Windows XP Kebutuhan software :
- Browser : Internet Explorer
- Web Server : Apache
- Database : MySQL
3.1. Perancangan
3.2.1 Rancangan User Interface
3.2.1.1Rancangan Template
Rancangan template untuk website penyedia dan web template member mempunyai struktur template yang sama, yaitu menggunakan format tabel yang style – style-nya dibuat menggunakan CSS. Tabel akan terbagi menjadi 5 bagian, yang rancangannya terlihat seperti pada gambar berikut :
Gambar 3.1
Keterangan :
1. Header : tempat diletakkannya banner yang berisi judul web dan keterangan lainnya.
2. Blok Kiri : tempat untuk meletakkan modul – modul dan kolom.
Pada website penyedia : untuk meletakkan modul menu CMS administrator website penyedia, daftar tamu terbaru, link semua buku tamu, form buku tamu, dan statistik situs.
Pada web template member : untuk meletakkan modul menu CMS member, menu utama, daftar aspirasi terbaru, link ke form tulis aspirasi,
link ke lihat semua data aspirasi dan kolom yang ditambahkan member. 3. Blok Tengah : tempat untuk meletakkan content website.
4. Blok Kanan : tempat untuk meletakkan modul – modul, kolom, dan keterangan informasi tertentu..
Pada website penyedia : untuk meletakkan modul form pencarian member, daftar member terbaru, kalender, dan informasi untuk menghubungi adminstrator website penyedia.
Pada webtemplate member : untuk meletakkan modul form pencarian berita atau halaman menu, kalender, daftar link berita terbaru, link ke form tulis berita, link ke semua daftar berita, daftar agenda kecamatan, dan statistik situs.
Istilah modul di atas digunakan untuk menyebut fasilitas berupa aplikasi kecil yang dapat menampilkan informasi tertentu pada halaman web(Ahmad Luthfie, 2005). Modul ini bisa berupa modul dinamis yang posisinya bisa berubah, yaitu dari blok kiri ke blok kanan atau sebaliknya, dan berupa modul statis yang posisinya tetap. Modul statis pada webtemplate seperti : menu utama, menu CMS, form pencarian, dan statistik situs. Sedangkan modul dinamis pada web template seperti : berita terbaru, aspirasi terbaru, agenda dan kalender.
3.2.1.1Rancangan Form untuk Setiap User
3.2.2.2.1 Administrator Website Penyedia
a. Rancangan FormLogin Adminsitator Website Penyedia
Gambar 3.2
b. Rancangan Buku Tamu Manager
Gambar 3.3
Rancangan Halaman Utama Buku Tamu Manager
Gambar 3.4
c. Rancangan Member Manager
Gambar 3.5
Rancangan Halaman Utama Member Manager
3.2.2.2.1 Member
a. Rancangan Form Pendaftaran
Gambar 3.6
b. Rancangan Form Testing Tulis Aspirasi
Gambar 3.7
Rancangan Form Testing Tulis Aspirasi
c. Rancangan Form Testing Tulis Berita
Gambar 3.8
d. Rancangan Form Testing Tulis Komentar Berita
Gambar 3.9
Rancangan Form Testing Komentar Berita
e. Rancangan Form Testing Pencarian Berita dan Halaman Menu
Gambar 3.10
f. Rancangan Form Login Member
Gambar 3.11
Rancangan Form Login Member
g. Rancangan Edit Data Login
Gambar 3.12
Rancangan Form Edit Data Login
h. Rancangan Menu Manager
Gambar 3.13
Gambar 3.14
Rancangan Form Tambah Menu
Untuk form edit menu rancangannya sama dengan form tambah menu. Hanya saja, pada form edit menu sudah ditampilkan data menu yang akan diedit.
Gambar 3.15
Rancangan Form Tambah Submenu
i. Rancangan Halaman Manager
Gambar 3.16
Rancangan Halaman Utama Halaman Manager
Gambar 3.17
Rancangan Form Tambah Halaman
j. Rancangan Modul Manager
Gambar 3.18
Rancangan Halaman Utama Modul Manager
Gambar 3.19
Rancangan Form Tambah Modul
k. Rancangan Berita Manager
Gambar 3.20
Rancangan Halaman Utama Berita Manager
Gambar 3.21
Rancangan Form Tulis Berita
Gambar 3.22
Rancangan Halaman Utama Berita Masuk yang Belum Divalidasi
Untuk form edit berita masuk yang belum divalidasi rancangannya sama dengan form editberitayang sudah dipublikasi.
l. Rancangan Kolom Manager
Gambar 3.23
Rancangan Halaman Utama Kolom Manager
Gambar 3.24
Untuk form edit kolom rancangannya sama dengan form tambah kolom. Hanya saja, pada form edit kolom sudah ditampilkan data kolom yang akan diedit.
m. Rancangan Agenda Manager
Gambar 3.25
Rancangan Halaman Utama Agenda Manager
Gambar 3.26
Untuk form edit agenda rancangannya sama dengan form tambah agenda. Hanya saja, pada form edit agenda sudah ditampilkan data agenda yang akan diedit.
n. Rancangan Aspirasi Manager
Gambar 3.27
Rancangan Halaman Utama Aspirasi Manager
Gambar 3.28
o. Rancangan TemplateManager
Gambar 3.29
Rancangan Halaman Utama TemplateManager
Gambar 3.30
Rancangan Form Edit Judul Web
Gambar 3.31
p. Rancangan Form Aktivasi
Gambar 3.32
Rancangan Form Aktivasi
3.2.2.2.2 Pengunjung Web
a. Rancangan Form Tulis Buku Tamu pada Website Penyedia
Gambar 3.33
Rancangan Form Tulis Buku Tamu
b. Rancangan Form Pencarian Member
Gambar 3.34
Rancangan Form Pencarian Member
3.2.1 Rancangan Proses
Rancangan proses beserta input dan output-nya akan digambarkan dalam Diagram Aliran Data(DAD). Komponen – komponen DAD akan digambarkan menurut Yourdan dan DeMarco.
3.2.1.1Diagram Konteks
Gambaran umum sistem digambarkan dalam diagram konteks berikut :
Gambar 3.35 Diagram Konteks
Pada diagram konteks di atas, data yang mengalir dikelompokkan karena untuk menghindari aliran data yang kompleks. Penjelasan detail dari pengelompokan data akan dibahas pada kamus data, sedangkan penjelasan garis besar dari data yang dikelompokkan akan dijelaskan sebagai berikut :
c. Data login meliputi data-data yang digunakan untuk login ke halaman adminsitrasi.
d. Data pendaftaran meliputi data-data yang akan menjadi account member. e. Data testing fitur pengunjung meliputi data aspirasi, data berita., data
komentar dan data pencarian.
f. Data pengelolaan template adalah data – data yang akan digunakan untuk mengelola web template menjadi website yang siap dipublikasikan, meliputi data login, data menu, data halaman, data modul, data berita, data kolom, data agenda, data aspirasi, dan data template yang meliputi data judul web, data
footer dan data template.
g. Data aktivasi adalah data untuk mengaktivasi account member. h. Data perawatan situs sama dengan data pengelolaan template.
i. Data interaktif dengan web penyedia meliputi data buku tamu, dan data pencarian member.
j. Data interaktif dengan website member meliputi data aspirasi, data berita, data komentar dan data pencarian.
k. Hasil proses meliputi semua hasil proses yang terjadi, seperti pesan hasil proses maupun tampilan yang muncul akibat suatu proses.
3.2.1.2DAD Level 1
DAD level 1 akan memecah sistem menjadi 3 subsistem, yaitu subsistem
Data pendaftaran valid yang di-input-kan member ke subsistem website penyedia template dan hosting akan memunculkan database dan direktori baru untuk member yang akan membentuk sebuah subsistem baru, yaitu web template member. Semua direktori baru akan ditempatkan pada direktori utama yang bernama homesites. Setelah web template dikelola dan siap dipublikasikan, member meng-input-kan data aktivasi yang mengaktivasi web template-nya menjadi website member. Proses – proses yang terjadi pada masing – masing subsistem akan dibahas pada level selanjutnya.
3.2.1.3DAD Level 2
a. Proses – proses pada Subsistem 1
Gambar 3.37
Gambar 3.38
DAD Level 2 Subsistem 1 Sisi Member Proses Pendaftaran
Gambar 3.39
Gambar 3.40
DAD Level 2 Subsistem 1 Sisi Pengunjung Web
b. Proses – proses pada Subsistem 2
Gambar 3.41
DAD Level 2 Subsistem 2 Sisi Member
c. Proses – proses pada Subsistem 3
3.2.1.4DAD Level 3
a. Pecahan proses DAD Level 2 pada Subsistem 1
Gambar 3.42 DAD Level 3 Proses 1.2
Gambar 3.44
Gambar 3.45 DAD Level 3 Proses 1.5
b. Pecahan proses pada Subsistem 2
3.2.1.5DAD Level 4
Gambar 3.49 DAD Level 4 Proses 2.3.1
Gambar 3.51 DAD Level 4 Proses 2.3.3
Gambar 3.53
Gambar 3.54
Gambar 3.55
Gambar 3.56
Gambar 3.57
Gambar 3.58
Gambar 3.59
Gambar 3.60
3.2.1.6DAD Level 5
Gambar 3.61 DAD Level 5 Proses 2.2.2.1
Gambar 3.63 DAD Level 5 Proses 2.2.2.4
Gambar 3.65 DAD Level 5 Proses 2.2.3.1
Gambar 3.67 DAD Level 5 Proses 2.2.4.1
Gambar 3.69 DAD Level 5 Proses 2.2.5.1
Gambar 3.71 DAD Level 5 Proses 2.2.6.1
Gambar 3.73 DAD Level 5 Proses 2.2.6.2
Gambar 3.75 DAD Level 5 Proses 2.2.7.2
Gambar 3.77 DAD Level 5 Proses 2.2.9.2
3.2.1.7Kamus Data
legal-char [A-Z|a-z|0-9| |]
data member data pendaftaran + url + direktori + basisdata +
tgl_aktivasi
data pendaftaran @id + kecamatan + alamat + telepon + email +
camat + nip + kabupaten + deskripsi + pengelola
+ tgl_daftar + tampil + aktivasi
id [1 | 2 | 3 | . . . |999999999]10 kecamatan {legal-char}30
alamat {legal-char}100
email string_1 + @ + string_2 + . + string_3 tgl_daftar {legal-char}14
tampil [0 | 1]1
legal-char [A-Z|a-z|0-9| |]
data login username + password
username {legal-char}20 password {legal-char}32
legal-char [A-Z|a-z|0-9| |]
data menu @id + menu + url + halaman
menu {legal-char}50
url {legal-char}26
halaman [1 | 2 | 3 | . . . |999999999]10
legal-char [A-Z|a-z|0-9| |]
data submenu @id + submenu + url + halaman + parent
legal-char [A-Z|a-z|0-9| ]
data halaman @id + judul + konten + image
id [1 | 2 | 3 | . . . |999999999]10
judul {legal-char}50
konten {legal-char}~
image {legal-char}30
legal-char [A-Z|a-z|0-9| |]
data berita @id + judul + konten + image + pengirim + email
+ tanggal + publikasi
id [1 | 2 | 3 | . . . |999999999]10
judul {legal-char}100
image {legal-char}60
legal-char [A-Z|a-z|0-9| ]
data komentar @id + judul + konten + user + email + tanggal +
data modul @id + judul + modul + isi + posisi
id [1 | 2 | 3 | . . . |999999999]10
modul {legal-char}30
isi {legal-char}50
posisi [0 | 1]1
legal-char [A-Z|a-z|0-9| |]
data kolom @id + judul + isi + posisi
id [1 | 2 | 3 | . . . |999999999]10
judul {legal-char}30
isi {legal-char}~
posisi [0 | 1]1
legal-char [A-Z|a-z|0-9| |]
data agenda @id + tanggal + judul + isi
id [1 | 2 | 3 | . . . |999999999]10 tanggal {legal-char}14
judul {legal-char}100
isi {legal-char}~
legal-char [A-Z|a-z|0-9| |]
data aspirasi @id + tanggal + pengirim + email + judul +
alamat + aspirasi + tanggapan
pengirim {legal-char}50
legal-char [A-Z|a-z|0-9| |]
data judul_web @id + judul
id [1 ]1
judul {legal-char}25
legal-char [A-Z|a-z|0-9| ]
data footer @id + footer
id [1 ]1
footer {legal-char}~
legal-char [A-Z|a-z|0-9| ]
data template @id + folder + status
id [1 | 2 | 3 | . . . |999]3 folder {legal-char}30
legal-char [A-Z|a-z|0-9| |]
data aktivasi kode aktivasi kode aktivasi {legal-char}103
legal-char [A-Z|a-z|0-9| |]
Tabel 3.2 Kamus Data
3.2.2 Rancangan Struktur Menu
Rancangan struktur menu fasilitas dari masing – masing user sistem adalah sebagai berikut :
Gambar 3.79
Rancangan Struktur Menu Member
Gambar 3.81
3.2.3 Rancangan Database
Sistem terdiri dari subsistem website penyedia dan subsistem member baik yang masih berupa web template maupun sudah menjadi website. Masing- masing subsistem mempunyai database sendiri – sendiri. Alasan kenapa database member tidak disatukan dalam database penyedia karena mempertimbangkan bahwa subsistem member mempunyai banyak macam data yang perlu disimpan sehingga memerlukan database sendiri.
Database member terbentuk setelah member berhasil mendaftar. Semua member akan mempunyai struktur database yang sama.
3.2.3.1Entity Relationship Diagram (ERD)
Gambar 3.82
ERD Pada Subsistem Member
Entitas menu dan submenu dihubungkan dengan relasi punya.
Entitas submenu dan halaman dihubungkan dengan relasi punya.
Cardinality ratio-nya 1 to 1, karena 1 submenu hanya bisa mempunyai 1 halaman, dan 1 halaman hanya bisa dipunyai oleh 1 submenu. Participation constraint-nya total partial. Karena semua submenu pasti punya halaman, tatapi tidak semua halaman pasti dipunyai oleh submenu. Karena 1 to 1 dan total partial, maka kunci primer pada sisi partial masuk ke sisi total sehingga kunci primer pada entitas halaman masuk menjadi kunci tamu pada entitas submenu.
Entitas menu dan halaman dihubungkan dengan relasi punya.
Cardinality ratio-nya 1 to 1. Karena 1 menu hanya bisa mempunyai 1 halaman, dan 1 halaman hanya bisa dipunyai 1 menu. Participation constraint-nya partial partial. Karena tidak semua menu pasti punya halaman, dan tidak semua halaman pasti dipunyai oleh menu. Karena 1 to 1 dan partial partial, maka bebas untuk menentukan kunci primer mana yang akan masuk sebagai kunci tamu pada entitas lainnya. Penulis memilih kunci primer pada entitas halaman yang masuk ke entitas menu sebagai kunci tamu.
Entitas berita dan komentar dihubungkan dengan relasi punya.
3.2.3.2Mapping
Mapping akan mengkonversi rancangan pada ERD ke dalam struktur database, dimana entitas akan menjadi tabel dan atribut menjadi field. Dari ERD di atas akan dihasilkan mapping sebagai berikut:
halaman(id, judul, konten,image)
menu(id, menu, url, halaman)
Field halaman pada tabel menu adalah id pada tabel halaman.
submenu(id, menu, url, parent, halaman)
Field halaman pada tabel submenu adalah id pada tabel halaman, sedangkan field parent adalah id pada tabel menu.
berita (id, pengirim, email, judul, konten,image, tgl, publikasi)
komentar(id, user, email, judul, konten, tgl, berita)
Field berita pada tabel komentar adalah id pada tabel berita.
Selain dari hasil mapping, tabel – tabel yang diperlukan pada subsistem member berasal dari data simpanan yang tidak berelasi. Tabel – tabel tersebut adalah :
admin(id, username, email, password, tipe)
menu_admin(id, menu, url)
modul(id, modul, isi, posisi)
kolom(id, judul, isi, posisi)
agenda(id, tanggal, judul, isi)
judul_web(id, judul)
footer(id, footer)
template(id, folder, status)
counter(id, ip, counter, hits)
Tabel yang dibutuhkan pada subsistem website penyedia adalah sebagai berikut :
adminmenu(id, menu, url)
adminsuper(id, admin, email, password, tipe)
counter(id, ip, counter, hits)
halaman(id, judul, konten)
member(id, kecamatan, alamat, telepon, email, camat, nip, kabupaten, deskripsi, url, direktori, basisdata, aktivasi, tampil, tgl_daftar, tgl_aktivasi)
modul(id, modul, isi, posisi)
tamu(id, tanggal, pengirim, email, judul, alamat, pesan, tanggapan.)
3.2.3.3Aturan Domain
Field Tipe Data Panjang Null Extra Keterangan
Tabel Menu Subsistem Member
Field Tipe Data Panjang Null Extra Keterangan
id int 10 no auto_increment kunci primer
Tabel Submenu Subsistem Member
Field Tipe Data Panjang Null Extra Keterangan
id int 10 no auto_increment kunci primer
judul varchar 50 no
konten text no
image varchar 60 yes
Tabel 3.5
