PERANCANGAN SISTEM INFORMASI UKM MAPASADHA BERBASIS WEB

  PERANCANGAN SISTEM INFORMASI UKM MAPASADHA BERBASIS WEB TUGAS AKHIR Diajukan untuk Memenuhi Salah Satu Syarat Memperoleh Gelar Sarjana Teknik Program Studi Teknik Informatika Disusun oleh : SUMARYANTA 995314066 PROGRAM STUDI TEKNIK INFORMATIKA JURUSAN TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS SANATA DHARMA YOGYAKARTA

  WEB BASED INFORMATION SYSTEM DESIGN OF UKM MAPASADHA FINAL PROJECT Presented as Partial Fulfillment of The Requirements to Obtain The Sarjana Teknik Degree In Informatics Engineering By :

SUMARYANTA

995314066

INFORMATICS ENGINEERING STUDY PROGRAM DEPARTMENT OF INFORMATICS ENGINEERING FACULTY OF ENGINEERING SANATA DHARMA UNIVERSITY YOGYAKARTA

  

TUGAS AKHIR

PERANCANGAN SISTEM INFORMASI UKM MAPASADHA

BERBASIS WEB

Oleh :

SUMARYANTA

  

995314066

  Telah disetujui oleh : Dosen Pembimbing Paulina Heruningsih Prima Rosa, S.Si, M.Sc.

  Tanggal, Januari 2007

  

TUGAS AKHIR

PERANCANGAN SISTEM INFORMASI UKM MAPASADHA

BERBASIS WEB

  Dipersiapkan dan ditulis oleh :

  

SUMARYANTA

995314066

  Telah dipertahankan di depan Panitia Penguji pada tanggal 14 Desember 2006 dan dinyatakan telah memenuhi syarat.

  Susunan Panitia Penguji : Paulina Heruningsih Prima Rosa, S.Si., M.Sc. Ketua ……………………..

  Ridowati Gunawan, S.Kom., M.T.

  Sekretaris ……………….…….

  Anggota Henricus Agung Hernawan, S.T. ……………….……. Anggota Cosmas Bramono, S.T. ………….………….

  Yogyakarta, ………………………….

PERNYATAAN KEASLIAN KARYA

  Saya menyatakan dengan sesungguhnya bahwa tugas akhir yang saya tulis ini tidak memuat karya atau bagian karya orang lain, kecuali yang telah disebutkan dalam kutipan dan daftar pustaka, sebagaimana layaknya karya ilmiah.

  Yogyakarta, 14 Desember 2006 Penulis,

  Sumaryanta

  

MOTTO

Sebuah gagasan baru mula-mula dianggap konyol,

lalu dibuang karena dianggap tidak penting,

sampai akhirnya diakui semua orang.

  

(William James)

Meskipun dunia penuh dengan penderitaan,

dunia juga penuh dengan keberhasilan mengatasi penderitaan itu.

  

(Hellen Keller)

HALAMAN PERSEMBAHAN

  Kupersembahkan karya ini untuk : Yesus Kristus dan Bunda Maria, Keluarga Besar Djojo Soemardjo, Bapak dan Ibu tercinta,

  Kakakku Mas Suryo dan adikku Unique, Keponakanku Adhit dan Devina, Mbak Alloysia Ani Syanjayani (alm.) Teman-teman seperjuangan TI ’99,

  Segala hal yang membuatku terus berjuang selama ini.

  

INTISARI

  Mapasadha (Mahasiswa Pecinta Alam Sanata Dharma) merupakan salah satu Unit Kegiatan Mahasiswa (UKM) di Universitas Sanata Dharma yang mengkhususkan diri pada pembinaan dan pengembangan minat, bakat, dan kreativitas mahasiswa dalam kecintaan dan kepedulian atas kelestarian lingkungan alam beserta segala isinya dan tantangannya. Sebagai sebuah UKM, informasi mengenai Mapasadha sangat dibutuhkan oleh mahasiswa, baik anggota maupun non anggota. Selama ini, untuk mendapatkan informasi, mahasiswa harus datang langsung ke “Pondok Mapasadha”. Hal ini tentu saja menyita waktu dan tenaga karena belum tentu mahasiswa dapat menemui pengurus Mapasadha, karena pengurusnya adalah mahasiswa juga, sehingga ia harus mengikuti kegiatan akademik (perkuliahan) seperti mahasiswa yang lain.

  Sistem yang akan dikembangkan adalah sebuah sistem perangkat lunak

  

client/server berbasis web yang akan menyajikan segala informasi tentang

  Mapasadha secara detail. Sistem akan menyajikan informasi dalam bentuk halaman web yang dapat diakses oleh siapa saja, kapan saja, dan dari mana saja sehingga pemakai tidak perlu datang langsung ke “Pondok Mapasadha” untuk mendapatkan informasi mengenai Mapasadha.

  

ABSTRACT

  Mapasadha (Mahasiswa Pecinta Alam Sanata Dharma) is one of the students' activity unit at Sanata Dharma University majoring purpose at construction and development of enthusiasm, talent, and student creativity in caring and love about continuity of natural environment along with all its contents and its challenge. As a students' activity unit, information about Mapasadha is very required by students, member and non member. During the time, to get information, student have to come to “ Pondok Mapasadha”. This situation causes energy and time of the student wasted because there is no warranty that the student can meet the official member of Mapasadha. It because the official member is student too, so they have to follow the academic activity like the others.

  System to be developed is a system software of client / server base on web to present all information about Mapasadha in detail. System will present information in the web pages that able to be accessed by anyone, any time, and anywhere, so user do not need to come to “Pondok Mapasadha” to get information about Mapasadha.

KATA PENGANTAR

  Dengan memanjatkan puji syukur kepada Tuhan Yang Maha Kasih yang telah melimpahkan berkat dan rahmat-Nya, akhirnya penulis dapat menyelesaikan Tugas Akhir ini. Tugas Akhir ini disusun sebagai salah satu syarat untuk menempuh ujian akhir gelar kesarjanaan pada Jurusan Teknik Informatika, Universitas Sanata Dharma Yogyakarta.

  Penulis menyadari bahwa tanpa bantuan dan kerjasama semua pihak, Tugas Akhir ini tidak akan terlaksana dengan baik. Untuk itu pada kesempatan ini penulis menghaturkan terima kasih kepada pihak-pihak yang telah banyak membantu, baik selama analisa, perancangan sistem, maupun pada saat penulisan naskah. Ucapan terima kasih penulis sampaikan kepada :

  1. Romo Ir. Greg. Heliarko S.J., S.S., B.S.T., M.A., M.Sc., selaku Dekan Fakultas Teknik Universitas Sanata Dharma Yogyakarta.

  2. Ibu Agnes Maria Polina, S.Kom., M.Sc., selaku Ketua Jurusan Teknik Informatika.

  3. Ibu Paulina Heruningsih Prima Rosa, S.Si., M.Sc., selaku Dosen Pembimbing Tugas Akhir yang telah meluangkan waktu untuk membimbing, memberikan saran dan koreksi dalam penulisan Tugas Akhir ini.

  4. Bapak Dynosius Dony Ariananda, S.T., M.Sc., selaku Dosen Pembimbing Pra Tugas Akhir.

  5. John Pitter, selaku Ketua UKM Mapasadha yang telah mendukung dan memberikan izin selama penulis melakukan survei dan pengambilan data.

  6. Kedua orang tua yang selalu memberikan perhatian, cinta kasih, semangat dan dorongan dalam menyelesaikan Tugas Akhir ini. (Nyuwun

  ngampunten dangu anggenipun ngentosi kulo rampung ).

  7. Mas Suryo dan adikku Unique (Makasih atas kesabarannya), keponakanku Adhit dan Devina (Cepet gedhe ya...), serta almarhumah kakak iparku Mbak Alloysia Ani Syanjayani (Selamat jalan Mbak, semoga kau temukan tempat terindah di sisiNya ).

  8. Teman-teman Pn’S Community (Kongkow-kongkow sampe tuek!?).

  9. Teman-teman TI ’99 terutama : Anang (Piye...?!), Destya (Matur

  tengkyu! ), Wisnu “Djanggut” (Keep on rollin’!), Chrisnoadi “Sronggot”

  (Wis dadi Tukang Insinyur?), Iwan, Teguh, Andre, Andri, Joko (Saiki wis

  dho plong to?

  ), Sigit, Asep, Indra “Cecak”, Dito, Dinar, Dicky, Kukuh (Lha kok dho ndhisiki?).

  Akhir kata, penulis berharap Tugas Akhir ini dapat bermanfaat bagi pembaca. Kritik dan saran yang bersifat membangun atas segala kekurangan dalam penulisan Tugas Akhir ini sangat diharapkan.

  DAFTAR ISI

  HALAMAN JUDUL ............................................................................................ i HALAMAN PERSETUJUAN ............................................................................. ii HALAMAN PENGESAHAN .............................................................................. iii PERNYATAAN KEASLIAN KARYA .............................................................. iv HALAMAN MOTTO .......................................................................................... v HALAMAN PERSEMBAHAN .......................................................................... vi

  INTISARI ............................................................................................................. vii ABSTRACT ......................................................................................................... viii KATA PENGANTAR ......................................................................................... ix DAFTAR ISI ........................................................................................................ xi DAFTAR GAMBAR ........................................................................................... xiv DAFTAR TABEL ................................................................................................ xvi BAB I PENDAHULUAN ....................................................................................

  1 1.1. Latar Belakang Masalah............................................................................

  1 1.2. Rumusan Masalah ....................................................................................

  3 1.3. Batasan Masalah ......................................................................................

  3 1.4. Tujuan dan Manfaat Penelitian ................................................................

  3 1.5. Metodologi Penelitian ..............................................................................

  4 1.6. Sistematika Penulisan ..............................................................................

  5 BAB II LANDASAN TEORI ..............................................................................

  7

  2.1.1. Konsep Dasar Sistem Informasi .......................................................

  7 2.1.2. Sistem Informasi Berbasis Web .......................................................

  8 2.2. Pemrograman Web ...................................................................................

  10

  2.2.1. WWW .............................................................................................. 10 2.2.2. Web Browser ....................................................................................

  11 2.2.3. Web Server .......................................................................................

  11 2.2.4. Web Client .......................................................................................

  12 2.2.5. HTTP ................................................................................................

  12

  2.2.6. HTML .............................................................................................. 12 2.3. Diagram Arus Data ..................................................................................

  14 2.4. Diagram E-R ............................................................................................

  15 2.5. Basis Data ................................................................................................

  16 2.6. JSP (Java Server Pages) ...........................................................................

  17 2.6.1. Sekilas tentang JSP ..........................................................................

  17 2.6.2. Arsitektur JSP ..................................................................................

  18 2.7. My SQL ....................................................................................................

  19 BAB III ANALISA DAN PERANCANGAN SISTEM ......................................

  21 3.1. Analisa Sistem ..........................................................................................

  21 3.1.1. Analisa Sistem Lama .......................................................................

  21 3.1.2. Analisa Sistem Baru .........................................................................

  22 3.1.2.1. Gambaran Sistem secara Umum ............................................

  22 3.1.2.2. DFD (Data Flow Diagram) ....................................................

  24

  3.1.2.2.2. Diagram Berjenjang .......................................................

  25 3.1.2.2.3. DFD di sisi Guest ...........................................................

  29 3.1.2.2.4. DFD di sisi Anggota ......................................................

  30 3.1.2.2.5. DFD di sisi Administrator ..............................................

  33 3.2. Perancangan Sistem .................................................................................

  37 3.2.1. Perancangan Database ......................................................................

  37 3.2.1.1. Conceptual Design .................................................................

  37 3.2.1.2. Logical Design .......................................................................

  37 3.2.1.3. Physical Design ......................................................................

  38 3.2.2. Perancangan Input dan Output .........................................................

  41 3.2.2.1. Perancangan Input ..................................................................

  41 3.2.2.2. Perancangan Output ...............................................................

  47 3.2.3. Perancangan Menu ...........................................................................

  49 3.2.4. Perancangan Teknologi ....................................................................

  51 3.2.4.1. Perancangan Perangkat Lunak ...............................................

  51 3.2.4.2. Perancangan Perangkat Keras ................................................

  52 BAB IV PENUTUP .............................................................................................

  53

  4.1. Kesimpulan .............................................................................................. 53 4.2. Saran .........................................................................................................

  53 DAFTAR PUSTAKA .......................................................................................... xvii

  DAFTAR GAMBAR

