Cara Membuat Hitung Luas Bangun Datar dengan Bootstrap 4 [Part 1] | LathifPradana

Cara Membuat Hitung Luas Bangun Datar dengan Bootstrap 4 [Part 1]

Memasuki semester ke-dua ini, kita akan membahas bab PHP. Jika di semester per-tama kita membahas seputar HTML dan CSS yang bersifat statis.

Di semester ke-dua ini, kita akan membahas bab PHP yang bersifat dinamis. Di pertemuan kali ini, kita akan praktek cara menghitung luas bangun datar dengan menggunakan PHP.

Untuk materi kali ini, akan saya bagi menjadi 2 bagian. Dimana pada bagian per-tama kita akan membuat form atau tempat untuk menghitungnya. Dan di bagian yang ke-dua, kita akan belajar mengenai proses penghitungan dengan PHP.

Pembuatan form kali ini kita akan menggunakan Bootstrap versi 4. Untuk tutorial pembuatan lebih lengkap ada di situs

Bootstrap  adalah framework yang sifatnya Open Source (bebas digunakan) untuk membuat tampilan situs website.

Untuk tutorial secara lengkapnya seperti berikut :

Cara Membuat Form Hitung Bootstrap 4

  1. Silahakan download Bootstrap 4 di halaman berikut : https://getbootstrap.com/
  2. Kemudian buatlah folder baru di C:\xampp\htdocs\nama_folder. (nama_folder diganti dengan nama_kelas_kelompok)
  3. Selanjutnya silahkan buat folder "assets".
  4. Lalu ekstrak file Bootstrap 4 seperti berikut ini:
  5. Jika sudah silahkan buat file index.php seperti berikut ini:
  6. Kemudian jika sudah, silahkan kamu bikin HTML Dasar dulu di index.php
  7. Jika sudah pada dibawah <head>. Kita panggil file css dan js milik bootstrap seperti berikut :
  8. Dibagian body kita buat elementnya seperti berikut :
  9. Jika sudah coba jalankan xampp kalian seperti berikut :
  10. Jika sudah silahkan coba jalankan file PHP kalian dengan "localhost/nama_folder/"
  11. Maka hasilnya akan seperti ini :
  12. Selesai.
Untuk form kalian boleh ubah atau sesuai dengan selera kalian. Setelah part 1 selesa, silahka lanjut ke hitung bangun datar part 2. Terima kasih....

0 Response to "Cara Membuat Hitung Luas Bangun Datar dengan Bootstrap 4 [Part 1]"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel