Sistem Informasi Nama Jalan di Kota Medan Berbasis Web

(1)

TUGAS AKHIR

RAJA ARIF HIDAYAH HARAHAP

112406196

PROGRAM STUDI D-3 TEKNIK INFORMATIKA

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

(2)

TUGAS AKHIR

Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh Ahli Madya

RAJA ARIF HIDAYAH HARAHAP

112406196

PROGRAM STUDI D-3 TEKNIK INFORMATIKA

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

(3)

Judul : Sistem Informasi Nama Jalan Di Kota Medan Berbasis Web

Kategori : Tugas Akhir

Nama : Raja Arif Hidayah Harahap

Nomor Induk Mahasiswa : 112406196

Program Studi : Diploma 3 Teknik Informatika

Departemen : Matematika

Fakultas : Matematika Dan Ilmu Pengetahuan Alam Universitas Sumatera Utara

Disetujui di Medan, Juni 2014

Disetujui Oleh

Program Studi D3 Teknik Informatika Pembimbing, FMIPA USU

Ketua,

(4)

PERNYATAAN

SISTEM INFORMASI NAMA JALAN DI KOTA MEDAN BERBASIS WEB

TUGAS AKHIR

Saya mengakui bahwa tugas akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.

Medan, Juni 2014

(5)

PENGHARGAAN

Puji dan syukur penulis ucapkan kepada Tuhan Yang Maha Esa, Pemurah dan Maha Penyayang, karena atas limpahan karunia-Nya Penulis dapat menyelesaikan penyusunan tugas akhir ini dengan judul sistem informasi nama jalan di kota Medan berbasis web.

Terimakasih penulis sampaikan kepada Bapak Drs. Suyanto, M.Kom selaku pembimbing yang telah meluangkan waktunya untuk membimbing penulis selama penyusunan tugas akhir ini. Terimakasih kepada prof.Dr.Tulus,M.Si.Ph.D dan Ibu Dra. Elly Rosmaini, M.Si dan Bapak Syahriol Sitorus, S.Si, M.IT selaku Ketua Departemen dan Sekretaris Departemen Matematika FMIPA USU Medan, kemudian Bapak Prof. Dr. Tulus, M.Si dan Ibu Dr. Mardiningsih, M.Si selaku Ketua dan Sekretaris Departemen Matematika FMIPA USU, Bapak Dr. Sutarman, M.Sc Selaku Dekan FMIPA USU serta seluruh Staff dan Dosen Program Studi D3 Teknik Informatika FMIPA USU, pegawai FMIPA USU dan seluruh rekan-rekan kuliah. Akhirnya tidak terlupakan kepada Ayahanda dan Ibunda penulis

(6)

ABSTRAK

Rancangan website Kemanakita merupakan rancangan web yang dirancang untuk memudahkan masyarakat khususnya orang-orang yang berkunjung ke Medan atau bahkan orang Medan sendiri, untuk mencari tempat-tempat yang familiar di Medan, namun ketika mendengar nama jalannya orang-orang banyak bingung atau seperti kedengarannya asing dan baru. Selain itu juga memudahkan orang untuk mengetahui acara apa saja yang sedang diadakan atau sudah ada di Medan.

Dalam rancangan website ini, penulis menggunakan pemrograman web dengan html yang juga digabungkan dengan php untuk keperluan database. Adapun untuk mengakses database, rancangan ini menggunakan serverlocalhost dari database MYSQL dengan XAMPP Control Panel. Dalam penulisan script, baik html maupun php menggunakan Notepad++.

(7)

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

(8)

BAB 3 Perancangan Sistem

3.1 Gambaran Umum Sistem 25

3.2 Rancangan Umum Sistem 26

3.2.1 Flowchart 26

3.2.1.1 Flowchart Rancangan Sistem 28

3.2.2 Data Flow Diagram (DFD) 28

3.2.2.1 Data Flow Diagram Rancangan Sistem 29

3.3 Rancangan Website 31

3.4 Rancangan Menu Input 32

3.5 Rancangan Tabel Database 34

BAB 4 Implementasi

4.1 Implementasi Sistem 36

4.2 Implementasi Halaman Umum 36

4.2.1 Halaman Utama 37

4.2.2 Halaman List Menu 39

4.3 Implementasi Halaman Admin 42

BAB 5 Kesimpulan

5.1 Kesimpulan Akhir 45

5.2 Saran 46

DAFTAR PUSTAKA 47

(9)

DAFTAR TABEL

Nomor Judul Halaman Tabel

(10)

DAFTAR GAMBAR

Nomor Judul Halaman Gambar

2.1. XAMPP Control Panel 22

3.1. Flowchart Rancangan Web KemanaKita 28

3.2. Data Flow Diagram (DFD) 0 30

3.3. Data Flow Diagram (DFD) 1 30

3.4. Rancangan tampilan halaman utama 31

3.5. Rancangan tampilan menu input 32

3.6. Rancangan Input Event 33

3.7. Rancangan Input Data Jalan 33

4.1. Halaman Utama Umum 37

4.2. Halaman Detail Event (Rincian Event) 38

4.3. Halaman List Menu (Menu Jalan) 39

4.4. Halaman Detail Jalan 40

4.5. Tampilan peta sebelum di zoom 40

4.6. Tampilan Peta setelah di zoom 41

4.7. Halaman About 41

4.8. Halaman Utama Admin 42

4.9. Menghapus Event dan Nama Jalan 43

4.10. Halaman Menu Input 43

4.11. Halaman Input Event 44

(11)

ABSTRAK

Rancangan website Kemanakita merupakan rancangan web yang dirancang untuk memudahkan masyarakat khususnya orang-orang yang berkunjung ke Medan atau bahkan orang Medan sendiri, untuk mencari tempat-tempat yang familiar di Medan, namun ketika mendengar nama jalannya orang-orang banyak bingung atau seperti kedengarannya asing dan baru. Selain itu juga memudahkan orang untuk mengetahui acara apa saja yang sedang diadakan atau sudah ada di Medan.

Dalam rancangan website ini, penulis menggunakan pemrograman web dengan html yang juga digabungkan dengan php untuk keperluan database. Adapun untuk mengakses database, rancangan ini menggunakan serverlocalhost dari database MYSQL dengan XAMPP Control Panel. Dalam penulisan script, baik html maupun php menggunakan Notepad++.

(12)

BAB 1

PENDAHULUAN

1.1. Latar Belakang

Dalam kehidupan sehari-hari, sering kita melihat orang-orang mengetahui suatu

tempat tetapi tidak mengetahui jalan menuju tempat tersebut secara detail.

Orang-orang kebanyakan hanya mengetahui suatu tempat karena mereka mengetahui

suatu tempat yang terkenal saja tetapi tidak mengetahui nama jalannya, padahal

mereka sering melewatinya atau sebenarnya mengetahui tempat tersebut.

Dengan zaman sekarang yang semakin canggih, apalagi semua aktivitas

saat ini yang kita lakukan selalu terhubung dengan internet, sudah pasti sistem

informasi tentang nama jalan berbasis web dibutuhkan oleh banyak orang.

Memang sudah tersedia fasilitas seperti google map, yang bisa mengakses peta nama jalan seluruh dunia, tetapi banyak orang yang bingung nama jalan tersebut

dimana dan dekat dengan tempat apa.

Oleh karena itu, penulis dengan bimbingan dari Bapak dosen pembimbing

memutuskan untuk membuat tugas akhir tentang sistem informasi nama jalan di

(13)

Dengan adanya sistem ini diharapkan orang-orang tidak kebingungan lagi dalam

mencari suatu tempat ataupun nama jalan yang mereka cari.

Dalam sistem informasi yang akan saya buat, akan dilengkapi dengan

foto-foto tempat yang terdekat dari jalan tersebut serta peta dari google map yang mendukung, dilengkapi dengan tulisan yang akan memudahkan pemahaman

orang-orang dalam pencarian nama jalan yang diinginkan.

1.2 Rumusan Masalah

Berdasarkan uraian yang telah dijelaskan pada latar belakang, perumusan masalah

dapat dirumuskan dengan penjelasan selengkap-lengkapnya tentang nama jalan

tersebut, disertai dengan nama tempat terdekat dari jalan tersebut, serta foto yang

mendukung.

Adapun rumusan masalahnya adalah sebagai berikut :

a. Informasi apa saja yang bisa pengunjung dapatkan dari rancangan website ini.

b. Nama jalan apa saja yang bisa pengunjung dapatkan dari rancangan

(14)

1.3 Tujuan

Adapun tujuan daripada pembuatan rancangan website ini adalah :

a. Pengunjung website ini nantinya akan lebih mudah mencari nama jalan yang menurutnya nama jalan tersebut kurang familiar, padahal ketika

ditunjukkan dengan gambar tempat sekeliling jalan tersebut pasti akan

lebih mudah mengetahuinya.

b. Pengunjung website ini juga nantinya akan update dengan event-event

yang ada di Medan, baik yang telah berlangsung maupun yang akan

berlangsung.

1.4 Manfaat

Adapun manfaat yang didapat adalah :

a. Mempermudah orang-orang untuk mencari nama jalan yang asing, padahal

nama jalan tersebut sering dilewati.

b. Mempermudah orang-orang untuk mencari tempat terdekat yang menjadi

rekomendasi daripada nama jalan tersebut.

c. Dengan adanya informasi angkutan umum yang melalui jalan tersebut,

maka akan memudahkan orang-orang juga untuk menggunakan angkutan

umum apa yang menuju kesana.

(15)

1.5 Batasan Masalah

Dalam membuat perancangan website kemanakita ini, penulis membatasi

beberapa hal agar dalam tugas akhir ini hanya fokus terhadap beberapa tujuan

seperti yang sudah disebutkan dalam tujuan diatas. Adapun batasan dari

pembuatan rancangan website kemanakita adalah :

a) Pengguna sistem informasi/visitor dari website kemanakita dapat mencari nama jalan ataupun acara terbaru yang mereka kehendaki yang telah di

update oleh admin/penulis sendiri.

b) Admin dapat memperbarui event dan nama jalan melalui database MYSQL.

1.6 Metodologi Pembuatan Sistem

Dalam membuat perancangan website kemanakita, penulis menggunakan

metodologi waterfall, dimana pendekatan dilakukan secara sistematis dan berurutan. Metode waterfall disebut seperti air terjun, dimana proses yang

berlangsung tahap demi tahapan dan berjalan berurutan. Adapun tahapan dari

metode waterfall (Pressman, Roger S. 2001) adalah sebagai berikut : a) Requirement

Dalam tahap ini penulis menentukan apa yang dibutuhkan dalam sistem

yang akan dirancang. Tujuan dari perancangan website ini adalah sebagai

(16)

Hal yang dibutuhkan adalah database SQL, pengumpulan nama jalan, pengumpulan acara acara yang akan berlangsung di Medan serta foto-foto

pendukung. Pastinya aplikasi yang dibutuhkan seperti web editor

Notepad++, localhost server melalui XAMPP Control Panel.

b) Design

Pada tahap desain, penulis memulai untuk membangun rancangan website ini. Dalam desain yang penulis rancang, interface yang digunakan

sangatlah sederhana agar memudahkan orang-orang dalam mengakses.

Dengan tab menu yang hanya menggunakan border dan background dengan warna yang sederhana. Penulis membuat rancangan desain website

maukemana dengan web editor Notepad++ dengan bantuan aplikasi lain

juga seperti Dreamwaver CS3. Adapun dalam header penulis

menggunakan gambar/logo website yang sangat sederhana dengan konsep fun.

c) Coding

Seperti yang dijelaskan diatas, penulis menggunakan Notepad++ untuk mengkoding rancangan web yang dibuat. Penulis menggunakan bahasa

pemrograman HTML dan dihubungkan dengan php untuk mengakses

database.

d) Testing

Testing atauoun percobaan rancangan yang dibuat bertujuan untuk

mengetahui kesalahan apa yang terjadi pada rancangan tersebut. Aapabila

(17)

1.7 Sistematika Penulisan

Pada dasarnya, penyusunan skematika penulisan ini bertujan untuk memudahkan

para pembaca dalam mengikuti apa yang dipaparkan dalam laporan tugas akhir

ini. skematikanya sebagai berikut :

BAB 1 PENDAHULUAN

Dalam bab ini, berisikan gambaran umum pembuatan laporan yang

meliputi latar belakang, rumusan masalah, tujuan, ruang lingkup,

batasan masalah, metodologi penelitian, jadwal pengerjaan, dan

skematika penulisan sebagai panduan dalam penyusunan landasan

teori.

BAB 2 LANDASAN TEORI

Bab ini menjelaskan tentang teori-teori yang berkaitan dengan isi

laporan tugas akhir dan aplikasi-aplikasi web yang dibuat,

diantaranya HTML, MySQL, PHP, sebagian besar memakai Data

Flow Diagram (DFD), Entity Relationship (ERD), Data Dictionary

(DD) dan sebagainya.

BAB 3 PERANCANGAN SISTEM

Dalam bab ini dilakukan perancangan sistem atau rancangan

terperinci dari sistem yang mencakup perincian penggunaan sistem

serta gambaran bentuk rancangan sampai pengujian sistem dengan

interface gambar, menggunakan Data Flow Diagram (DFD), Entity

(18)

BAB 4 IMPLEMENTASI

Dalam bab ini dijelaskan tentang implementasi dari beberapa

rancangan yang telah dibuat. Terdapat didalamnya paparan hasil

implementasi dalam bentuk gambar/screenhot dari sistem yang telah selesai dibuat.