Gambar 2.1. Lingkungan client/server yang melibatkan berbagai platform ........ 9Gambar 2.2. Prinsip kerja pengaksesan dokumen JSP ........................................ 18Gambar 3.1. Diagram Konteks ............................................................................ 25Gambar 3.2. Diagram Berjenjang di sisi Guest ................................................... 26Gambar 3.3. Diagram Berjenjang di sisi Anggota ............................................... 27Gambar 3.4. Diagram Berjenjang di sisi Administrator ...................................... 28Gambar 3.5. DFD Level 0 di sisi Guest ............................................................... 29Gambar 3.6. DFD Level 0 di sisi Anggota .......................................................... 30Gambar 3.7. DFD Level 1 Proses 4 di sisi Anggota ............................................ 31Gambar 3.8. DFD Keseluruhan di sisi Anggota .................................................. 32Gambar 3.9. DFD Level 0 di sisi Administrator .................................................. 33Gambar 3.10. DFD Level 1 Proses 3 di sisi Administrator ................................... 34Gambar 3.11. DFD Level 2 Proses 3.4 di sisi Administrator ................................ 35Gambar 3.12. DFD Keseluruhan di sisi Administrator .......................................... 36Gambar 3.13. Diagram E-R ................................................................................... 37Gambar 3.14. Relasi Antar Tabel ........................................................................... 38Gambar 3.15. Perancangan Input Pendaftaran Anggota ........................................ 42Gambar 3.16. Perancangan Input Penerimaan Anggota ........................................ 43Gambar 3.17. Perancangan Input Berita ................................................................ 43Gambar 3.18. Perancangan Input Jenis Kegiatan .................................................. 44Gambar 3.20. Perancangan Input Dokumentasi .................................................... 45Gambar 3.21. Perancangan Input Tambah Topik .................................................. 45Gambar 3.22. Perancangan Input Tambah Tanggapan .......................................... 46Gambar 3.23. Perancangan Login Administrator .................................................. 46Gambar 3.24. Perancangan Output Data Anggota ................................................. 47Gambar 3.25. Perancangan Output Berita ............................................................. 48Gambar 3.26. Perancangan Output Dokumentasi .................................................. 48Gambar 3.27. Perancangan Menu Utama .............................................................. 49Gambar 3.28. Perancangan MenuAnggota ............................................................ 50Gambar 3.29. Perancangan Menu Administrator ................................................... 51

  DAFTAR TABEL

Tabel 2.1. Simbol DFD ......................................................................................... 15Tabel 3.1. Entitas, Masukan, dan Keluaran dari Sistem ...................................... 24Tabel 3.2. Tabel Anggota ..................................................................................... 39Tabel 3.3. Tabel JenisKegiatan ............................................................................ 39Tabel 3.4. Tabel Kegiatan .................................................................................... 39Tabel 3.5. Tabel IkutKegiatan .............................................................................. 40Tabel 3.6. Tabel Dokumentasi ............................................................................. 40Tabel 3.7. Tabel Berita ......................................................................................... 40Tabel 3.8. Tabel Topik ......................................................................................... 40Tabel 3.9. Tabel Tanggapan ................................................................................. 41

