Pembangunan Website Komunitas D3 Teknik Informatika Universitas Sumatera Utara Berbasis Web
PEMBANGUNAN WEBSITE KOMUNITAS D3 TEKNIK
INFORMATIKA UNIVERSITAS SUMATERA
UTARA BERBASIS WEB
TUGAS AKHIR
WITA CLARISA GINTING
092406119
PROGRAM STUDI D3 TEKNIK INFORMATIKA
DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SUMATERA UTARA
MEDAN
2012
(2)
PEMBANGUNAN WEBSITE KOMUNITAS D3 TEKNIK INFORMATIKA UNIVERSITAS SUMATERA
UTARA BERBASIS WEB
TUGAS AKHIR
Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh Ahli Madya
WITA CLARISA GINTING 092406119
PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA
MEDAN 2012
(3)
PERSETUJUAN
Judul : PEMBANGUNAN WEBSITE KOMUNITAS D3
TEKNIK INFORMATIKA UNIVERSITAS SUMATERA UTARA BERBASIS WEB
Kategori : TUGAS AKHIR
Nama : WITA CLARISA GINTING
Nomor Induk Mahasiswa : 092406119
Program Studi : DIPLOMA-III (D3) TEKNIK INFORMATIKA
Departemen : MATEMATIKA
Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN
ALAM (FMIPA) UNIVERSITAS SUMATERA UTARA
Diluluskan di Medan, Mei 2012
Diketahui/Disetujui oleh
Departemen Matematika FMIPA USU
Ketua, Dosen Pembimbing
Prof. Dr. Tulus, M. Si Drs. Bambang Irawan, M. Sc NIP. 196209011988031002 NIP. 194704211976031001
(4)
PERNYATAAN
PEMBANGUNAN WEBSITE KOMUNITAS D3 TEKNIK INFORMATIKA UNIVERSITAS SUMATERA
UTARA BERBASIS WEB TUGAS AKHIR
Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.
Medan, Juni 2012
WITA CLARISA GINTING 092406119
(5)
PENGHARGAAN
Puji dan syukur penulis panjatkan kepada Tuhan Yang Maha Esa yang telah memberikan kesempatan dan kesehatan hingga akhirnya penulis dapat menyelesaikan Tugas Akhir ini dan diselesaikan tepat pada waktunya sesuai dengan instruksi dan peraturan yang berlaku di Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumetera Utara.
Tugas akhir ini disusun sebagai salah satu syarat untuk menyelesaikan pendidikan D3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam, Universitas Sumatera Utara.
Selama penulisan tugas akhir ini, penulis menyadari bahwa banyak terdapat kesalahan-kesalahan yang mungkin terjadi, baik dari segi teknik, tata penyajian ataupun dari segi tata bahasa. Oleh karena itu penulis bersedia menerima kritik dan saran yang bersifat membangun dalam perbaikan tugas akhir ini.
Ucapan terima kasih penulis sampaikan kepada:
1. Bapak Drs. Bambang Irawan, M. Sc, selaku dosen pembimbing yang telah bersedia meluangkan waktu,dan yang telah membimbing penulis dengan sabar sehingga Tugas Akhir ini dapat penulis selesaikan tepat waktu.
2. Bapak Dr. Sutarman, M. Sc, selaku Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.
3. Bapak Prof. Dr. Tulus, M. Sc, selaku Ketua Departemen Matematika.
4. Bapak Syahril Efendi S. Si, M. IT dan Syahriol Sitorus S. Si, M. IT selaku ketua dan sekretaris program studi D3 Teknik Informatika.
5. Seluruh Dosen Pengajar Program Studi D3 Teknik Informatika Fakultas MIPA Universitas Sumatera Utara yang telah memberikan ilmu yang bermanfaat kepada penulis selama masa perkuliahan.
6. Para Pegawai FMIPA USU yang telah banyak membantu penulis.
7. Ucapan terima kasih penulis spesialkan kepada kedua orang tua penulis, Ayahanda Julius Ginting, dan Ibunda Dahlia Sinukaban yang tiada hentinya memberikan dukungan dan doa kepada penulis.
8. Kepada ke dua Abang penulis Dian Socrates Ginting dan Felik Hendarta Ginting, terima kasih atas doa dan dukungannya.
9. Kepada kakak tercinta Nina Efriliana Ginting, terima kasih atas bantuan dan pemberi semangat kepada penulis dalam mengerjakan Tugas Akhir ini.
10.Kepada sahabat-sahabat terbaik: Tarida Yanti, Evi Wulandari, Wilda Yulianun, dan Winda Meiriza, terima kasih buat kalian semua yang memberikan persahabatan terbaik di masa perkuliahan serta canda tawa kalian tidak pernah terlupakan didalam kehidupan penulis.
Akhirnya, penulis hanya bisa memanjatkan doa semoga Tuhan Yang Maha Esa akan membalas semua kebaikan semua pihak. Amin.
(6)
ABSTRAK
Penulisan Tugas Akhir ini adalah untuk menghasilkan karya dalam menyampaikan informasi antara mahasiswa aktif ataupun yang tidak aktif di D3 Teknik Informatika Universitas Sumatera Utara.
Metode penelitian yang digunakan adalah dengan metode penelitian kepustakaan yaitu merupakan jenis metode penelitian yang dilakukan dengan mengumpulkan data yang berhubungan dengan topik permasalahan yang penulis angkat dari judul yang telah penulis ajukan.
Hasil yang dicapai adalah Pembangunan Website komunitas D3 Teknik Informatika Universitas Sumatera Utara Berbasis Web.
(7)
DAFTAR ISI Halaman PERSETUJUAN PERNYATAAN PENGHARGAAN ABSTRAK DAFTAR ISI DAFTAR TABEL DAFTAR GAMBAR DAFTAR LAMPIRAN BAB 1 PENDAHULUAN
1.1 Latar Belakang 1.2 Rumusan Masalah 1.3 Tujuan Penelitian 1.4 Metode Penelitian 1.5 Batasan Masalah 1.6 Sistematika Penulisan
BAB 2 LANDASAN TEORI 2.1 Komunitas 2.2 Media Sosial 2.3 Website
2.3.1 World Wide Web 2.3.2 Homepage dan Browser 2.4 Internet 2.4.1 Layanan Utama Internet 2.5 Database 2.6 Structured Query Language (SQL)
2.6.1 Pengertian SQL
2.6.2 Latar Belakang SQL 2.6.3 Kelebihan SQL
2.7 HyperText Markup Language (HTML) 2.8 Hypertext Preprocessor (PHP)
2.8.1 Script PHP 2.8.2 Tipe Data PHP 2.9 MySQL
2.10 Apache 2.11 Javascript 2.12 Cascade Style Sheet (CSS) 2.13 Adobe Dreamwever CS5 2.13.1 Kelebihan Adobe Dreamweaver CS5
ii iii iv v vi viii ix x 1 1 2 2 3 3 4 6 6 7 8 9 9 10 11 11 13 13 14 17 17 18 19 20 21 22 23 24 24 25
(8)
2.13.2 Lingkungan Adobe Dreamweaver CS5 25 BAB 3 PERANCANGAN SISTEM 28
3.1 Perancangan Sistem 3.2 Teknologi Informasi Yang Digunakan
3.3 Diagram Konteks 3.4 Data Flow Diagram (DFD) 3.5 Perancangan Data
3.5.1 Perancangan Database dan Tabel
3.6 Entity Relationship Diagram (ERD) 3.7 Rancangan User Interface 3.7.1 Rancangan Output
3.7.2 Rancangan Input 3.8 Flowchart
BAB 4 IMPLEMENTASI SISTEM 4.1 Pengertian Implementasi Sistem 4.2 Komponen Utama dalam Implementasi Sistem
4.2.1 Perankat Keras 4.2.2 Perangkat Lunak
4.2.3 Unsur Manusia
4.3 Tampilan Pogram BAB 5 KESIMPULAN DAN SARAN
5.1 Kesimpulan 5.2 Saran
DAFTAR PUSTAKA LAMPIRAN 28 28 29 30 31 35 35 41 43 43 51 55 65 65 65 65 66 66 67 74 74 75 76 77
(9)
DAFTAR TABEL
Halaman Tabel 3.1 Tabel Identitas Tabel 3.2 Tabel Data Diri
Tabel 3.3 Tabel Informasi Tabel 3.4 Tabel Komentar Tabel 3.5 Tabel Gambar
Tabel 3.6 Tabel Pesan Tabel 3.7 Tabel Balas Pesan
Tabel 3.8 Tabel Id_Voting Tabel 3.9 Tabel Relasi
35 36 36 37 37 37 38 38 39
(10)
DAFTAR GAMBAR
Halaman Gambar 2.1 Tampilan Web Browser
Gambar 2.3 Tampilan Awal Adobe Dreamweaver CS5 Gambar 2.4 Tampilan Meja Kerja Adobe Dreamweaver CS5
Gambar 3.1 Diagram Konteks Gambar 3.2 DFD Level 0
Gambar 3.3 DFD Level 1 Gambar 3.4 DFD Level 2
Gambar 3.5 DFD Level 3
Gambar 3.6 ERD Website Komunitas
Gambar 3.7 Halaman Home Website Komunitas D3 Teknik Informatika Gambar 3.8 Halaman Output Website Lengkap Data Alumni/Mahasiswa
Gambar 3.9 Halaman Galeri Foto
Gambar 3.10 Halaman Pesan Masuk dan Pesan Terkirim
Gambar 3.11 Halaman Admin Website Pengolahan Data Alumni/Mahasiswa Gambar 3.12 Halaman Admin Website Pengolahan Data Informasi
Gambar 3.13 Halaman Details Website Pengolahan Informasi dan Komentar Gambar 3.14 Halaman Admin Pengolahan Data Admin
Gambar 3.15 Halaman Input /Output Gambar Website Komunitas Gambar 3.16 Halaman Details Website Input Pengiriman Pesan
Gambar 3.17 Halaman Details Website Pendaftaran Alumni/Mahasiswa Gambar 3.18 Halaman Details Website Login Alumni/Mahasiswa
Gambar 3.19 Halaman Input Data NIM Alumni/Mahasiswa
Gambar 3.20 Flowchart Login Gambar 3.21 Flowchart Inputan Member
Gambar 3.22 Flowchart Inputan Informasi Gambar 3.23 Flowchart Inputan Gambar Gambar 3.24 Flowchart Inputan Komentar
Gambar 3.25 Flowchart Inputan Data NIM oleh Admin Gambar 3.26 Flowchart Inputan Data Admin Oleh Admin Gambar 3.27 Flowchart Pengolahan Data Alumni
Gambar 3.28 Flowchart Pengolahan Data Informasi
Gambar 3.29 Flowchart Pengolahan Data Admin Oleh Admin
Gambar 4.1 Tampilan Login Website Gambar 4.2 Halaman Register Website
Gambar 4.3 Halaman Akun Member
Gambar 4.4 Tampilan Halaman Kirim Pesan Gambar 4.5 Tampilan Halaman Pesan Terkirim Gambar 4.6 Tampilan Form Upload Gambar Gambar 4.7 Tampilan Galeri Foto
Gambar 4.8 Tampilan Form Input NIM
10 25 26 30 31 33 34 35 41 43 44 45 46 47 48 49 50 51 52 53 54 54 55 56 57 58 59 60 61 62 63 64 68 68 69 70 70 71 71 72
(11)
Gambar 4.9 Tampilan Halaman Pengolahan Data Member 72 Gambar 4.10 Tampilan Halaman Pengolahan Data Informasi 73
(12)
DAFTAR LAMPIRAN
Lampiran A : Daftar Pustaka
Lampiran B : Kartu Bimbingan Tugas Akhir Mahasiswa
Lampiran C : Surat Keterangan Hasil Uji Program Tugas Akhir Mahasiswa Lampiran D : Listing Program
(13)
ABSTRAK
Penulisan Tugas Akhir ini adalah untuk menghasilkan karya dalam menyampaikan informasi antara mahasiswa aktif ataupun yang tidak aktif di D3 Teknik Informatika Universitas Sumatera Utara.
Metode penelitian yang digunakan adalah dengan metode penelitian kepustakaan yaitu merupakan jenis metode penelitian yang dilakukan dengan mengumpulkan data yang berhubungan dengan topik permasalahan yang penulis angkat dari judul yang telah penulis ajukan.
Hasil yang dicapai adalah Pembangunan Website komunitas D3 Teknik Informatika Universitas Sumatera Utara Berbasis Web.
(14)
BAB 1
PENDAHULUAN
1.1 Latar Belakang
Internet telah dapat dimanfaatkan dalam berbagai bidang kehidupan, mulai dari aplikasi sederhana berupa chatting, penelusuran Website, email, sampai kepada perkembangan teknologi internet yang memungkinkan untuk menelepon teman atau saudara di luar negeri dengan layanan VoIP (Voice Over Internet Protocol). Internet memiliki kelebihan dibanding media lainnya. Ketakterbatasan internet dapat memberikan service selama 24 jam sehari dan 365 hari satu tahun non stop. Hal ini merupakan suatu kelebihan yang tidak dimiliki media lainnya.
Perkembangan internet inilah yang membuat penulis merasa tergerak untuk membuat suatu Website di mana Website ini digunakan untuk komunitas mahasiswa D3 Teknik Informatika Universitas Sumatera Utara, baik itu mahasiswa yang masih aktif di D3 Teknik Informatika ataupun yang lulus dari D3 Teknik Informatika.
Website ini nanti diharapkan dapat menjadi media informasi bagi alumni maupun mahasiswa agar dapat terus saling berhubungan timbal balik antara mahasiswa yang masih aktif di perkuliahan dengan alumni-alumni dari D3 Teknik Informatika.
(15)
Oleh karena itu berdasarkan pengamatan ini, penulis mengambil judul tugas akhir “Pembangunan Website Komunitas D3 Teknik Informatika Universitas Sumatera Utara Berbasis Web”.
1.2 Rumusan Masalah
Berdasarkan latar belakang yang telah diuraikan sebelumnya, permasalahan yang akan dibahas pada Tugas Akhir ini adalah bagaimana PEMBANGUNAN WEBSITE KOMUNITAS D3 TEKNIK INFORMATIKA UNIVERSITAS SUMATERA UTARA BERBASIS WEB.
1.3 Tujuan Penelitian
Tujuan dari Tugas Akhir pembuatan Website berikut ini adalah:
a. Menyediakan sarana berkomunikasi antara alumni mahasiswa D3 Teknik Informatika dan mahasiswa yang masih aktif kuliah di D3 Teknik Informatika b. Saling bertukar informasi dan pengetahuan antara alumni dengan mahasiswa
(16)
1.4 Metode Penelitian
Metode penelitian merupakan suatu cara atau teknik yang sistematik untuk mengerjakan atau menyelesaikan suatu masalah. Adapun metode penelitian yang penulis gunakan untuk menyelesaikan permasalahan tersebut adalah:
a. Penelitian Kepustakaan merupakan jenis metode penelitian yang dilakukan dengan mengumpulkan data yang berhubungan dengan topik permasalahan yang penulis angkat dari judul yang telah penulis ajukan yang bersifat teoritis. b. Penelitian Lapangan merupakan metode tanya jawab kepada setiap orang
tentang pentingnya mencari dan mempelajari referensi-referensi yang berkaitan dengan masalah yang ingin diselesaikan
1.5 Batasan Masalah
a. Pengolahan data, seperti data mahasiswa dan alumni hanya bisa dilakukan oleh administrator. Hak akses member hanya menyampaikan informasi yang dikirim dan mengolah informasi yang dikirimnya sendiri seperti menghapus dan mengedit informasi.
b. Menghindari data ganda, penulis akan pembuatan suatu validasi data agar user tidak memasukkan data yang sama ke dalam sistem
c. Website yang dirancang oleh penulis hanya terbatas untuk komunitas D3 Teknik Informatika dan untuk memverivikasi mahasiswa yang terdaftar di D3 Teknik Informatika. Admin terlebih dahulu memasukkan NIM mahasiswa
(17)
USU ke dalam database dan akan membandingkan NIM yang diinput oleh member dibaca oleh sistem ada atau tidak.
1.6 Sistematika Penulisan
Tugas akhir ini terdiri dari abstrak yang membahas mengenai ringkasan dari tugas akhir secara umum, kata pengantar, daftar isi, daftar gambar dan daftar tabel. Kemudian isi dari buku tugas akhir ini terdiri dari beberapa bab, yang masing-masing dijelaskan sebagai berikut:
Bab 1: Pendahuluan
Bab ini menjelaskan beberapa hal, antara lain: latar belakang pembuatan tugas akhir, tujuan pembuatan tugas akhir, permasalahan, batasan permasalahan, metodologi pembuatan dan sistematika penulisan tugas akhir.
Bab 2: Landasan Teori
Bab ini membahas beberapa teori penunjang yang berhubungan dengan pokok pembahasan dalam tugas akhir ini.
Bab 3: Perancangan Sistem
Bab ini membahas mengenai desain dan perancangan aplikasi. Desain aplikasi meliputi desain data, desain proses dan desain antar muka.
(18)
Bab 4: Implementasi Sistem
Dalam bab ini dijelaskan mengenai implementasi pembuatan aplikasi berdasarkan hasil rancangan yang telah dibuat sebelumnya.
Bab 5: Kesimpulan Dan Saran
(19)
BAB 2
LANDASAN TEORI
2.1 Komunitas
Kata komunitas berasal dari bahasa Latin yaitu communis, yang berarti umum, publik yang saling berbagi. Istilah community dalam bahasa inggris berasal dari istilah Latin
yaitu communitatus, awalan “Com-“ mengandung arti dengan atau bersama, “-Munis-“ mempunyai arti perubahan atau pertukaran, dan akhiran “-tatus” berarti
kecil, intim, atau lokal (Wikipedia, 2006). Sejak akhir abad ke 19, istilah komunitas mempunyai makna sebuah perkumpulan dengan harapan dapat semakin dekat dan harmonis antara sesama anggota (Elias 1974, dikutip oleh Hogget, 1997: 5). Kemudian beberapa definisi tentang komunitas mulai bermunculan. Beberapa memfokuskan komunitas sebagai daerah geografis; sebuah kelompok yang terdiri dari beberapa orang yang tinggal berdekatan; dan ada yang melihat komunitas sebagai daerah yang mempunyai kehidupan yang sama. Komunitas dapat berarti sebuah nilai (Frazer, 2000: 76). Komunitas dapat digunakan untuk membawa nilai-nilai seperti: solidaritas, komitmen, saling tolong-menolong, dan kepercayaan.
(20)
Pengertian komunitas mengacu pada sekumpulan orang yang saling berbagi perhatian, masalah, atau kegemaran terhadap suatu topik dan memperdalam pengetahuan serta keahlian mereka dengan saling berinteraksi secara terus menerus (Wenger, 2004: 4). Komunitas merupakan bagian dari masyarakat yang saling berbagi informasi mengenai suatu subjek tertentu. Mereka mendiskusikan keadaan, aspirasi dan kebutuhan mereka.
2.2 Media Sosial
Media sosial adalah sebuah media online, dengan para penggunanya bisa dengan mudah berpartisipasi, berbagi, dan menciptakan isi meliputi forum da yang paling umum digunakan oleh masyarakat di seluruh dunia. Media sosial teknologi mengambil berbagai bentuk termasuk majalah, forum internet, Weblog, blog sosial, microblogging, wiki, podcast, foto atau gambar, video, peringkat dan bookmark sosial. Dengan menerapkan satu set teori-teori dalam bidang media penelitian (kehadiran sosial, media kekayaan) dan proses sosial (presentasi, self-disclosure).
Pesatnya perkembangan media sosial kini dikarenakan semua orang seperti bisa memiliki media sendiri. Jika untuk memiliki media tradisional sepert lain halnya denga menggunakan media sosial dengan jaringan internet bahkan yang aksesnya lambat
(21)
sekalipun, tanpa biaya besar, tanpa alat mahal dan dilakukan sendiri tanpa karyawan. Pengguna media sosial dengan bebas bisa mengedit, menambahkan, memodifikasi baik tulisan, gambar, video, grafis, dan berbagai model content lainnya.
menciptakan kreasi, berfikir, berdebat, menemukan orang yang bisa menjadi teman baik, menemukan pasangan, dan membangun sebua menggunakan media sosial menjadi diri sendiri, selain kecepatan informasi yang bisa diakses dalam hitungan detik, menjadi diri sendiri dalam media sosial adalah alasan mengapa media sosial berkembang pesat. Tak terkecuali, keinginan unt
2.3 Website
Website adalah kumpulan dari halaman Web yang tersimpan di dalam sebuah komputer utama (yang disebut Web Server) dan diakses oleh komputar luar (yang disebut dengan Web Client). Pembuat Website memasukkan file ke dalam Web server. Sebuah Web server hanya sebuah komputer dengan special software yang mengizinkan orang lain untuk melihat sebuah halaman Web ketika menuju ke alamat Web dari Web server tersebut. Contohnya ketika seseorang memasukkan halaman CNN. (Mark Bell, 2011: 7).
(22)
Website awalnya merupakan suatu layanan sajian informasi yang menggunakan konsep hyperlink, yang memudahkan server atau pengguna internet melakukan penelusuran informasi di internet. Informasi yang disajikan dengan Web menggunakan
konsep multimedia, informasi dapat disajikan dengan menggunakan banyak media,
seperti teks, gambar, animasi, suara, atau film.
2.3.1 World Wide Web
WWW (World Wide Web) adalah sebuah metode baru yang berjalan di dunia internet yang akhir-akhir ini berkembang dengan cepat (Bunafit Nugroho, PHP & MySQL dengan Editor Dreamweaver MX, 2004: 1)
2.3.2 Homepage dan Browser
Homepage adalah halaman pembuka/pertama dari sekian banyaknya Website, browser merupakan suatu program yang dirancang untuk mengambil informasi-informasi dari suatu server komputer pada jaringan internet. Informasi-informasi ini biasanya di kemas dalam page-page, di mana setiap page biasa mempunyai beberapa link yang menghubungkan Web page tersebut ke sumber informasi lainnya. Jika suatu link di klik, maka browser akan mencari alamat dari tujuan link tersebut dan browser akan menampilkan informasi tersebut, jika tidak menemukan alamat yang di tuju, maka browser akan memberikan suatu pesan yang menyatakan bahwa alamat dari tujuan link tersebut tidak dapat ditemukan.
(23)
Berikut ini disajikan Gambar 2.1 Tampilan Web Browser
Gambar 2.1 Tampilan Web Browser
2.4 Internet
Internet adalah rangkaian hubungan jaringan komputer yang dapat diakses secara umum diseluruh dunia, yang mengirimkan data dalam bentuk paket data berdasarkan standar Internet Protocol (IP). Lebih dalam lagi, Internet adalah kumpulan jaringan dari jaringan-jaringan komputer dunia yang terdiri dari jutaan unit-unit kecil, seperti jaringan pendidikan, jaringan bisnis, jaringan pemerintahan, dan lain-lain, yang secara bersama menyediakan layanan informasi seperti e-mail, online chat, transfer file dan saling keterhubungan (linked) antara satu halaman Web dengan sumber halaman Web yang lainnya (Yuhefizar, 2008: 2).
(24)
2.4.1 Layanan Utama Internet
Internet telah membawa perubahan yang sangat besar dalam segala aspek kehidupan hal ini tidak terlepas dari fasilitas-fasilitas yang terdapat dalam internet. Berikut ini fasilitas utama yang ada di Internet (Yuhefizar, 2008: 10):
a. Website (www), yaitu kumpulan halaman-halaman Web yang mengandung
informasi. Informasi yang disajikan diolah sedemikian rupa sehingga mampu memberikan multiflier efek, melalui sebuah Website bisa berbelanja secara online (e-commerce), belajar jarak jauh (e-learning), e-government, ebanking, dan lain-lain.
b. Mailing List (milis), yaitu media untuk membentuk ruang diskusi di internet yang dapat diikuti oleh siapa saja yang mempunyai minat terhadap suatu topik. c. File Transfer Protocol (FTP), yaitu fasilitas untuk mengirim (meng-upload)
dan mengambil (men-download) file atau folder antara komputer yang terhubung dengan jaringan internet.
d. Chatting, yaitu fasilitas untuk mengobrol secara online baik secara teks maupun grafik.
2.5 Database
Database adalah kumpulan data terhubung yang disimpan secara bersama-sama pada suatu media, tanpa adanya suatu kerangkapan data, sehingga mudah untuk digunakan kembali, dapat digunakan oleh satu atau lebih program aplikasi secara optimal, data
(25)
disimpan tanpa mengalami ketergantungan pada program yang akan menggunakannya, data disimpan sedemekian rupa sehingga jika ada penambahan, maka pengambilan dan modifikasi data dapat dilakukan dengan mudah dan terkontrol. (Hj. Harlinda L., MH, 2005: 372).
Keuntungan menggunakan database sebagai media penyimpanan data adalah duplikasi data dapat dikurangi, ketidakkonsistenan data dapat dihindari, data dapat digunakan bersama-sama oleh banyak data pemakai, dan keamanan data lebih terjaga dan integritas data dapat terpelihara. Beberapa model basis data antara lain adalah (Lukas Sebastianus Oscar, 2008: 61):
1. Model database jaringan (Network database model), model ini database yang datanya dinyatakan sebagai sekumpulan baris dengan hubungannya dinyatakan sebagai pointer.
2. Model database hirarki (Hierarchycal database model), model ini merupakan database yang dapat digambarkan sebagai hirarki.
3. Model database relasional (Relational database model), model ini merupakan database yang data dan hubungannya dinyatakan dalam bentuk tabel yang setiap kolomnya mempunyai nama berbeda.
4. Model database berorientasi objek (Object oriented database model) merupakan alternatif bagi sistem relasional di mana objek yang kompleks memainkan peranan sentral.
Data disimpan di dalam database untuk keperluan penyediaan informasi, diorganisasikan untuk efisiensi kapasitas penyimpanan supaya informasi yang
(26)
dihasilkan berkualitas. Database diakses atau dimanipulasikan dengan menggunakan paket software Database Managemen System (DBMS).
2.6 StructuredQuery Language (SQL)
Bahasa SQL merupakan bahasa yang sudah umum digunakan dalam database, sebelum sampai pada SQL yang sudah digunakan saat ini. Bahasa SQL mengalami beberapa kali pengembangan yang disesuaikan dengan kebutuhan.(Rachmat Selamet, 2008: 158).
2.6.1 Pengertian SQL
SQL adalah struktur blok bahasa query dalam pengambilan dan pemanipulasian data (Rachmat Selamet, 2008: 158). Dalam pemakaiannya, SQL dibagi menjadi 3 (tiga) yaitu:
1. DDL (Data Definition Language): bahasa yang digunakan untuk mendefinisikan data DDL terdiri dari CREATE (membuat), ALTER (mengubah), dan DROP (menghapus)
2. DML (Data Manipulation Language): bahasa yang digunakan untuk memanipulasi data. DML terdiri dari SELECT (mengambil), INSERT (menambah), DELETE (menghapus), dan UPDATE (mengubah).
(27)
3. DCL (Data Control Language): merupakan perintah SQL yang berhubungan dengan pengaturan hak akses MySQL. DCL terdiri dari GRANT (mengatur), REVOKE (menghapus atau mencabut)
2.6.2 Latar Belakang SQL
Pada awal pengembangan SQL, namanya adalah SEQUEL (Structured English Query Language) yang dirancang oleh IBM di San Jose pada awal 1970.
Pada bulan Oktober 1986, ANSI (American National Standard Institute) membuat versi dasar dari SQL yang dibuat sebagai standar. Pada pemakaiannya, banyak yang tidak mengikuti standar yang dikeluarkan oleh ANSI ini sehingga standarnya di-update dengan menambahkan integrity pada tahun 1989. SQL ini dikenal juga dengan nama SQL-89 atau SQL1 (Rachmat Selamet, 2008: 159). Beberapa hal yang diperkenalkan dari awal, yaitu:
1. DDL: Bahasa untuk mendefinisikan data (CREATE, ALTER, DROP).
2. DML: Bahasa untuk memanipulasi data (SELECT, INSERT, DELETE, dan UPDATE).
3. DCL: Bahasa untuk pengaturan hak akses (GRANT, REVOKE) 4. Table and view: Objek yang dapat dibuat hanya tabel dan view saja.
5. Basic and type: tipe data yang dapat digunakan numeric (integer, float, numeric) dan karakter (char dan varchar).
6. NULL: digunakan untuk memeriksa data apakah kosong atau tidak. 7. Constraint: digunakan untuk memeriksa keterhubungan antar tabel.
(28)
Pada tahun 1992, dikeluarkan lagi standar dengan nama SQL-92 atau SQL2. Berikut ini perbedaan antara SQL1 dan SQL2, yaitu:
1. Kode error: SQL1 tidak menyebutkan nilai secara sepesifik dari kode error sehingga tidak ada standar untuk kode error ini. SQL2 sudah mendukung kode error ini.
2. Embedded SQL: Embedded SQL adalah pemakaian perintah SQL
menggunakan parameter yang berhubungan dari luar. Contoh: SELECT * FROM siswa WHERE nama=’name’ (Parameter name yang dapat diisi denan sesuatu yang dapat dihubungkan dengan program yang digunakan, misalnya: bisa di-input dari textbox atau dihubungkan dengan grid).
3. SQL dinamis: beberapa perintah SQL dapat dikerjakan sekaligus dalam sebuah server database. SQL2 sudah mendukung hal tersebut.
4. Tipe data: SQL2 menambah standarisasi beberapa tipe data seperti date, time, dan money.
5. Kompabilitas: SQL2 sudah dapat digunakan untuk produk DBMS yang berbeda. Semuanya sudah diatur oleh ODBC (Open Database Connectivity) yang dibuat oleh Microsoft yang juga sudah mendukung pemakaian SQL2 ini.
6. Stored Procedure: SQL2 sudah dapat menggunakan stored procedure
(kumpulan dari beberapa perintah SQL yang dikerjakan dalam 1 kali eksekusi). Kecepatan yang dihasilkan oleh stored procedure jauh lebih cepat dibandingkan dengan menggunakan perintah satu per satu.
7. Domain: digunakan untuk membuat tipe data dan pengecekan data secara
(29)
8. Data type conversion: digunakan untuk mengubah tipe data. Perintah yang digunakan adalah cast.
9. Suquery: menghubungkan 1 perinyah query dengan kondisi dari perintah query yang lain.
10.Aggregate function: fungsi untuk perhitungan statistic (sum, average, count, min, max).
Pengembangan berikutnya dikeluarkan pada tahun 1999 dengan nama SQL3. Pada versi ini sudah dapat diterapkan dalam OOP (Object Oriented Programming). Berikut ini penambahan dari SQL3 dibandingkan dengan SQL2, yaitu:
1. Mendukung pemakaian trigger.
2. Mendukung tipe abstrak seperti tipe objek untuk grafik dan multimedia. 3. Mendukung penulisan union secara rekursi.
4. Mendukung tipe data enumerasi dan Boolean.
5. Mendukung pemakaian cursor (temporary data yang dihasilkan dari perintah SQL).
6. Mendukung pemakaian array. 7. Menganggap SQL sebagai objek. 8. Suptable dan supertable.
(30)
2.6.3 Kelebihan SQL
Sejak dibuat sebagai standar, banyak keuntungan dengan menggunakan bahasa SQL dibanding dengan yang lain (Rachmat Selamet, 2008: 161), yaitu:
1. Kecepatan dalam pengambilan data. Di sebuah majalah pernah disurvei pemakaian bahasa SQL dibandingkan dengan pemakaian filter dalam bahasa pemrograman bersangkutan. Hasilnya, yang menggunakan bahasa SQL lebih cepat 20 kali dibandingkan dengan pemakaian filter.
2. Standarisasi. SQL hampir semua bahasa pemrograman saat ini mendukung bahasa SQL.
3. Program mengurangi kerumitan. JIka ingin mengambil data dengan kriteria tertentu, maka dengan menggunakan SQL cukup menggunakan bahasa SELECT yang penulisannya tidak terlalu panjang (dibandingkan dengan memeriksa seluruh data dan dibandingkan dengan perintah if).
2.7 HyperText Markup Language (HTML)
HTML merupakan bahasa yang digunakan untuk menulis halaman Web. HTML berisi dokumen teks yang memiliki aturan dalam penulisannya dan dirancang untuk tidak tergantung pada sistem operasi tertentu. (Henky Prihatma, 2005: 13). Dokumen HTML disebut mark up language, karena berisi tanda-tanda (Tag) dan disusun oleh elemen-elemen yang merupakan ciri utama dari dokumen HTML.
(31)
Tag html terdiri atas sebuah kurung sudut kiri (<), sebuah nama tag, dan sebuah kurung sudut kanan (>). Tag umumnya berpasangan (misalnya <H1> dengan </H1> Elemen yang dibutuhkan untuk membuat suatu dokumen HTML dinyatakan dengan tag <html>, <head>, dan <body> berikut tag-tag pasangannya. Setiap dokumen terdiri atas tag head dan body. Contoh penulisan html dasar sebagai berikut:
<HTML> <HEAD>
<TITLE> BELAJAR HTML </TITLE> </HEAD>
<BODY> BELAJAR HTML <BR>ITU MENYENANGKAN </BODY>
</HTML>
Dokumen HTML adalah file teks murni yang dapat dibuat dengan editor teks biasa ataupun dengan editor khusus, menjalankan dokumen HTML harus menggunakan program khusus yang disebut Web browser atau browser.
2.8 PHP (Hypertext Preprocessor)
PHP adalah bahasa pemrograman Web yang bekerja pada sisi server. Pada prinsipnya, bahasa pemrograman ini banyak mengadopsi sintaks dari bahasa pemrograman C. PHP dikenal dengan sebuah sctipting language yang menyatu dengan tag-tag HTML, dieksekusi di server dan digunakan untuk membuat halamanWeb yang dinamis seperti halnya ASP (Active Server Pages) atau JSP(Java Server Pages).
(32)
PHP banyak dipakai untuk memprogram situs Web dinamis, walaupun tidak tertutup kemungkinan digunakan untuk pemakain lain, seperti phpBB dan MediaWiki. PHP juga dapat dilihat sebagai pilihan lain dari ASP.NET/C#/VB.NET Microsoft, ColdFusion Macromedia, JSP/Java Sun Microsystems, dan CGI/Perl. Contoh aplikasi lain yang lebih kompleks berupa CMS yang dibangun menggunakan PHP adalah Mambo, Joomla, Postnuke, Xaraya, dan lain-lain. PHP dijalankan dalam file berekstensi .php, .php3 atau .phtml, itu tergantung dengan pengaturan PHP tersebut, tetapi secara umum ekstensi file PHP adalah .php. Kode PHP menyatu dengan tag-tag HTML dalam satu file. Kode PHP diawali dengan tag <? Atau <?php dan ditutup dengan ?>. (Angelina Eleonora R, 2009: 230).
PHP dapat digunakan untuk berbagai macam tujuan dunia pemrograman seperti membuat database, meng-update database, melakukan operasi matematika (termasuk fungsi-fungsi kompleks seperti trigonometri) serta melakukan berbagai macam operasi file seperti membuat dan menghapus fie tersebut. (Lukas Sebastianus Oscar, 2008: 61).
2.8.1 Script PHP
Setiap program PHP disebut dengan script. Script berupa file text yang dapat dibuat dengan menggunakan program editor file text biasa seperti notepad, edit, dan lainya. Script PHP diawali dengan tag <? Dan diakhiri dengan tag ?>. Setiap baris atau statement harus diakhiri dengan menggunakan tanda titik koma (;) dan umumnya setiap statement dituliskan dalam satu baris. Script PHP merupakan script yang digunakan untuk menghasilkan halaman-halaman Web.
(33)
2.8.2 Tipe Data PHP
PHP mengenal lima tipe data, yaitu: integer, floating point, string, arrays dan objects. Tipe data dari sebuah variabel akan ditentukan otomatis oleh PHP bergantung pada operasi yang sedang dilakukan mengunakan variabel tersebut, lima tipe data tersebut, yaitu:
1. Tipe Data Integer
Tipe data integer meliputi semua bilangan bulat, range data integer pada PHP yaitu antara –2,147,483,648 samapai +2,147,483,647 pada platform 32 bit. PHP akan secara otomatis mengkonversi data integer menjadi floating point berada di luar range.
2. Tipe Data String
Sebuah data dengan tipe string dinyatakan dengan mengapitnya mengunakan tanda petik tunggal (‘ ‘) maupun ganda (“ “). Perbedaannya adalah jika tanda petik tunggal, maka pada string itu tidak dapat dimasukkan variabel dan escape sequence handling.
3. Tipe Data Array
Array adalah sebuah data yang mengandung satu atau lebih data, dan dapat diindeks berdasarkan numerik maupun string. Data yang dikandung pada sebuah array dapat dari tipe data yang lain bahkan dapat juga bertipe array. PHP membolehkan elemen dari array terdiri dari data dengan tipe yang berbeda beda.
(34)
4. Tipe Data Object
Object adalah sebuah tipe data yang dapat berupa sebuah bilangan, variable atau bahkan sebuah fungsi. Object dibuat dengan tujuan untuk membantu programmer yang terbiasa dengan Object Oriented Programming.
5. Tipe Data Floating Point
Tipe data ini berisi bilangan pecahan atau bilangan desimal. Kisaran data floating antara 1.7E-308 sampai 1.7E+308, bentuk data ini adalah desimal ataupun dalam bentuk pangkat.
2.9 MySQL
MySQL merupakan sebuah database developer yang juga bersifat free, MySQL banyak digunakan sebagai database karena mudah digunakan dan juga sangat banyak tersedia. MySQL menggunakan bahasa SQL yang sangat mudah digunakan saat ini. MySQL merupakan software database yang paling populer di lingkungan Linux atau Unix, kepopuleran ini ditunjang karena performansi query dari databasenya yang saat ini bisa dikatakan paling cepat dan juga memiliki sedikit permasalahan (Roy Otniel P., Erwin Kristianto J, 2008: 127).
Kehandalan suatu sistem database dapat diketahui dari cara kerja pengoptimasi-nya dalam melakukan proses perintah-perintah SQL yang dibuat oleh pengguna maupun program-program aplikasi yang memanfaatkannya, sebagai peladen basis data.
(35)
MySQL mendukung operasi basisdata transaksional maupun operasi basisdata non-transaksional. Pada modus operasi non-transaksional, MySQL dapat dikatakan unggul dalam hal unjuk kerja dibandingkan perangkat lunak peladen basis data kompetitor lainnya. Namun demikian pada modus non-transaksional tidak ada jaminan atas reliabilitas terhadap data yang tersimpan, karenanya modus non-transaksional hanya cocok untuk jenis aplikasi yang tidak membutuhkan reliabilitas data seperti aplikasi blogging berbasis WeContent Management System), dan sejenisnya. Kebutuhan sistem yang ditujukan untuk bisnis sangat disarankan untuk menggunakan modus basisdata transaksional, hanya saja sebagai konsekuensinya unjuk kerja MySQL pada modus transaksional tidak secepat unjuk kerja pada modus non-transaksional.
2.10 Apache
Apache merupakan salah satu Web server yang melayani permintaan client terhadap suatu halaman Web. Web Server adalah server internet yang mampu melayani koneksi transfer data dengan protocol Hypertext Transfer Protocol (HTTP). Web server pada umumnya melayani data dalam bentuk file HTML lainnya seperti ke file gambar, file suara, dan jenis file lainnya yang hendak dipublikasikan di internet. Keuntungan penggunaan Apache sebagai Web server antara lain adalah akses basis data yang lebih fleksibel, waktu eksekusi lebih cepat, dan dapat diperoleh secara gratis karena bersifat open source (Lukas Sebastianus Oscar, 2008: 62).
(36)
Apache memiliki fitur-fitur canggih seperti pesan kesalahan yang dapat dikonfigurasi, autentikasi berbasis basis data dan lain-lain. Apache juga didukung oleh sejumlah antarmuka pengguna berbasis grafik (GUI) yang memungkinkan penanganan server menjadi mudah. Apache merupakan perangkat lunak sumber terbuka dikembangkan oleh komunitas terbuka yang terdiri dari pengembang-pengembang di bawah naungan Apache Software Foundation.
2.11 Javascript
Javascript adalah bahasa program komputer yang didesain untuk mengeksekusi di dalam Web browser. Javascript digunakan di dalam pengembangan dari program kecil yang disebut sebagai script yang tertanam di dalam halaman HTML. Ketika dieksekusi, script megeluarkan kemampuan untuk menambahkan isi yang interaktif ke beberapa halaman Web. Javascript adalah bahasa program yang berorientasi objek, dikarenakan semua program javascript disimpan di dalam halaman HTML dan browser dianggap sebagai objek (Jerry Lee Ford Jr, 2009: 31).
Javascript dapat merespon perintah user dengan cepat, dan membuat halaman Web menjadi lebih responsif. JavaScript melakukan apa yang tidak bisa dilakukan oleh HTML, PHP, dan CSS dalam menangani hal-hal yang membutuhkan respons cepat terhadap aksi dari user
(37)
2.12 Cascading Style Sheets (CSS)
CSS adalah sebuah bahasa stylesheet yan dapat digunakan untuk mendefinisikan representasi visual dari sebuah halaman HTML. CSS dapat digunakan untuk mendefinisikan hal-hal yang simpel seperti warna teks, ukuran teks, style, dan atribut lainnya (Jonathan Stark, 2010: 6).
CSS terdapat 3 (tiga) versi, yaitu CSS1, CSS2, dan CSS3. CSS1 dikembangkan berpusat pada pemformatan dokumen HTML, CSS2 dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa ditampilkan di printer, sedangkan CSS3 adalah versi terbaru dari CSS yang mampu melakukan banyak hal dalam desain Website. CSS2 mendukung penentuan posisi konten, downloadable, huruf font, tampilan pada tabel/table layout dan media tipe untuk printer. Kehadiran versi CSS yang ke dua diharapkan lebih baik dari versi pertama.
2.13 Adobe Dreamwever CS5
Adobe Dreamweaver merupakan salah satu program aplikasi yang digunakan untuk membangun sebuah Website, baik secara grafis maupun dengan menuliskan kode sumber secara langsung.” Adobe Dreamweaver memudahkan pengembang Website untuk mengelola halaman-halaman Website dan aset-asetnya, baik gambar (image), animasi flash, video, suara dan lain sebagainya. Selain itu Adobe Dreamweaver juga menyediakan fasilitas untuk melakukan pemrograman scripting, baik ASP (Active Server Page), JSP (Java Server Page), PHP (HypertextPreprocessor), JavaScript (js),
(38)
Cold Fusion, CSS (Cascading StyleSheet), XML (Extensible Markup Language) dan lainnya (Wahana Komputer, 2010: 2).
2.13.1 Kelebihan Adobe Dreamweaver CS5
Adapun beberapa kelebihan Dreamweaver antara lain: (Sutisna,2008: 51)
1. Pada pemrograman HTML dan XHTML, tampilan situs dapat dilihat tanpa menggunakan browser sehingga memudahkan programmer untuk editing. 2. Dreamweaver mendukung pemrograman PHP, ASP, ASP ColdFusion, JSP,
CSS, Javascript, dan XML.
3. Dreamweaver dapat membantu Websmaster untuk lebih memahami kode-kode pemrograman.
4. Dreamweaver dapat memeriksa kesalahan dalam penulisan sintaks. 5. Membantu dalam mengelola situs yang penulis buat.
2.13.2 Lingkungan Adobe Dreamweaver CS5
(39)
Gambar 2.4 Adobe Dreamweaver CS5 Tampilan Meja Kerja
a. Document Window
Document Windos menampilkan dokument dari halaman Web yang aktif, atau dokumen yang sedang diedit. Pada Document Window terdapat Title Bar yang menampilkan judul halaman, fasilitas Zoom, Document Toolbar, dan Tag Selector.
b. Document Toolbar
Dokumen Toolbar berisi tombol-tombol yang digunakan untuk mengatur layar kerja dokumen pada dengan cepat, di antaranya show Code view, Show Code and Design views, dan Show Design view.
c. Tag Selector
Tag selector berfungsi untuk menampilkan tag HTML dari objek yang terseleksi dan dapat meng-klik <body> untuk memilih keseluruhan elemen
(40)
dokumen. Tag Selector ini terdapat pada Document Window, dan terletak di bawah sebelah kiri.
d. Panel Groups
Panel groups merupakan salah satu fasilitas yang terdapat pada Adobe Dreamweaver yang berfungsi untuk membantu dalam mengedit suatu halaman Web. Panel Groups terletak di sebelah kanan layar kerja dan terdiri dari beberapa panel, untuk menampilkan panel.
e. Property Inspector
Pada Adobe Dreamweaver terdapat fasilitas Property Inspector yang berfungsi untuk mengatur atau mengedit properti objek-objek yang ada pada halaman Web. Property Inspector menampilkan semua properti objek (misalnya objek teks, objek gambar, objek tabel) yang terseleksi pada jendela kerja.
f. Workspace Switcher
Workspace Switcher pada Adobe Dreeamweaver berfungsi untuk mengubah atau mengatur jendela kerja sesuai keinginan, sehingga memudahkan dalam membuat halaman Web. Tampilan yang terdapat di dalamnya antara lain adalah mode Designer, Classic, Coder dan lain-lain.
(41)
BAB 3
PERANCANGAN SISTEM
3.1 Perancangan Sistem/Website Yang Akan Dibuat
Adapun rumusan Website yang akan dibuat dan dirancang dapat dirumuskan sebagai berikut:
1. Sitem pendaftaran alumni atau mahasiswa yang aktif di D3 Teknik Informatika USU dilakukan secara online.
2. Pendaftaran di Website ini adalah benar-benar untuk alumni dan mahasiswa dari D3 Teknik informatika, administrator dari Website ini terlebih dahulu memasukkan NIM mahasiswa ke dalam database. Apabila ada alumni/mahasiswa yang mendaftar di Website ini, maka diwajibkan terlebih dahulu mengisi NIM di form pendaftaran. Jika NIM yang diinput alumni/mahasiswa sama dengan yang tersimpan di database oleh admin sebelumnya, maka alumni/mahasiswa tersebut benar-benar alumni/mahasiswa dari D3 Teknik Informatika.
(42)
3. Informasi yang diposting berasal dari alumni/mahasiswa yang aktif dan terdaftar di Website yang dibuat, sehingga sistem dapat menghasilkan informasi yang akurat.
4. Alumni/Mahasiswa yang aktif dapat mengirim pesan kepada alumni/mahasiswa lain.
Dari rumusan-rumusan yang telah dipaparkan pada pembahasan sebelumnya, diharapkan alumni/mahasiswa yang mendaftar adalah benar-benar mahasiswa D3 Teknik Informatika USU dan alumni/mahasiwa yang mendaftar dapat menyampaikan sebuah informasi yang berguna dan menjalin komunitas yang terkoneksi dengan Website/sitem yang dirancang.
3.2 Teknologi Informasi Yang Digunakan
Teknologi yang perlu digunakan dalam pengelolaan Website komunitas alumni agar berjalan dengan baik perlu adanya penggunaan sistem aplikasi yang berbasis Web serta konfigurasi yang baik dari komponen-komponen perangkat keras dan perangkat lunak. Dalam hal ini bentuk-bentuk usulan yang diberikan penulis dilihat dari analisa kebutuhan informasi sebagai berikut:
1. Data alumni/mahasiswa perlu didokumentasikan dalam bentuk database. 2. Dibuatkan fasilitas pendaftaran online berbasiskan internet agar setiap alumni
yang tersebar di berbagai daerah dapat mengakses sistem akan melakukan pendaftaran.
(43)
Rancangan tersebut akan dibuat dalam bentuk aplikasi berbasis Web, untuk teks editor menggunakan Adober Dreamwever CS5 dan menggunakan aplikasi dan bahasa pemrogrman PHP dan MySQL.
3.3 Diagram Konteks
Konteks Diagram atau disebut juga dengan model sistem fundamental merepresentasikan seluruh elemen sistem sebagai sebuah bubble tunggal dengan data input output yang ditunjukkan oleh anak panah yang masuk dan ke luar secara berurutan.
Berikut disajikan Gambar 3.1 Diagram Konteks:
(44)
3.4 Data Flow Diagram (DFD)
Data Flow Diagram (DFD) digunakan untuk menggambarkan aliran informasi dan proses data hingga keluaran, yang bergerak dari pemasukkan diagram konteks sebelumnya, aliran data yang ada pada sistem digambarkan dengan lebih rinci menggunakan Data Flow Diagram. Data Flow Diagram dari pembangunan Website Komunitas D3 Teknik Informatika dapat dilihat pada Gambar 3.2 untuk diagram level 0, pada Gambar 3.3 untuk diagram level 1, pada Gambar 3.4 untuk diagram level 2, dan untuk diagram level 3 ditunjukkan oleh Gambar 3.5.
Berikut Gambar 3.2 DFD Level 0 Website Komunitas D3 Teknik Informatika
(45)
DFD Level 0 mempunyai alur kerja sebagai berikut:
1. Proses 1.0, di mana alumni/mahasiswa yang masih aktif mengikuti perkuliahan mendaftar di Website ini. Jika proses pendaftaran tidak mengalami error, maka proses pendaftaran berhasil dan data terekam di tabel member.
2. Proses 2.0, di mana alumni/mahasiswa yang sudah terdaftar di Website melakukan proses login. Jika proses login valid, maka alumni/mahasiswa yang telah menjadi member mempunyai hak untuk sharing informasi, kirim pesan, dan kirim komentar.
3. Proses 3.0, di mana alumni/mahasiswa yang berhasil melakukan proses login mempunyai hak untuk melakukan proses penyampaian atau sharing informasi dan data yang masuk terekam di tabel informasi.
4. Proses 4.0, di mana alumni/mahasiswa yang berhasil melakukan proses login mempunyai hak untuk melakukan proses pengiriman pesan kepada alumni/mahasiswa dan data yang masuk terekam di tabel pesan.
5. Proses 5.0, di mana alumni/mahasiswa yang berhasil melakukan proses login mempunyai hak untuk melakukan melakukan proses pengiriman komentar dan data yang masuk terekam di tabel komentar.
(46)
Berikut Gambar 3.3 DFD Level 1 Website Komunitas D3 Teknik Informatika
Gambar 3.3 DFD Level 1
Proses DFD Level 1 mempunyai alur sebagai berikut:
1. Proses 1.1, di mana alumni/mahasiswa melakukan proses penginputan data member dan data tersebut akan terekam ke tabel member.
2. Proses 1.2, di mana alumni/mahasiswa melakukan proses penginputan data pesan dan data tersebut akan terekam ke tabel pesan.
3. Proses 1.3, di mana alumni/mahasiswa melakukan proses penginputan data pesan dan data tersebut akan terekam ke tabel pesan.
4. Proses 1.4, di mana alumni/mahasiswa melakukan proses penginputan data komentar dan data tersebut akan terekam ke tabel komentar.
5. Proses 1.5, di mana alumni/mahasiswa melakukan proses penginputan data gambar dan data tersebut akan terekam ke tabel gambar.
(47)
Berikut Gambar 3.4 DFD Level 2 Website Komunitas D3 Teknik Informatika
Gambar 3.4 DFD Level 2
Proses DFD Level 2 mempunyai alur sebagai berikut:
1 Proses 2.1, di mana admin melakukan proses pengeditan data member dan data tersebut akan terekam ke tabel member.
2 Proses 2.2, di mana alumni/mahasiswa melakukan proses penghapusan data member dan data tersebut akan terekam ke tabel member.
(48)
Berikut Gambar 3.5 DFD Level 3 Website Komunitas D3 Teknik Informatika
Gambar 3.5 DFD Level 3
Proses DFD Level 3 mempunyai alur sebagai berikut:
1 Proses 3.1, di mana alumni/mahasiswa melakukan proses penghapusan data informasi dan data tersebut akan terekam ke tabel informasi
3.5 Perancangan Data
Perancangan data terdiri dari tabel relasi, struktur tabel, dan tabel ERD untuk membuat Website alumni ini adalah:
3.5.1 Perancangan Database dan Tabel Nama Database: mahasiswa/alumni
1. Tabel Identitas Primary Key: id_nim
Tabel 3.1 Tabel Identitas Field Type Ukuran Keterangan
id_nim(*) Int 10 ID Nim (Primary Key)
Nim Varchar 10 NIM Mahasiswa
(49)
2. Tabel Data Diri Primary Key: id_data Foreign Key: id_nim
Tabel 3.2 Tabel Data Diri Field Type Ukuran Keterangan
id_data(*) Int 11 ID Data (Primary Key)
id_nim(**) Int 10 ID NIM (Foreign Key)
Username Varchar 10 Username Mahasiswa
Password Varchar 15 Password Mahasiswa
nama_lengkap Varchar 30 Nama Lengkap Mahasiswa
Kategori Varchar 2 Kategori Mahasiswa
Email Varchar 15 Email Mahasiswa
Phone Varchar 15 No Telepon Mahasiswa
tgl_lahir date Tanggal Lahir Mahasiswa
3. Tabel Informasi
Primary Key: id_informasi Foreign Key: id_data
Tabel 3.3 Informasi Field Type Ukuran Keterangan
id_informasi(*) Int 11 ID Informasi (Primary Key)
id_data(**) Int 10 ID Data (Foreign Key)
Isi Text Isi Informasi
Up Int 11 Status Informasi (suka)
Down Int 11 Status Informsai (tidak suka)
(50)
4. Tabel Komentar Primary Key: kom_id
Foreign Key: id_informasi dan id_data
Tabel 3.4 Tabel Komentar Field Type Ukuran Keterangan
kom_id(*) Int 10 ID Komentar (Primary Key)
isi_komentar Text Isi Komentar
id_informasi(**) Int 10 ID Informasi (Foreign Key)
id_data(**) Int 10 ID Data (Foreign Key)
Waktu date Waktu Terbit Komentar
5. Tabel Gambar
Primary Key: id_gambar Foreign Key: id_data
Tabel 3.5 Tabel Gambar Field Type Ukuran Keterangan
id_gambar(*) Int 10 ID Gambar (Primary Key)
id_data(**) Int 10 ID Data (Foreign Key)
nama_gambar Varchar 20 Nama Gambar
Profile Gambar Varchar 2 Profil gambar (gambar profile atau tidak)
Waktu date Waktu Terbit Foto
6. Tabel Pesan
Primary Key: id_pesan
Tabel 3.6 Tabel Pesan Field Type Ukuran Keterangan
id_pesan(*) int 10 ID Pesan (Primary Key)
Waktu date Waktu Terbit Pesan
Dari varchar 10 Pengirim Pesan
Kepada varchar 10 Penerima Pesan
(51)
7. Tabel balas_pesan Primary Key: id_balas Foreign Key: id_pesan
Tabel 3.7 Tabel Balas Pesan Field Type Ukuran Keterangan
id_balas(*) int 10 ID Balas (Primary Key)
id_pesan(**) int 10 ID Pesan (Foreign Key)
Waktu date Waktu Terbit Balas Pesan
isi_balasan text Isi Balasan Pesan
Pengirim varchar 10 Pengirim Balasan Pesan
Untuk varchar 10 Penerima Balasan Pesan
Status Pesan varchar 20 Status Pesan (sudah dibaca / tidak)
8. Tabel voting_id
Primary Key: id_voting Foreign Key: id_informasi
Tabel 3.8 Tabel Id_Voting Field Type Ukuran Keterangan
id_voting(*) int 10 ID Voting (Primary Key)
id_informasi(**) int 10 ID Informasi (Foreign Key)
(52)
Tabel 3.9 Tabel Relasi Berikut Tabel 3.9 DFD Tabel Relasi sebagai berikut:
Keterangan:
* Primary Key ** Foreign Key
(53)
Keterangan
1. Tabel identitas dengan tabel data diri mempunyai hubungan one to many di mana id_nim sebagai primary key dari tabel data diri, yang digunakan untuk menentukan nim dari mahasiswa atau alumni dari tabel data diri.
2. Tabel data diri dan tabel informasi mempunyai hubungan one to many di mana id_data dari tabel informasi merupakan primary key, yang digunakan untuk menentukan siapa pengirim informasi dari tabel informasi.
3. Tabel data diri dengan tabel voting_id mempunyai hubungan one to many di mana id_data dari tabel data diri bisa digunakan untuk pengisian siapa user yang memvote suatu informasi dari tabel data.
4. Tabel data diri dengan tabel komentar mempunyai hubungan one to many di mana banyak user yang diwakili oleh data pengirim komentar suatu postingan informasi tertentu.
5. Tabel voting_id dengan tabel informasi mempunyai hubungan one to many di mana satu informasi dapat divoting oleh banyak user.
(54)
3.6 Entity Relationship Diagram (ERD)
ERD merupakan suatu model untuk menjelaskan hubungan antar data dalam basis data berdasarkan objek-objek dasar data yang mempunyai hubungan antar relasi. Di bawah ini adalah ERD untuk membuat Website yang akan dirancang.
Berikut Gambar 3.6 ERD Website Komunitas D3 Teknik Informatika
(55)
Dari ERD pada pembahasan sebelumnya, mempunyai keterangan sebagai berikut:
1. Tabel Identitas mempunyai atribut id_nim, nim, dan active memerlukan verifikasi dari mahasiswa yang mempunyai nim dari mahasiswa pada saat registerasi untuk menjadi member di Website komunitas D3 Teknik Informatika.
2. Tabel data diri yang mempunyai atribut username, password dapat mengupload gambar yang mempunyai atribut id_gambar, nama_gambar, dan kapan gambar tersebut di-upload.
3. Tabel data mempunyai atribut username dan password dapat sharing informasi yang diwakili oleh atribut id_informasi, isi, dan time yang artinya kapan informasi tersebut dikirm.
4. Tabel data diri yang mempunyai atribut username dan password dapat memberikan komentar kepada suatu informasi tertentu. Komentar tersebut sendiri diwakili oleh atribut isi komentar, id_komentar dan time yang artinya kapan komentar tersebut dikirim.
5. Tabel data diri yang mempunyai atribut username dan password dapat mengirim pesan kepada member lain. Tabel pesan sendiri diwakili oleh atribut id_pesan, isi pesan, dan kapan pesan tersebut dikirim.
(56)
3.7 Rancangan User Interface
User Interface adalah mekanisme komunikasi antara pengguna atau user dengan sistem. Berikut rancangan user interface:
3.7.1 Rancangan Output
1. Halaman Home Website Komunitas D3 Teknik Informatika Sumatera Utara
Komunitas D3 Teknik Informatika Universitas Sumatera Utara nama_profile Pesan Kirim Pesan Lihat Pesan Pesan Terkirim Image Upload Image Foto Galeri Notifikasi Pesan Masuk Pesan Balasan
Copyright 2012 WITA
Gambar 3.7 Halaman Home Website Komunitas
Nama User Beranda Nama User Search
Sharing Informasi
Gambar pemberi informasi
Nama pemberi informasi Isi Informasi
Isi Komentar
More Gambar
(57)
2. Halaman Output Website lengkap Data Alumni/Mahasiswa
Komunitas D3 Teknik Informatika Universitas Sumatera Utara
Nama Profile
Pesan Kirim Pesan Lihat Pesan Pesan Terkirim Image
Upload Image Foto Galeri Notifikasi Pesan Masuk Pesan Balasan
NIM : ||||
Nama Lengkap : |||| Email : ||||
Status : |||| Handphone : |||| Tanggal Lahir : ||||
Copyright 2012 WITA
Gambar 3.8 Halaman Output Website Lengkap Data Alumni/Mahasiswa Nama User Beranda Nama User Search
Gambar Profile Gambar
(58)
3. Halaman Galeri Foto
Komunitas D3 Teknik Informatika Universitas Sumatera Utara nama_profile
Pesan Kirim Pesan Lihat Pesan Pesan Terkirim Image
Upload Image Foto Galeri Notifikasi Pesan Masuk Pesan Balasan
Galeri Foto
1 2 Copyright 2012 WITA
Gambar 3.9 Halaman Galeri Foto
Nama User Beranda Nama User Search
Image Image
Image Image
Gambar Profile
(59)
4. Halaman Pesan Masuk dan Pesan Terkirim
Komunitas D3 Teknik Informatika Universitas Sumatera Utara
nama_profile
Pesan Kirim Pesan Lihat Pesan Pesan Terkirim Image
Upload Image Foto Galeri Notifikasi Pesan Masuk Pesan Balasan
Pesan Masuk
Dari:
||||
Waktu : ||||
Pesan : ||||
Copyright 2012 WITA
Gambar 3.10 Halaman Pesan Masuk dan Pesan Terkirim Nama User Beranda Nama User Search
Gambar Profile
(60)
5. Halaman admin Website pengolahan data Alumni/Mahasiswa Admin
Home
Manage Users
Manage Informasi Manage Admin
Alumni/Mahasiswa NIM Yang Sudah Aktif: ||||
NIM Yang Belum Aktif: ||||
Posting Terbaru ||||
Posting Paling Dibahas
||||
Data Alumni/Mahasaiswa Yang Aktif di Website komunitas
Pilih Semua
Username NIM Tanggal Lahir
Details Edit
|||| ||| |||| |||| ||||
Copyright 2012 WITA
Gambar 3.11 Halaman Admin Website Pengolahan Data Alumni/Mahasiswa
√
(61)
6. Halaman admin Website pengolahan data Informasi Admin
Home
Manage Users
Manage Informasi Manage Admin Alumni/Mahasiswa
NIM Yang Sudah Aktif: ||||
NIM Yang Belum Aktif: ||||
Posting Terbaru ||||
Posting Paling Dibahas
||||
Data Informasi Pilih
Semua
Username Isi Date Posting Details
|||| ||| |||| ||||
Copyright 2012 WITA
Gambar 3.12 Halaman Admin Website Pengolahan Data Informasi
HAPUS BATAL
(62)
7. Halaman Details Website Pengolahan Informasi dan Komentar Admin
Home
Manage Users
Manage Informasi Manage Admin Alumni/Mahasiswa
NIM Yang Sudah Aktif: ||||
NIM Yang Belum Aktif: ||||
Posting Terbaru ||||
Posting Paling Dibahas
||||
Posting Oleh: |||| Waktu: ||||
Suka: |||| Tidak Suka: ||| Komentar:
Copyright 2012 WITA
Gambar 3.13 Halaman Details Website Pengolahan Informasi dan Komentar Dikomentari Oleh: |||
isi komentar : |||
(63)
8. Halaman Admin Pengolahan Data Admin Admin
Home
Manage Users
Manage Informasi Manage Admin Alumni/Mahasiswa
NIM Yang Sudah Aktif: ||||
NIM Yang Belum Aktif: ||||
Posting Terbaru ||||
Posting Paling Dibahas
||||
Pilih Semua
Username password Edit
|||| ||| ||||
Copyright 2012 WITA
Gambar 3.14 Halaman Admin Pengolahan Data Admin
√
(64)
3.7.2 Rancangan Input
1. Halaman Input/Upload Gambar Website Komunitas
Komunitas D3 Teknik Informatika Universitas Sumatera Utara nama_profile
Pesan Kirim Pesan Lihat Pesan Pesan Terkirim Image
Upload Image Foto Galeri Notifikasi Pesan Masuk Pesan Balasan
Upload Gambar
Pilih Gambar:
Copyright 2012 WITA
Gambar 3.15 Halaman Input/Upload Gambar Website Komunitas Nama User Beranda Nama User Search
Browse Upload
Gambar Profile
(65)
2. Halaman Input Pengiriman Pesan
Komunitas D3 Teknik Informatika Universitas Sumatera Utara nama_profile
Pesan Kirim Pesan Lihat Pesan Pesan Terkirim Image
Upload Image Foto Galeri Notifikasi Pesan Masuk Pesan Balasan
Kirim Pesan
Ke
Isi Pesan
Copyright 2012 WITA
Gambar 3.16 Halaman Details Website Input Pengriman Pesan Nama User Beranda Nama User Search
Kirim Pesan Gambar
(66)
3. Halaman Website Pendaftaran Alumni/Mahasiswa
Komunitas D3 Teknik Informatika Universitas Sumatera Utara
NIM Username Nama Lengkap Password
Ulangi Password Kategori
Email Hp/Telepon Tanggal Lahir
Masukkan Teks Yang anda lihat
I agree Above the terms
Gambar 3.17 Halaman Details Website Pendaftaran Alumni/Mahasiswa Login Signup
V
Tgl Bln Thn
288909 «» V
LOGO USU
(67)
4. Halaman Login Alumni/Mahasiswa Website Komunitas D3 Teknik Informatika USU
Komunitas D3 Teknik Informatika Universitas Sumatera Utara
NIM
Password
Gambar 3.18 Halaman Details Website Login Alumni/Mahasiswa
5. Halaman Admin untuk penginputan data NIM alumni/mahasiswa Admin Home Manage
Users
Manage Informasi Manage Admin Alumni/Mahasiswa
NIM Yang Sudah Aktif: ||||
NIM Yang Belum Aktif: |||| Posting Terbaru |||| Posting Paling Dibahas ||||
Input NIM Alumni/Mahasiswa NIM/Mahasiswa:
Copyright 2012 WITA
Gambar 3.19 Halaman Input Data Nim Alumni/Mahasiswa Login Signup
LOGIN LOGO
USU
(68)
3.8 Flowchart
Flowchart adalah penggambaran secara grafik dari langkah-langkah dan urut-urutan prosedur dari suatu program. Flowchart menolong analis dan programmer untuk memecahkan masalah kedalam segmen-segmen yang lebih kecil dan menolong dalam menganalisis alternatif-alternatif lain dalam pengoperasian suatu masalah.
Berikut flowchart dari pembangunan Website komunitas D3 Teknik Informatika yaitu:
1. Flowchart Login
(69)
2. Flowchart Penginputan Data Member
(70)
3. Flowchart Penginputan Informasi oleh member alumni/mahasiswa
(71)
4. Flowchart Inputan Gambar oleh member alumni/mahasiswa
(72)
5. Flowchart Inputan Komentar
(73)
6. Flowchart Inputan NIM oleh Admin
(74)
7. Flowchart inputan data admin oleh admin
(75)
8. Flowchart Pengolahan Data Alumni/Mahasiswa
(76)
9. Flowchart data pengolahan data informasi
(77)
10.Flowchart Pengolahan Data Admin oleh admin
(78)
BAB 4
IMPLEMENTASI SISTEM
4.1 Pengertian Implementasi Sistem
Implementasi Sistem adalah langkah-langkah atau prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui, menguji, dan memulai sistem baru yang telah disempurnakan.
4.2 Komponen Utama dalam Implementasi Sistem
Agar sistem perancangan yang telah dikerjakan dapat berjalan baik atau tidak, perlu kiranya dilakukan pengujian terhadap sistem yang telah dikerjakan. Oleh karena itu, dibutuhkan beberapa komponen untuk mencakup perangkat keras (Hardware), perangkat lunak (Software), dan perangkat manusia (Brainware).
(79)
4.2.1 Perangkat Keras (Hardware)
Hardware merupakan komponen yang terlihat secara fisik yang saling bekerja sama dalam pengolahan data. Perangkat keras yang digunakan meliputi:
a. Monitor
b. CPU (Central Processing Unit)
c. Hardisk sebagai tempat sistem beroperasi dalam media penyimpanan
d. Memori minimal 128 MB
e. Keyboard dan Mouse
4.2.2 Perangkat Lunak (Software)
Software adalah instruksi atau program-program komputer yang dapat digunakan oleh komputer dengan memberikan fungsi serta penampilan yang diinginkan. Dalam hal ini perangkat lunak yang digunakan adalah:
a. Operating System Windows 7
b. Adobe Dreamwever CS5 sebagai tempat untuk mendesain Website
c. XAMPP 1.7.1 di mana terdapat Apache sebagai server, PHP sebagai bahasa pemrograman yang digunakan, dan MySQL sebagai software untuk pembuatan database.
(80)
4.2.3 Unsur Manusia (Brainware)
Brainware merupakan faktor manusia yang menangani fasilitas komputer yang ada.
Faktor manusia yang dimaksud adalah orang-orang yang memiliki bagian untuk menangani sistem dan merupkan unsur manusia yang meliputi:
a. Analisa Sistem, yaitu orang membentuk dan membangun fasilitas rancangan sistem atau program.
b. Programmer, yaitu orang yang digunakan dalam membangun suatu program.
c. Operator (Administrator), yaitu orang yang mengoperasikan sistem seperti memasukkan data untuk dioperasikan oleh komputer dalam menghasilkan informasi dan lain sebagainya.
d. Public, yaitu orang yang memakai sistem yang telah dirancang untuk
informasi yang dibutuhkan.
4.3 Tampilan Program
Subbab ini menampilkan tampilan program yang telah dibuat dari hasil perancangan dari bab-bab sebelumnya.
4.3.1 Tampilan Halaman Login Website
Halaman ini adalah halaman tampilan login Website yang di mana berfungsi untuk member yang telah daftar di Website ini.
(81)
Gambar 4.1 Halaman Login Website
4.3.2 Tampilan Halaman Register Website
Halaman ini adalah halaman tampilan register bagi mahasiswa/alumni D3 Teknik Informatika yang ingin masuk ke Website komunitas D3 Teknik Komputer.
(82)
4.3.3 Tampilan Halaman Akun Member
Halaman ini adalah halaman tampilan akun member setelah member login dan berhasil masuk ke halaman Website member komunitas D3 Teknik Informatika USU. Di halaman ini sendiri di kontennya terdapat form untuk menginput informasi apa yang akan disaring dan secara otomatis akan langsung tampil di halaman konten Website tersebut.
(83)
4.3.4 Tampilan Kirim Pesan
Halaman ini berfungsi untuk member yang ingin mengirimkan pesan kepada member lain dan pesan tersebut tidak akan dilihat oleh member yang lain.
Gambar 4.4 Tampilan Halaman Kirim Pesan
4.3.5 Tampilan Pesan Terkirim
Halaman ini berfungsi untuk menampilkan record-record pesan yang terkirim kepada member lain.
(84)
4.3.6 Tampilan Form Upload Gambar
Halaman ini berfungsi untuk menampilkan form upload gambar member ingin mengupload gambar yang diinginkan.
Gambar 4.6 Tampilan Form Upload Gambar
4.3.7 Tampilan Galeri Foto
Halaman ini berfungsi untuk Foto-foto yang telah ditampilkan sebelumnya.
(85)
4.3.8 Tampilan Halaman Admin Input NIM
Halaman ini berfungsi untuk menginput nim-nim mahasiswa baik itu yang masih aktif atau tidak aktif di Website.
Gambar 4.8 Tampilan Form Input NIM
4.3.9 Halaman Admin Untuk Pengolahan Informasi
Halaman ini menampilkan data mahasiswa yang sudah aktif menjadi member di Website ini. Di halaman ini seorang admin dapat mengolah data member seperti mengupdate ataupun menghapus data member tersebut.
Gambar 4.9 Tampilan Halaman Pengolahan Data Member 4.3.10 Halaman Admin Untuk Pengolahan Informasi
(86)
Halaman ini menampilkan data informasi yang berasal dari member. Di halaman ini seorang admin dapat mengolah data member seperti mengupdate ataupun menghapus data member tersebut.
(87)
BAB 5
PENUTUP
5.1 Kesimpulan
Dalam penulisan Tugas Akhir ini telah diuraikan mengenai Pembangunan Website Komunitas D3 Teknik Informatika Universitas Sumatera Utara Berbasis Web, sehingga penulis dapat membuat kesimpulan:
1. Tahapan Analisis dalam membuat Website ini adalah dengan melakukan analisa terhadap data mahasiswa yang aktif atau alumni yang ada di D3 Teknik Informatika.
2. Selanjutnya tahapan desain dari Website Pembangunan Komunitas D3 Teknik Informatika Universitas Sumatera Utara Berbasis Web.
3. Setelah tahapan desain selesai, selanjutnya proses tahapan implementasi sistem dan pengujian program, dokumentasi.
(88)
5.2 Saran
Adapun saran-saran yang ingin penulis kemukakan adalah sebagai berikut:
1. Agar di masa yang akan datang Website ini nantinya dapat dihostingkan dan dapat berkembang secara luas, sehingga nantinya Website ini tidak hanya untuk komunitas D3 Teknik Informatika tetapi juga untuk seluruh pengguna Website secara umum.
2. Diharapkan desain dari Website ini dapat diperbaiki menjadi lebih baik agar alumni atau mahasiswa D3 Teknik Informatika tertarik mengunjungi Website ini.
3. Sebaiknya Website dapat dikembangkan agar informasi yang diinput dapat berguna untuk member mahasiswa/alumni D3 Teknik Informatika.
(89)
DAFTAR PUSTAKA
Cederholm, Dan. 2010. CSS3 For Web Designers. Publisher: Jeffrey Zeldman.
Davis, E. Michele & Philips, A. John. 2007. Learning PHP and MySQL Second Edition. Publisher: O’reily
Harlinda. 2005. Manajemen database: konsep dan penerapan sistem basis data/database. Jurnal ilmiah. Penerbit Sekolah Tinggi Ilmu Ekonomi Nobel Indonesia.
Snyder, Chris & Myer, Thomas. 2010. Pro PHP Security Form Application Security Principles to the Implementation of XSS Defenses. 2010. Publisher: Apress.
Welling, Luke & Thomson, Laura. 2009. PHP and MySQL Web Development. Addison Wesley.
Zervaas, Quentin. 2008. Practical Web 2.0 Applications With PHP. Publisher: Apress 2012
2012
(90)
Listing Program Halaman Index.php <?php session_start(); header('Cache-control: private'); include 'config.php';
$nim = $_POST['nim'];
$password = $_POST['password']; if(isset($_GET['login'])){
if(isset($nim) && isset($password)){
$sql = "SELECT b.username, b.id_data, a.nim, b.password FROM data_diri b, identitas a WHERE a.id_nim=b.id_nim and nim='$nim' and
password='$password'";
$query = mysql_query($sql);
$array = mysql_fetch_array($query);
if($nim == $array['nim'] && $password == $array['password']){ $_SESSION['access'] = true;
$_SESSION['id_data'] = $array['id_data']; $_SESSION['nim'] = $array['nim'];
$_SESSION['username'] = $array['username'];
header('location:home.php?username=' . $_SESSION['username']); }
else {
$_SESSION['access'] = FALSE; $_SESSION['nim'] = null;
header('Location: 401.php'); }
} else {
$_SESSION['access'] = FALSE; $_SESSION['nim'] = null;
header('Location: 401.php'); } exit(); } else if(isset($_GET['logout'])){ if (isset($_COOKIE[session_name()])) {
setcookie(session_name(), '', time() - 42000, '/'); }
$_SESSION = array(); session_unset();
(91)
session_destroy(); }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title>
<script type="text/javascript" src="js/jquery-1.4.3.min.js"></script> <script type="text/javascript">
$(document).ready(function(){
//prepend span tag
$(".jquery h1").prepend("<span></span>");
});
</script>
<script type="text/javascript" src="js/captcha.js"> </script> <script type="text/javascript"> $(document).ready(function() { $(".tab").click(function() { var X=$(this).attr('id'); if(X=='signup') { $("#login").removeClass('select'); $("#signup").addClass('select'); $("#loginbox").slideUp(); $("#signupbox").slideDown(); $("#panel").css({ height:800 }); } else { $("#signup").removeClass('select'); $("#login").addClass('select');
(92)
$("#signupbox").slideUp(); $("#loginbox").slideDown(); $("#panel").css({ height:300}) } }); }); </script> </script> <style type="text/css"> html {
background:url(images/blue_background_abstract-wide.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #container { width:500px; padding-top:90px; padding-left: 400px; } #tabbox { height:40px } img#refresh{ float:left; margin-top:30px; margin-left:4px; cursor:pointer; } #panel { height:300px; width: 500px; } .tab {
(93)
line-height: 40px;text-align: center; width: 80px;float: right;font-weight: bold; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius: 4px 4px 0px 0px; } a { color: #000; margin: 0; padding: 0; text-decoration: none; } .signup { margin-left:8px; } .select { background-color:#FFF; } #loginbox { min-height:200px; padding-top: 20px; padding-right: 90px; padding-bottom: 90px; padding-left: 90px; } .loginsize{ height:300px; } #signupbox { min-height:200px; padding:10px; display:none; }
.tab1 {background: #dedede;display: block;height: 40px; line-height: 40px;text-align: center;
width: 80px;float: right;font-weight: bold; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius: 4px 4px 0px 0px; }
.tab2 {background: #dedede;display: block;height: 40px; line-height: 40px;text-align: center;
(94)
width: 80px;float: right;font-weight: bold; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius: 4px 4px 0px 0px; } #username { border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none;
font-family: Verdana, Geneva, sans-serif; font-size: 14px; font-style: normal; color:#FFF; text-transform: none; font-weight: normal; position: relative; } .texbox { width: 300px;
border: medium double #000; }
.daftar {
background-color: #093;
font-family: Verdana, Geneva, sans-serif; color: #FFF; cursor:pointer; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; width: 190px; height: 39px; text-align: center; font-size: 16px; } .Batal { background-color: #09F;
font-family: Verdana, Geneva, sans-serif; color: #FFF;
cursor:pointer;
border-top-width: thin; border-right-width: thin; border-bottom-width: thin;
(95)
border-left-width: thin; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; width: 190px; height: 39px; text-align: center; font-size: 16px; } .login { background-color: #B22222;
font-family: Verdana, Geneva, sans-serif; color: #FFF; cursor:pointer; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; width: 190px; height: 39px; text-align: center; font-size: 16px; }
#container #panel #loginbox h1 {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #006400;
}
.boxtex {
border: thin solid #093; height: 20px;
font-family: Tahoma, Geneva, sans-serif; font-size: 14px; } #apDiv1 { position:absolute; width:440px; height:800px; float: left; background-color: #000; } #apDiv2 { position:absolute; width:200px;
(96)
height:115px; z-index:1; } #right { float: left; width: 300px; } #apDiv3 { position:absolute; width:584px; height:115px; z-index:1; left: 4px; top: 5px; } h1 {
font: bold 330%/100% "Comic Sans MS", cursive; position: relative;
margin: 30px 0; color: white; text-align: center; text-shadow: 0 1px 0 #bbb, 0 2px 0 #bbb, 0 3px 0 #aaa, 0 4px 0 #aaa, 0 5px 0 #999, 0 6px 1px #000, 0 0px 3px #000, 0 1px 3px #000, 0 3px 5px #000,
0 5px 10px #000, 0 5px 20px #000;} #apDiv4 { position:absolute; width:200px; height:114px; z-index:1; left: 16px; top: 473px; } </style> </head> <body>
<h1><span></span>KOMUNITAS D3 TEKNIK INFORMATIKA USU<br /> </h1>
(1)
} })
</script>
<script src="jquery.jclock-1.2.0.js.txt" type="text/javascript"></script> <script type="text/javascript" src="jconfirmaction.jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $('.ask').jConfirmAction(); }); </script> <script type="text/javascript"> $(function($) { $('.jclock').jclock(); }); </script>
<script language="javascript" type="text/javascript" src="niceforms.js"></script> <link rel="stylesheet" type="text/css" media="all" href="niceforms-default.css" /> </head>
<body>
<div id="main_container"> <div class="header">
<div class="right_header">Welcome <?php echo
$_SESSION['username'];?>,<a href="logout.php" class="logout">Logout</a></div> <div class="jclock"></div> </div> <div class="main_content"> <div class="menu"> <ul>
<li><a class="current" href="index.html">Admin Home</a></li> <li><a href="login.html">Manage Users<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]--> <ul>
<li><a href="homeadmin.php?page=nim" title="">Input NIM</a></li> <li><a href="homeadmin.php?page=mahasiswa"
title="">Alumni/Mahasiswa</a></li>
<!--[if lte IE 6]><table><tr><td><![endif]--> </ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--> </li>
<li><a href="#">Manage Informasi</a> <ul>
(2)
</li>
<li><a href="homeadmin.php?page=informasi" title="">Informasi</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--> </li>
<li><a href="">Manage Admin<!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="homeadmin.php?page=inputadmin" title="">Input Admin</a></li>
<li><a href="homeadmin.php?page=dataadmin" title="">Data Admin</a></li> </ul> </div> <div class="center_content"> <div class="left_content"> <div class="sidebar_box"> <div class="sidebar_box_top"></div> <div class="sidebar_box_content"> <h3>Alumni/Mahasiswa</h3>
<img src="images/info.png" alt="" title="" class="sidebar_icon_right" /> <?php
$aktif = mysql_query("select count(*) AS aktif from identitas where active = 'Y'"); $jum_aktif = mysql_fetch_array($aktif);
$inaktif = mysql_query("select count(*) AS inaktif from identitas where active = 'N'");
$jum_inaktif = mysql_fetch_array($inaktif); ?>
<p>
<?php echo "NIM Yang Sudah Aktif : " . $jum_aktif['aktif'] . "<br>";
echo "NIM Yang Belum Aktif : " . $jum_inaktif['inaktif'] . "<br>"; ?> </p> </div> <div class="sidebar_box_bottom"></div> </div> <div class="sidebar_box"> <div class="sidebar_box_top"></div>
(3)
<div class="sidebar_box_content"> <h4>Posting Terbaru</h4>
<img src="images/notice.png" alt="" title="" class="sidebar_icon_right" /> <p>
<?php
$informasi = mysql_query("SELECT a.id_data, a.username, b.time, b.isi,
b.id_informasi FROM data_diri a, informasi b where a.id_data=b.id_data ORDER BY b.id_informasi DESC LIMIT 5") or die(mysql_error());
while($row=mysql_fetch_array($informasi)){
$isi_berita = nl2br($row['isi']); // membuat paragraf pada isi $isi = substr($isi_berita,0,50); // ambil sebanyak 900 karakter
echo $isi . ".... Oleh <strong>" . $row['username'] . "</strong><br><br>"; }
?> </p> </div> <div class="sidebar_box_bottom"></div> </div> <div class="sidebar_box"> <div class="sidebar_box_top"></div> <div class="sidebar_box_content"> <h5>Posting Paling Dibahas</h5>
<img src="images/photo.png" alt="" title="" class="sidebar_icon_right" /> <p>
<?php
$dibahas = mysql_query(" select a.id_informasi, count(a.id_informasi) as jum_komen, b.isi from komentar a, informasi b where a.id_informasi=b.id_informasi GROUP BY a.id_informasi DESC LIMIT 5");
while($dibahas_row = mysql_fetch_array($dibahas)){ $jum_komen = $dibahas_row['jum_komen'];
$isi_berita2 = nl2br($dibahas_row['isi']); // membuat paragraf pada isi $isi2 = substr($isi_berita,0,50); // ambil sebanyak 900 karakter
echo $isi2 . "... ($jum_komen Komentar) " . $dibahas_row['username'] . "<br>";
}
?> </p> </div> <div class="sidebar_box_bottom"></div> </div> </div> <div class="right_content"> <?php
(4)
if(isset($_GET['page'])){
$page=htmlentities($_GET['page']); }else{
$page="artikel"; }
$file="$page.php"; $cek=strlen($page);
if($cek>30 || !file_exists($file) || empty($page)){ include ("index2.php");
}else{
include ($file); }
?>
</div><!-- end of right content-->
</div> <!--end of center content -->
<div class="clear"></div>
</div> <!--end of main content-->
<div class="footer">
<div class="left_footer">IN ADMIN PANEL | Powered by <a href="http://indeziner.com">INDEZINER</a></div>
<div class="right_footer"><a href="http://indeziner.com"><img src="images/indeziner_logo.gif" alt="" title="" border="0" /></a></div>
</div> </div> </body> </html>
(5)
(6)