BAB 5 KESIMPULAN

Dalam bab ini memaparkan tentang kesimpulan yang penulis ambil

(19)

BAB 2

LANDASAN TEORI

2.1 Konsep Dasar Sistem Informasi

Dalam mendefinisikan suatu sistem terdapat dua kelompok pendekatan, yaitu

yang menekankan pada prosedurnya dan yang menekankan pada komponen atau

elemennya. Suatu 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. Sedangkan informasi itu

sendiri memiliki pengertian data yang diolah bentuk yang lebih berguna dan lebih

berarti bagi yang menerimanya.

2.1.1 Definisi Sistem

Kata sistem berasal dari bahasa Yunani yaitu “System”, yang berarti kesatuan,

suatu kesatuan yang saling tergantung dan saling bekerja sama untuk mencapai

(20)

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.

Suatu sistem dapat terdiri dari sistem-sistem bagian lainnya atau sering

disebut subsistem. Subsistem saling berinteraksi dan saling berhubungan

membentuk suatu kesatuan untuk tercapainya suatu sasaran dan sistem tidak

terlepas dari komponen-komponen penduking sistem yang mempunyai sifat dan

fungsi tertentu dan mampu mempengaruhi proses sistem secara keseluruhan.

Suatu sistem sangat dibutuhkan dalam suatu perusahaan atau instansi

pemerintahan , karena sistem dapat menunjang terhadap kinerja perusahaan atau

instansi pemerintah , baik yang berskala kecil maupun besar. Supaya dapat

berjalan dengan baik diperlukan kerjasama diantara unsur-unsur yang terkait

dalam sistem tersebut.

Tujuan dari sistem adalah untuk mengorganisasikan sistem informasi

yang baru agar dapat mengatasi berbagai masalah yang terjadi pada suatu

organisasi, serta memberikan pengertian mengenai suatu sistem yang ada pada

struktur organisasi serta trik-trik manajemen yang berkaitan dengan sistem

berbasis komputer.

2.1.2 Definisi Informasi

(21)

Informasi merupakan kata benda dari „informare‟ yang berarti aktivitas dalam

“pengetahuan yang dikomunikasikan”. Informasi adalah data yang telah diproses

dan memiliki arti atau manfaat bagi penggunanya.

Informasi sebagai hasil dari pengolahan data dalam suatu organisasi

sangatlah penting karena informasi merupakan landasan untuk mengambil suatu

keputusan dan data merupakan sumber dari informasi. Konsep dasar informasi

adalah suatu data yang diolah menjadi bentuk yang lebih berguna dan penting

bagi yang menerimanya.

2.1.3 Definisi Sistem Informasi

Pada dasarnya sistem informasi merupakan suatu sistem yang dibuat oleh manusia

untuk mencapai suatu tujuan yaitu menyajikan informasi. Sistem informasi

menerima masukan data dan instruksi, mengolah data sesuai instruksi, dan

mengeluarkan hasilnya.

Informasi diperoleh dari sistem informasi (information system) atau

processing system. Sistem informasi adalah suatu sistem di dalam suatu organisasi

yang mempertemukan kebutuhan pengolahan transaksi harian, mendukung

operasi, bersifat manajerial dan kegiatan strategi dari suatu organisasi dan

menyediakan pihak luar tertentu dengan laporan-laporan yang diperlukan.

Dari pengertian diatas, sistem informasi dapat didefinisikan pula sebagai

suatu kesatuan dari berbagai bagian atau elemen-elemen atau subsistem-subsistem

yang saling berkaitan dan berinteraksi satu sama lainnya untuk mencapai suatu

(22)

Adapun sistem informasi terdiri dari komponen-komponen yang disebutnya

dengan istilah blok bangunan (building block), yaitu :

1. Blok Masukan (Input Block)

2. Input mewakili data yang masuk ke dalam sistem informasi, input disini

termasuk metode-metode dan media untuk menangkap data yang akan

dimasukkan, yang dapat berupa dokumen-dokumen dasar.

3. Blok Model (Model Block)

Blok ini terdiri dari kombinasi prosedur, logika dan model matematik yang

akan memanipulasi data input dan data yang tersimpan di basis data

dengan cara yang sudah ditentukan untuk menghasilkan keluaran yang

diinginkan.

4. Blok Keluaran (Output Block)

Produk dari sistem informasi adalah keluaran yang merupakan informasi

yang berkualitas dan dokumentasi yang berguna untuk semua tingkatan

manajemen serta semua pemakai sistem.

5. Blok Teknologi (Technology Block)

Teknologi merupakan Toolbox dalam sistem informasi. Teknologi

digunakan untuk menerima input, menjalankan model, menyimpan dan

mengakses data, menghasilkan dan mengirimkan keluaran dan membantu

pengendalian dari sistem secara keseluruhan. Teknologi terdiri dari

(23)

6. Blok Basis Data (Database Block)

Basis data (database) merupakan kumpulan dari data yang saling

berhubungan satu dengan yang lainnya, tersimpan di perangkat keras

komputer dan digunakan perangkat lunak untuk memanipulasinya. Data

perlu disimpan di dalam basis data untuk keperluan penyedian informasi

lebih lanjut.

7. Blok Kendali (Controls Block)

Banyak hal yang dapat merusak sistem informasi, seperti misalnya

bencana alam, api, temperature, air, debu, kecurangan-kecurangan, kegagalan-kegagalan sistem itu sendiri, kesalahan-kesalahan, tidak efisien,

sabotase dan sebagainya. Beberapa pengendalian perlu dirancang dan

diterapkan untuk meyakinkan bahwa hal-hal yang dapat merusak sistem

dapat dicegah ataupun bila terlanjur terjadi kesalahan-kesalahan dapat

langsung cepat diatasi.

2.2 Konsep Pemrograman Berbasis Web

Dalam pemrograman web ada banyak bahasa yang bisa digunakan untuk

(24)

2.2.1 Website

Website diartikan sebagai kumpulan halaman yang menampilkan informasi data

teks, data gambar diam atau gerak, data animasi, suara, video, atau gabungan dari

semuanya, baik yang bersifat statis maupun dinamis.

Suatu Website membentuk satu rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan halaman (hyperlink).

Bersifat statis apabila isi informasi website tetap, jarang berubah, dan isi informasinya searah hanya dari pemilik website. Bersifat dinamis apabila isi informasi website selalu berubah-ubah, dan isi informasinya interaktif dua arah

berasal dari pemilik serta pengguna website. Contoh website statis yaitu profil perusahaan, sedangkan website dinamis seperti Facebook, Multiply, Twitter, dll.

Dalam sisi pengembangannya, website statis hanya bisa diupdate oleh pemiliknya saja, sedangkan website dinamis bisa diupdate oleh pengguna maupun pemilik.

2.2.2 Browser

Browser merupakan tool yang berada di sisi client. Untuk mengakses web,