BAB I PENDAHULUAN

1.1 Latar Belakang Masalah

  Unit Kegiatan Mahasiswa (UKM) merupakan wadah untuk menyalurkan kreativitas mahasiswa dalam suatu kegiatan di luar kegiatan akademik (perkuliahan). Di Universitas Sanata Dharma terdapat banyak UKM yang dapat diikuti oleh mahasiswa, antara lain : UKM Olah Raga, UKM Fotografi, UKM Pecinta Alam, UKM Kerawitan, dan lain-lain. Dengan mengikuti salah satu UKM diharapkan mahasiswa dapat mengembangkan kreativitasnya sesuai dengan bakat dan minatnya masing-masing.

  Mapasadha (Mahasiswa Pecinta Alam Sanata Dharma) merupakan salah satu Unit Kegiatan Mahasiswa (UKM) di Universitas Sanata Dharma yang mengkhususkan diri pada pembinaan dan pengembangan minat, bakat, dan kreativitas mahasiswa dalam kecintaan dan kepedulian atas kelestarian lingkungan alam beserta segala isinya dan tantangannya. Untuk menarik mahasiswa menjadi anggota, informasi tentang seluk beluk Mapasadha harus diketahui oleh mahasiswa.

  Selama ini informasi tentang Mapasadha hanya diperoleh dari pengurus dan anggota Mapasadha saja. Mahasiswa yang tertarik untuk mengikuti UKM Mapasadha, namun tidak mengetahui siapa saja pengurus dan anggotanya, harus datang langsung ke “Pondok Mapasadha” untuk mendapatkan informasi detail tentu mahasiswa dapat menemui pengurus dan anggota Mapasadha mengingat pengurus dan anggotanya adalah mahasiswa juga, sehingga ia harus mengikuti kegiatan akademik (perkuliahan) seperti mahasiswa yang lain.

  Selain untuk mahasiswa, informasi juga dibutuhkan oleh anggota Mapasadha sendiri. Informasi-informasi seperti jadwal kegiatan, pertemuan ataupun informasi yang lainnya hanya dapat didapatkan di “Pondok Mapasadha” saja. “Pondok Mapasadha” juga merupakan tempat menampung ide, gagasan dan usulan dari anggota dan kemudian mendiskusikannya dengan anggota yang lain.

  Sehingga anggota yang mempunyai ide, gagasan, usulan atau membutuhkan informasi harus sering datang ke “Pondok Mapasadha”. Bagi anggota yang mempunyai jadwal kuliah padat, hal ini tentu sangat menyulitkan.

  Dalam sebuah organisasi, pengelolaan data anggota merupakan hal yang sangat penting karena anggota merupakan pilar bagi organisasi. Sebuah organisasi tidak akan dapat berjalan tanpa dukungan dan peran serta dari anggota. Data anggota Mapasadha disimpan dalam sebuah buku induk. Untuk melakukan perubahan data anggota, pengurus harus mencari berkas secara manual satu per satu data anggota yang dikehendaki di dalam buku induk tersebut. Hal ini membuat proses pencarian menjadi sangat lama dan tidak efektif, apalagi bila perawatan dan penyimpanannya kurang baik, berkas dapat menjadi rusak atau bahkan hilang.

  Hal yang juga penting untuk dikelola adalah dokumentasi kegiatan. Dengan dokumentasi yang baik, dapat diketahui kapan dan di mana kegiatan tersebut. Foto-foto kegiatan yang dilakukan anggota Mapasadha hanya ditempatkan dalam album foto dan belum diorganisasikan dengan baik sehingga untuk dokumentasi yang lama sudah tidak dapat diketahui kapan dan di mana kegiatan dilakukan, kecuali oleh pembuat dokumentasi ataupun anggota yang mengikuti kegiatan tersebut.

  1.2 Rumusan Masalah

  Berdasarkan latar belakang di atas maka rumusan masalah yang akan disajikan adalah : Bagaimana membuat sistem informasi UKM Mapasadha berbasis web dengan menggunakan bahasa pemrograman JSP (Java Server Pages) dan database MySQL?

  1.3 Batasan Masalah

  Batasan masalah dalam sistem ini adalah :

  1. Pendaftaran anggota baru hanya ditujukan untuk mahasiswa Universitas Sanata Dharma.

  2. Login ditujukan hanya untuk anggota Mapasadha dan administrator.

  3. Administrator adalah pengurus Mapasadha yang diberikan kewenangan khusus sebagai administrator.

  1.4 Tujuan dan Manfaat Penelitian

  Tujuan penulisan karya ilmiah ini adalah :

  1. Menampilkan informasi tentang UKM Mapasadha secara detail di

  2. Memahami pemrograman web yang menggunakan bahasa pemrograman JSP (Java Server Pages) dan database MySQL dengan studi kasus UKM Mapasadha.

  Manfaat penulisan karya ilmiah ini adalah :

  1. Membantu mahasiswa dalam mencari informasi mengenai UKM Mapasadha.

  2. Memudahkan interaksi antara Mapasadha dengan para anggotanya.

