Perancangan Sistem Informasi Inter Club Indonesia Kordinator Daerah Sumatera Utara Berbasis Web
PERANCANGAN SISTEM INFORMASI INTER CLUB INDONESIA KORDINATOR DAERAH SUMATERA UTARA
BERBASIS WEB
TUGAS AKHIR
RAHMAD RIWANDA SIREGAR 112406248
PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA
MEDAN 2015
PERANCANGAN SISTEM INFORMASI INTER CLUB INDONESIA KORDINATOR DAERAH SUMATERA UTARA
(2)
BERBASIS WEB
Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh gelar Ahli Madya
RAHMAD RIWANDA SIREGAR 112406248
PROGRAM STUDI D3 TEKNIK INFORMATIKA DEPARTEMEN MATEMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA
MEDAN 2015
(3)
PERSETUJUAN
Judul : PERANCANGAN SISTEM INFORMASI
INTER CLUB INDONESIA
KORDINATOR DAERAH SUMATERA UTARA BERBASIS WEB
Kategori : TUGAS AKHIR
Nama : RAHMADRIWANDA SIREGAR
Nomor Induk Mahasiswa : 112406248
Program Studi : D-3 TEKNIK INFORMATIKA
Departemen : MATEMATIKA
Fakultas : MATEMATIKA DAN ILMU
PENGETAHUAN ALAM (FMIPA) UNIVERSITAS SUMATERAUTARA
Diluluskan di
Medan, 5Oktober 2015
Komisi Pembimbing : Diketahui/ Disetujui oleh
Ketua Prodi D3 Teknik Informatika Dosen Pembimbing
Dr. Elly Rosmaini, M.Si
NIP.196005201985032002 NIP.197103101997031004
(4)
PERNYATAAN
PERANCANGAN SISTEM INFORMASI INTER CLUB INDONESIA KORDINATOR DAERAH 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, 5 Oktober 2015
Rahmad Riwanda Siregar 112406248
(5)
PENGHARGAAN
Alhamdulillah, puji dan puja syukur penulis ucapkan kehadirat Allah SWT yang telah memberi rahmat dan hidayah-Nya sehingga penulis dapat menyelesaikan Tugas Akhir ini tepat pada waktunya. Tugas Akhir ini dibuat sebagai salah satu syarat untuk menyelesaikan perkuliahan pada Program Studi D-3 Teknik Informasi Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara. Adapun judul Tugas Akhir yang penulis buat adalah “PERANCANGAN SISTEM INFORMASI INTER CLUB INDONESIA KORDINATOR DAERAH SUMATERA UTARA BERBASIS WEB”.
Pada kesempatan ini penulis menghaturkan ucapan terima kasih kepada: 1. Bapak Dr. Syahriol Sitorus, M.IT. selaku Dosen Pembimbing penulis yang
banyak sekali memberikan bantuan baik berupa saran maupun masukan dalam penyelesaian Tugas Akhit ini.
2. Bapak Dr. Sutarman, M.Sc. selaku Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.
3. Ibu Dra.Elly Rosmaini, M.Si. selaku Ketua Program Studi D3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.
4. Djoko Sutejo, selaku kordinator daerah Inter Club Indonesia Kordinator Sumatera Utara. Terimakasih karena telah memberi banyak saran dan mempermudah dalam mendapatkan data – data dalam pembuatan tugas akhir ini.
5. Teman – Teman yang telah menjadi keluarga besar penulis di perantauan, para member ICI Medan, Forza Inter.
6. Keluarga di kampung, Ibunda “Rima Zahara Nasution”, Ayahanda “Mazwar”, dan tiga adik perempuan penulis “Rahayu Septianda Siregar, Dinda Novita Lestari Siregar, dan Paradiba Apriliani Siregar” yang terus memberi semangat dan motivasi yang besar kepada penulis dalam penyelesaian Tugas Akhir ini.
(6)
7. Keluarga kecil satu atap di perantauan, adik sepupu Cahya Rizky. Terimakasih kasih karena selalu memberi semangat. Kakak sepupu Shofia Mastura yang berniat mendukung sampai diselesaikannya tugas akhir ini.
8. Hengki Sardi Tanjung, tidak seperti teman melainkan keluarga. Terimakasih karena telah memberi semangat penulis dengan makian dan sindiran.
9. Teman yang sama berjuang dan hampir senasib. Ikhfal Fazwi, terimakasih karena tidak menunggu. Rio Manik, tetap berjuang!
10.Teman – teman Teknik Kimia USU 2010, atas semangat dan dukungannya. Reaksikan!!!
11.Setiap teman yang mendukung penulis yang masih stay di Padangsidimpuan. 12.Sahabat – sahabat yang telah wisuda terlebih dahulu, yang selalu bertanya
“kapan Tamat??”. Terimakasih atas motivasi tiada tanding.
13.Semua sahabat, mungkin lebih pantasnya disebut sekutu yang mengatasnamakan “2010”. Maaf penulis tidak dapat mencantumkan nama satu - persatu, kecuali Firman.
14.Mulut yang hampir berbuih karena mendesak penulis segera menyelesaikan tugas akhir ini. Kamu yang kerjaannya datang dan pergi, Aya Syarifah Nasution. Terimakasih atas desakan dengan menambah masalah.
Penulis menyadari bahwa dalam penyelesaian Tugas Akhir ini banyak terdapat kekurangan dan kesalahan, untuk itu penulis berharap adanya kritikan dan juga saran yang membangun dari semua pihak untuk penyempurnaan Tugas Akhir ini. Pada akhirnya, semoga Tugas Akhir ini dapat berguna dan bermanfaat untuk kita semua dan untuk penulis khususnya.
Medan, 5 Oktober 2015
Rahmad Riwanda Siregar
(7)
Pada penulisan Tugas Akhir ini, penulis membuat Perancangan Sistem Informasi Inter Club Indonesia Kordinator Daerah Provinsi Sumatera Utara Berbasis Webmerupakan sebuah website yang akan digunakan untuk dapat mengakses data dari website pada internet.
Metode dan rancangan website ini menggunakan PHP, HTML, MySQL, dan
CSS sebagai bahasa pemrogramannya. Cara kerja dari website yang dibuat adalah
dengan mengakses data yang terdapat di websiteInter Club Indonesia Kordinator Daerah Sumatera Utara.
Hasil rancangan dari website ini dapat memberikan informasi tentang team sepak bola FC Internazionale, informasi Inter Club Indonesia, berbelanja secara online, dan berdiskusi dengan member lain yang telah terdaftar di website ini. Target yang akan dicapai dalam perancangan website Inter Club Indonesia Kordinator Daerah Sumatera Utara ini adalah user mampu mengakses informasi tentang FC Internazionale dan menjalin kekeluargaan antar user yang telah terdaftar di website ini. Kajian ini dibuat bertujuan untuk menambah wawasan merancang website yang sederhana.
(8)
DAFTAR ISI
Halaman
Persetujuan i
Pernyataan ii Penghargaan iii Abstrak v Daftar Isi vi Daftar Gambar viii Daftar Tabel ix BAB 1 PENDAHULUAN
1
1.1 Latar Belakang 1
1.2 Permasalahan 3
1.3 Maksud Dan Tujuan 4
1.4 Metodologi Penelitian 4
1.5 Lokasi Dan Waktu 5
1.6 Sistematika Penulisan 5
BAB 2 LANDASAN TEORI 7
2.1 Pengertian Komputer 7
2.2 Internet 10
2.3 Word Wide Web (Web) 11
2.3.1 Lahirnya Web 13
2.3.2 Web Browser 13
2.3.3 Fungsi WWW 15
2.3.4 Web Server 15
2.4 HTML (Hypertext Markup Language) 16
2.4.1 Dokumen HTML 17
2.4.2 Tag Dan Elemen Dalam HTML 17
2.5 PHP (Hypertext Preprocessor) 20
2.5.1 Sejarah PHP 21
2.5.2 Hubungan PHP dengan HTML 23
2.5.3 Kelebihan PHP 24
2.6 CSS (Cassading Style-Sheet) 25
(9)
2.6.2 Kelebihan Pengunaan CSS 28
2.7 MySQL 28
2.8 Sistem Informasi 29
BAB 3 GAMBARAN SEKILAS TENTANG INTER CLUB INDONESIA
KORDINATOR DAERAH SUMATERA UTARA 32
3.1 Latar Belakang Inter Club Indonesia Kordinator Daerah
Sumatera Utara 32
3.2 Azaz, Sifat, Tujuan, Tugas Pokok dan Fungsi
Inter Club Indonesia Kordinator Daerah Sumatera Utara 33 3.3 Kepengurusan dan Kegiatan Inter Club Indonesia
Kordinator Daerah Sumatera Utara 34
BAB 4 PERANCANGAN SISTEM 35
4.1 Analisis Sistem 35
4.2 Perancangan Sistem 35
4.3 Metode Pengembangan Sistem 36
4.4 Metode Perancangan 37
4.4.1 Pembuatan Diagram Alir (Flowchart) 38 4.4.2 Diagram Konteks (Context Diagram) 45 4.4.3 Entity Relationship Diagram (ERD) 55
4.5 Table Database 58
BAB 5 IMPLEMENTASI SISTEM 62
5.1 Pengertian Implementasi Sistem 62
5.1.1 Tujuan Implementasi Sistem 62
5.2 Komponen Pada Sistem 63
5.2.1 Hardware 63
5.2.2 Software 63
5.2.3 Brainware 66
5.3 Uji program 67
BAB 6 KESIMPULAN DAN SARAN 72
6.1 Kesimpulan 72
6.2 Saran 73
DAFTAR PUSTAKA LISTING PROGRAM
(10)
Gamba Judul Halaman Nomor
Gambar 2.1 Dokumen HTML5 Ditampilkan Pada Jendela
Browser MozillaFirefox 20
Gambar 4.1 Flowchart Perancangan Website Inter Club Indonesia
Kordinator Daerah Sumatera Utara 43
Gambar 4.2 Flowchart User 44
Gambar 4.3 Flowchart Admin 45
Gambar 4.4 Diagram Konteks Perancangan Website Inter Club Indonesia
Kordinator Daerah Sumatera Utara 46
Gambar 4.5 DFD Level 0 47
Gambar 4.6 DFD Level 1 News 48
Gambar 4.7 DFD Level 1 Inter 49
Gambar 4.8 DFD Level 1 ICI PROVSU 50
Gambar 4.9 DFD Level 1 Gallery 51
Gambar 4.10DFD Level 1 Store 52
Gambar 4.11 DFD Level 1 Forum 53
Gambar 4.12 DFD Level 1 Contact 54
Gambar 4.13 ERD News 55
Gambar 4.14 ERD Pertandingan 55
Gambar 4.15 ERD ICIPROVSU 56
Gambar 4.16 ERD Gallery 56
Gambar 4.17 ERD Produk 56
Gambar 4.18 ERD Forum 57
Gambar 4.19 ERD Contact 57
Gambar 4.20 ERD Admin dan User 57
Gambar 5.1 Windows 8 Pro 64
Gambar 5.2 Sublime Text 2 64
Gambar 5.3 XAMPP Control Panel 65
Gambar 5.4 Localhost XAMPP 65
Gambar 5.5 Adobe PhotoShop CS3 Extended 66
Gambar 5.6 Tampilan Halaman Welcome Screen 67
Gambar 5.7 Tampilan Halaman Home 67
Gambar 5.8 Tampilan Halaman News 68
Gambar 5.9 Tampilan Halaman Inter 68
Gambar 5.10 Tampilan Halaman ICIPROVSU 69
Gambar 5.11 Tampilan Halaman Gallery 69
Gambar 5.12 Tampilan Halaman Store 70
Gambar 5.13 Tampilan Halaman Forum 70
Gambar 5.14 Tampilan Halaman Contact 71
(11)
DAFTAR TABEL
Tabel Judul Halaman
Nomor
Tabel 4.1 Tabel Database News 58
Tabel 4.2 Tabel Database Pertandingan 59
Tabel 4.3 Tabel Database ICIPROVSU (Regional) 59
Tabel 4.4 Tabel Database Gallery 59
Tabel 4.5 Tabel Database Produk 60
Tabel 4.6 Tabel Database Forum 60
(12)
(13)
BAB 1
PENDAHULUAN
1.1 Latar Belakang
Kebutuhan akan informasi yang akurat dan tepat waktu untuk menyajikan data yang lengkap sangatlah diperlukan oleh instansi baik instansi pemerintah maupun instansi swasta, organisasi dan perusahaan. Komputer sesuai fungsinya adalah sebagai alat untuk mengolah data menjadi informasi yang benar, akurat, tepat guna dan tepat waktu.
Perkembangan internet sekarang ini sangat jauh berbeda dengan awal masa kehadirannya. Kini internet telah banyak digunakan oleh berbagai instansi, organisasi dan perusahaan untuk mendukung kelancaran usaha dari sekedar penanganan pertukaran informasi, pengolahan data sampai kepenyelenggaraan bisnis lainnya. Kini internet yang popular sering disebut dengan web atau juga sering juga disebut peragkat lunak berbasis web yang telah berkembang dengan pesat baik dari segi penggunaan, ukuran, bahasa yang digunakan dan kompleksitasnya. Aplikasi web pada mulanya hanyalah berupa situs yang bersifat situs dan navigated oriented, tapi saat ini telah banyak bersifat dinamis, interaktif dan task oriented yang digunakan dalam system informasi dan telekomunikasi.
(14)
Situs web merupakan kumpulan halaman web yang berhubungan dan saling terkait. Keterhubungan ini mempengaruhi keputusan para perancang web dalam menangani setiap elemen web dan proses – prosesnya.
Pada umumnya tujuan suatu instansi ataupun perusahaan adalah untuk menjamin dan meningkatkan mutu dan kualitas dengan harapan memperoleh hasil yang maksimal. Inter Club Indonesia Kordinator Daerah Provinsi Sumatera Utara adalah tolak ukur untuk menyatakan kordinator organisasi tersebut berhasil, apalagi data dan informasi yang mengalir didalamnya mampu disajikan dalam bentuk sistem informasi yang tersusun sedemikian rupa dan dituangkan dalam bentuk sistem informasi yang berbasis web, sehingga orang lain yang membutuhkan informasi dapat mengakses data dan melakukan komunikasi dengan mudah.
Dengan pertimbangan diataslah penulis mengangkat judul “PERANCANGAN
SISTEM INFORMASI INTER CLUB INDONESIA KORDINATOR DAERAH PROVINSI SUMATERA UTARA BERBASIS WEB”sebagai salah satu acuan agar
kordinator organisasi tersebut maju dalam bidang pengolahan data dan informasi sehingga sejajar dengan kordinator - kordinator lainnya yang terlebih dahalu telah menerapkan sistem tersebut.
Inter Club Indonesia adalah sebuah organisasi fans ataupun penggemar club sepak bola yang berasal dari Italy, FC Internazionale. Karena meningkatnya jumlah member yang terbentuk di Indonesia Indonesia, Inter Club Indonesia membagi kordinator tiap provinsi di Indonesia salah satunya kordinator daerah provinsi Sumatera Utara. Seiring dengan perkembangan teknologi informasi di Indonesia yang akurat dan tepat waktu untuk menyajikan data yang lengkap sangatlah diperlukan suatu organisasi. Maka kita dituntut untuk bisa mempunyai website sendiri seperti membuat sistem informasi. Hal ini sangatlah wajar mengingat manfaat yang kita dapatkan adalahmempunya website sendiri dan
database yang termenajemen dengan baik. Kemudahan orang lain untuk mengakses data
(15)
sebagai suatu syarat yang mutlak untuk mempromosikan kordinaor tersebut dalam bidang membagi informasi dengan cepat dan mudah.
1.2 Permasalahan
Pada umumnya setiap organisasi tidak akan terlepas dari beberapa masalah dalam aktivitasnya untuk mencapai tujuan. Masalah yang akan dipecahkan adalah bagaimana Inter Club Indonesia Kordinator Daerah Sumatera Utara dapat memanfaatkan aplikasi web sebagai suatu sarana untuk penyajian dan mengirimkan informasi dengan lebih cepat dan mudah bagi masyarakat umum dan kalangan anggota Inter Club Indonesia yang berada dalam daerah Provinsi Sumatera Utara.
Sehubungan dengan hal tersebut dapat dirumuskan permasalahan sebagai berikut:
1. Bagaimana pemanfaatan aplikasi web dalam penyebaran informasi mengenai FC Internazione dan Inter Club Indonesia.
2. Bagaimana informasi mengenai Inter Club Indonesia Korditor Daerah Sumatera Utara dapat disajikan dengan baik.
3. Bagaimana informasi berbasis websiteyang telah dirancang ini dapat diperbaharui (update) dengan mudah pada waktu yang diinginkan.
Untuk memperjelas dan untuk lebih memudahkan penelitian ini agar tidak menyimpang dari sasaran yang dituju, maka penulis melakukan pembatasan masalah :
(16)
1. Penelitian dilakukan pada Inter Club Indonesia Kordinator Daerah Sumatera Utara.
2. Data yang di analisa yaitusejarah organisasi, informasi seputar FC Internazionale, sistem penjualan merchandise, dan informasi seputar Inter Club Indonesia.
1.3 Maksud dan Tujuan
Adapun maksud penulisan tugas akhir ini adalah untuk memenuhi syarat menyelesaikan perkuliahan di program studi D3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.
Tujuan dari penulisan tugas akhir ini adalah untuk merancang sistem informasi berbasis web pada Inter Club Indonesia Kordinator Daerah Sumatera Utara dengan menggunakan bahasa pemrograman web dan aplikasi lainnya untuk membantu dalam menyajikan informasi bagi member ataupun nonmember yang berada di Sumatera Utara ataupun diluar Sumatera Utara.
1.4 Metodologi Penelitian
Adapun metodologi penelitian yang diguunakan penulis adalah : a. Penelitian kepustakaan (Library research)
Disini penulis menggunakan buku-buku dan websiteyang berhubungan dengan masalah dalam menyusun tugas akhir sehingga dapat membantu penyelesaian masalah tersebut.
(17)
b. Penelitian lapangan (Field research)
Studi lapangan dilakukan dengan cara meneliti organisasi secara langsung untuk mendapatkan data-data yang berhubungan dengan masalah yang di teliti.
1.5 Lokasi dan Waktu
Dalam menyusun tugas akhir ini penulis melakukan metode penelitian untuk memperoleh data yang dibutuhkan, sehingga memudahkan penulis dalam menyusun tugas akhir dan dapat diselesaikan dengan baik. Adapun lokasi penelitian yang penulis lakukan yakni di basecamp Inter Club Indonesia Regional Medan yang dulunya berada di Kaswari Food Court, Jalan Kaswari Medan sekarang telah pindah ke Jalan Titi Papan No. 17 Medan. Untuk mengetahui sistem yang sedang berjalan pada saat ini, penulis membutuhkan waktu yaitu dari 24 November 2014sampai 31 Desember 2014.
1.6 Sistematika Penulisan
Adapun seistematika penulisan Laporan Tugas Akhir adalah sebagai berikut :
BAB 1 : PENDAHULUAN
Dalam bab ini penulis menguraikan latar belakang masalah, permasalahan maksud dan tujuan, ruang lingkup, metode penelitian, lokasi dan waktu serta sistematika penulisan.
(18)
BAB 2: LANDASAN TEORI
Dalam bab ini penulis menguraikan tentang pengertian yang berhubungan dengan komputer, sistem informasi, sejarah singkat internet, Word Wide
Web, HTML, PHP, javasript dan jquery, MySQL, dan Adobe Photoshop.
BAB 3: GAMBARAN SEKILAS TENTANG INTER CLUB INDONESIA KORDINATOR DAERAH SUMATERA UTARA
Dalam bab ini peulis menjelaskan sekilas gambaran Inter Club Indonesia Kordinator Daerah Sumatera Utara yang terdiri dari profil, struktur organisasi, visi dan misi Inter Club Indonesia Kordinator Daerah Sumatera Utara.
BAB 4: PERANCANGAN SISTEM
Dalam bab ini penulis menguraikan tentang perancangan sistem yang dirancang dan meliputi database dari sistem yang dirancang, gambaran aplikasi web yang akan dibuat serta bagaimana algoritma aplikasi tersebut dijalankan.
BAB 5: IMPLEMENTASI SISTEM
Dalam bab ini penulis menyajikan tentang pengrtian dan tujuan implementasi dan komponen-komponen yang dibutuhkan sistem.
BAB 6 : KESIMPULAN DAN SARAN
(19)
(20)
BAB 2
LANDASAN TEORI
2.1 Pengertian Komputer
Komputer (computer)berasal dari Bahasa latin computare yang berarti menghitung. Kompoter mempunyai arti yang sangat luas dan berbeda untuk orang yang berbeda. Komputer adalah system elektronik untuk memanipulasi data yang cepat dan tepat serta dirancang dan diorganisasikan supaya secara otomatis menerima dan menyimpan data input, memprosesnya dan menghasilkan output dibawah pengawasan suatu langkah – langkah instruksi program yang tersimpan di memori
(stored program).
Bila dijabarkan, defenisi dari komputer adalah seperangkat peralatan elektronik yang bekerja bersama – sama secara otomatis, menerima output, memproses data dan menghasilkan data secara logis (output), cepat dan tepat berdasarkan perintah – perintah yang diberikan oleh user dan komputer itu sendiri merupakan bagian dari system komputerisasi.
Sistem komputer adalah suatu sistem yang terdiri atas komputer dan seluruh komponen – komponen yang menunjang terlaksananya proses pengolahan data dan
(21)
menjadikan komputer sebagai alat yang berguna. Sistem komputer memiliki bebrapa komponen, yaitu :
a. Perangkat Keras (Hardware)
Perangkat keras merupakan perangkat yang secara fisik dapat dilihat dan diraba, yang membentuk kesatuan, sehingga dapat difungsikan. Berdasarkan kegunaannya, perangkat keras dapat digolongkan kedalam tiga bagian :
1. Alat Input
Alat input adalah alat yang memiliki fungsi untuk memasukkan data ataupun program yang akan diproses komputer, seperti keyboard, mouse, printer,
scanner, dan lainnya.
2. Alat Proses
Alat proses atau CPU (Central Processing Unit), merupakan alau atau unit terpenting didalam sistem komputer. Fungsi utamanya adalah pusat pemprosesan data dan mengontrol keseluruhan sistem komputer selama pengolahan data berlangsung, contohnya processor.
3. Alat Output
Alat output adalah alat untuk menampilkan hasil pengolahan data yang dilakukan oleh CPU, misalnya monitor dan printer.
(22)
b. Perangkat Lunak (Software)
Perangkat lunak adalah komponen komputer yang merupakan kumpulan program dan prosedur yang memungkinkan perangkat keras komputer dapat menjalankan fungsinya sebagai alat pengolahan data. Komponen ini tidak nyata secara fisik. Perangkat lunak berfungsi sebagai perantara antara computer dan user sehingga dapat digunakan.
c. Perangkat Komputer (Brainware)
Pengguna komputer adalah manusia yang menangani suatu sistem komputer atau orang yang mampu menangani suatu sistem operasi komputer. Brainware dapat dikelompokkan dalam beberapa bagian, yaitu :
1. Sistem Analisis
Orang yang bertugas untuk membentuk dan merancang fasilitas suatu sistem komputer yang akan dibangun.
2. Programmer
Orang yang bertugas menerjemahkan spesifikasi yang telah dirancang oleh sistem analisis kedalam suatu Bahasa program tertentu.
3. Komputer Operator
Orang yang bertugas menangani pengolahan data secara langsung.
4. Data Entry Operator
Orang yang bertugas melakukan pengurusan data yang akan diolah, mulai dari pengumpulan data, perekaman data kedalam media penyimpanan hingga pemeriksaan dan pengiriman informasi yang akan dihasilkan oleh Komputer.
(23)
2.2 Internet
Pertahanan disebut mendemonstrasikan bagaimana dengan berbasis melalui saluran telepon. Proyek ARPANET merancang bentuk jaringan, kehandalan, seberapa besar informasi dapat dipindahkan, dan akhirnya semua standar yang mereka tentukan menjadi cikal bakal pembangunan protokol baru yang sekarang dikenal sebagai
Tujuan awal dibangunnya proyek itu adalah untuk keperluan militer. Pada saat itu membuat siste komputer di daerah-daerah vital untuk mengatasi masalah bila terjadi serangan terjadi perang dapat mudah dihancurkan.
Pada mulanya ARPANET hanya menghubungkan 4 situs saja yaitu pada tahun
(24)
bula daerah, dan semua membuat ARPANET kesulitan untuk mengaturnya.
Oleh sebab itu ARPANET dipecah manjadi dua, yaitu "MILNET" untuk keperluan militer dan "ARPANET" baru yang lebih kecil untuk keperluan non-militer seperti, universitas-universitas. Gabungan kedua jaringan akhirnya dikenal dengan nama
2.3 Word Wide Web (WWW)
World Wide Web (biasa disingkat WWW) adalah suatu ruang informasi yang yang
dipakai oleh pengenal global untuk mengidentifikasi sumber-sumber daya yang berguna. WWW sering dianggap sama dengan internet secara keseluruhan, walaupun sebenarnya ia hanyalah bagian daripada internet. WWW merupakan kumpulan serverweb dari seluruh dunia yang mempunyai kegunaan untuk menyediakan data dan informasi untuk dapat digunakan bersama.
WWW adalah bagian yang paling menarik dari Internet. Melalui web, para pengguna dapat mengakses informasi-informasi yang tidak hanya berupa teks tetapi bisa juga berupa gambar, suara, video dan animasi. Kegunaan ini tergolong masih baru dibandingkan surat elektronik, sebenarnya WWW merupakan kumpulan dokumen yang tersimpan di server web, dan tersebar di lima benua termasuk Indonesia yang terhubung menjadi satu melalui jaringan internet.
(25)
Dokumen-dokumen informasi ini disimpan atau dibuat dengan format HTML (Hypertext Markup Language).
Suatu halaman dokumen informasi dapat terdiri atas teks yang saling terkait dengan teks lainnya atau bahkan dengan dokumen lain. Keterkaitan halaman lewat teks ini disebut hyperlink. Dokumen infomasi ini tidak hanya terdiri dari teks tetapi dapat juga berupa gambar, mengandung suara bahkan klip video. Kaitan antar-dokumen yang seperti itu biasa disebut hipermedia. Jadi dapat disimpulkan bahwa WWW adalah sekelompok dokumen multimedia yang saling bertautan dengan menggunakan tautan hiperteks atau hyperlink. Dengan mengeklik hyperlink, maka para pengguna bisa berpindah dari satu dokumen ke dokumen lainnya.
Interface identik dengan web, Karena poularitas sebagai penyedia informasi
dan interface yang digunakan oleh pengguna internet dari masalah informasi sampai dengan komunikasi. Dari yang gratis sampai dengan yang komersil.
Web memudahkan pengguna komputer untuk berinteraksi dengan pelaku internet
lainnya. Selain itu web telah diadopsi oleh perusahaan sebagai bagian dari startegi teknologi informasi, karena bebrapa kelebihan yaitu :
a. Update informasi dengan cepat dan mudah. b. Menghemat biaya komunikasi dan administrasi.
c. Beriklan dan menyampaikan informasi tanpa henti 24 jam sehari. Edukasi klien dan calon klien tentang produk atau jasa yang anda berikan.
d. Brand Awarness dengan cara iklan di web terkemuka atau dengan tukar link. e. Desain dan isi web dapat mencerminkan keseriusan anda atau perusahaan anda.
(26)
f. Bonafiditas naik. Kartu nama tidak lagi hanya berisi kontak alamat, telepon dan email.
2.3.1 LahirnyaWeb
Sejarah World Wide Web bermula di European Laboratory for Particle Physics (lebih dikenal dengan nama CERN), di kota Geneva dekat perbatasan Perancis dan Swiss. CERN merupakan suatu organisasi yang didirikan oleh 18 negara di Eropa. Dibulan Maret 1989, Tim Berners dan peneliti lainnya dari CERN mengusulkan suatu protokol sistem distribusi informasi di Internet yang memungkinkan para anggotanya yang tersebar di seluruh dunia saling membagi informasi dan bahkan untuk menampilkan informasi tersebut dalam bentuk grafik.
2.3.2 Web Browser
Web Browser pertama dibuat dengan berbasiskan pada teks. Untuk menyatakan
suatu link, dibuat sebarisan nomor yang mirip dengan suatu menu. Pemakai mengetikkan suatu nomor untuk melakukan navigasi di dalam web. Kebanyakan
software tersebut dibuat untuk komputer-komputer yang menggunakan Sistem
Operasi UNIX, dan belum banyak yang bisa dilakukan oleh pemakai komputer saat itu yang telah menggunakan Windows. Tetapi semua ini berubah setelah munculnya browser Mosaic dari NCSA (National Center for Supercomputing
(27)
Di bulan Mei 1993, Marc Andreesen dan beberapa murid dari NCSA membuat web browser untuk sistem X-Windows yang berbasiskan grafik dan yang mudah untuk digunakan. Dalam beberapa bulan saja, Mosaic telah menarik perhatian baik dari pemakai lama maupun pemakai baru di Internet. Kemudian NCSA mengembangkan versi-versi Mosaic lainnya untuk komputer berbasis UNIX, NeXT, Windows dan Macintosh.
Pada tahun 1994, Marc Andreesen meninggalkan NCSA, dan kemudian bersama Jim Clark, salah satu pendiri dari Silicon Graphics, membuat Netscape versi pertama. Kehadiran Netscape ini menggantikan kepopuleran Mosaic sebagai
web browser dan bahkan sampai saat ini Netscape merupakan browser yang
banyak digunakan setelah Internet Explorer dari Microsoft. Pada tahun yang sama CERN dan MIT mendirikan suatu konsorsium yang dinamakan World Wide Web
Consortium (W3C) yang bertugas untuk membangun standar bagi teknologi web.
Pada awal perkembangannya, sewaktu browser masih berbasiskan teks hanya terdapat sekitar 50 web. Di akhir tahun 1995 jumlah ini telah berkembang mencapai sekitar 300.000 web site. Dan diperkirakan sekarang ini jumlah pemakai
web telah mencapat sekitar 30-an juta pemakai diseluruh dunia.
Diantara browser web yang telah banyak digunakan pada saat peluncurannya diantaranya adalah MSN, Opera Mini, Mozila Firefox, Google
Chrome dan lain sebagainya. Diantara web browser ini terdapat kelebihan dan
kekurangan masing-masing sehinnga pengguna dapat memilih web browser sesuai dengan kemudahan yang ditawarkan.
(28)
2.3.3 Fungsi WWW
Fungsi WWW adalah menyediakan data dan informasi untuk dapat digunakan bersama. Hal ini senada dengan pengertian www yang telah disebutkan di atas. Dengan demikian, salah satu fungsi www di internet menawarkan berbagai kecanggihan dan kemudahan pemakai intenet mendapatkan dan menampilan informasi dimana saja di internet secara mudah dan cepat.
Cara Kerja Browser Mengambil Halaman
Suatu browser mengambil halaman sebuah web page dari server dengan sebuah
request. Sebuah request adalah HTTP standar yang berisi sebuah page address.
Sebuah page address dapat di contohkan sebagai berikut :
2.3.4 Web Server
Web server adalah sebuah layanan internet yang telah disediakan oleh komputer.
Dalam memasukkan web yang telah dirancang dalam internet, maka terlebih dahulu memiliki ruangan dalam internet dan ruangan inilah disediakan oleh server.
Web server juga merupakan sebuah perangkat komputer yang digunakan untuk
mengakses segala jenis file yang terdapat pada halaman web melalui HTTP/HTTPS dengan menggunakan web browser dan mengirimkan kembali hasil permintaannya dalam bentuk halaman – halaman web yang berbentuk dokumen HTML.
(29)
2.4 HTML (Hypertext Markup Language)
HTML (Hypertext Markup Language) yaitu bahasa pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web browser. HTML dapat juga digunakan sebagai link link antara file-file dalam situs atau dalam komputer dengan menggunakan localhost, atau link yang menghubungkan antar situs dalam dunia
Untuk dapat menghasiilkan tampilan wujud yang terintegrasi, format
hiperteks sederhana ditulis dalam berkas format ASCII sehingga menjadi halaman web dengan perintah-perintah HTML.
Ada beberapa versi dalam HTML, yaitu :
a.
b.
c.
d.
e.
f.
Disini penulis menggunakan versi HTML 5.
(30)
Dokumen HTML adalah teks murni yang dibuat menggunakan editor teks. Dokumen HTML merupakan dokumen yang disajikan dalam web surfer. Dokumen pada umumnya berisi informasi atau interface aplikasi dalam internet.
Penamaan dokumen HTML pada beberapa sistem operasi bersifat case
sensitive (membedakan huruf kapital dan biasa). Nama dokumen yang sama tapi
dituliskan dengancase yang berbeda akan dianggap menjadi dokumen yang berbeda, misalnya “file.html” berbeda dengan “FILE.html” dan sebagainya.
Dokumen HTML mirip dengan dokumen tulisan biasa, hanya dalam dokumen ini sebuah tulisan bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan tag tertentu.
2.4.2 Tag dan Elemen Dalam HTML
Tag adalah teks atau disebut dengan istilah script yang ditulis diantara tanda < dan >. Tag berfungsi untuk menentukan bagaimana sebuah web akan dibuat. Dengan kata lain tag mengontrol bentuk teks, paragraf, tabel dan banyak lagi.
Elemen merupakan istilah untuk komponen dasar pembentuk HTML5. Nama elemen ditunjukkan dengan tag. Suatu elemen harus ditandai dengan tag yang berpasangan, namun ada beberapa elemen yang tidak mengharuskan tag nya ditulis secara berpasangan. Contohnya :
(31)
b. Ganti garis - break time dengan tag<br>. c. Ganti datar - horizontal dengan tag<hr>. d. List item dengan tag<li>.
Pada penulisan script HTML5 dimulai dengan menentikan tipe dokumen lewat tag :
<!DOCTYPE HTML>
Fungsi Document Type diatas untuk menginformasikan kepada browser jenis dokumen yang akan dibuat yaitu dokumen HTML, secara spesifik adalah HTML5.
Struktur script dasar adalah menulis tag diawal sebagai berikut : <html>
<head> <body>
Selanjutnya bisa menulis materi yang akan ditampilkan dalam jendela browser dengan tag <p>. Kemudian tutup script dengan mengetik tag penutup untuk body dan html :
</body> </head> </html>
Tag <head> .... </head> ditulis sebelum body memiliki fungsi spesifik,
yaitu mencantumkan informasi yang secara umum tidak diletakkan dalam desain
web secara langsung. Dan tag <title> .... </title> fungsinya untuk menulis judul
(32)
Berikut adalah contoh susunan script sederhana <!DOCTYPE>
<html> <head>
<title> ... tugas akhir d3 MIPA USU </title>
</head> <body>
<h1> TUGAS AKHIR </h1>
<p> ini adalah contoh script sederhana </body>
(33)
Hasil dokumen HTML5 yang ditampilkan ditampilan Mozila Firefox sebagai berikut :
Gambar 2.1 Dokumen HTML5 ditampilkan pada jendela browser Mozila Firefox
2.5 PHP (Hypertext Preprocessor)
PHP adalah singkatan dari "PHP: Hypertext Preprocessor", yang merupakan sebuah bahasa scripting yang terpasang pada HTML. Sebagian besar sintaks mirip dengan bahasa C, Java dan Perl, ditambah beberapa fungsi PHP yang spesifik.
(34)
Tujuan utama penggunaan bahasa ini adalah untuk memungkinkan perancang web menulis halaman web dinamik degan cepat.
2.5.1 Sejarah PHP
PHP pertama kali dibuat oleh Rasmus Lerdroft, seorang programmer C. Semula PHP digunakannya untuk menghitung jumlah pengunjung di dalam
webnya. Kemudian ia mengeluarkan Personal Home Page Tools versi 1.0 secara
gratis. Versi ini pertama kali keluar pada tahun 1995. Isinya adalah sekumpulan script PERL yang dibuatnya untuk membuat halaman webnya menjadi dinamis. Kemudian pada tahun 1996 ia mengeluarkan PHP versi 2.0 yang kemampuannya telah dapat mengakses database dan dapat terintegrasi dengan HTML.
Pada tahun 1998 tepatnya pada tanggal 6 Juni 1998 keluarlah PHP versi 3.0 yang dikeluarkan oleh Rasmus sendiri bersama kelompok pengembang softwarenya.Versi terbaru, yaitu PHP 4.0 keluar pada tanggal 22 Mei 2000 merupakan versi yang lebih lengkap lagi dibandingkan dengan versi sebelumnya.
Perubahan yang paling mendasar pada PHP 4.0 adalah terintegrasinya Zend Engine yang dibuat oleh Zend Suraski dan Andi Gutmans yang merupakan penyempurnaan dari PHP scripting engine. Yang lainnya adalah build in HTTP session, tidak lagi menggunakan library tambahan seperti pada PHP. Tujuan dari bahasa scripting ini adalah untuk membuat aplikasi-aplikasi yang dijalankan di atas teknologi web.
(35)
Dalam hal ini, aplikasi pada umumnya akan memberikan hasil pada web
browser, tetapi prosesnya secara keseluruhan dijalankan web server.
Seluruh aplikasi berbasis web dapat dibuat dengan PHP. Namun kekuatan yang paling utama PHP adalah pada konektivitasnya dengan system database di dalam web. Sistem database yang dapat didukung oleh PHP adalah :
1. Oracle 2. MySQL 3. Sybase 4. PostgreSQL 5. Dan lainnya
PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995. Pada waktu itu PHP bernama FI (Form Interpreted). Pada saat tersebut PHP adalah sekumpulan script yang digunakan untuk mengolah data form dari web.
Perkembangan selanjutnya adalah Rasmus melepaskan kode sumber tersebut dan menamakannya PHP/FI, pada saat tersebut kepanjangan dari PHP/FI adalah Personal HomePage/Form Interpreter. Dengan pelepasan kode sumber ini menjadi open source, maka banyak programmer yang tertarik untuk ikut mengembangkan PHP.
(36)
Pada November 1997, dirilis PHP/FI 2.0. Pada rilis ini interpreter sudah diimplementasikan dalam C. Dalam rilis ini disertakan juga modul-modul ekstensi yang meningkatkan kemampuan PHP/FI secara signifikan.
Pada tahun 1997, sebuah perusahaan bernama Zend, menulis ulang interpreter PHP menjadi lebih bersih, lebih baik dan lebih cepat. Kemudian pada Juni 1998 perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan nama rilis tersebut menjadi PHP 3.0.
Pada pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling banyak dipakai. Versi ini banyak dipakai sebab versi ini mampu dipakai untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan proses dan stabilitas yang tinggi.
Pada Juni 2004, Zend merilis PHP 5.0. Versi ini adalah versi mutakhir dari PHP. Dalam versi ini, inti dari interpreter PHP mengalami perubahan besar. Dalam versi ini juga dikenalkan model pemrograman berorientasi objek baru untuk menjawab perkembangan bahas pemrograman kearah pemrograman berorientasi objek.
2.5.2 Hubungan PHP Dengan HTML
Halaman web biasanya disusun dari script html yang disimpan dalam sebuah file berekstensi .html. File html ini dikirimkan oleh server (atau file) ke browser,
(37)
Kemudian browser menerjemahkan script tersebut sehingga menghasilkan suatu tampilan yang indah. Lain halnya dengan program php, program ini harus diterjemahkan oleh web server sehingga menghasilkan kode html yang dikirim ke
browser agar dapat ditampilkan.
Program ini dapat berdiri sendiri ataupun disisipkan di antara script html sehingga dapat langsung ditampilkan bersama dengan script HTML tersebut.
Program php dapat ditambahkan dengan mengapit program tersebut di antara tanda. Tanda-tanda tersebut biasanya disebut tanda untuk escaping (kabur) dari script html. File html yang telah dibubuhi program php harus diganti ekstensi nya menjadi .php3 atau php.
PHP merupakan bahasa pemograman web yang bersifat server-side HTML=embedded scripting, di mana script nya menyatu dengan HTML dan berada si server. Artinya adalah sintaks dan perintah-perintah yang kita berikan akan sepenuhnya dijalankan di server tetapi disertakan HTML biasa. PHP dikenal sebagai bahasa scripting yang menyatu dengan tag HTML, dieksekusi di server dan digunakan untuk membuat halaman web yang dinamis seperti ASP (Active
Server Pages) dan JSP (Java Server Pages).
2.5.3 Kelebihan PHP
Ketika teknologi komunikasi semakin berkembang, situs-situs yang statispun semakin ditinggalkan, karena dianggap sudah tidak memenuhi keinginan pasar.
(38)
Padahal situs tersebut harus tetap dinamis. Pada saat ini bahasa PERL dan CGI sudah jauh ketinggalan jaman sehingga sebagian besar designer web banyak beralih ke bahasa server-side scripting yang lebih dinamis seperti PHP.
Pemrograman kearah pemrograman berorientasi objek. Kelebihan PHP dari bahasa pemrograman lain
a. Bahasa pemrograman php adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya.
b. Web server yang mendukung php dapat ditemukan dimana - mana dari
mulai IIS sampai dengan apache, dengan konfigurasi yang relatif mudah. c. Dalam sisi pengembangan lebih mudah, karena banyaknya milis - milis dan
developer yang siap membantu dalam pengembangan
d. Dalam sisi pemahamanan, php adalah bahasa scripting yang paling mudah karena referensi yang banyak.
e. PHP adalah bahasa open source yang dapat digunakan di berbagai mesin (linux, unix, windows) dan dapat dijalankan secara runtime melalui perangkat serta juga dapat menjalankan perintah-perintah sistem.
2.6 CSS (Cassading Style-Sheet)
CSS (Cascading Style-Sheet) adalah sebuah pengembangan atas script HTML yang sudah ada sebelumnya. Dengan CSS, kita bisa menentukan sebuah struktur dasar
(39)
halaman web secara lebih mudah dan cepat, serta irit ukuran. CSS juga membantu kita untuk menyeragamkan seluruh halaman web dengan tampilan yang konsisten.
Misalnya, kita mau seluruh hurufyang ada di web kita adalah huruf "Tahoma", maka dengan bantuan CSS kita bisa bikin proses itu menjadi otomatis tanpa harus mengganti-ganti huruf secara manual di setiap halaman.
Sebelum CSS menjadi standar untuk mendesain halaman web seperti sekarang, halaman web di desain menggunakan <table>. Terlebih dahulu pengerjaan desain, dalam format .psd atau jpeg, lalu di slice atau di potong potong menjadi bagian – bagian terpisah. Kemudian pembuatan tabel dengan ukuran yang sesuai, lalu desain tadi di “tempel” pada table sebagai image yang melekat pada tabel, atau sebagai background. Kelemahan dari cara seperti ini adalah, halaman
web menjadi berat karena kolom – kolom penyusun table <tr> dan <td> diberi
tambahan atribut image source. Side effect dari hal ini adalah halaman web menjadi padat dan tidak SEO friendly.
Pada perkembangannya CSS sudah masuk lelvel 3 untuk sekarang, dimana dimulai CSS level 1 atau yang sering di sebut CSS aja, kemudian level 2 yang merupakan penyempurnaan dari CSS level sebelumnya, yaitu CSS level 1.
CSS merupakan alternatif bahasa pemrograman web masa yang akan datang, dimana mempunyai banyak keuntungan, diantaranya :
a. Ukuran file lebih kecil b. Load file lebih cepat
(40)
d. Pasangan setia XHTML
e. Menghemat pekerjaan tentunya, dimana hanya membuat 1 halaman CSS. f. Mudah mengganti-ganti tampilan dengan hanya merubah file CSS saja.
2.6.1 Sejarah CSS
Pada tanggal 17 Agustus 1996, World Wide Web Consortium (W3C) menjadikan CSS sebagai bahasa pemrograman standart dalam pembuatan dokumen web. Tujuannya adalah mengurangi pembuatan tag-tag baru oleh Netscape dan Internet Explorer, karena kedua kedua browser pada saat itu bersaing mengembangkan TAG sendiri untuk mengatur tampilan web.
CSS level 1 mendukung pengaturan tampilan dalam hal: a. Huruf (jenis, ketebalan)
b. Warna, teks, backgrounf dan elemen lainnya
c. Text attributes, misalnya spasi antar baris, kata dan huruf d. Posisi teks, gambar, table dan elemen lainnya
e. Marjin, border dan padding.
Selanjutnya di tahun 1998, W3c menyempurnakan CSS awal dengan menciptakan standar CSS2 (CSS level 2) yang menjadi standar hingga saat ini. Pada CSS level 2 ini, di masukkan semua atribut dari CSS1, serta diperluas dengan penekanan pada Internasional accessibility and capability khususnya media-specific CSS. Bahkan pada tahun 2000, tidak lama setelah CSS2 di implementasikan. CSS2 ini sampai sekarang masih terus dikembangkan, spesifikasinya dibagi pada beberapa topik atau modul.
(41)
Adapun kelebihan dengan menggunakan CSS adalah sebagai berikut :
a. Halaman web menjadi tidak padat, hingga halaman web menjadi SEO friendly b. Dapat dengan mudah mengganti tampilan web dengan cukup mengganti nilai dan
definisi pada pada satu file CSS saja.
2.7 MySQL
MySQL adalah satu perangkat lunak sistem pengola basis data (Database Management System). MySQL juga dapat dikategorikan sebagai Relation Database Management System (RDBMS). Karena dalam pembuatan basis data pada MySQL
dapat dibedakan dalam berbagai tabel dua dimensi. Setiap tabel pada MySQL terdiri atas lajur horizontal dan lajur vertikal.
MySQL pada saat ini banyak digunakan oleh pemrograman web untuk
membangun situs yang memerlukan basis data sebagai data dan pengolahan data. Untuk keperluan menampung data dalam server haruslah diperlukan database.
MySQL merupakan sebuah program aplikasi untuk membuat database yang umum
digunakan pada web server. MySQL banyak digunakan karena kemampuannya dalam menampung data yang cukup besar dan proses yang cepat dalam memanggil data.
(42)
2.8 Sistem Informasi
Sistem adalah suatu jaringan kerja dari prosedur-prosedur yang saling berhubungan, berkumpul bersama-sama untuk melakukan suatu kegiatan atau untuk menyelesaikan suatu sasaran yang tertentu. Sistem adalah kumpulan dari elemen-elemen yang berinteraksi untuk mencapai suatu tujuan tertentu.
Informasi merupakan hal yang sangat vital dalam suatu organisasi. Jika informasi tesebut dapat memberikan arti bagi penerimanya, maka informasi itu mempengaruhi suatu keputusan yang telah diambil sebelumnya sehingga dapat memberi suatu nilai tertentu, mengemukakan bahwa informasi adalah data yang telah diolah menjadi bentuk yang lebih berguna bagi penerimanya dan bermanfaat dalam mengambil keputusan baik saat ini atau mendatang.
Informasi adalah data yang diolah menjadi bentuk yang lebih berarti dan lebih berguna bagi yang menerimanya. Sumber informasi adalah data. Data merupakan bentuk jamak dari bentuk tunggal datim atau data item. Data adalah kenyataan yang menggambarkan suatu kejadian-kejadian dan kesatuan nyata. Kejadian (event) adalah suatu yang terjadi pada saat tertentu. Kesatuan nyata merupakan objek nyata seperti tempat, benda, orang dan lain sebagainya yang betul-betul ada dan terjadi.
Data diolah melalui suatu model yang disebut siklus informasi atau siklus pengolahan. Data yang diolah atau diproses yang akan menghasilkan keluaran berupa
(43)
informasi, informasi tersebut akan menjadi input bagi proses berikutnya dan seterusnya lagi terus berputar.
Sistem informasi adalah suatu sistem atau tatanan kerja buatan manusia yang secara umum terdiri atas sekumpulan komponen berbasis komputer dan manual yang dibuat untuk menghimpun, menyimpan, dan mengelola data serta menyediakan informasi keluaran kepada para pemakai.
Adapun yang harus diperhatikan dalam membuat sistem informasi adalah sebagai berikut :
1. Kualitas Informasi
a. Akurat berarti informasi harus bebas dari kesalahan dan tidak menyesatkan. Informasi harus akurat dari sumber informasi sampai ke penerima informasi. b. Tepat pada waktunya, artinya informasi yang datang pada penerima tidak boleh
terlambat, informasi yang sudah usang tidak mempunyai nilai lagi dan bila informasi terlambat akan dapat menimbulkan masalah dalam organisasi.
c. Relevan berarti informasi tersebut mempunyai manfaat untuk pemakainya. Relevansinya informasi untuk tiap-tiap orang, satu dengan yang lainnya berbeda.
2. Informasi dalam ruang lingkup sistem informasi memiliki beberapa ciri yaitu sebagai berikut :
a. Benar atau salah, ini dapat berhubungan dengan realita atau tidak. b. Baru, informasi dapat sama sekali baru dan segar bagi penerimanya.
(44)
c. Tambahan, informasi dapat mempengaruhi atau memberikan tambahan baru pada informasi yang telah ada.
d. Korektif, informasi dapat menjadi suatu koreksi dan informasi salah atau palsu sebelumnya.
e. Penegas, informasi dapat mempertegas informasi yang telah ada.
Dalam berbagai literature manajemen, terkandung suatu pengertian informasi yang sasaran akhirnya adalah untuk pengambilan keputusan. Penggunaan informasi diharapkan akan menambah pengetahuan bagi yang menggunakannya. Namun demikian tidak selamanya bahwa pengguna informasi akan mengakibatkan suatu pilihan mutlak.
3. Nilai Informasi
Nilai dari informasi (Value of Information) ditentukan dari dua hal, yaitu manfaat dan biaya mendapatkannya. Suatu informasi dikatakan bernilai bila manfaatnya lebih efektif dibandingkan dengan biaya mendapatkannya. Akan tetapi perlu diperhatikan dalam informasi, umumnya dapat digunakan untuk beberapa kegunaan. Sehingga tidak memungkinkan untuk menghubungkan suatu bagian informasi pada suatu masalah yang tertentu dengan biaya untuk memperolehnya, karena sebagian informasi dinikmati tidak hanya oleh satu pihak dalam perusahaan. Lebih lanjut sebagian informasi tidak dapat ditaksir keuntungannya dengan satuan nilai uang, tetapi ditaksir efektivitasnya.
(45)
(46)
BAB 3
GABARAN SEKILAS TENTANG
INTER CLUB INDONESIA
KORDINATOR DAERAH PROVINSI SUMATERA UTARA
3.1 Latar Belakang Inter Club Indonesia Kordinator Daerah Sumatera Utara
ICI adalah organisasi pendukung klub sepakbola FC Internazionale di Italia yang beraffiliasi dan tunduk pada regulasi serta peraturan- peraturan yang dikeluarkan oleh CCIC (Centro Coordinamento Inter Club).
Organisasi Inter Club Indonesia disingkat ICI yang didirikan pada tanggal 24 Agustus di Jakarta. Pengurus pusat ICI berkedudukan di Jakarta dan pengurus regional berkedudukan di setiap wilayah Provinsi/Kabupaten/ Kotamadya di Indonesia, kecuali dalam kondisi tertentu yang diputuskan oleh Pengurus Pusat.
Inter Club Indonesia Kordinator Daerah Sumatera Utara dibentuk agar mempermudah mengkordinasi Organisasi ICI yang berada di daerah Sumatera Utara. Pengurus Inter Club Indonesia Kordinator Daerah Sumatera Utara berkedudukan di Kota Medan, Sumatera Utara.
3.2 Azaz, Sifat, Tujuan, Tugas Pokok dan Fungsi Inter Club Indonesia Kordinator Daerah Sumatera Utara
Inter Club Indonesia berazaskan “kebersamaan, kekeluargaan dan anti kekerasan” dengan bersifat “independen, profesional, demokratis dan bertanggung jawab”.
(47)
Inter Club Indonesia Kordinator Daerah Sumatera Utaradidirikan dengan tujuan untuk menjadi wadah resmi dan ajang silaturahmi bagi para pendukung FC
Internazionale yang ada di wilayah Sumatera Utara.
Inter Club Indonesia Kordinator Daerah Sumatera Utara mempunyai tugas pokok sebagai berikut :
1. Membina dan mengayomi seluruh anggota untuk menjadi pendukung yang profesional, anti kekerasan, dan menjunjung tinggi perdamaian antar
pendukung.
2. Memberikan kesempatan yang sama kepada setiap anggota untuk mengembangkan karier organisasi sesuai dengan kemampuan masing-masing.
Di dalam melaksanakan tugas pokok, Inter Club Indonesia Kordinator Daerah Sumatera Utara mempunyai fungsi sebagai berikut :
1. Sebagai sarana penampung dan penyalur aspirasi para anggota.
2. Sebagai penyelenggara kegiatan dalam rangka mendukung FC Internazionale di Sumatera Utara.
(48)
3.3 Kepengurusan dan Kegiatan Inter Club Indonesia Kordinator Daerah Sumatera Utara
Kepengurusaan Inter Club Indonesia Kordinator Daerah Sumatera Utara dipilih dari dan oleh anggota melalui mekanisme musyawarah pembentukan kepengurusan di Sumatera Utara. Setiap yang dapat dipilih menjadi pengurus Inter Club Indonesia Kordinator Daerah Sumatera Utaraadalah anggota ICI Moratti yang memenuhi syarat sebagai berikut:
1. Bersedia menjadi pengurus tanpa imbalan / pamrih apapun. 2. Memiliki kemauan dan kemampuan mengelola organisasi. 3. Bertanggung jawab serta mau bekerja keras.
Inter Club Indonesia Kordinator Daerah Sumatera Utara menyelenggarakan kegiatan yang terdiri dari:
1. Kegiatan rutin keanggotaan.
(49)
BAB 4
PERANCANGAN SISTEM
4.1 Analisis Sistem
Analisis sistem bertujuan untuk mengidentifkasi jalannya suatu sistem dan permasalahan – permasalahan yang terjadi pada sistem yang dibuat, yang meliputi perangkat keras (Hardware), perangkat lunak (Software), dan pengguna (Brainware). Analisis sistem dibutuhkan sebagai tahapan dasar perancangan sistem yang bekerja, yaitu meliputi pembahasan desain, deskripsi sistem, rancangan umum, spesifikasi kebutuhan, dan perancangan basis data (RED).
4.2 Perancangan Sistem
Perancangan merupakan proses setelah analisis dari siklus pengembangan sistem, pendefenisian dari kebutuhan – kebutuhan fungsional, persiapan untuk merancang implementasi, menggambarkan bagaimana suatu sistem dibentuk yang dapat berupa penggambaran, perancangan dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah kedalam satu kesatuan yang utuh dan berfungsi mengkonfigurasikan perangkat lunak dan perangkat keras dari suatu sistem.
(50)
Dalam hal ini, sistem yang akan penulis rancang adalah dengan menggunakan PHP dan HTML sebagai bahasa pemogramannya dan MySQL sebagai database nya serta Sublime Textsebagai media untuk merancang bahasa program dari sistem inforamsi berbasis web ini.
Adapun spesifikasi serta target terhadap sistem yang akan dibuat yaitu :
1. Perancangan yang akan dibuat yaitu “Perancangan Sistem Informasi Inter Club
Indonesia Kordinator Daerah Sumatera Utara Berbasis Web”. Yang
menyediakan informasi-informasi yang berkaitan dengan FC. Internazionale dan Inter Club Indonesia.
2. Target yang ingin dicapai dalam perancangan sistem informasi berbasis web ini adalah diharapkan sebagai media ataupun wadah untuk mempermudah member Inter Club Indonesia yang berada dalam naungan ataupun diluar naungan Kordinator Daerah Sumatera Utara dalam pengaksesan informasi serta data – data yang dibutuhkan member Inter Club Indonesia.
4.3 Metode Pengembangan Sistem
Dalam pembuatan tugas akhir ini, penulis menggunakan metode yang terdiri dari :
1. Studi Kelayakan
Studi kelayakan adalah studi awal untuk memeriksa kebutuhan informasi calon pengguna akhir dan tujuannya, batasan, kebutuhan sumber daya, biaya, manfaat, dan kelayakan dari proyek yang diusulkan.
(51)
2. Rencana Pendahuluan
Yaitu menentukan lingkup sistem yang akan ditangani.
3. Analisi Sistem
Penguraian dari suatu sistem informasi yang utuh ke dalam bagian – bagian komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan – permasalahan, kesempatan – kesempatan, hambatan – hambatan yang terjadi dan kebutuhan – kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan – perbaikan.
4. Perancangan Sistem
Pendefenisian dari kebutuhan – kebutuhan fungsional, persiapan untuk merancang bangun implementasi, menggambarkan bagaimana suatu sistem dibentuk serta mengkonfigurasikan komponen – komponen perangkat lunak dan perangkat keras dari sistem.
5. Implementasi Sistem
Tahap untuk meletakkan sistem supaya siap untuk dijalankan.
4.4 Metode Perancangan
Metode perancangan sistem ini menggunakan metode pendekatan atas-bawah (top
and down approach). Perancangan ini dimulai dari bentuk yang luas yaitu diagram
(52)
4.4.1 Pembuatan Diagram Alir (Flowchart)
Dengan adanya flowchart, akan sangat membantu untuk memvisualisasikan isi dari setiap halaman dan navigasi antara halaman tersebut. Secara sederhana
flowchart keseluruhan web ini dapat dilihat sebagai berikut :
Keterangan :
(53)
Keterangan :
B = Tampilan Home F = Tampilan Galeri C = Tampilan Berita G = Tampilan Toko D = Tampilan Inter H = Tampilan Forum E = Tampilan ICI PROVSU I = Tampilan Kontak
(54)
(55)
(56)
(57)
(58)
Gambar 4.1 FlowchartPerancangan Website Inter Club Indonesia Kordinator Daerah Sumatera Utara
(59)
Gambar 4.2 Flowchart User
Login
Login
Logout
Halaman UtamaInput Username dan Pasword
(60)
Gambar 4.3 Flowchart Admin
4.4.2 Diagram Konteks (Contex Diagram)
Diagram Kontek (Contex Diagram) adalah diagram level tertinggi dari DFD yang menggambarkan hubungan sistem dengan sistem dengan lingkungan luar web.
Data flow Diagram (DFD) merupakan model dari sistem untuk menggambarkan
pembagian sistem ke modul yang lebih kecil. Salah satu keuntungan menggunakan Login
Login
Logout
Halaman AdminInput Username dan Pasword
(61)
diagram alir data adalah memudahkan pemakai yang kurang menguasai bidang komputer untuk mengerti sistem yang akan dikerjakan. Pada tahap analisa, penanganan notasi simbol lingkaran dan anak panah menggambarkan arus data dalam perancangan sistem sangat membantu dalam komunikasi dengan pemakaian sistem menggunakan notasi-notasi untuk menggambarkan arus dari data sistem. Berikut ini adalah gambar DFD level 0 dan DFD level 1 yang merupakan perincian dari diagram konteks.
Disamping itu DFD adalah salah satu alat pembuatan model yang sering digunakan, khususnya bila fungsi-fungsi sistem merupakan bagian yang lebih penting dan kompleks dari pada data yang dimanipulasi oleh sistem.
(62)
Gambar 4.4 Diagram Konteks Perancangan Sistem InformasiInter Club Indonesia Kordinator Daerah Sumatera Utara Berbasis Web
(63)
(64)
(65)
(66)
(67)
(68)
(69)
(70)
(71)
4.4.3 Entity Relationship Diagram (ERD)
Entity Relationship Diagram (ERD) adalah suatu model untuk menjelaskan hubungan antar data dalam basis data (database) berdasarkan objek-objek dasar data yang mempunyai hubungan antar relasi.
Gambar 4.13 ERD News
Gambar 4.14 ERD Pertandingan
News Tanggal
Isi Id
Gambar Judul
(72)
Gambar 4.15 ERD ICIPROVSU
Gambar 4.16 ERD Gallery
(73)
Gambar 4.18 ERD Forum
(74)
Gambar 4.20 ERD Admin dan User
4.5 Tabel Database
Database digunakan untuk tempat penyimpanan data yang di masukkan atau diinput. Kemudian data tersebut akan ditampilkan dalam website. Berikut tabel database Website Pemerintahan Desa Firdaus Kecamatan Sei Rampah.
Nama Field Tipe Data Ukuran Keterangan
id Int 9 Id Berita
isi Text Text Isi Berita
judul Text Text Judul Berita
(75)
gambar Varchar 50 Gambar Berita
status Varchar 50 Status Berita
Tabel 4.1 Tabel Database News
Nama Filed Tipe Data Ukuran Keterangan
id Int 3 Id Pertandingan
gambar Text Text Gambar Pertandingan
hari Text Text Tanggal Pertandingan
jam Text Text Waktu Pertandingan
des Text Text Deskripsi Pertandingan
cup Varchar 20 Kejuaraan Pertandingan
skor Varchar 10 Skor Pertandingan
tanggal Text Text Waktu Update
status Varchar 50 Status Pertandingan
4.2 Tabel Database Pertandingan
Nama Field Tipe Data Ukuran Keterangan
id Int 10 Id Regional
regional Varchar 50 Nama Regional
agenda Text Text AgendaRegional
pengurus Text Text Pengurus Regional
kontak Text Text Kontak Regional
(76)
waktu Timestamp Timestamp (on update) Tanggal Update
Tabel 4.3 Tabel Database ICIPROVSU (Regional)
Nama Field Tipe Data Ukuran Keterangan
id Int 3 Id Gambar
gambar Text Text Gambar
des Text Text Deskripsi Gambar
waktu Timestamp Timestamp (on
update)
Taggal Update
(77)
Nama Field Tipe Data Ukuran Keterangan
idbrg Int 3 Id Produk
tgl Timestamp Timestamp (on
update)
Tanggal Update
namabrg Varchar 50 Nama Produk
spek Text Text Spesifikasi Produk
hargabrg Int 7 Harga Produk
stok Int 2 Stok Produk
gambar Varchar 225 Gambar Produk
status Varchar 50 Status Produk
Tabel 4.5 Tabel Database Produk
Nama Field Tipe Data Ukuran Keterangan
id_topik Int 5 Id Topik
nama Varchar 50 Nama User
avatar Varchar 50 Avatar User
topik Varchar 255 Topik Forum
isi Text Text Isi Topik
id_reply Int 5 Id Reply
waktu Timestamp Timestamp (on
update)
Tanggal Update
nama_reply Varchar 20 Nama Reply
(78)
Nama Field Tipe Data Ukuran Keterangan
id Int 3 Id Pesan
waktu Timestamp Timestamp (on
update)
Tanggal Update
nama Varchar 255 Nama User/Guest
email Varchar 255 Email User/Guest
pesan Varchar 255 Isi Pesan
avatar Text Text Avatar User
status Text Text Status User/Guest
username Text Text Username User
(79)
(80)
BAB 5
IMPLEMENTASI SISTEM
5.1 Pengertian Implementasi Sistem
Implementasi sistem adalah prosedur yang dilakukan untuk menyelesaikan desain sistem supaya siap untuk dioperasikan, termasuk juga menulis kode program jika tidak digunakan perangkat lunak seperti aplikasi.
5.1.1 Tujuan Implementasi Sistem
Adapun tujuan – tujuan dari implementasi sistem, yaitu :
a. mengkaji rangkaian sistem baik dari segi software maupun hardware sebagai sarana penyaji informasi.
b. Menyelesaikan rancangan sistem yang ada dalam dokumen sistem yang baru atau yang telah disetujui.
c. Memastikan bahwa pengunjung dapat mengoperasikan dengan mudah terhadap sistem yang baru dan mendapat informasi yang baik dan jelas.
d. Mempethitungkan bahwa sistem telah memenuhi permintaan pemakai, yaitu dengan menguji sistem secara menyeluruh.
(81)
e. Memastikan bahwa sistem telah berjalan dengan lancar dengan mengontrol dan melakukan instalasi secara benar.
5.2 Komponen Pada Sistem
Beberapa komponen yang sangat dibutuhkan pada perancangan web ini antara lain :
5.2.1 Hardware
Hardware merupakan komponen yang membantu menunjang terlaksananya sitem
yang dirancang. Dalam hal ini penulis merinci komponen hardware yang digunakan dalam perancangan, yaitu :
a. Personal Computer dengan Processor AMD E-350 APU with Radeon(tm) HD Graphic (2 CPUs), `1.6GHz
b. Hard Disk 298 GB
c. Memory 2048MB RAM
5.2.2 Software
Software sangat berhubungan dengan Hardware. Tanpa adanya software, Hardware tidak akan berfungsi sesuai dengan yang diharapkan. Adapun software
(82)
a. Operasi Windows 8 Pro 32-bit (6.2, Build 9200)
Gambar 5.1 Windows 8 Pro
b. Sublime Text 2
Software ini berfungsi sebagai teks editor dalam pembuatan script perancangan website.
Gambar 5.2 Sublime Text 2
(83)
XAMPP digunakan sebagai web server, PHP sebagai bahasa pemrograman dan MySQL sebagai databasenya.
Gambar 5.3 XAMPP Control Panel
(84)
d. Adobe Photoshop CS3 Extended
Adobe Photohsop digunakan sebagai desain gambar atau pun objek yang berjenis image yang dibutuhkan untuk kebutuhan website.
Gambar 5.5Adobe Photoshop CS3 Extended
5.2.3 Brainware
Brainware adalah setiap orang yang terlibat dalam kegiatan pemanfaatan komputer
atau sistem pengolahan. Brainware juga dapat diartikan sebagai perangkat intelektual yang mengoperasikan kemampuan dari hardware dan juga software komputer. Brainware yang dibutuhkan adalah administrator dan pengguna (user). Administrator dibutuhkan untuk bekerja pada server dalam pengolahan data
website dan mengeri tentang bahas pemrogramannya. Sedangkan pengguna (user)
tidak harus memiiki kemampuan khusus, hanya saja mampu menggunakan internet serta browsing.
(85)
5.3 Uji Program
Dari hasil uji program yang telah dilakukan, maka dapat dilihat tampilan hasil desain web dinamis pada website Inter Club Indonesia Kordinator Daerah Sumatera Utara, sebagai berikut :
(86)
Tampilan 5.7 Tampilan HalamanHome
Gambar 5.8 Tampilan Halaman News
(87)
Gambar 5.10 Tampilan Halaman ICIPROVSU
(88)
Gambar 5.12 Tampilan Halaman Store
(89)
Gambar 5.14 Tampilan Halaman Contact
(90)
(91)
BAB 6
KESIMPULAN DAN SARAN
6.1 Kesimpulan
Berdasarkan pembahasan pada bab-bab sebelumnya, maka pada bab ini yang merupakan bab terakhir dari tugas akhir , penulis akan mencoba menarik kesimpulan yakni sebagai berikut :
1. Aplikasi berbasis web dapat menjadi alternative pilihan sebagian besar masyarakat yang ingin mencari barang ataupun informasi yang sebelumnya menghabiskan waktu, tenaga, dan uang.
2. Setiap fans Internazionale di daerah manapun di Indonesia khususnya di Sumatera Utara, dengan adanya website ini semakin mempermudah dalam mendapatkan informasi, berbelanja merchandise, dan berdiskusi seputar Internazionale.
3. Dengan menggunakan internet, penyampaian informasi dapat lebih luas tersebar diberbagai wilayah dan lebih mudah untuk mengaksesnya.
4. Dengan menggunakan Bahasa pemrograman PHP dan MySQL sebagai sistem database-nya, dapat dibuat sebuah website yang sederhana dan sebagai media penyampaian informasi bagi Inter Club Indonesia Kordinator Daerah Sumatera Utara.
5. Penyajian informasi yang baik dapat dilakukan dengan meng-update isi dari situs tersebut secara berkala dan sesuai dengan perkembangan.
(92)
6. Dengan menggunakan internet, penyampaian informasi dapat lebih mudah tersebar dan mudah dalam aksesnya.
6.2 Saran
Dalam mengakhiri penulisan Tugas Akhir ini penulis menguraikan beberapasaran, antara lain :
1. Data pada situs website seharusnya selalu di-update oleh admin secara berkala sesuai dengan perkembangan yang terjadi sekarang ini, sehingga dapat memberikan informasi yang update dan teraktual kepada masyarakat. 2. Diharapkan komputer yang digunakan sebagai serverwebsite ini adalah
komputer yang mempunyai spesifikasi yang tinggi, sehingga mempermudah dalam pengaksesan data dan sumber daya komputer kita. 3. Hendaklah pembuatan berkas cadangan secara berkala untuk mencegah
kemungkinan kehilangan atau kerusakan data yang telah tersimpan.
4. Adanya pengembangan website agar sistem informasi ini mendapat cakupan yang lebih luas dan perkembangan yang lebih baik.
5. Sebaiknya dalam pembuatan website digunakan program anvirus ataupun security yang resistant untuk mencegah terjadinya kerusakan pada program ataupun data.
(93)
KARTU BIMBINGAN TUGAS AKHIR MAHASISWA
Nama Mahasiswa : Rahmad Riwanda Siregar Nomor Induk Mahasiswa : 112406248
Judul Tugas akhir : PERANCANGAN SISTEM INFORMASI
INTER CLUB INDONESIA KORDINATOR DAERAH PROVINSI SUMATERA UTARA BERBASIS WEB Dosen Pembimbing : Dr. Syahriol Sitorus, M.IT
Tanggal Mulai Bimbingan : 3 September 2015 Tanggal Selesai Bimbingan : 5 Oktober 2015
No Tanggal Asisten Bimbingan
Pembahasan Pada Asistensi Mengenai, pada Bab
Paraf Dosen
Pembimbing Keterangan
1 3 September 2015 Bab 1
2 3 September 2015 Bab 2
3 3 September 2015 Bab 3
4 5 Oktober 2015 Bab 4
5 5 Oktober 2015 Bab 5 dan Bab 6 6 5 Oktober 2015 Pengujian Program
∗ Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan telah selesai.
Diketahui Disetujui
Ketua Prodi D3 Teknik Informatika Pembimbing Utama
Dr. Elly Rosmaini, M.Si
NIP. 196005201985032002 NIP. 197103101997031004
(94)
Hasil Uji Program Tugas Akhir
SURAT KETERANGAN
Yang bertanda tangan dibawah ini, menerangkan bahwa Mahasiswa Tugas Akhir Program Diploma 3 Teknik Informatika :
Nama : Rahmad Riwanda Siregar
Nim : 112406248
Program Studi : D-3 Teknik Informatika
Judul TA : Perancangan Sistem InformasiInter Club Indonesia Kordinator Daerah Provinsi Sumatera Utara Berbasis Web Telah melaksanakan tugas test program Tugas Akhir Mahasiswa tersebut di atas pada tanggal 5 Oktober 2015.
Dengan Hasil : Sukses / Gagal
Demikian diterangkan untuk melengkapi syarat pendaftaran Ujian Meja Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.
Medan, 5 Oktober 2015 Dosen Pembimbing
NIP. 197103101997031004 Dr.Syahriol Sitorus, M.IT
(95)
DAFTAR PUSTAKA
Agung, Gregorius, 2012, Buku Pintar HTML 5 + CSS3 + Dreamweaver CS6, PT Gramedia, Jakarta.
Ardana YM, Kusuma, 2012, Membuat Website 30 Juta Rupiah, Jasakom, Jakarta.
Destiyarto, Anggi, 2011, Cara Mudah Membuat Read More Artikel,
diakses pada 8 April 2015 ).
Keuntungan Punya Website
, diakses
tanggal 27 Oktober 2014).
Mardian, M., 2013, Pengertian Website dan Sejarah Website
Nugroho, Bunafit, 2008, Paduan Lengkap Menguasai Perintah SQL, mediakita, Jakarta.
Panduan Tatacara Penulisan Skripsi & Tugas Akhir.2008. Dokumen Nomor :
Akad/05/2005. Medan : Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara.
P as u n d an , P r ab u , 2 0 1 2 , M em b ua t Fo r u m S e d e r h a n a (P HP + My s q l ), sederhana-phpmysql.html , diakses pada tanggal 11 April 2015).
(96)
Pino, 2013, Membuat Halaman Dinamis Dengan PHP, pada 26 Maret 2015).
Qineu Blankeship, Said, 2013, Membuat Web Jual Beli dengan PHP,
Sunardi, 2014, Aplikasi Artikel Disertai Foto Dengan PHP,
Win S, Jemmy, 2009, Membuat Forum Sederhana PHP MYSQL,
(97)
Listing Program
conn.php (Koneksi Database) <?
ini_set('display_errors',FALSE); $host = "localhost";
$user = "root"; $pass = "";
$db = "iciprovsu"; $entries=10;
$koneksi=mysql_connect($host,$user,$pass); $database=mysql_select_db($db,$koneksi); date_default_timezone_set("Asia/Jakarta"); $tanggal=date('D, d-M-Y H:i:s');
mysql_connect($host, $user, $pass); mysql_select_db($db)
or die ("Koneksi Gagal : ".mysql_error()); ?> index.php <?php include "head.php" ?> <?php session_start(); setcookie("counter","visitor",time()+3600); ?> <?php include "isi.php" ?> isi.php (Halaman) <? error_reporting(0); $page=$_GET['page']; switch($page) { case "0"; include "welcome.php"; break; case "1"; include "home.php"; break; case "2"; include "news.php"; break; case "3"; include "inter.php"; break;
(98)
case "4"; include "view_beritaici.php"; break; case "5"; include "view-berita-inter.php"; break; case "6"; include "jadwal_sebelumnya.php"; break; case "7"; include "iciprovsu.php"; break; case "8"; include "galeri.php"; break; case "9"; include "store.php"; break; case "10"; include "e-transaksi.php"; break; case "11"; include "e-pemesanan.php"; break; case "12"; include "e-rincian.php"; break; case "13"; include "e-konfirmasi.php"; break; case "14"; include "pembayaran.php"; break; case "15"; include "forum.php"; break; case "16"; include "forum-view.php"; break; case "17"; include "forum-new.php"; break; case "18"; include "forum-reply.php"; break;
(99)
case "19"; include "contact.php"; break; case "20"; include "edit_profil.php"; break; case "21"; include "edit_bio.php"; break; case "22"; include "edit_pass.php"; break; default; include "welcome.php"; break; } ?>
home.php (Halaman Home) <style> body{ margin: 0; overflow-x: hidden; } </style> <body>
<? include "header.php"; ?> <? include "home-slide.php"; ?> <? include "home-text.php"; ?> <? include "footer.php"; ?> <? include "navigasi.php";?> </body> header.php <style> body{ margin: 0; } .at{
background:#222 url(images/bg2.jpg) repeat top left; box-shadow: 0 0 5px 2px rgba(0,0,0,.35);
height: 130px; margin: 0 auto; } #menu{ padding:10px 15px; text-decoration: none; color: #fff; font-size: 35px; font-family: dusthome; letter-spacing: 3;
(100)
margin-left: 100px;
text-shadow: 1px 3px 1px #000; } #menu img{ margin-bottom: -6px; margin-top: 45px; } #menu:hover{ color: #ccc; -webkit-transition:all 1s; -moz-transition:all 1s; transition:all 1s; } #masuk{ float: right; width: 20%; height: 45%; margin-top: 40px; } #log, #sig{
border: 1px solid #fff; height: 40px; width: 80px; margin-left: 10px; background: none; color: #fff; font-family: dusthome; cursor: pointer; border-radius: 5px; } #log:hover, #sig:hover{ background: rgba(256,256,256,0.1); -webkit-transition:all 1s; -moz-transition:all 1s; transition:all 1s; } </style> <body> <div class="at">
<a id="menu" href="index.php?page=1">
<img src="images/logo.png" height="40">ICIPROVSU </a> <?php error_reporting(0); if ($_SESSION['user_name']) { include "member.php"; }else{ ?> <div id="masuk">
<input id="log" TYPE="button" VALUE="LOGIN" onClick="location.replace('login2.php');">
<input id="sig" TYPE="button" VALUE="SIGNUP" onClick="location.replace('signup.php');"> </div> <? } ?> </div>
(1)
margin-left: 20px; margin-top: 20px; cursor: pointer;
-webkit-animation: moveLeft 1s ease-in-out 0.2s backwards; -moz-animation: moveLeft 1s ease-in-out 0.2s backwards; -o-animation: moveLeft 1s ease-in-out 0.2s backwards; -ms-animation: moveLeft 1s ease-in-out 0.2s backwards; animation: moveLeft 1s ease-in-out 0.2s backwards; }
nav a.slide-1{ width: 50%;
padding-top: 20px; padding-bottom: 20px;
background-image: url(images/admin/10.jpg); margin-left: 165px;
-webkit-animation: moveLeft 1s ease-in-out 0.2s backwards; -moz-animation: moveLeft 1s ease-in-out 0.2s backwards; -o-animation: moveLeft 1s ease-in-out 0.2s backwards; -ms-animation: moveLeft 1s ease-in-out 0.2s backwards; animation: moveLeft 1s ease-in-out 0.2s backwards; }
nav a.slide-2{ width: 50%;
padding-top: 20px; padding-bottom: 20px;
background-image: url(images/admin/10-1.jpg); margin-right: 165px;
right: 180px; margin-top: 120px;
-webkit-animation: moveRight 1s ease-in-out 0.2s backwards; -moz-animation: moveRight 1s ease-in-out 0.2s backwards; -o-animation: moveRight 1s ease-in-out 0.2s backwards; -ms-animation: moveRight 1s ease-in-out 0.2s backwards; animation: moveRight 1s ease-in-out 0.2s backwards; }
</style>
edit-contact.php <?
session_start();
if ($_SESSION['user_name'] == "admin") {
include "../include/conn.php"; ?>
<link rel="stylesheet" type="text/css" href="css/admin.css" />
<link rel="stylesheet" type="text/css" href="css/isi-admin.css" />
<link rel="stylesheet" type="text/css" href="css/edit.css" /> <link rel="stylesheet" type="text/css"
href="../css/menu/page.css" /> <body>
(2)
<?include"menu-atas.php";?> <div class="menu">
<h2>CONTACT</h2>
<a href="index.php?page=23" class="cn-back">Back</a>
<div class="cn-content"> <?
$query = mysql_query("SELECT * FROM contact ");
while($show=mysql_fetch_array($query)):
?>
<table align="center" width="90%"> <tr>
<td id="judul" align="center">
<img class='pop' src='../images/icons/homebase.png' height='30' width="50"><br>
<font size="1" color="#ccc" face="Verdana">HOMEBASE</font>
</td>
<td id="judul" width="60%">
<font size="2" color="#fff" face="Verdana"><? echo $show['homebase'] ?></font>
</td>
<td id="judul" align="center" width="10%">
<a href="update-contact.php?action=homebase&alamat=<? echo $show['homebase'] ?>" style='text-decoration:none'>
<img src="../images/icons/edit-2.png" height="20" title="Update">
</a> </td> </tr> <tr>
<td id="judul" align="center">
<img class='pop' src='../images/icons/phone.png' height='30' width="50"><br>
<font size="1" color="#ccc" face="Verdana">PHONE</font>
</td>
(3)
<font size="2" color="#fff" face="Verdana"><? echo $show['phone'] ?></font>
</td>
<td id="judul" align="center" width="10%">
<a
href="update-contact.php?action=phone&phone=<? echo $show['phone'] ?>" style='text-decoration:none'>
<img src="../images/icons/edit-2.png" height="20" title="Update">
</a> </td> </tr> <tr>
<td id="judul" align="center">
<img class='pop' src='../images/icons/email.png' height='30' width="50"><br>
<font size="1" color="#ccc" face="Verdana">EMAIL</font>
</td>
<td id="judul"> <font size="2" color="#fff" face="Verdana"><? echo $show['email'] ?></font>
</td>
<td id="judul" align="center" width="10%">
<a
href="update-contact.php?action=email&email=<? echo $show['email'] ?>" style='text-decoration:none'>
<img src="../images/icons/edit-2.png" height="20" title="Update">
</a> </td> </tr> <tr>
<td id="judul" align="center">
<img class='pop' src='../images/icons/fb.png' height='30'
width="50"><br>
<font size="1" color="#ccc" face="Verdana">FACEBOOK</font>
</td>
<td id="judul"> <font
size="2" color="#fff" face="Verdana"><? echo $show['fb'] ?></font> </td>
(4)
<td id="judul" align="center" width="10%">
<a
href="update-contact.php?action=facebook&fb=<? echo $show['fb'] ?>" style='text-decoration:none'>
<img src="../images/icons/edit-2.png" height="20" title="Update">
</a> </td> </tr> <tr>
<td id="judul" align="center">
<img class='pop' src='../images/icons/twit.png' height='40' width="50"><br>
</td>
<td id="judul"> <font size="2" color="#fff" face="Verdana"><? echo $show['twitter'] ?></font>
</td>
<td id="judul" align="center" width="10%">
<a href="update-contact.php?action=twitter&twitter=<? echo $show['twitter'] ?>" style='text-decoration:none'>
<img src="../images/icons/edit-2.png" height="20" title="Update">
</a> </td> </tr> <tr>
<td id="judul" align="center">
<img class='pop' src='../images/icons/insta.png' height='30' width="50"><br>
<font size="1" color="#ccc" face="Verdana">INSTAGRAM</font>
</td>
<td id="judul"> <font size="2" color="#fff" face="Verdana"><? echo $show['insta'] ?></font>
</td>
<td id="judul" align="center" width="10%">
<a href="update-contact.php?action=instagram&instagram=<? echo $show['insta'] ?>" style='text-decoration:none'>
<img src="../images/icons/edit-2.png" height="20" title="Update">
(5)
</a> </td> </tr> <?
endwhile; ?>
</table> </div>
</div>
<?include"menu-bawah.php";?> <?
}else{
echo "<script> document.location.href='akses.php'; </script>";
} ?> <style> .cn-back{
outline: none;
text-indent: -9000px; width: 49px;
height: 42px;
background: transparent url(images/admin/arrow.png) no-repeat center center;
position: absolute; margin-left: 20px; margin-top: 20px; cursor: pointer;
-webkit-animation: moveLeft 1s ease-in-out 0.2s backwards; -moz-animation: moveLeft 1s ease-in-out 0.2s backwards; -o-animation: moveLeft 1s ease-in-out 0.2s backwards; -ms-animation: moveLeft 1s ease-in-out 0.2s backwards; animation: moveLeft 1s ease-in-out 0.2s backwards; }
.cn-content{
background: #80B8CE url(images/admin/10.jpg) no-repeat center center;
background-size:100% 100%;
box-shadow: 1px 1px 3px rgba(0,0,0,0.1); border: 8px solid #fff;
width: 80%; height: 65%; overflow-y: auto; display: inline-block; margin-top: -30px; margin-left: 100px; border-radius: 15px;
-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 2s; /* Firefox < 16 */ -ms-animation: fadein 2s; /* Internet Explorer */ -o-animation: fadein 2s; /* Opera < 12.1 */ animation: fadein 2s;
(6)
table{
margin: 10px auto; }