LAPORAN AKHIR PRAKTIKUM

WEBSITE TRAVELPEDIA (OOP)

Asistensi :
Muhammad Ramdhan

Disusun Oleh :
Adi Surya Widura 41037006181006
Fristia Nopano 41037006181038
Rama Fadillah 41037006181031

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK
UNIVERSITAS ISLAM NUSANTARA BANDUNG
TAHUN 2020
 KATA PENGANTAR

Puji syukur Saya ucapkan kepada Allah SWT karena berkat Rahmat-Nya
Kami dapat menyelesaikan laporan akhir praktikum mata kuliah OOP ini.
Penyusun mengucapkan terimakasih banyak kepada Bapak Muhammad Ramdhan
selaku asistensi praktikum mata kuliah OOP yang telah banyak memberikan
pengarahan dalam menyelesaikan praktikum hingga penyusunan laporan ini.
Penyusun menyadari laporan ini masih jauh dari sempurna. Maka dari itu
penyusun memohon maaf dan akan menerima segala masukan yang diberikan
untuk menyempurnakan laporan ini. Penyusun berharap laporan ini berguna bagi
siapapun yang membacanya.

Bandung, 14 Januari 2020

Penyusun

Laporan Akhir Praktikum Website Travelpedia (OOP)

i
 DAFTAR ISI

HALAMAN JUDUL
KATA PENGANTAR...................................................................................................
i
DAFTAR ISI.................................................................................................................
ii
BAB I TEORI
A. Dasar Teori
...................................................................................................................
1
BAB II HASIL DAN PEMBAHASAN
A. Deskripsi Website
......................................................................................................................
3
B. Source Code
......................................................................................................................
3
C. Sql Database
......................................................................................................................
9
D. Tampilan Website
......................................................................................................................
11
BAB III PENUTUP
A. Kesimpulan
......................................................................................................................
14
B..Saran
......................................................................................................................
14

Laporan Akhir Praktikum Website Travelpedia (OOP)

ii
KATA PENUTUP.........................................................................................................
iii

Laporan Akhir Praktikum Website Travelpedia (OOP)

iii
 BAB I
TEORI

A. Dasar Teori
Pemrograman Berorientasi Objek (Object Oriented Programming
atau OOP) merupakan paradigma pemrograman yang berorientasikan kepada
objek. Objek adalah struktur data yang terdiri dari bidang data dan metode
bersama dengan interaksi mereka untuk merancang aplikasi dan program
komputer. Semua data dan fungsi di dalam paradigma ini dibungkus dalam
kelas-kelas atau objek-objek. Bandingkan dengan logika pemrograman
terstruktur. Setiap objek dapat menerima pesan, memproses data, dan
mengirim pesan ke objek lainnya. Pada jaman sekarang, banyak bahasa
pemrograman yang mendukung OOP.
OOP adalah paradigma pemrograman yang cukup dominan saat ini,
karena mampu memberikan solusi kaidah pemrograman modern. Meskipun
demikian, bukan berarti bahwa pemrograman prosedural sudah tidak layak
lagi. OOP diciptakan karena dirasakan masih adanya keterbatasan pada
bahasa pemrograman tradisional. Konsep dari OOP sendiri adalah semua
pemecahan masalah dibagi ke dalam objek. Dalam OOP data dan fungsi-
fungsi yang akan mengoperasikannya digabungkan menjadi satu kesatuan
yang dapat disebut sebagai objek.
Proses perancangan atau desain dalam suatu pemrograman
merupakan proses yang tidak terpisah dari proses yang mendahului, yaitu
analisis dan proses yang mengikutinya. Pembahasan mengenai orientasi objek
tidak akan terlepas dari konsep objek seperti inheritanceatau penurunan,
encapsulation atau pembungkusan, dan polymorphism atau kebanyakrupaan.
Konsep-konsep ini merupakan fundamental dalam orientasi objek yang perlu
sekali dipahami serta digunakan dengan baik, dan menghindari
penggunaannya yang tidak tepat.
Model data berorientasi objek dikatakan dapat memberi fleksibilitas
yang lebih, kemudahan mengubah program, dan digunakan luas dalam teknik
piranti lunak skala besar. Lebih jauh lagi, pendukung OOP mengklaim bahwa
Laporan Akhir Praktikum Website Travelpedia (OOP)
1
 OOP lebih mudah dipelajari bagi pemula dibanding dengan pendekatan