diperlukan suatu program yang disebut web browser. Browser merupakan suatu program yang dirancang untuk mengambil informasi-informasi dari suatu server

komputer pada jaringan internet. Informasi-informasi ini biasanya dikemas dalam

page-page, dimana setiap page bisa memiliki beberapa link yang menghubungkan

(25)

2.2.3 PHP

Pada awalnya PHP merupakan singkatan dari Personal Home Page tools, yang berguna untuk memonitor pengunjung suatu web. PHP mula-mula dikembangkan oleh Rasmus Lerdofr. Istilah PHP kemudian mengacu pada Hypertext

Preprocessor. PHP kemudian lebih dikembangkan untuk membangun aplikasi

web yang mendukung database, biasanya dipasangkan dengan MySQL.

PHP merupakan bahasa berbentuk skrip yang ditempatkan dalam server

dan diproses di server. Hasilnya akan dikirimkan ke client, tempat pemakai menggunakan browser. Secara khusus, PHP dirancang untuk membentuk web

dinamis, dimana dapat membentuk suatu tampilan berdasarkan keinginan dari si

perancang web. Salah satu contohnya adalah dapat menampilkan isi database ke

halaman web.

Cara penulisan script PHP ada dua macam, yaitu :

a. Embedded Script yaitu meletakkan tag PHP di antara tag-tag HTML.

Contoh Embedded Script yaitu: <html>

<head>

<title>Embedded Script</title>

</head>

<body>

<?php echo “Belajar Embedded Script”;

(26)

</body>

</html>

b. Non Embedded Script yaitu semua script html diletakkan di dalam script

PHP. Contoh Non Embedded Script, yaitu:

<?php

echo “<html>” ;

echo “<body>” ;

echo “Contoh Non Embedded Script” ;

echo “</body>” ;

echo “</html>”;

?>

2.2.4 HTML

HTML (Hyper Text Markup Languange) yang merupakan bahasa standar

penulisan dokumen web. Semua informasi yang akan diletakkan di web menggunakan format penulisan HTML. File HTML adalah file teks yang

dilengkapi simbol-simbol untuk keperluan display yang biasa disebut dengan tag. Dokumen HTML adalah file teks murni yang dapat dibuat dengan editor teks sembarang. Dokumen ini dikenal sebagai webpage. Dokumen HTML

(27)

HTML biasanya ber-ekstensi “.htm”, “.html”, atau “.shtml”. HTML tersusun atas

tag-tag, digunakn untuk menetukan tampilan dari dokumen HTML yang ditejemahkan oleh browser. Tag HTML tidak case sentive, jadi bisa menggunakan <HTML> atau <html>. Keduanya menghasilkan output yang sama, yang diawali dengan nama tag seperti : <html>, dan diakhiri dengan nama tag seperti : </html>.

Dokumen HTML mempunyai tiga buah tag utama yang membentuk

struktur dari dokumen tersebut. Ketiga buah Tag tersebut adalah:

a) Tag HTML : Sebagai tanda awal dokumen HTML.

b) Head : Sebagai informasi page header. Di dalam tag ini kita bisa meletakkan tag-tag TITLE, BASE, ISINDEX, LINK, SCRIPT, STYLE &

META.Body : Di dalam tag ini bisa diletakkan berbagai atribut halaman seperti warna latar belakang, warna teks, warna link, warna visited link,

warna active link dan lain-lain. Contoh atribut : BGCOLOR,

BACKGROUND, TEXT, LINK, VLINK, ALINK dan lainnya.

2.2.5 Cascading Style Sheets (CSS)

CSS (Cascading Style Sheets) banyak digunakan untuk memperluas kemampuan HTML dalam memformat dokumen atau untuk mepercantik tampilan web, bahkan untuk pemosisian dan layouting halaman web. Dengan mendefinisikan suatu style

(28)

CSS telah didukung kebanyakan browser, terutama versi baru sehingga penempatan layout manjadi lebih fleksibel. Membuat HTML menggunakan tag

minimal berpengaruh terhadap ukuran file, dapat menampilkan isi utama terlebih dahulu sementara gambar dan yang lain dapat ditampilkan sesudahnya. Selain itu

penggunaan CSS pada file terpisah dapat mempermudah pengubahan tampilan

situs secara keseluruhan.

2.2.6 JavaScript

JavaScript mulanya bernama LiveScript, dikembangkan pertama kali tahun 1995

di Netscape Communication. Pada akhir tahun 1995 Netscape Communication dan

Sun Microsystem berkolaborasi dan menggati nama LiveScript menjadi

JavaScript.

JavaScript adalah bahan skrip yang ditempatkan pada kode HTML dan

diproses pada sisi klien. Dengan adanya bahasa ini maka kemampuan dokumen

HTML menjdai labih luas. Sebagai contoh, digunakan untuk validasi masukan

pada formulir sebelum diproses ke tahap selanjutnya. Bisa untuk membuat

permainan interaktif dan juga bisa untuk menambah desain web.

2.2.7 Adobe Dreamweaver

Adobe Dreamweaver CS5 adalah editor HTML professional untuk merancang,

(29)

Kita bisa melakukan secara manual untuk coding HTML ataupun mengerjakan dalam lingkungan editing visual. Dreamweaver menyediakan tool yang sangat

menolong untuk meningkatkan pengalaman dalam menciptakan web.

Di dalam Dreamweaver memungkinkan kita dengan cepat menciptakan halaman tanpa menulis satupun baris kode. Kita dapat memandang semua asset

atau unsur-unsur lokasi dan menyeretnya dari suatu panel easy-to-use secara langsung ke dalam suatu dokumen. Kita dapat mengefektifkan workflow

pengembangan dengan menciptakan dan mengedit gambar di dalam firework atau aplikasi grafik yang lain, dan kemudian mengimpornya secara langsung ke dalam

Dreamweaver, atau dengan menambahkan objek Flash.

Dreamweaver juga menyediakan lingkungan pengkodean penuh, meliputi

code-editing tool (seperti kode mewarnai dan penyelesaian tag) dan material

referensi pada HTML, Cascading Style Sheets (CSS), JavaScript, ColdFusion

Markup Language (CFML), Microsoft Active Server Page (ASP), dan JavaServer

Page (JSP). Teknologi Roudtrip HTML mengimpor dokumen HTML yang dikode secara manual tanpa reformating kode. Kita kemudian bisa memformat kembali kode itu dengan gaya pengaturan yang lebih disukai.

Dreamweaver juga memungkinkan kita untuk membangun aplikasi web

dinamis yang didukung database yang menggunakan teknologi server seperti CFML, ASP.NET, ASP, JSP, dan PHP. Dreamweaver secara penuh customizable.

Kita dapat menciptakan objek dan perintah, meodifikasi shortcut keyboard, bahkan menuliskan kode JavaScript untuk memperluas kemampuan

