Selasa, 14 Maret 2017

Cara Membuat Kalkulator Sederhana Dengan PHP

  3 komentar

Script Kiddies - Pada postingan kali ini saya akan share kepada sobat semua Cara Membuat Kalkulator Sederhana Dengan PHP. Sebelum kita belajar cara menggunakan bahasa pemrograman PHP kita harus mengetahui apa itu PHP. PHP / Hypertext Preprocessor Adalah bahasa skrip yang dapat ditanamkan atau diselipkan dalam HTML. Kalkulator Sederhana adalah bahasa pemrograman dasar dalam PHP jadi jangan terlalu bangga jikalau sobat sudah bisa membuat Kalkulator Sederhana :P

Saya harapkan sobat sudah menginstal apache di Linux sobat atau yang menggunakan Windows sudah memiliki aplikasi xampp  Ok langsung kita menuju ke tutornya  

File Yang Harus di Buat :
  • kalkulator.php
  • style.css
Lanjut ke Tutor :
1. Sediakan text editor disini saya menggunakan Sublime 2. Ketikkan Script berikut : 

<?php
 if (isset($_POST['proses'])) {
 $pertama = $_POST['pertama'];
 $kedua = $_POST['kedua'];
 $operasi = $_POST['operasi'];
  switch ($operasi) {
   case 'tambah':
    $hasil = $pertama + $kedua;
   break;
   case 'kurang':
    $hasil = $pertama - $kedua;
   break;
   case 'kali':
    $hasil = $pertama * $kedua;
   break;
   case 'bagi':
    $hasil = $pertama / $kedua;
   }
}
 ?>
<!DOCTYPE HTML>
<html>
  <head>
  <meta charset="utf-8">
  <title>Script Kiddies Kalkulator Sederhana</title>
  <link href="style.css" rel="stylesheet" type="text/css">

 <body>
 <div class="kalkulator">
  <h1>KALKULATOR</h1>
  <form action="" action="" method="post">
   <input class="number" type="number" name="pertama" placeholder="Masukkan Bilangan Pertama">
   <input class="number" type="number" name="kedua" placeholder="Masukkan Bilangan Kedua">
   <select class="option" name="operasi">
    <option value="tambah">+</option>
    <option value="kurang">-</option>
    <option value="kali">x</option>
    <option value="bagi">/</option>
   </select>
   <input type="submit" name="proses" class="tombol" value="Hitung">
  </form>

  <?php if(isset($_POST['proses'])){ ?>
   <input type="text" value="<?php echo $hasil; ?>" class="number">
  <?php }else{ ?>
   <input type="text" value="0" class="number">
  <?php } ?> <br>
    <a class="sumber" href="https://script-kiddies22.blogspot.com">SCRIPT KIDDIES</a>
</div>
 </body>
 </html>

3. Disini saya menggunakan Linux, maka saya simpan di directori file system/var/www/html simpan dengan nama kalkulator.php 

4. Kita berikan sentuhan CSS agar tampilan lebih menarik. Ketikkan Script berikut dan simpan dengan nama style.css dan simpan dalam satu folder dengan kalkulator.php

body{
 background: whitesmoke;
 font-family: "Times New Roman" times, serif;
}
.kalkulator{
 width: 360px;
 background: gold;
 margin: 130px auto;
 padding: 10px 20px 60px 20px;
 border-radius: 8px;
 box-shadow: 0px 10px 10px 0 #D1D1D1;
}
.number{
 width: 330px;
 margin: 5px;
 border: none;
 font-size: 16pt;
 border-radius: 5px;
 padding: 10px;
}
.option{
 font-size: 20pt;
 width: 180px;
 margin: 5px;
 border: 20px;
 border-radius: 5px;
 padding: 10px;
}
.tombol{
 background: crimson;
 border-top: 2px solid white;
 border-left: 2px solid white;
 border-right: 2px solid white;
 margin-left: 13px;
 border-radius: 10px;
 padding: 12px 30px;
 font-size: 25px;
 color: #fff;
 border-bottom: 2px solid white;
}
h1{
 text-align: center;
 font-family: sans-serif;
 color: orangered;
}
.sumber{

 text-decoration: none;
 font-family: sans-serif;
 text-align: right;
 color: white;
 float: right;
 padding: 10px;

}

4. OK Sekarang kita tinggal cek hasil pekerajaan kita dengan mengetikkan localhost/kalkulator.php 


Oke saya jelaskan sedikit mengenai syntax php kalkulatoryang telah kita buat



Saya menggunakan method POST untuk penanganan data yang di input, pada bilangan satu saya memberikan nama "pertama" dan bilangan kedua "kedua". Dan bagian operatornya saya memberikan nama operasi yang masing - masing valuenya bisa anda perhatikan sendiri ( cek option value=" " ) . form action saya kosongkan karena action form akan diproses dalam file kalkulator.php bukan ke file yang lain kemudian perhatikan pada bagian penangkapan data dari form.



function isset() berfungsi untuk memeriksa ketersediaan data. Jadi disini saya membuat pengecekan untuk data submit dar formm. Berarti jika form di Submit maka data yang diinputkan dari form saya simpan pada masing - masing variabel. Selanjutnya saya menggunakan fungsi switch case pada php untuk mengecek operasi yang di pilih sebelum form disubmit



Pengecekan dengan switch case ini berfungsi untuk memeriksa opsi apa yang dipilih pengguna untuk menghitung bilangan, Jadi jika pengguna memlih tambah berarti bilangan " pertama " ditambah " kedua " ( $hasil = $pertama + $kedua ) begitujuga dengan opsi kurang, kali, dan bagi Sampai di sini kita sudah memiliki hasil dari operasi aritmatikanya. Kemudian yang harus kita lakukan adalah menampilkan hasil operasinya.



kita periksa apakah submit telah di lakukan seperti cara di atas. Kemudian jika form sudah disubmit otomatis kita sudah memiliki hasilnya ( hasil dari switch case tadi).


Tampilan sebelum dihitung
sesudah dihitung

Cukup sekian dari sini postingan semoga membantu sobat, jika sobat mengalama kesulitan jangan sungkan - sungkan untuk memberikan komentar pada kolom dibawah .. Sekian Terima Kasih 

Referensi Script : Malas Ngoding
Kunjungi Juga Blog Saya : www.tampancips.com

3 komentar :