Algoritma dan Pemrograman Dasar
Laporan Praktikum
Disusun Oleh:
Yogi Aji Pangestu 2070231054
Dosen Pembimbing:
Aviv Kurniawan M.Kom
Fakultas Teknik Prodi Informatika
2021
Modul 1 Latihan 1
1. Radiobutton.html Script
<!DOCTYPE html>
<html>
<Body>
<H3>Pilih Jenis Kelamin</H3>
<form>
<input type="radio" name="gender" value="laki-laki">Laki-laki <br>
<input type="radio" name="gender" value="perempuan">perempuan<br>
<input type="radio" name="gender" value="lainnya">lainnya<br>
<input type="submit" value="submit">
</form>
</Body>
</html>
Screenshot script
Screenshot Hasil output
Latihan 2 2. Button.html
Script
Screenshot script
<!DOCTYPE html>
<html>
<Body>
<H3>Pilih Makanan</H3>
<form>
<input type="button" value="Nasi Goreng"><br>
<input type="button" value="Mie Ayam"><br>
<input type="button" value="Bakso"><br>
<input type="button" value="Soto Ayam"><br><br>
<input type="submit" value="submit">
</form>
</Body>
</html>
Screenshot Hasil Out Put
Latihan 3 3. Checkbox.html
Script
Screenshot script
<!DOCTYPE html>
<html>
<Body>
<H3>Pilih Kendaraan</H3>
<form>
<input type="checkbox" value="Mobil">Mobil<br>
<input type="checkbox" value="Motor">Motor<br>
<input type="checkbox" value="Sepeda">Sepeda<br>
<input type="checkbox" value="Pesawat">Pesawat<br><br>
<input type="submit" value="submit">
</form>
</Body>
</html>
Screenshot Hasil Out Put
Latihan 4
4. Combo_box.html Script
<!DOCTYPE html>
<html>
<Body>
<H3>Kendaraan apa yang anda miliki?</H3>
<form>
<select>
<option value="Mobil">Mobil<br></option>
<option value="Motor">Motor<br></option>
<option value="Sepeda">Sepeda<br></option>
<option value="Pesawat">Pesawat</option>
</select>
<br><br>
<input type="submit" value="submit">
</form>
</Body>
</html>
Screenshot script
Screenshot Hasil Output
Modul 2 Program 2.1
1. Lat_css.html Script
<!DOCTYPE html>
<html>
<title>CSS pertama</title>
<head>
<style type = "text/css">
<!-- H1 {
font-size: :14pt;
font-style: italic;
color: green;
-->
}
</style>
</head>
<body>
<H1>CSS Pertama</H1>
Selamat mencoba CSS!
</body>
</html>
Screenshot script
Screenshot hasil output
Program 2.2 css external 2. Style.css
Script
Screenshot scipt H1 {
font-size:14pt;
font-style:italic;
color: green;
}
#tebal {
font-weight: bold;
color: blue;
}
#miring {
font-style: italic;
color: pink;
}
Program 2.3 css external2 3. External.html
Script
Screenshot script
<!DOCTYPE html>
<html>
<head>
<title>CSS Pertama</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>CSS Pertama</h1>
Selamat mencoba CSS!
</body>
</body>
</html>
Screenshot hasil output
Program 2.4 4. css1.html
script
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<body>
<h1>PANTUN</h1>
<h2 id="miring">
Kalau ada jarum yang patah<br>
jangan disimpan dalam peti
</h2>
<h3 id="tebal">
kalau ada kata yang salah<br>
Jangan disimpan dalam hati
</h3>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 2.5 5. css2.html
script
<!DOCTYPE html>
<html>
<head>
<title>Komentar</title>
<style type="text/css">
<!-- h3.merah{
color: red;
}
h3.biru {
color: blue;
} -->
</style>
</head>
<body>
<H3 CLASS ="biru"> Biru? Pasti!</H3>
<H3 CLASS ="merah"> Merah? Pasti!</H3>
<H3 CLASS ="biru "> Merah? Nggak Mungkin!</H3>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 2.6 6. css3.html
script
Screenshot script
<!DOCTYPE html>
<html>
<head>
<title>Background-color</title>
</head>
<body>
<span style="color: white; background-color: blue ;">
White diatas biru <br>
</span>
<span style="color: silver; background-color: black ; ">
Perak di atas hitam
</span>
</body>
</html>
Screenshot hasil output
Program 2.7 7. table_margin.html
script
<!DOCTYPE html>
<html>
<head>
<title>Pengaturan margin</title>
<style type="text/css">
table.margin{
margin-left: 2cm;
}
</style>
</head>
<body>
<p>
paragraf tidak di beri margin
</p>
<table class="margin" width="50%" border="1">
<tr>
<td> peratan margin kiri</td>
</tr>
<tr>
<td> </td>
</tr>
</table>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 2.8 8. link_tbganti.css
script A:link{
color: white;
text-decoration: none;
background-image: url("button.gif")50% 50% no-repeat;
padding: 0.5em;
margin: 0.5em;
display: block;
}
A:visited{
color: white;
text-decoration: none;
background-image: url("#button.gif");
padding: 0.5em;
margin: 0.5em;
display: block;
}
A:active{
color: white;
background-image: url("#button.gif");
padding: 0.5em;
margin: 0.5em;
display: block;
text-decoration: underline;
color: red;
background-image: url(#button.gif);
}
Screenshot script
Program 2.9 9. fm_btnflat.html
script
<!DOCTYPE html>
<html>
<head>
<title>Pengaturan pada form tombol</title>
<style type="text/css">
input.button{
color: #000000;
background:red;
border-color:white;
border-bottom-color:green;
border-top: 2px dotted;
border-bottom: 1px dotted;
border-left: 1px dotted;
border-right: 1px dotted;
font-family: verdana;
font-size: 12px;
}
</style>
</head>
<body>
<form name="form1" method="post" action="">
<table bordercolor="1">
<tr>
<td width="58">nama</td>
<td width="230">:
<input type="text" name="nama">
</td>
</tr>
<tr>
<td width="58">alamat</td>
<td width="230">:
<input type="text" name="alamat">
</td>
</tr>
<tr>
<td></td>
<td>
<input class="button" type="submit" name="submit"
value="submit">
<input class="button" type="submit"
name="submit2" value="simpan">
</td>
</tr>
</table>
</form>
</body>
</html>
Screenshot script
Screenshot hasil output
Tugas Pratikum Pertama Script
1. HTML
<!DOCTYPE html>
<html>
<head>
<title>REGISTER</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1 align="center">Selamat Datang</h1>
<h2 align="center">Formulir Register</h2><br>
<table bordercolor="1" border="1" align="center">
<tr>
<td>Nama Lengkap</td>
<td colspan="2">:
<input type="text" name="nama" width="">
</td>
</tr>
<tr>
<td>Tempat Lahir</td>
<td colspan="2">:
<input type="text" name="tempatlahir">
</td>
</tr>
<tr>
<td>Tanggal Lahir</td>
<td colspan="2">:
<input type="date" name="tanggallahir">
</td>
</tr>
<tr>
<td>Jenis Kelamin</td>
<td colspan="2">:
<input type="radio" name="gender" value="pria">Pria <input type="radio" name="gender" value="wanita">Wanita
</td>
</tr>
<tr>
<td>Alamat</td>
<td colspan="2">:
<textarea name="alamat"></textarea>
</td>
</tr>
<tr>
<td>Kota</td>
<td colspan="2">:
<select name="kota">
<option value="">--Pilih Kota--</option>
<option value="1">Jakarta</option>
<option value="2">Bogor</option>
<option value="3">Depok</option>
<option value="4">Tanggerang</option>
<option value="5">Bekasi</option>
</select>
</td>
</tr>
<tr>
<td >No Hp</td>
<td colspan="2">:
<input type="text" name="nohp">
</td>
</tr>
<tr>
<td>Email</td>
<td colspan="2">:
<input type="email" name="email">
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input class="button" type="submit" name="submit"
value="submit" >
<input class="button1" type="reset" name="reset"
value="reset" >
</td>
</tr>
<tr>
<td colspan="3" align="center"><a href="">Sign up?</a></td>
</tr>
</table>
</body>
</html>
Screenshot script HTML
CSS
Screenshot hasil output
Modul 3 Program 3.1
1. coba.php
script
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
</head>
<body>
<?php
print("Hi, I'm a PHP script")
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.2 2. tanggal.php
script
Screenshot script
<html>
<head>
<title> Tanggal </title>
</head>
<body>
Tanggal : <?php
/* script untuk menuliskan tanggal */
echo date ("d F Y");
?>
</body>
</html>
Screenshot hasil Output
Program 3.3 3. variable.php
script
<?php
/* deklarasi variable */
$Tanggal = date ("d m Y");
$Nama = "praktikum";
?>
<html>
<head>
<title> Variable </title>
</head>
<body>
<?php
/* script pengenalan variable */
/* memanggil variable Tanggal */
Print ("$Tanggal <BR> \n");
/* memanggil variable Nama */
Print ("$Nama, selamat datang didunia webmaster");
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.4 4. masukan.php
script
<!DOCTYPE html>
<html>
<head>
<title>Masukan</title>
</head>
<body>
<FORM ACTION="keluaran.php" METHOD="post">
Nama Anda : <BR>
<INPUT TYPE="text" NAME="nama"> <BR>
Kuliah di : <BR>
<INPUT TYPE="text" NAME="sekolah"> <BR>
<INPUT TYPE="submit"> <INPUT TYPE="reset">
</FORM>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.5 5. keluaran.php
script
Screenshot script
<!DOCTYPE html>
<html>
<head>
<title>Keluaran</title>
</head>
<body>
<?php
echo "Hai, ".$_POST ["nama"]."</br>";
echo $_POST ["sekolah"]." memang top";
?>
</body>
</html>
Screenshot hasil ouput
Noted : kodingan ini akan berhasil jika dirun lewat masukan.php
Program 3.6 6. kondisi.php
script
<!DOCTYPE html>
<html>
<head>
<title>Kondisional</title>
</head>
<body>
<?php
$Hari = date ("1");
if($Hari=="Saturday") {
Print ("Hari yang menyenangkan");
} else {
Print ("Hari yang melelahkan");
}
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.7 7. ulang.php
script
<?php
$Tanggal=date ("d F Y");
?>
<html>
<head>
<title>Pengulangan</title>
</head>
<body>
<?php
/*script pengenalan pengulangan */
Print ("$Tanggal <BR> \n");
For ($count=1; $count<=4; $count++) {
echo ("Anda adalah calon webmaster <BR> \n");
} ?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.8 8. lok_glo.php
script
<!DOCTYPE html>
<html>
<head>
<title>VARIABLE LOKAL DAN GLOBAL</title>
</head>
<body>
<?php
Function printklub ($NamaKlub) {
Print ("Klub Sepak bola adalah $NamaKlub <BR> \n");
}
Function MitraSby () {/* Variable Lokal */
$NamaKlub="Mitra Surabaya";
printKlub($NamaKlub);
}
Function persija () {/* Variable Lokal */
$NamaKlub="Persija";
printKlub($NamaKlub);}
Function Forever () {/* Variable Lokal */
$NamaKlub="AC milan";
$NamaKlub="AC milan";
printKlub($NamaKlub);
}
/* Variable Global */
$NamaKlub = "AC Milan";
Forever();
MitraSby();
Persija();
Forever();
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.9 9. operator.php
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<?php
$Harga = 100;
$Pengunjung = 8;
Print("Jumlah pengunjung hari ini $Pengunjung <BR> \n");
Print("Total Pendapatan :");
Print ($Harga * $Pengunjung);
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 3.10 10. ekspresi.php
script
<!DOCTYPE html>
<html>
<head>
<title>EKSPRESI</title>
</head>
<body>
<?php
Print ((4+1*2). "<BR> \n");
Print (((4+1)*2). "<BR> \n");
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Tugas Modul 3 1. script
<?php
$namaBulan =
array("Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","
Oktober","November","Desember");
echo "<b>Menampilkan Isi Array berdasarkan Index</b><br><br>";
echo "Bulan ke 1 : ". $namaBulan [0]."<br>";
echo "Bulan ke 2 : ". $namaBulan [1]."<br>";
echo "Bulan ke 3 : ". $namaBulan [2]."<br>";
echo "Bulan ke 4 : ". $namaBulan [3]."<br>";
echo "Bulan ke 5 : ". $namaBulan [4]."<br>";
echo "Bulan ke 6 : ". $namaBulan [5]."<br>";
echo "Bulan ke 7 : ". $namaBulan [6]."<br>";
echo "Bulan ke 8 : ". $namaBulan [7]."<br>";
echo "Bulan ke 9 : ". $namaBulan [8]."<br>";
echo "Bulan ke 10 : ". $namaBulan [9]."<br>";
echo "Bulan ke 11 : ". $namaBulan [10]."<br>";
echo "Bulan ke 12 : ". $namaBulan [11]."<br>";
?>
Screenshot kodingan
Screenshot hasil output
2. script
<html>
<head>
<title>Membuat Kalkulator Sederhana</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<?php
if(isset($_POST['hitung'])){
$bil1 = $_POST['bil1'];
$bil2 = $_POST['bil2'];
$operasi = $_POST['operasi'];
switch ($operasi) { case 'tambah':
$hasil = $bil1+$bil2;
break;
case 'kurang':
$hasil = $bil1-$bil2;
break;
case 'kali':
$hasil = $bil1*$bil2;
break;
case 'bagi':
$hasil = $bil1/$bil2;
break;
} }
?>
<div class="kalkulator">
<h2 class="judul">KALKULATOR SEDERHANA</h2>
<input type="text" name="bil1" class="bil" autocomplete="off"
placeholder="Masukkan Bilangan Pertama">
<input type="text" name="bil2" class="bil" autocomplete="off"
placeholder="Masukkan Bilangan Kedua">
<select class="opt" name="operasi">
<option value="tambah">+</option>
<option value="kurang">-</option>
<option value="kali">x</option>
<option value="bagi">/</option>
</select>
<input type="submit" name="hitung" value="Hitung"
class="tombol">
</form>
<?php if(isset($_POST['hitung'])){ ?>
<input type="text" value="<?php echo $hasil; ?>" class="bil">
<?php }else{ ?>
<input type="text" value="0" class="bil">
<?php } ?>
</div>
</body>
</html>
Screenshot script
Screenshot hasil output
3. script HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Membuat Form Sederhana</title>
</head>
<body>
<form action="Tugas3.php" method="POST">
<div>
<label>Your Name</label> <br>
<input name="nama" type="text" placeholder="Masukkan nama">
</div>
<div>
<label>Your Password</label> <br>
<input name="password" type="text" placeholder="Masukkan password">
</div>
<div>
<div>
<label>Your Age</label> <br>
<input name="umur" type="text" placeholder="Masukkan umur">
</div>
<div>
<label>Your Life Story</label> <br>
<input name="cerita" type="text" placeholder="Masukkan cerita">
</div>
<div>
<label>Your Favorite Sport</label> <br>
<input name="olahraga" type="text" placeholder="Masukkan olahraga">
</div>
<div>
<label>Language you choose</label> <br>
<input name="bahasa" type="text" placeholder="Masukkan bahasa">
</div>
<button>Submit</button>
</div>
</form>
</body>
</html>
PHP
<?php
$YourName = @$_POST['nama'];
$YourPassword = @$_POST['password'];
$YourAge = @$_POST['umur'];
$YourLifeStory = @$_POST['cerita'];
$YourFavoriteSport = @$_POST['olahraga'];
$LanguageYouChoose = @$_POST['bahasa'];
echo "Your name : ".$YourName. "<br>";
echo "Your password : ".$YourPassword. "<br>";
echo "Your age : ".$YourAge. "<br>";
echo "Your life story : ".$YourLifeStory. "<br>";
echo "Your favorite sport : ".$YourFavoriteSport. "<br>";
echo "Language you choose : ".$LanguageYouChoose. "<br>";
?>
Screenshot script HTML
PHP
Screenshot hasil output
Modul 4 Program 4.1
1. if.php
<!DOCTYPE html>
<html>
<head>
<title>IF</title>
</head>
<body>
<?php
$X=100;
$Y=50;
if ($X > $Y) {
Print ("X Lebih besar dari Y");
} ?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 4.2 2. ifelse.php
<!DOCTYPE html>
<html>
<head>
<title>IF ELSE</title>
</head>
<body>
<?php $X=100;
$Y=50;
if ($X > $Y) {
Print ("X Lebih besar dari Y");
} else
{
Print ("X Lebih kecil dari Y");
} ?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 4.3 3. switch.php
<!DOCTYPE html>
<html>
<head>
<title>Switch</title>
</head>
<body>
<?php
$indonesian_day=date("l");
Switch($indonesian_day) {
case "Monday":
$indonesian_day = "Senin";
break;
case "Tuesday":
$indonesian_day = "Senin";
break;
case "Wednesday":
$indonesian_day = "Rabu";
break;
case "Thursday":
case "Thursday":
$indonesian_day = "Kamis";
break;
case "Friday":
$indonesian_day = "Jumat";
break;
case "Saturday":
$indonesian_day = "Sabtu";
break;
case "Sunday":
$indonesian_day = "Minggu";
break;
}
print ("Hari ini adalah hari $indonesian_day") ?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 4.4 4. for.php
<!DOCTYPE html>
<html>
<head>
<title>FOR</title>
</head>
<body>
<?php
for ($i=3; $i<=7; $i++) {
print("<font size=$i>ERZA</font><br>");
}
?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 4.5 5. while.php
<!DOCTYPE html>
<html>
<head>
<title>while</title>
</head>
<body>
<?php $i=1;
while($i<=7) {
print ("$i<br>");
$i++;
} ?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 4.6 6. dowhile.php
<!DOCTYPE html>
<html>
<head>
<title>dowhile</title>
</head>
<body>
<?php $i=1;
do {
print ("$i<br>");
$i++;
}
while($i<=7) ?>
</body>
</html>
Screenshot script
Screenshot hasil output
Program 4.7 7. array1.php
Screenshot script
<?php
$nama_bulan=array("Januari","Februari","Maret","April","Mei","Juni", "Juli","Agustus","September","Oktober","November","Desember");
$bulan_ini=$nama_bulan[date("m")-1];
echo "Sekarang Bulan <b>$bulan_ini</b>";
?>
Screenshot hasil output
Program 4.8 8. arraystring.php
<html>
<head>
<title>Array Urut</title>
</head>
<body>
<?php
$teksl="Pemrograman Web dengan PHP";
print("Teks Asli $teksl :<br>");
$hasil = explode(" ",$teksl);
print("<b>Setelah explode:</b><br>");
print_r($hasil);
print("<br>");
$gabungl = implode("-",$hasil);
$gabung2 = join("-",$hasil);
print("<b>Setelah implode:</b><br>");
print_r($gabungl);
print("<br>");
print("<b>Setelah implode:</b><br>");
print_r($gabung2);
print("<br><br>");
$teks2="17.7.2005";
$apisah1=preg_split('[/.-]',$teks2);
print("Teks Asli:$teks2<br>");
print_r($apisah1);
print("<br><br>");
$teks3="PEMPROGRAMAN PHP";
$apisah2 = preg_split('//',$teks3,-1,PREG_SPLIT_NO_EMPTY);
$banyak = sizeof($apisah2);
print("Teks Asli: $teks3 <br>");
Screenshot script
print("Teks Asli: $teks3 <br>");
print("<b>Setelah preg_split:</b><br>");
$i=0;
while($i<$banyak) {
print($apisah2[$i]."");
$i++;
} ?>
</body>
</html>
Screenshot hasil output
Program 4.9
9. array_multidimensi.php
<?php
$data=@array(
array("Judul" =>"Keamanan Jaringan Internet","Pengarang" =>"Onno W Purbo",),
array("Judul" =>"Pengenalan SQL","Pengarang" =>"Sri Wahyuni",), array("Judul" =>"Network Security","Pengarang" =>"TOM Thomas",),
);
echo"Array Multidimensi<br><br>";
foreach($data as $val) {
foreach($val as $key => $data2) {
echo"$key: $data2 <br>";
}
echo"<br>";
}
?>
Screenshot script
Screenshot hasil output
TUGAS PRAKTIKUM MODUL 4 1. Script
<html>
<head><title>Jumlah Biaya untuk Korban Gempa Bumi</title>
<style type="text/css">
body {
font-family:Arial;
}
#canvas { width:600px;
background-color:grey;
padding:20px;
margin: auto;
} H2 {
text-align : center;
color:white;
}
</style>
</head>
<body>
<div id="canvas">
<h2>Biaya Korban Gempa Bumi</h2>
<form>
<table border="1" width="100%" style="background-color:brown;color:white;border- collapse:collapse">
<tr style="text-align:left" style="cellpadding:10">
<thead>
<th>No</th><th>Korban</th><th>Biaya perbulan</th><th>Qty</th>
</tr>
</thead>
<tr>
<td>1</td><td>Balita</td><td><input type="text" id="biaya_balita" value=""
onchange="total()"></td><td><input type="number" id="qty_balita" value=""
onchange="total()">
</tr>
<tr>
<td>2</td><td>Diatas Balita</td><td><input type="text" id="biaya_balita2" value=""
onchange="total()"></td><td><input type="number" id="qty_balita2" value=""
onchange="total()">
</tr>
<tr>
<td colspan="3">Grand Total</td><td><input type="text" id="total_harga"
value="0"></td>
</tr>
</table>
</form>
</div>
</body>
</html>
<!--Menghitung fungsi total-->
<script type="text/javascript">
function total() {
var biaya_balita = document.getElementById('biaya_balita').value *
document.getElementById('qty_balita').value;
var biaya_balita2 = document.getElementById('biaya_balita2').value *
document.getElementById('qty_balita2').value;
var grand_total= biaya_balita + biaya_balita2 ;
document.getElementById('total_harga').value = grand_total;
}
</script>
Screenshot script
Screenshot hasil output
2. Script
<?php
$a = "abc";
$b = "de";
$c = $a . $b;
echo '$data = ' . $c ;
echo '<br>';
$x = "bcde";
$y = " = {$x}";
echo '$potongan_satu' . $y;
echo '<br>';
$x = "cde";
$y = " = {$x}";
echo '$potongan_dua' . $y;
echo '<br>';
$x = "de";
$y = " = {$x}";
echo '$potongan_tiga' . $y;
echo '<br>';
$x = "e";
$y = " = {$x}";
echo '$potongan_empat' . $y;
echo '<br>';
$x = "bcdecdedee";
$y = " = {$x}";
echo 'Digabung menjadi' . $y;
?>
Screenshot script
Screenshot hasil output