(30)

2.2.8 Notepad++

Notepad++ adalah program aplikasi pengembang yang berguna untuk mengedit

teks dan skrip kode pemrograman. Versi terbaru program ini adalah Notepad++

v5.9, yang dirilis pada tanggal 06 April 2012. Software Notepad++ dibuat dan

dikembangkan oleh Tim Notepad++.

Software ini memiliki kelebihan pada peningkatan kemampuan

sebuah program text editor, lebih dari sekedar program Notepad bawaan

Windows. Notepad++ bisa mengenal tag dan kode dalam berbagai bahasa pemrograman. Fitur pencarian tingkat lanjut dan pengeditan teks yang tersedia

juga cukup ampuh, sangat membantu tugas seorang programmer atau developer

dalam menyelesaikan skrip kode programnya.

Program Notepad++ banyak di aplikasikan dan digunakan oleh kalangan

pengguna komputer di bidang pemrograman aplikasi desktop dan web.

2.3 Database

Database adalah kumpulan dari item data yang saling berhubungan satu dengan

yang lainnya yang diorganisasikan berdasarkan sebuah skema atau struktur

tertentu, tersimpan di komputer dan dengan software untuk melakukan manipulasi untuk kegunaan tertentu.

Database memiliki struktur yang relasional, ada tabel-tabel yang

(31)

Setiap data memerlukan kolom khusus untuk setiap jenis informasi yang ingin

disimpan (misalnya umur, tinggi, berat, alamat). Jika kolom mendefinisikan jenis

informasi apa yang akan disimpan, maka sebuah baris adalah data aktual yang

disimpan.

Setiap baris dari tabel adalah masukan dari tabel tersebut dan berisi

nilai-nilai untuk setiap kolom tabel tersebut. Database sangat diperlukan karena

database salah satu komponen terpenting dalam sistem informasi, karena

merupakan dasar dalam menyediakan informasi, database juga menentukan kualitas informasi seperti: akurat, tepat pada waktunya dan relevan.

Informasi dapat dikatakan bernilai bila manfaatnya lebih efektif

dibandingkan dengan biaya mendapatkannya, database dapat mengurangi duplikasi data (data redudancy) dan dengan database hubungan data dapat

ditingkatkan (data relatability) dan dengan database juga akan mengurangi pemborosan tempat simpanan luar.

2.3.1 SQL

SQL (Structured Query Language) yaitu bahasa yang dirancang khusus untuk

komunikasi dengan database. Tidak seperti bahasa-bahasa lainnya (seperti bahasa C, basic, pascal atau bahasa pemprograman yang lain), bahasa SQL sengaja di

rancang untuk melakukan hal secara sederhana dan efisien untuk membaca dan

(32)

Statement didalam SQL digunakan untuk melakukan tugas-tugas seperti melakukan update terhadap database, atau mengambil data dari sebuah database.

Terdapat beberapa bahasa SQL dasar, yaitu :

a) Membuat Database

CREATE DATABASE nama_database;

b) MembuatTabel

CREATE TABLEnama_table (nama_field1 tipe_data1,…..);

c) Menambah Data

INSERT INTO nama_tabel (field1, field2, …,field_n) VALUES

(nilai_field1, …,nilai_n) WHEREkondisi;

d) Menghapus Data

DELETE FROM nama_tabel;

2.4 Aplikasi pendukung Database

Dalam pembuatan database penulis memerlukan beberapa aplikasi yang

mendukung. Berikut adalah beberapa aplikasi pendukung dalam pembuatan

(33)

2.4.1 XAMPP

XAMPP adalah sebuah paket web server yang gratis danopen source cross

platform yang di dalamnya terdapat Apache HTTP Server, MySQL Database, dan

phpMyAdmin. XAMPPjuga dapat berjalan pada Sistem Operasi Linux,

Mocrosoft Windows, Solaris dan Mac OSX.

Gambar 2.1 XAMPP Control Panel

2.4.2 phpMyAdmin

phpMyAdmin adalah perangkat lunak bebas yang ditulis dalam bahasa

pemrograman PHP yang digunakan untuk menangani administrasi MySQL.

phpMyAdmin mendukung berbagai operasi MySQL, diantaranya mengelola basis

data, tabel-tabel, bidang (fields), relasi (relations), indeks, pengguna (users), perijinan (permissions), dan lain-lain. phpMyAdmin merupakan bagian untuk

(34)

Untuk membukanya, buka browser lalu ketikkan alamat http://localhost lalu pilih

phpMyAdmin maka akan muncul halaman phpMyAdmin. phpMyAdmin memiliki

beberapa menu, antara lain:

1) Browse, untuk melihat data tabel.

2) Structure, untuk melihat struktur tabel.

3) SQL, untuk mengeksekusi perintah SQL.

4) Search, untuk melakukan pencarian data dalam record.

5) Insert, untuk menambahkan data (record) baru.

6) Export, untuk mengeksport record dan tabel ke dalam format lain.

7) Import, untuk mengimport data dari hasil eksport.

8) Operations, untuk operasi dalam tabel.

9) Empty, untuk mengosongkan tabel.

10) Drop, untuk menghapus tabel beserta isinya.

2.4.3 MYSQL

MySQL adalah salah satu jenis database server yang sangat terkenal. Kepopulerannya disebabkan MySQL menggunkaan SQL sebagai bahasa dasar

untuk mengakses databasenya. Selain itu bersifat free (tidak perlu membayar untuk menggunakannya).

MySQL termasuk jenis RDBMS (Relational Database Management

System). Itulah sebabnya istilah seperti tabel, baris, dan kolom digunakan pada

(35)

2.4.4 Apache

Server HTTP Apache atau Server Web/WWW Apache adalah server web yang

dapat dijalankan di banyak sistem operasi (Unix, BSD, Linux, Microsoft

Windows dan Novell Netware serta platform lainnya) yang berguna untuk

(36)

BAB 3

PERANCANGAN SISTEM

Dalam membuat suatu sistem perlu untuk merancang sistem yang akan dibuat

terlebih dahulu. Perancangan sistem merupakan suatu kebutuhan perangkat lunak

yang akan dibuat dengan menggunakan prinsip tertentu sehingga rancangan dapat

menjadi perangkat lunak yang siap pakai. Pada bab ini, penulis memaparkan

rancangan dari sistem informasi berbasis website yang telah penulis buat.

3.1 Gambaran Umum Sistem

Seperti yang sudah dijelaskan dalam pendahuluan bahwa websiteKemanaKita ini

dibuat agar orang-orang tidak kebingungan lagi dalam mencari suatu tempat

ataupun nama jalan yang mereka cari. Sistem yang akan dibuat sangatlah

sederhana, dimana pengunjung dapat melihat event-event yang update di

homepage nya MauKemana dan melihat daftar nama jalan pada List Menu.

