M3118066 - One Octadion - TIC - Modularitas PDF

LAPORAN PRAKTIKUM
PEMROGRAMAN WEB
Dosen Pembimbing Sahirul Alim Tri Bawono, S.Kom., M.Eng..
Disusun Oleh
Nama : One Octadion
NIM : M3118066
Kelas : TI-C
D3 TEKNIK INFORMATIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS SEBELAS MARET
SURAKARTA
2019
A. Dasar Teori
a) PHP
PHP adalah bahasa pemrograman script server-side yang didesain untuk
pengembangan web. Selain itu, PHP juga bisa digunakan sebagai bahasa
pemrograman umum (Wikipedia).
PHP disebut bahasa pemrograman server side karena PHP diproses pada
komputer server. Hal ini berbeda dibandingkan dengan bahasa pemrograman
client-side seperti JavaScript yang diproses pada web browser (client).
Web yang dihasilkan dengan HTML (dan CSS) ini dikenal dengan website
statis, dimana konten dan halaman web bersifat tetap. Sebagai perbandingan,
website dinamis yang bisa dibuat menggunakan PHP adalah situs web yang bisa
menyesuaikan tampilan konten tergantung situasi
b) Modularitas
Pada pemrograman yang besar biasanya dipecah/dibagi menjadi program-
program kecil yang selanjutnya disebut modul. Modul ini kemudian dapat
dipanggil dan digunakan sewaktu-waktu jika diperlukan.
Pada PHP konsep ini disebut modularitas di mana kita dapat menyisipkan
suatu modul/file php lain ke suatu modul/file php tertentu.
Modularitas di PHP dapat dilakukan dengan perintah/fungsi include(),
include_once(), require(), dan require_once(). Memang fungsi dari keempatnya
adalah sama yaitu untuk menyisipkan modul/file php lain ke suatu modul/file php
tertentu. Yang membedakan di sini adalah fungsi include akan menjalankan sampai
selesai file php yang disisipkan meskipun terdapat eror diawal program. Sedangkan
fungsi require tidak akan menjalankan file php yang disisipkan jika terdapat eror
di awal program.
B. Langkah Praktikum
1) Membuat file index
<html>
<head>
<title> Web Profile </title>
</head>
<body>
<?php
include "menu.php";
?>
<p>
<?php
if(!isset($_GET['menu']) || $_GET['menu']=='beranda'){
require "./modul/home/beranda.php";
}
//print "hallo";
?>
<p>
<?php
if(!isset($_GET['menu']) || $_GET['menu']=='kontak'){
require "./modul/kontak/kontak.php";
}
?>
<p>
<?php
if(!isset($_GET['menu']) || $_GET['menu']=='tentang'){
require "./modul/tentang saya/tentang_saya.php";
}
?>
<p>
<?php
if(!isset($_GET['menu']) || $_GET['menu']=='login'){
require "./modul/login/login.php";
}
?>
</p>
</body>
</html>
Keterangan: membuat file index yang akan digunakan untuk memanggil file file php seperti
kontak dengan fungsi require, dan juga fungsi if agar antar file halaman bisa berpindah
2) Membuat file menu
<a href="./index.php?menu=beranda"> Beranda</a> |
<a href="./index.php?menu=tentang">Tentang Saya</a> |
<a href="./index.php?menu=kontak">Kontak</a> |
<a href="./index.php?menu=login">Login</a> |
Hasil:
Keterangan: membuat file menu yang akan digunakan sebagai tombol untuk berpindah
antar halaman pada menu
3) Membuat beranda, kontak, login dan tentang pada modul
Hasil:
Keterangan: membuat modul yang berisi file file pada menu, lalu mengisi
file tersebut
C. Soal dan Pembahasan
Soal:
Buatlah satu halaman yang dibagi menjadi 3 frame kemudian dengan menggunakan
require atau include menjadikan halaman inti berubah-ubah halaman (minimal 5
halaman) sesuai dengan link yang disediakan. Dengan salah satunya adalah halaman
form.
Pembahasan: 1. Membuat program index
Program Keterangan
<html> Membuat
<body> index, dan
<head>
<title>Web profile</title> menggunaka
</head> n fungsi
<body> require untuk
<?php memanggil
require ("header.php");
?>
header,
<div class="container"> menu, dan
<?php konten.
require ("menu.php");
?>
</div>
<div class="container">
<table border='1'>
<tr>
<td><?php
require ("konten.php");
if(!isset($_GET['menu']) || $_GET['menu']=='beranda'){ Membuat

require "./modul/home/view_beranda.php"; fungsi if
} untuk
else if(!isset($_GET['menu']) ||
berpindah
$_GET['menu']=='tentang'){
require "./modul/ttg_saya/ttg_saya.php"; halaman
} ketika nilai
else if(!isset($_GET['menu']) || menu diisi.
$_GET['menu']=='kontak'){ Dan fungsi
require "./modul/kontak/kontak.php"; require untuk
} memanggil
else if(!isset($_GET['menu']) || file halaman
$_GET['menu']=='register'){ tersebut
require "./modul/register/register.php";
}
else if(!isset($_GET['menu']) ||
$_GET['menu']=='login'){
require "./modul/login/login.php";
}
?></td>
</tr>
</table>
</div>
<?php Membuat
require ("footer.php"); fungsi require
?> untuk
memanggil
</body> footer
</html>
Hasil
<a href=" ./indexxx.php?menu=beranda">Beranda</a> | Membuat