1.5 Metodologi Penelitian

  Metodologi penelitian yang digunakan untuk membuat sistem ini adalah sebagai berikut :

  1. Studi Pustaka Mempelajari buku-buku yang berhubungan dengan web, pemrograman Java dan JSP (Java Server Pages), dan pengolahan database menggunakan MySQL.

  2. Wawancara Untuk mengetahui kebutuhan-kebutuhan dari sistem yang akan dibuat, dilakukan wawancara dengan pengurus dan anggota UKM Mapasadha.

  3. Survei Materi Mengumpulkan data-data yang berhubungan dengan sistem yang akan dibuat.

  4. Analisa Sistem Menganalisa semua kebutuhan yang diperlukan dalam pengembangan

  5. Perancangan Sistem Membuat rancangan dari sistem berdasarkan analisa yang telah dilakukan, yang meliputi : a. Merancang database yang meliputi conceptual design, logical design, dan physical design b. Merancang input dan output

  c. Merancang antarmuka (interface)

  d. Merancang teknologi yang digunakan

1.6 Sistematika Penulisan

  Agar memudahkan pembaca dalam memahami isi dari penulisan tugas akhir ini, maka penulis menyusun suatu penulisan sebagai berikut :

  BAB I. PENDAHULUAN Bab ini memberikan gambaran umum tentang isi tugas akhir yang mencakup latar belakang masalah, rumusan masalah, batasan masalah, tujuan dan manfaat penelitian, metodologi penelitian, dan sistematika penulisan.

  BAB II. LANDASAN TEORI Bab ini berisi pembahasan tentang teori-teori yang menjadi dasar penjelasan-penjelasan yang mendukung pembuatan sistem, baik dasar teori dari program aplikasi yang digunakan maupun hal-hal yang diperlukan dalam mengimplementasikan sistem.

  BAB III. ANALISA DAN PERANCANGAN SISTEM Bab ini berisi penjelasan umum dari sistem yang akan dibuat, mulai dari analisa sistem, perancangan basis data, input, proses, output dan teknologi yang akan digunakan.

  BAB IV. PENUTUP Bab ini berisi kesimpulan dan saran terhadap sistem yang telah dibuat.

BAB II LANDASAN TEORI

2.1. Sistem Informasi

2.1.1. Konsep Dasar Sistem Informasi

  Suatu sistem mempunyai maksud tertentu, yaitu untuk mencapai tujuan (goal) dan sasaran (objectives). Goal biasanya dihubungkan dengan ruang lingkup yang lebih luas, sedangkan objectives dalam ruang lingkup yang lebih sempit.

  Pendekatan sistem yang lebih menekankan pada elemen atau komponennya mendefinisikan sistem sebagai kumpulan dari elemen-elemen yang berinteraksi untuk mencapai suatu tujuan tertentu. Pendekatan sistem yang menekankan pada komponen ini akan lebih mudah dalam mempelajari suatu sistem untuk tujuan analisis dan perancangan sistem.

  Informasi adalah data yang diolah menjadi bentuk yang lebih berguna dan berarti bagi yang menerimanya (Jogiyanto, 1993). Sumber informasi adalah data, dimana data adalah kenyataan yang menggambarkan suatu kejadian dan kesatuan nyata. Kejadian (event) adalah suatu yang terjadi pada saat tertentu.

  Kualitas dari suatu informasi (quality of information) tergantung dari 3 (tiga) hal, yaitu : a. Informasi harus akurat (accurate)

  Berarti informasi harus bebas dari kesalahan-kesalahan. Akurat juga berarti informasi harus jelas mencerminkan maksud dari informasi itu b. Tepat pada waktunya (timeliness) Berarti informasi yang disampaikan kepada penerima tidak boleh terlambat sehingga informasi yang diberikan tidak kadaluwarsa, karena informasi merupakan landasan di dalam pengambilan keputusan.

  c. Relevan (relevance) Berarti informasi tersebut mempunyai manfaat untuk pemakainya.

  Definisi dari sistem informasi menurut Laudon adalah : sekumpulan komponen (model, input, database, output, teknologi) yang saling berhubungan, yang berfungsi untuk mengumpulkan, menampilkan, memproses, menyimpan dan mendistribusikan informasi sehingga dapat digunakan untuk pengambilan keputusan dan pengendalian di dalam organisasi.

  Sebuah sistem informasi yang baik haruslah memiliki kriteria-kriteria sebagai berikut : a. Dapat memberikan informasi yang cermat, tepat waktu dan akurat.

  b. Mempunyai peranan yang kuat dalam perencanaan, analisis atau pengendalian manajemen untuk mengoptimalisasi pertumbuhan manajemen.

2.1.2. Sistem Informasi Berbasis Web

  Sistem informasi berbasis web adalah sistem informasi yang bersifat global, artinya tidak terbatas dalam pengaksesan dan dapat dilakukan di mana saja, oleh siapa saja, dan kapan saja sesuai dengan kebutuhan seseorang tanpa batasan ruang dan waktu.

  Sistem informasi berbasis web merupakan salah satu bentuk aplikasi web. Aplikasi web adalah suatu aplikasi yang dapat membentuk halaman-halaman web berdasarkan permintaan pemakai. Berbagai contoh aplikasi web yang lain adalah :

  

search engine (altavista, google), toko on-line (bookpool, amazon), lelang on-line