Dalam merancang website ini, penulis menggunakan PHP agar website yang dihasilkan nantinya bisa lebih dinamis, berhubung juga penulis

(37)

Adapun database yang digunakan menggunakan MySQL. Untuk membuat tampilan lebih menarik, maka dibuatlah desain dengan bantuan CSS. Gambaran

umum dari website ini adalah sebagai berikut :

a) Pengunjung dapat mengakses semua konten yang ada di website

KemanaKita. Pengunjung mendapatkan informasi seputar event di Medan

dan juga bisa mendapatkan informasi nama jalan yang ada di Medan.

b) Admin dapat mengakses semua konten yang ada di website KemanaKita

melalui folder admin, lalu dapat langsung meng-update data jalan dan juga data event.

3.2 Rancangan Umum Sistem

Secara umum, rancangan sistem yang penulis buat tidak begitu rumit. Hal ini

dapat dilihat dari aliran proses dalam flowchart maupun Data Flow Diagram yang

telah penulis buat.

3.2.1 Flowchart

Untuk membantu pemrogram dalam menuangkan ide-ide penyelesaian masalah

yang diajukannya ke dalam bentuk program, seorang pemrogram dapat

memanfaatkan bantuan flowchart (diagram alir). Flowchart adalah sebuah

diagram umum yang merepresentasikan sebuah algoritma atau proses

menggunakan beberapa bangun geometri untuk memperlihatkan langkah-langkah

(38)

Secara umum, flowchart juga digunakan diberbagai bidang untuk menganalisis, mendesain, mendokumentasikan atau mengelola suatu proses atau program.

Berikut adalah elemen-elemen flowchart :

Tabel 3.1 Elemen-elemen flowchart

SIMBOL KETERANGAN

Simbol dokumen, digunakan untuk mewakili output baik proses manual, mekanik atau komputer, sebagai alternatif

untuk simbol jajaran genjang pada input.

Menujukkan kegiatan manual

Rectangle, menujukkan kegiatan proses dari operasi computer

atau instruksi lainnya.

Penghubung kesatu halaman atau halaman lain.

Diamond, menyatakan keputusan (decision).

Jajar genjang, digunakan untuk mewakilisimbol Input/Output

yang menyatakan dan mewakili data masukan atau keluaran

(biasanya simbol ini menyatakan input).

Flow Lines Symbol. Simbol Garis Alir digunakan untuk

(39)

3.2.1.1 Flowchart Rancangan Sistem

Berikut adalah flowchart dari rancangan sistem yang telah penulis buat

Gambar 3.1 Flowchart Rancangan Web KemanaKita

3.2.2 Data Flow Diagram (DFD)

Data Flow Diagram adalah diagram untuk menggambarkan arus data didalam

sistem secara terstruktur dan jelas yang dikembangkan secara logika. Data Flow

Diagram sangat membantu sekali dalam berkomunikasi dengan pemakai system

(40)

Berikut adalah beberapa simbol dalam Data Flow Diagram :

Tabel 3.2 Simbol dalam Data Flow Diagram (DFD)

3.2.2.1 Data Flow Diagram Rancangan Sistem

Berikut ini adalah Data Flow Diagram dari rancangan sistem yang telah penulis buat. DFD yang penulis buat sangat sederhana, karena dalam sistem yang dibuat

SIMBOL KETERANGAN

Terminator merupakan sumber atau tujuan

data

Data Flow atau Arus Data menunjukan keluar

atau masuk kesuatu Proses. Jadi sebagai alur

data atau informasi dari suatu bagian kebagian

lainnya dalam suatu sistem.

Proses merupakan kegiatan yang dilakukan

oleh orang,mesin, atau komputer dari hasil

suatu arus data yang masuk kedalam proses,

untuk dihasilkan arus data yang akan keluar

dari proses

Data Strore digunakan sebagai sarana untuk

pengumpulan data. Data store juga diberi

(41)

Gambar 3.2 Data Flow Diagram (DFD) 0

(42)

3.3 Rancangan Website

Rancangan website disini maksudnya adalah rancangan dari tampilan dari website

yang penulis buat, termasuk dalam tata letak ataupun susunan kontennya. Berikut

adalah rancangan tampilan website yang telah penulis rancang.

(43)

Gambar 3.5 Rancangan tampilan menu input

3.4 Rancangan Menu Input

Rancangan menu innput adalag rancangan apa saja yang akan di input dalam

(44)

(45)

3.5 Rancangan Tabel Database

Dalam menginput data event dan data nama jalan diperlukan database untuk dapat menampilkannya ke halaman web. Dalam hal ini, penulis hanya menggunakan dua tabel saja, pertama tabel event dan yang kedua tabel jalan.

Database : tugasakhir

Tabel : event

Field Type Extra

id_event int(5) auto_increment

judul varchar(150)

penulis varchar(50)

isi text

tanggal datetime

foto varchar(100)

(46)

Database : tugasakhir

Tabel : jalan

Field Type Extra

id_jalan int(5) auto_increment

judul varchar(150)

penulis varchar(50)

isi text

tanggal datetime

foto varchar(100)

(47)

BAB 4

IMPLEMENTASI

4.1 Implementasi Sistem

Implementasi sistem merupakan tahap terakhir dari suatu pembuatan sistem,

dimana di tahap inilah penulis menerapkan semua rancangan yang telah dibuat

sebelumnya. Dalam bab ini akan dijelaskan dan dipaparkan apa saja yang terdapat

di dalam website kemanakita ini, mulai dari apa saja yang terdapat di halaman

umum dan apa saja yang terdapat di halaman admin.

4.2 Implementasi Halaman Umum

Halaman umum adalah halaman yang bisa diakses oleh siapa saja yang hanya

berisi informasi yang telah disediakan. Pengguna tidak mendapatkan akses untuk

mengedit atau menambahkan apapun pada halaman ini. Ada tiga menu dalam

(48)

4.2.1 Halaman Utama

Halaman utama (biasa kita sebut : homepage) adalah halaman tampilan yang pertama kita lihat saat mengakses website ini. Halaman utama ini terdapat pada

index.php, home.php dan kemanakita.php. Halaman utama dari website ini dibagi

atas dua, yang pertama halaman pertama umum dan yang kedua halaman utama

admin.

Gambar 4.1 Halaman Utama Umum

Dalam halaman utama diatas bisa dilihat sangat sederhana sesuai dengan yang

(49)

Didalam halaman ini (home.php, index.php atau kemanakita.php) terdapat menu

home, yaitu menu untuk kembali ke halaman utama dimana didalam menu ini terdapat info event-event yang ada di Medan. Kemudian ada list menu, untuk melihat daftar nama jalan dan yang terakhir ada about yang berisi tentang website kemanakita ini.

Gambar 4.2 Halaman Detail Event (Rincian Event)

(50)

4.2.2 Halaman List Menu