<a href=" ./indexxx.php?menu=tentang">Tentang Saya</a> |
file
<a href=" ./indexxx.php?menu=kontak">Kontak</a> |
<a href=" ./indexxx.php?menu=register">Register</a> | menu.php
<a href=" ./indexxx.php?menu=login">Login</a> | yang berisi
tombol menu
dan alamat
nya utuk
pindah ke
halaman
yang di klik
<!DOCTYPE html> Membuat
<html lang="en">
file
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, header.php
initial-scale=1"> yang akan
<link rel="stylesheet" dipanggil di
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bo index. header
otstrap.min.css">
<script
ini
src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jque menggunaka
ry.min.js"></script> n file css.
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/boot
strap.min.js"></script>
<style>
.page-header {
color: white;
}
.page-header small{
color: black;
}
.page-header {
background-color: lightblue;
}
</style>
<body>
<head>
<title>Web profile</title>
</head>
<body>
<div class="page-header {color: blue;}">
<h1>Octadion<small>Coba coba</small></h1>
</div>
</div>
</body>
</html
Hasil frame
header
<!DOCTYPE html> Membuat file

<html> konten.php
<head> yang nantinya
<meta name="viewport" content="width=device-width, initial-
dipanggil oleh
scale=1">
<style> index untuk
body {font-family: Arial, Helvetica, sans-serif;} template
form {border: 8px solid #f1f1f1;} konten.
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
button {
background-color: #0000FF;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
button:hover {
opacity: 0.8;
}
.cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 3px;
}
span.psw {
float: right;
padding-top: 16px;
}
/* Change styles for span and cancel button on extra small

screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
</style>
</head>
<body>
<div class="container" style="background-color:#f1f1f1">
<p><center>konten</h2></p>
</div>
</div>
</body>
</html>
Hasil frame
konten
<h3><center>Beranda</center></h3> Membuat
<a href=" ./indexxx.php?menu=beranda">Beranda</a> file isi
<br> Ini adalah web octadion, selamat datang</br>
<br> beranda,
<a href=" ./indexxx.php?menu=tentang">Tentang Saya</a> view_berand
<br>Nama saya adalah One Octadion, saya adahalah mahasiswa a.php
Teknik Informatika Vokasi UNS. <a href="
./indexxx.php?menu=tentang">teruskan baca..</a><br>
<br>
<a href=" ./indexxx.php?menu=kontak">Kontak</a>
<br>Hubungi saya di <a href=" ./indexxx.php?menu=kontak">...
</a>
<br>
<a href=" ./indexxx.php?menu=login">Login</a>
<br>loogun
<br>
Hasil
view_beranda.
php
<h3><center>Kontak</center></h3> Membuat isi

<br> menu kontak,
<table border='1'> kontak.php
<tr>
<td>Whatsapp: +6285707458151</td></tr>
<tr>
<td>Facebook: Octa Dion</td>
</tr>
<tr>
<td>Twitter: @octadion_</td>
</tr>
</table>
Hasil
kontak.php
<!DOCTYPE html> Membuat isi

<html> login,
<head> login.php
<meta name="viewport" content="width=device-width, initial-
dengan css
scale=1">
<style>
body {font-family: Arial, Helvetica, sans-serif;}
form {border: 0px solid #f1f1f1;}
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
button {
background-color: #0000FF;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
button:hover {
opacity: 0.8;
}
.cancelbtn {
width: auto;
padding: 5px 18px;
background-color: #f44336;
}
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
}
img.avatar {
width: 40%;
border-radius: 50%;
}
.container {
padding: 3px;
}
span.psw {
float: right;
padding-top: 5px;
}
/* Change styles for span and cancel button on extra small

screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
</style>
</head>
<body>
<h3><center>Login Form</h3></center>
<form action="/action_page.php" method="post">

<label for="uname"><b>Username</b></label>
<input type="text" placeholder="Enter Username"
name="uname" required>
<label for="psw"><b>Password</b></label>
<input type="password" placeholder="Enter Password"
name="psw" required>
<button type="submit" name="tombol">Login</button>

<label>
<input type="checkbox" checked="checked"
name="remember"> Remember me
</label>
</div>

<button type="button" class="cancelbtn">Cancel</button>
<span class="psw">Forgot <a
href="#">password?</a></span>
</div>
</form>
</body>
</html>
Hasil
login.php
<html> Membuat isi

<head> menu register,
</head> register.php
<body>
<h3><center>Register</h3></center>
<pre>
Nama :<input required type="text" name="nama">
Password :<input required type="password" name="password">
Jenis Kelamin :
<input checked type="radio" name="jk" value="laki-laki"> -
pria
<input type="radio" name="jk" value="perempuan"> - wanita
Warga Negara :<input type="checkbox" name="wni">WNI
<input type="submit" name="input" value="REGISTER">
</pre>
</form>
</body>
</html>
Hasil file
register.php
<h3><center>Tentang</center></h3> Membuat isi

<br>Nama saya adalah One Octadion, saya adahalah mahasiswa menu tentang
Teknik Informatika Vokasi UNS.<br> saya,
saya lahir di Bojonegoro, pada tanggal 25 Oktober 1999. hobi
ttg_saya.php
saya adalah menggambar, genjreng genjreng gitar dan ngegame
<br>cita cita ku adalah suatu saat nanti bisa memiliki
perusahaan yang menyaingi Google, hahahaha.<br>
<br>
Hasil tentang
 Membuat file

<footer class="page-footer font-small blue"> footer.php
<div class="container" style="background-color:lightblue"> yang nantinya
<div class="footer-copyright text-center py-3">© 2018
dipanggil di
Copyright:
<a href="https://mdbootstrap.com/education/bootstrap/"> index, file
MDBootstrap.com</a> footer
</div> menggunakan
</div> css.
</footer>
Hasil frame
footer
D. Kesimpulan
Dengan adanya praktikum ini, saya dapat memahami modularitas pada php
dengan lebih baik, dimana kita dapat menyisipkan modul pada sebuah file php, dan juga apa
itu fungsi require dan include untuk menyisipkan sebuah file.

M3118066 - One Octadion - TIC - Modularitas PDF

Diunggah oleh

Informasi Dokumen

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

M3118066 - One Octadion - TIC - Modularitas PDF

Diunggah oleh

Hak Cipta:

Format Tersedia

LAPORAN PRAKTIKUM

if(!isset($_GET['menu']) || $_GET['menu']=='beranda'){ Membuat

<a href=" ./indexxx.php?menu=beranda">Beranda</a> | Membuat

<!DOCTYPE html> Membuat file

/* Change styles for span and cancel button on extra small

<div class="container" style="background-color:#f1f1f1">

<h3><center>Kontak</center></h3> Membuat isi

<!DOCTYPE html> Membuat isi

/* Change styles for span and cancel button on extra small

<form action="/action_page.php" method="post">

<button type="submit" name="tombol">Login</button>

<div class="container" style="background-color:#f1f1f1">

<html> Membuat isi

<h3><center>Tentang</center></h3> Membuat isi

Membuat file

Anda mungkin juga menyukai