sebelumnya, dan pendekatan OOP lebih mudah dikembangkan dan dirawat.

Laporan Akhir Praktikum Website Travelpedia (OOP)

2
 BAB II
HASIL DAN PEMBAHASAN

A. Deskripsi Website
Website Travelpedia adalah website layanan yang berfungsi untuk
menampilakn informasi tempat wisata alam, kota, dan tempat kuliner di kota
bandung. Website yang di desain dengan interface simple dan tentunya user
friendly. Website ini menggunakam Bahasa pemograman php dan javascript
yang dikombinasikan dengan css agar tampilannya lebih menarik dan di
dalamnya di sisipkan database. Dalam website ini database berisi review dari
pengguna yang telah mengunjungi tempat wisata dan tempat kuliner di
bandung.

B. Source Code
1. Index
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial
-scale=1.0">
<title> Travelpedia </title>
<link rel="stylesheet" type="text/css" href="css/style.css
">
<link rel="stylesheet" type="text/css" href="css/mobile.cs
s" media="screen and (max-width : 568px)">
<script type="text/javascript" src="js/mobile.js"></script
>
<link rel="icon" href="images/icons/it.ico">
</head>
<body onload="myFunction()" style="margin:0;">
<div id="loader"> </div>
<div style="display:none;" id="myDiv" class="animate-bottom">
<div id="header">
<a href="index.html" class="logo">
<img src="images/fix.jpg" alt="">
</a>
<ul id="navigation">
<li class="selected">

Laporan Akhir Praktikum Website Travelpedia (OOP)

3
 <a href="index.html">home</a>
</li>
<li>
<a href="about.html">about bandung</a>
</li>
<li>
<a href="nature.html">nature</a>
</li>
<li>
<a href="city.html">city tour</a>
</li>
<li>
<a href="culinary.html">culinary</a>
</li>
</ul>
<ul id="navigation">
<li>
<a href="../review/review.php"> Review Tempat
</a>
</li>
<li>
<a href="../review/daftar.php"> Daftar Review
</a>
</li>
</ul>
</div>
<div id="body">
<div id="featured">
<img src="images/1.jpg" alt="">
<div>
<h2> Bandung City </h2>
<span> Bumi Pasundan Lahir Ketika Tuhan Sedang
Tersenyum </span>
<span> M.A.W. Bouwer </span> <br>
<a href="about.html" class="more">read more</a
>
</div>
</div>
<ul>
<li>
<a href="nature.html">
<img src="images/2.jpg" alt="">
<span> Nature </span>
</a>
Laporan Akhir Praktikum Website Travelpedia (OOP)
4
 </li>
<li>
<a href="city.html">
<img src="images/3.jpg" alt="">
<span> City Tour </span>
</a>
</li>
<li>
<a href="culinary.html">
<img src="images/4.jpg" alt="">
<span> Culinary </span>
</a>
</li>
</ul>
</div>
<div id="footer">
<div>
<p>&copy; 2020 by RAN. All rights reserved.</p>
<ul>
<li>
<a href="http://instagram.com/adisuryawidu
ra/" id="instagram" target="_blank" data-toggle="tooltip" data
-placement="bottom" title="Instagram Adi Surya Widura"> <img s
rc="images/icons/ig.png"> </a>
</li>
<li>
<a href="http://instagram.com/rama.fdllh/"
id="instagram" target="_blank" data-toggle="tooltip" data-
placement="bottom" title="Instagram Rama Fadillah"> <img src="
images/icons/ig.png"> </a>
</li>
<li>
<a href="http://instagram.com/fristian_sag
a/" id="instagram" target="_blank" data-toggle="tooltip" data-
placement="bottom" title="Instagram Fristia Nopano"> <img src=
"images/icons/ig.png"> </a>
</li>
</ul>
</div>
</div>
<script>
var myVar;