(eBay), situs-situs berita (detik.com, cnn), dan lain-lain. web

  Aplikasi merupakan salah satu contoh aplikasi client/server. Client mewakili komputer yang digunakan oleh seorang pemakai yang hendak menggunakan aplikasi, sedangkan server mewakili komputer yang menyediakan layanan aplikasi. Dalam konteks ini, client dan server berhubungan melalui internet ataupun intranet. Keunggulan model client/server yang menggunakan aplikasi web adalah dapat melibatkan bermacam-macam platform.

  Internet Server

Browser Browser Browser

  

Client Client Client

Windows MacOS Linux Ciri khas yang lain pada penggunaan aplikasi web adalah pemakai menggunakan perangkat lunak yang dinamakan web browser atau sering disebut

  browser

  saja (misalnya Netscape Communicator, Internet Explorer, dan Mozilla) untuk mengakses aplikasi web. Komputer yang bertindak sebagai server umumnya menyediakan database server, selain web server yang ditujukan untuk melayani permintaan pemakai yang hendak mengakses aplikasi web. Database

  

server adalah server yang melayani akses terhadap database. Oracle dan MySQL

  merupakan contoh dari database engine. Adapun contoh web server yaitu Apache (sangat terkenal di lingkungan Linux) dan IIS (Internet Information Server), yang merupakan andalan Microsoft.

2.2. Pemrograman Web

2.2.1. WWW

  WWW (World Wide Web) adalah sistem untuk menata dan menampilkan informasi di internet. Web adalah suatu kumpulan informasi pada beberapa server komputer yang terhubung satu sama lain dalam jaringan internet dengan menggunakan konsep hypertext antar dokumen yang berkaitan. Protokol yang digunakan untuk mengakses halaman web adalah HTTP (HyperText Transfer

  

Protocol ). Setiap dokumen hypertext yang melewati HTTP ditulis dengan

  menggunakan format standar yang disebut HTML (HyperText Markup

  

Language ). Dalam WWW juga dikenal Uniform Resource Locator (URL), yaitu

penunjuk alamat di internet.

  2.2.2. Web Browser Web browser atau biasa disebut dengan browser adalah suatu program

  yang dirancang untuk mengambil informasi-informasi dari suatu server pada jaringan internet. Informasi-informasi ini biasanya dikemas dalam page-page, dimana setiap page bisa memiliki beberapa link yang menghubungkan web page tersebut ke sumber informasi lainnya. Jika suatu link diklik maka browser akan melihat alamat dari tujuan link tersebut dan kemudian mencari di web server. Jika

  browser

  menemukan alamat dari tujuan link tersebut, browser akan menampilkan informasi yang ada, dan apabila alamat tidak ditemukan maka browser akan memberikan suatu pesan bahwa alamat yang dicari tidak ditemukan (Sampurna, 1996).

  2.2.3. Web Server Web server adalah perangkat lunak yang menjadi kekuatan dari WWW.

  

Web server menunggu pemintaan dari client yang menggunakan browser seperti

  Netscape Navigator, Internet Explorer, Opera dan program browser lainnya. Jika ada permintaan dari browser maka web server akan memperoleh permintaan itu kemudian memberikan hasil prosesnya berupa data yang diinginkan kembali ke

  

browser . Web server untuk berkomunikasi dengan client mempunyai protokol

  sendiri yaitu HTTP sehingga komunikasinya dapat saling dimengerti dan lebih mudah.

  2.2.4. Web Client Web client adalah suatu aplikasi yang memanfaatkan HTTP untuk

  berkomunikasi dengan web server. Web client berfungsi menampilkan data yang diminta oleh pengguna dari web server melalui web client.

  2.2.5. HTTP

  HTTP (HyperText Transfer Protocol) adalah protokol yang menentukan aturan yang perlu diikuti oleh web browser dalam meminta atau mengambil suatu dokumen dan oleh web server dalam menyediakan dokumen yang diminta oleh

  

web browser . HTTP bersifat request-response, yaitu dalam protokol ini client

  menyampaikan pesan request ke server kemudian server memberikan response yang sesuai dengan request tersebut.

  2.2.6. HTML

  HTML (HyperText Markup Language) adalah standar informasi yang berbasis hypertext yang dipakai pada web. Berdasarkan standar inilah web

  