Halaman ini berisi nama-nama jalan yang kedengarannya asing, padahal sering

dilalui atu terdapat tempat yang sering dikunjungi orang.

(51)

Gambar 4.4 Halaman Detail Jalan

(52)

Gambar 4.6 Tampilan Peta setelah di zoom

Beberapa gambar diatas adalah bagian dalam halaman detail_jalan, dimana

dihalaman ini berisi tentang info selengkapnya tentang jalan tersebut. Didalamnya

juga terdapat google map daripada jalan tersebut yang memudahkan untuk melihat lokasinya berdasarkan peta. Berikut adalah tampilan halaman about.

(53)

4.3 Implementasi Halaman Admin

Pada halaman utama admin sama saja seperti halaman umum, hanya ada penambahan menu hapus dari setiap event/nama jalan yang ada. Namun dalam halaman utama admin terdapat penambahan menu yaitu input data, untuk

menginput nama jalan dan event.

(54)

Gambar 4.9 Menghapus Event dan Nama Jalan

(55)

Gambar 4.11 Halaman Input Event

Gambar diatas adalah halaman untuk menginput event. Hasil inputan akan masuk

ke database tugasakhir pada tabel event, lalu akan ditampilkan pada menu

(56)

Gambar 4.12 Halaman Input Data Jalan

Gambar diatas adalah halaman untuk menginput data jalan. Hasil inputan akan

(57)

BAB 5

KESIMPULAN

5.1 Kesimpulan Akhir

Berdasarkan pengamatan penulis dari pembuatan sistem informasi tentang nama

jalan di kota medan ini, dapat diambil kesimpulan bahwa sistem informasi

berbasis web ini sangatlah sederhana karena penulis hanya mementingkan kemudahan pengguna dalam mengakses website ini. Tidak menggunakan menu yang banyak, karena hal tersebut dapat membingungkan pengguna. Dengan

menggunakan desain CSS yang sederhana dan database yang tidak banyak,

namun website ini cukup memberikan informasi yang penting kepada pengguna.

Adapun kesimpulan akhir dari penulis adalah sebagai berikut :

1. Sistem ini menggunakan bahasa pemrograman web dengan script

php yang dimana didalamnya terdapat script html juga.

2. Kemanakita adalah website yang memberikan informasi tentang nama jalan yang ada di Medan dengan penjelasan yang fun serta

(58)

3. Dalam penginputan data menggunakan bantuan database SQL dan

dalam pengaturannya menggunakan phpMyAdmin.

4. Peta yang ada didalam website ini menggunakan peta dari

foursquare yang telah penulis simpan preview gambarnya.

5.2 Saran

Adapun website ini menurut penulis masih sangat perlu pengembangan lebih lanjut. Saran penulis adalah sebagai berikut :

1. Agar kedepan dapat ditambahkan menu lain yang lebih variatif, yang

dapat memudahkan orang-orang untuk mengenal lebih jauh tentang

jalan-jalan atau tempat yang ada di Medan.

2. Desain yang sederhana ini agar bisa lebih ditingkatkan dan dibuat lebih

menarik lagi untuk kedepannya.

3. Agar dilakukan pengembangan lebih lanjut terhadap sistem ini, misalnya

sudah tersedia menu peta yang ketika peta tersebut di klik, maka akan

(59)

DAFTAR PUSTAKA

H.M. Jogiyanto, MBA. 2003. Sistem Informasi Berbasis Komputer : Konsep Dasar

dan Komponen. Edisi 2. Yogyakarta : BPFE Yogyakarta.

Jogiyanto, Hartono. 2009. Analisis dan Desain Sistem Informasi, Edisi III. Yogyakarta: ANDI.

H.M. Jogiyanto, MBA, Akt, Ph.D. 2003. Sistem Teknologi Informasi : Pendekatan Terintergrasi Konsep Dasar, Teknologi, Aplikasi, Pengembangan dan

Pengelolaan. Yogyakarta : ANDI.

Kadir, Abdul. 2003. Pemrograman Web Mencakup : HTML, CSS, JavaScript dan PHP. Yogyakarta : ANDI.

Ladjamudin, bin Al-Bahra. 2005. Analisis dan Desain Sistem Informasi. Cetakan Pertama. Yogyakarta : Graha Ilmu.

Prasetyo, Didik Dwi. 2005. Solusi Menjadi Web Master melalui Manajemen Web

dengan PHP. Jakarta. Elex Media Komputindo.

Wahyono, Teguh. 2004. Sistem Informasi : Konsep Dasar, Analisis Desain dan

Implementasi. Edisi 1. Yogyakarta : Graha Ilmu.

Ariona, Rian. 2013. E-book : Belajar HTML dan CSS “Tutorial dan fundamental dalam mempelajari HTML dan CSS”. ariona.net

http://www.pemkomedan.go.id/infodata.php/. Diakses pada tanggal 26 Maret 2014.

http://www.streetdirectory.co.id/indonesia/medan/. Diakses pada tanggal 26 Maret 2014.

(60)

kemanakita.php

<html>

<head>

<title>Kemana Kita ?</title>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li> </ul>

<p> Sistem Informasi Nama Jalan di Kota Medan </p> <marquee>

Welcome to KemanaKita ! Mau Kemana Kita ? Apa Carik ? </marquee>

$query_ambil_event = mysql_query("SELECT * FROM event"); //query ambil data berita.

while ($data_event = mysql_fetch_array($query_ambil_event)) { //perulangan untuk menampilkan berita

?>

<?php

if (is_file("gambar/".$data_event['foto']) == TRUE) {

(61)

0 10px 10px 0; display: inline; float: left">

<?php } ?>

<a href="detail_event.php?id=<?php echo $data_event['id_event']; ?>">Continue Reading</a>

<?php }

//penutup perulangan while ?>

</div> </div>

<h2>Kenapa bingung Mau Kemana ?</h2>

<p>Enggak ada lagi deh kata bingung mau kemana dan.. bingung jalannya darimana, karena KemanaKita menawarkan kamu

berbagai jalanan di Medan yang sering dicari orang.. kedengerannya asing, padahal sering dilewati. What are you waiting for ? Check them all !</p>

<div class="jam"> <p><b> <?php

echo "Date : ";

echo gmdate("d-m-y | H:i", time()+60*60*7);

(62)

</html>

home.php

<html>

<head>

<title>Kemana Kita ? | Home</title> <link rel="stylesheet" href="desain.css" /> </head>

<body>

(63)

?>

<img src="gambar/<?php echo $data_event['foto']; ?>"

style="width: 100px; height: 75px; margin: 0 10px 10px 0; display: inline; float: left">

<?php } ?>

<?php }

</div> </div>

<div class="jam"> <p><b> <?php

echo "Date : ";

(64)

</div>

<title>Kemana Kita ? | Menu</title> <link rel="stylesheet" href="desain.css" /> </head>

<body>

</div>