function myFunction() {
Laporan Akhir Praktikum Website Travelpedia (OOP)
5
 myVar = setTimeout(showPage, 500);
}

function showPage() {
document.getElementById("loader").style.display = "none";
document.getElementById("myDiv").style.display = "block";
}
</script>
</body>
</html>

2. Nature
<!doctype html>
<!-- Website Template by freewebsitetemplates.com -->
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, init
ial-scale=1.0">
<title> Nature </title>
<link rel="stylesheet" type="text/css" href="css/style.
css">
<link rel="stylesheet" type="text/css" href="css/mobile
.css" media="screen and (max-width : 568px)">
<script type="text/javascript" src="js/mobile.js"></scr
ipt>
<link rel="icon" href="images/icons/it.ico">
</head>
<body onload="myFunction()" style="margin:0;">
<div id="loader"></div>
<div style="display:none;" id="myDiv" class="animate-
bottom">
<div id="header">
<a href="index.html" class="logo">
<img src="images/fix.jpg" alt="">
</a>
<ul id="navigation">
<li>
<a href="index.html">home</a>
</li>
<li>
<a href="about.html">about bandung</a>
</li>
Laporan Akhir Praktikum Website Travelpedia (OOP)
6
 <li class="selected">
<a href="nature.html">nature</a>
</li>
<li>
<a href="city.html">city tour</a>
</li>
<li>
<a href="culinary.html">culinary</a>
</li>
</ul>
</div>
<div id="body">
<h1><span>Nature</span></h1>
<ul class="gallery">
<li>
<a href="nature/tebing.html">
<img src="images/alam1.jpg" alt="">
</a>
</li>
<li>
<a href="nature/moko.html">
<img src="images/alam2.jpg" alt="">
</a>
</li>
<li>
<a href="nature/tangkuban.html">
<img src="images/alam3.jpg" alt="">
</a>
</li>
<li>
<a href="nature/kawah.html">
<img src="images/alam4.jpg" alt="">
</a>
</li>
<li>
<a href="nature/thelodge.html">
<img src="images/alam5.jpg" alt="">
</a>
</li>
<li>
<a href="nature/rancabali.html">
<img src="images/alam6.jpg" alt="">
</a>
</li>
Laporan Akhir Praktikum Website Travelpedia (OOP)
7
 </ul>
</div>
<div id="footer">
<div>
<p>&copy; 2020 by RAN. All rights reserved.</p>
<ul>
<li>
<a href="http://instagram.com/adisuryaw
idura/" id="instagram" target="_blank" data-
toggle="tooltip" data-placement="bottom" title="Instagram A
di Surya Widura"> <img src="images/icons/ig.png"> </a>
</li>
<li>
<a href="http://instagram.com/rama.fdll
h/" id="instagram" target="_blank" data-toggle="tooltip" da
ta-placement="bottom" title="Instagram Rama Fadillah"> <img
src="images/icons/ig.png"> </a>
</li>
<li>
<a href="http://instagram.com/fristian_
saga/" id="instagram" target="_blank" data-toggle="tooltip"
data-placement="bottom" title="Instagram Fristia Nopano">
<img src="images/icons/ig.png"> </a>
</li>
</ul>
</div>
</div>
<script>
var myVar;

function myFunction() {
myVar = setTimeout(showPage, 500);
}

function showPage() {
document.getElementById("loader").style.display = "none";
document.getElementById("myDiv").style.display = "block";
}
</script>
</body>
</html>