browser bisa memahami isi suatu dokumen yang berasal dari web server. HTML

  bekerja dengan menggunakan HTTP, yaitu protokol komunikasi yang memungkinkan web server berkomunikasi dengan web browser.

  HTML terdiri dari dua bagian yaitu head dan body. Bagian head berisikan judul dokumen dan informasi-informasi dasar lainnya, sedangkan bagian body adalah data dokumennya. Struktur HTML diapit oleh tag <HTML> dan

  </HTML> yang menandai awal dan akhir dari sebuah dokumen HTML. Standar penulisan dokumen HTML adalah : <HTML>

  <HEAD> <TITLE> Judul </TITLE> </HEAD> <BODY>

  Isi </BODY>

  </HTML> Perintah dalam HTML biasa disebut tag. Tag-tag dalam HTML biasanya digunakan untuk memodifikasi dokumen teks yang akan ditampilkan di dalam

  web browser . Tag-tag tersebut adalah sebagai berikut :

  a. Tag Heading HTML menyediakan 6 buah tag yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul dalam badan dokumen. Tag-tag judul ini berupa <H1>...</H1> untuk ukuran terbesar sampai dengan <H6>...</H6> untuk ukuran yang terkecil.

  Untuk mengatur penempatan teks di dalam baris digunakan atribut ALIGN. Nilai dari atribut ALIGN dapat berupa “CENTER” untuk menempatkan teks di tengah-tengah layar pada baris yang bersangkutan, mengatur teks rata kanan terhadap halaman, “JUSTIFY” untuk mengatur teks rata kiri dan kanan yang efeknya akan terlihat untuk teks yang panjang. Contoh penulisan ALIGN pada heading adalah :

  <H1 ALIGN = “RIGHT”> Heading Rata Kanan</H1>

  b. Tag Line Break <BR> Tag <BR> berfungsi untuk membuat baris baru atau berpindah baris.

  c. Tag Paragraph <P> Tag <P> berguna untuk membuat baris baru dengan sebuah baris kosong.

  Biasanya digunakan untuk membuat alenia / paragraf.

  d. Tag Horizontal Rule <HR> Tag <HR> digunakan untuk membuat garis horizontal. Biasanya digunakan untuk mempercantik tampilan.

  e. Tag <CENTER> Tag <CENTER> digunakan untuk menengahkan suatu teks.

2.3. DFD (Data Flow Diagram)

  Diagram Arus Data (DAD) atau Data Flow Diagram (DFD) digunakan untuk menggambarkan aliran data dan relasinya dalam suatu sistem. Manfaat digunakannya DFD adalah :

  a. Sebagai alat bantu komunikasi

  b. Mempermudah dalam memahami sistem secara logika Simbol-simbol yang digunakan dalam DFD adalah sebagai berikut : Simbol Arti Contoh

  Kesatuan Luar

  Anggota

  (Entity) Arus Data Data Anggota

  (Data Flow)

  1.P Proses

  Masukkan (Process)

  Data Anggota

  Simpanan Data

  D01 Anggota

  (Data Store)

Tabel 2.1 Simbol DFD

2.4. Diagram E-R

  Dalam merancang tabel, hubungan antar tabel, mengidentifikasikan

  primary dan foreign key dan aturannya, serta domain untuk database, diperlukan suatu metode yang disebut Diagram Entity-Relationship (Diagram E-R).

  Dalam E-R Diagram terdapat tiga tipe relasi. Tiap tipe menunjukkan jumlah record dari tiap tabel yang dapat direlasikan ke record pada tabel lain.

  Ketiga tipe relasi tersebut adalah : a.

   One-to-one

  Adalah hubungan satu ke satu. Sebagai contoh adalah satu kode mempunyai satu produk yang spesifik. Relasi one-to-one tidak diwujudkan ke dalam bentuk sebuah tabel tersendiri, melainkan atribut- atribut relasi akan ditambahkan pada salah satu entitas yang ada.

  b.

   One-to-many

  Adalah hubungan satu ke banyak. Misalnya satu kategori memiliki banyak produk. Demikian sebaliknya, banyak produk memiliki satu kategori.

  Relasi one-to-many tidak diwujudkan ke dalam bentuk sebuah tabel sendiri, melainkan atribut-atribut relasi akan ditambahkan pada entitas yang berderajat / bermuatan n (many).

  c.

   Many-to-many

  Adalah hubungan banyak ke banyak. Misalnya banyak order mempunyai banyak produk dan banyak produk memiliki banyak order. Relasi many-

  to-many diwujudkan dalam sebuah tabel baru.

2.5. Basis Data

  Basis data (database) adalah kumpulan file-file (berupa tabel) yang saling berelasi untuk menggambarkan atau menginformasikan tentang sesuatu hal.

  Tahap-tahap perancangan basis data meliputi : 1.

   Conceptual Design Berupa conceptual schema yang mengacu pada suatu conceptual model.

  Pada tahap ini biasanya digunakan entity relational model sebagai conceptual model .

  2. Logical Design

  Pada tahap ini, conceptual schema yang telah jadi diterjemahkan ke model data yang sesuai dengan DBMS (Database Management System) yang digunakan. Hasil yang didapat berupa logical data model.

  3. Physical Design

  Pada tahap ini, logical schema dilengkapi dengan detail-detail implementasi secara fisik. Physical schema yang dihasilkan berupa tabel.

2.6. JSP (Java Server Pages)

2.6.1. Sekilas tentang JSP

  JSP (Java Server Pages) merupakan teknologi yang didasarkan pada bahasa Java, yang dapat digunakan untuk membentuk halaman-halaman web yang bersifat dinamis. Teknologi ini dikembangkan oleh Sun Microsystem. JSP menggunakan pendekatan pemrosesan di sisi server. Pada model seperti ini, kode sumber JSP dijalankan pada web server. Salah satu keuntungan model seperti ini adalah memungkinkan untuk membuat aplikasi yang independen terhadap keberadaan sistem Java di sisi client.

  JSP merupakan perangkat lunak pembuat aplikasi web yang bersifat

  

multiplatform . Keunggulan dari adanya dukungan multiplatform adalah

  memungkinkan kode dapat dipindah-pindahkan ke berbagai platform tanpa perlu melakukan perubahan apapun pada kode tersebut. Sebagai contoh, penulisan kode JSP yang pada awalnya ditujukan untuk dijalankan pada Windows bisa