<p><b>Find out what are you looking for in Medan HERE !</b></p>

</div>

<div id="info-event"> <div class="event"> <?php

(65)

data berita.

while ($data_jalan = mysql_fetch_array($query_ambil_jalan)) { //perulangan untuk menampilkan jalan

?>

<?php

if (is_file("gambar/".$data_jalan['foto']) == TRUE) {

?>

<img src="gambar/<?php echo $data_jalan['foto']; ?>"

style="width: 100px; height: 75px; margin: 0 10px 10px 0; display: inline; float: left">

<?php } ?>

<a href="detail_jalan.php?id=<?php echo $data_jalan['id_jalan']; ?>">Continue Reading</a>

<?php }

</div> </div>

(66)

</head>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li> </ul><br><br>

$query_ambil_event = mysql_query("SELECT * FROM event WHERE id_event = '".$_GET['id']."'"); //query ambil data event.

$data_event = mysql_fetch_array($query_ambil_event); ?>

<h5 style="margin-bottom: 0px"> <?php

error_reporting('0');

echo $data_event['judul']; ?></h5>

<small>Ditulis oleh : <?php echo $data_event['penulis']; ?>, pada : <?php echo $data_event['tanggal']; ?></small>

<p> <?php

if (is_file("gambar/".$data_event['foto']) == TRUE) { ?>

(67)

<?php echo $data_event['isi']; ?></p>

</div>

<title>Jalan di Medan</title>

<body>

(68)

$query_ambil_jalan = mysql_query("SELECT * FROM jalan WHERE id_jalan = '".$_GET['id']."'"); //query ambil data jalan.

$data_jalan = mysql_fetch_array($query_ambil_jalan); ?>

<h5 style="margin-bottom: 0px"> <?php

echo $data_jalan['judul']; ?></h5>

<small>Ditulis oleh : <?php echo $data_jalan['penulis']; ?>, pada : <?php echo $data_event['tanggal']; ?></small>

<p> <?php

if (is_file("gambar/".$data_jalan['foto']) == TRUE) { ?>

<img src="gambar/<?php echo $data_jalan['foto']; ?>" style="width: 300px; height: 275px; margin: 0 10px 10px 0; display: inline; float: left">

<?php } ?>

<?php echo $data_jalan['isi']; ?></p> <hr>

</div> </div>

(69)

padahal sering dilewati. What are you waiting for ? Check them all !</p> </div>

mysql_connect("localhost", "root", ""); mysql_select_db("tugasakhir");

?>

about.php

<html>

<head>

<title>Kemana Kita ? | About</title> <link rel="stylesheet" href="desain.css" /> </head>

<body>

</div>

(70)

<h2>Apa itu MauKemana.php ?</h2>

<p><br>Enggak ada lagi deh kata bingung mau kemana dan.. bingung jalannya darimana, karena KemanaKita menawarkan kamu berbagai jalanan di Medan yang sering dicari orang.. kedengerannya asing, padahal sering dilewati<br><br> Disini kamu bisa mencari nama jalan yang pengen kamu tau, bisa juga mendapatkan info-info seputar event di Medan yang wajib kamu tau ! Mohon maaf kalau info dan nama jalan yang saya update masih sedikit ya :)</p>

</div>

font-family:"comic sans ms", sans-serif; }

body{

(71)

#header ul {

padding: 0px 5px 0px 5px; text-align: center;

margin: 5px 0px 0px 5px; text-decoration: none; border-radius: 5px;

background-color: #CCCC66; border: 2px solid #993300;

}

#header img{ width:135px; margin-left:30px; margin-top: 10px; }

#menu-utama{ margin-top:3px; list-style:none; }

#menu-utama li{ float:left;

padding:8px 20px;

border-right:1px solid #555555; }

#menu-utama li a{ color : #ffffff;

text-decoration:none; }

(72)

height:20px;

background:#ffffff; padding:10px; margin-bottom:20px; overflow:hidden; }

.event img{ float:left;

margin-right:10px; width:200px; height:165px; }

.event b{

color:#616060;

background:#DDDDDD; padding:3px;

font-size:12px; font-weight:bold; margin-right:10px; }

.event p{

margin:10px 0; }

.event a{ display:block; text-align:right; color:#636363; }

.judul{ width: 75%; height: 50px;

background-color: #FFCC99; text-align:center;

(73)

background-color: #FFCC99; text-align:center;

font:normal 15px comic; border-radius: 10px; border: 2px solid #999900; margin-bottom:20px; margin-top:35px; }

.tentang{ width: 85%; height: 380px; float: left;

border-radius: 10px; border: 3px solid #996600; margin-top:20px;

margin-bottom:20px; } font-size:18px; margin:10px 0; }

#sidebar p{ line-height:20px; color : #636363; text-align:center;

background-color: #FFFF99; padding:5px;

(74)

<html>

<head>

<title>Kemana Kita ? | Home</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li>

<?php

include "koneksi.php"; ?>

<?php

?>

<?php

if (is_file("gambar/".$data_event['foto']) == TRUE) {

?>

(75)

} ?>

<a href="hapus_event.php?id=<?php echo $data_event['id_event']; ?>" onClick="return confirm('Anda

yakin..?')">Hapus</a>

<?php }

</div> </div>

</div>

</div> </div>

</body>

(76)

<head>

<title>Kemana Kita ? | Menu</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

<p><b>Find out what are you looking for in Medan HERE !</b></p>

</div>

$query_ambil_jalan = mysql_query("SELECT * FROM jalan"); //query ambil data berita.

while ($data_jalan = mysql_fetch_array($query_ambil_jalan)) { //perulangan untuk menampilkan jalan

?>

<?php

if (is_file("gambar/".$data_jalan['foto']) == TRUE) {

?>

(77)

} ?>

<p><?php echo substr($data_jalan['isi'], 0, 300); ?> ... </p> <a href="detail_jalan.php?id=<?php echo $data_jalan['id_jalan']; ?>">Continue Reading</a>

<a href="hapus_jalan.php?id=<?php echo $data_jalan['id_jalan']; ?>" onClick="return confirm('Anda yakin..?')">Hapus</a>

<?php }

</div> </div>

<title>Kemana Kita ? | Menu Input</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

(78)

<p><b><a href="input_jalan.php">Input Data Jalan</a></b></p>

</div>

<title>Kemana Kita ? | Input Event</title> <link rel="stylesheet" href="style.css" /> </head>

<body>

<li><a href="home.php">Home</a></li> <li><a href="menu.php">List Menu</a></li> <li><a href="about.php">About</a></li> <li><a href="menu_input.php">Input Data</a></li>

</ul>

(79)

<tr>

<td width="200">Judul</td>

</tr> <tr>

<td>Pengirim</td>

</tr> <tr>

<td>File Gambar</td>

</tr> <tr>

<td>Tentang Event</td>

</td> </tr>

</table>