Laporan Akhir Praktikum Website Travelpedia (OOP)

8
 Untuk source code lebih lengkap website travelpedia ini bisa di
download di link :
https://drive.google.com/open?
id=1UiZW9kDAHreSiKbJ31uyhZyugwl4ravP

C. Sql Database
Database ini di dalamnya terdapat daftar review dari pengguna yang
telah mengunjungi tempat wisata dan kuliner di kota bandung.
-- phpMyAdmin SQL Dump
-- version 4.9.2
-- https://www.phpmyadmin.net/
--
-- Host: 127.0.0.1
-- Generation Time: Jan 22, 2020 at 03:02 PM
-- Server version: 10.4.11-MariaDB
-- PHP Version: 7.2.26

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";

SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";

/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT *

/;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS
*/;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION *
/;
/*!40101 SET NAMES utf8mb4 */;

--
-- Database: `travelpedia`
--

-- --------------------------------------------------------

--
-- Table structure for table `review`
--
Laporan Akhir Praktikum Website Travelpedia (OOP)
9
 CREATE TABLE `review` (
`id` int(4) NOT NULL,
`nama` varchar(50) NOT NULL,
`email` varchar(100) NOT NULL,
`hp` varchar(20) NOT NULL,
`namatempat` varchar(50) NOT NULL,
`review` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

--
-- Indexes for dumped tables
--

--
-- Indexes for table `review`
--
ALTER TABLE `review`
ADD PRIMARY KEY (`id`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `review`
--
ALTER TABLE `review`
MODIFY `id` int(4) NOT NULL AUTO_INCREMENT;
COMMIT;

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;

/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS *
/;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

Laporan Akhir Praktikum Website Travelpedia (OOP)

10
D. Tampilan Website
1. Index atau Dashboard

2. Nature

Laporan Akhir Praktikum Website Travelpedia (OOP)

11
 3. City

4. Tebing Keraton

Laporan Akhir Praktikum Website Travelpedia (OOP)

12
 5. Review

6. Daftar Review

Laporan Akhir Praktikum Website Travelpedia (OOP)

13
 BAB III
PENUTUP

A. Kesimpulan
Jadi website Travelpedia adalah website layanan yang berfungsi untuk
menampilakn informasi tempat wisata alam, kota, dan tempat kuliner di kota
bandung. Website yang di desain dengan interface simple dan tentunya user
friendly. Website ini menggunakam Bahasa pemograman php dan javascript
yang dikombinasikan dengan css agar tampilannya lebih menarik dan di
dalamnya di sisipkan database. Dalam website ini database berisi review dari
pengguna yang telah mengunjungi tempat wisata dan tempat kuliner di
bandung.
B. Saran
Mahasiswa dituntut lebih aktif lagi dalam pembelajaran dan tidak
bergantung pada pembelajaran di kampus. Mahasiswa diharapkan belajar
otodidak di luar kampus untuk memperdalam pengetahuan dan keterampilan
dalam mata kuliah OOP ini.

Laporan Akhir Praktikum Website Travelpedia (OOP)

14
 KATA PENUTUP

Demikian yang dapat saya paparkan mengenai materi yang menjadi pokok
pembahasan dalam laporan ini, tentunya masih banayak kekurangan dan
kelemahannya, karena terbatasnya pengetahuan dan kurangnya rujukan atau
refrensi yang ada hubungannya dengan judul laporan ini.
Penyusun banyak berharap para pembaca yang budiman bersedia
memberikan kritik dan saran yang membangun kepada penyusun demi
sempurnanya laporan ini dan penyusunan laporan di kesempatan-kesempatan
berikutnya.
Semoga makalah ini berguna juga bagi penyusun khususnya juga para
pembaca yang budiman pada umumnya.

Bandung, 14 Januari 2020

Penyusun

Laporan Akhir Praktikum Website Travelpedia (OOP)

15