2.6.2. Arsitektur JSP

  2. Permintaan

disampaikan ke

web server

  Internet Web Server

  

4. Kode HTML

dikirimkan ke

pemakai via internet sesuatu.jsp

5. Kode HTML

  1. Permintaan halaman web disampaikan ke pemakai (sesuatu.jsp)

  JSP Servlet Engine

  3. Memproses Browser berkas JSP dan membentuk kode HTML Client

Gambar 2.2 Prinsip kerja pengaksesan dokumen JSP

  Pemakai yang ingin mengakses halaman web, mula-mula mengirimkan permintaan halaman web melalui protokol HTTP dalam bentuk JSP (sesuatu.jsp).

  Permintaan ini akan disampaikan ke web server. Kemudian web server mengambil dokumen JSP dan mengirimkan ke JSP Servlet Engine. Bagian inilah yang melakukan pemrosesan kode-kode JSP (termasuk di dalamnya melakukan peng-compile-an) dan membentuk kode HTML. Berikutnya, kode HTML ini disampaikan oleh web server ke client yang memintanya. Kode HTML ini selanjutnya diproses oleh browser sehingga pemakai bisa memperoleh informasi dari halaman web yang dikehendakinya.

  Detail pemrosesan oleh JSP Servlet Engine adalah sebagai berikut : 1. Melakukan pemilahan (parsing) kode JSP.

  2. Membangkitkan kode sumber servlet.

  3. Meng-compile kode sumber servlet menjadi sebuah kelas.

  4. Membuat instan servlet.

  5. Memberikan keluaran servlet ke web server.

2.7. MySQL

  MySQL adalah multiuser database yang menggunakan bahasa Structure

  

Query Language (SQL). SQL adalah bahasa standar yang digunakan untuk

  mengakses database server. MySQL mampu menangani data yang cukup besar karena menerapkan suatu metode yang sangat cepat dalam relasi antar tabel

  

database -nya. Selain itu, MySQL dapat digunakan sebagai database sumber data

untuk informasi yang akan ditampilkan pada suatu halaman web.

  SQL membuat pemrogram dan administrator database melakukan beberapa hal, seperti : mengubah struktur sebuah database, mengubah pengaturan keamanan sistem, memberikan hak akses kepada pengguna untuk mengakses database , memperoleh informasi dari database, dan memperbaharui isi database.

  Beberapa perintah dasar yang sering digunakan pada MySQL adalah :

  a. Membuat database :

  b. Menghapus database : DROP DATABASE nama_database

  c. Membuat tabel : CREATE TABLE nama_tabel (nama_field tipe_field(nilai) [not null|null] primary key, ..., ...)

  d. Menghapus tabel : DROP TABLE nama_tabel

  e. Memasukkan data ke dalam tabel :

  INSERT INTO nama_tabel (field1, field2, ...) VALUES (nilai, ... , ...)

  f. Menghapus data dari tabel : DELETE FROM nama_tabel WHERE syarat

  g. Mengubah data : UPDATE nama_tabel SET field1=nilai, field2=nilai WHERE syarat

  h. Menampilkan isi tabel : SELECT field1, field2 FROM nama_tabel WHERE syarat1, syarat2 ORDER BY field

BAB III ANALISA DAN PERANCANGAN SISTEM

3.1. Analisa Sistem

3.1.1. Analisa Sistem Lama

  Informasi mengenai Mapasadha, selama ini hanya dapat diperoleh di “Pondok Mapasadha”. Sehingga bagi anggota maupun mahasiswa yang tertarik menjadi anggota harus datang ke “Pondok Mapasadha” untuk dapat memperoleh informasi yang dibutuhkan. Informasi menjadi sangat penting terutama untuk mahasiswa yang bukan anggota Mapasadha karena dengan mengetahui informasi detail mengenai Mapasadha, mahasiswa dapat tertarik untuk bergabung menjadi anggota.

  Dalam organisasi Mapasadha, data anggota disimpan dalam sebuah buku induk. Untuk melakukan perubahan data anggota, pengurus harus mencari berkas secara manual satu per satu data anggota yang dikehendaki di dalam buku induk tersebut. Hal ini membuat proses pencarian menjadi sangat lama dan tidak efektif, apalagi bila perawatan dan penyimpanannya kurang baik, berkas dapat menjadi rusak atau bahkan hilang.

  Permasalahan yang lain adalah dokumentasi kegiatan. Foto-foto kegiatan yang dilakukan anggota Mapasadha hanya ditempatkan pada album foto dan tidak diorganisasikan dengan baik sehingga untuk dokumentasi yang lama sudah tidak dapat diketahui kapan dan di mana kegiatan dilakukan, kecuali oleh pembuat

3.1.2. Analisa Sistem Baru

  3.1.2.1. Gambaran Sistem secara Umum

  Sistem yang akan dikembangkan adalah sebuah sistem perangkat lunak (software) client/server berbasis web yang akan menyajikan segala informasi seputar Mapasadha secara detail. Dengan adanya informasi yang mendetail tentang Mapasadha, diharapkan user yang bukan merupakan anggota Mapasadha akan lebih mengenal Mapasadha sehingga tertarik untuk menjadi anggota. Selain itu, anggota Mapasadha juga akan lebih mudah dalam mengakses informasi yang dibutuhkan.