ENGR 220 Lecture Notes - Lecture 1: Xampp, Mysql, Lake Dibawah
Modul Praktikum
Mengintegrasikan basis data dengan sebuah
Praktikum pembelajaran “
Mengintegrasikan
pemrogramman HTML, PHP dan
Database
PERSIAPAN AWAL:
v Pastikan program Xampp
sudah terinstal
v
Jika belum silahkan download terlebih dahulu
v Jalankan Web Server Apache
dan aplikasi database
v
Jika jendela XAMPP Control Panel belum terbuka,
Silahkan pilih menu tersebut dari
START
v
Pada tampilan XAMPP Control Panel ini, klik tombol
terlihat pada gambar dibawah ini:
v
Indikator warna hijau pada gambar diatas menandakan modul server apache (PHP) dan
(aktif) siap digunakan.
MATERI BELAJAR #1
Ø
Untuk siswa yang mengikuti belajar secara online / dirumah :
M
elalui browser bukalah halaman web:
atau
Untuk
siswa yang mengikuti belajar disekolah/kampus :
m
elalui browser bukalah halaman web:
atau http://192.168.4.146/materi1
Ø Amatilah dan pelajari tiap-
tiap bagian yang ada pada web tersebut
Cobalah link-link halamannya,
Cobalah masukan beberapa record data pada
Coba lakukan Edit Data, Hapus Data
dan
MODUL BELAJAR
HTML
Instuktur: Gatot Imam S.
Http:// Guruputra.com – Hp
/Wa:
Mengintegrasikan basis data dengan sebuah
web
Mengintegrasikan
basis data dengan sebuah web” ini mengguna
kan
Database
MySQL.
sudah terinstal
pada komputer/laptop anda
Jika belum silahkan download terlebih dahulu
dan install.
dan aplikasi database
MySQL.
Jika jendela XAMPP Control Panel belum terbuka,
START
->All Programs->XAMPP-
>XAMPP Control Panel
Pada tampilan XAMPP Control Panel ini, klik tombol
Start
pada bagian Apache dan MySQL, seperti yang
Indikator warna hijau pada gambar diatas menandakan modul server apache (PHP) dan
Untuk siswa yang mengikuti belajar secara online / dirumah :
elalui browser bukalah halaman web:
http://guruputra.com/rpl/materi1
siswa yang mengikuti belajar disekolah/kampus :
elalui browser bukalah halaman web:
http://192.168.0.100/materi1
tiap bagian yang ada pada web tersebut
Cobalah masukan beberapa record data pada
halaman Input Data Siswa
dan
Tampil Data, amati hasilnya
HTML
– PHP - MYSQL
Instuktur: Gatot Imam S.
, S.Kom
/Wa:
0816 708 768
kan
bahasa
>XAMPP Control Panel
.
pada bagian Apache dan MySQL, seperti yang
Indikator warna hijau pada gambar diatas menandakan modul server apache (PHP) dan
MySQL telah berjalan
MODUL BELAJAR HTML – PHP - MYSQL
Instuktur: Gatot Imam S., S.Kom
Http:// Guruputra.com – Hp/Wa: 0816 708 768
1. Bagian-bagian pada tampilan awal halaman Web Materi1 (index.php)
Jika kita amati Link (Navigasi) halaman-halaman web materi1 ini terdiri dari :
1. Link menuju ke Halaman utama atau index atau home (index.php)
2. Link menuju ke Halaman Input Siswa (inputsiswa.php)
3. Link menuju ke Halaman Tampil siswa (tampilsiswa.php)
4. Link menuju ke Halaman Engineering (enginering.php)
Bagian
Header
Bagian Navigasi
Bagian Isi
Bagian
Footer
Halaman
index.php
Halaman
inputsiswa.php
Halaman
tampilsiswa.php
Halaman
engineering
.php
MODUL BELAJAR HTML – PHP - MYSQL
Instuktur: Gatot Imam S., S.Kom
Http:// Guruputra.com – Hp/Wa: 0816 708 768
2. Membuat halaman index.php
PERSIAPAN:
v Pastikan program Xampp sudah terinstal serta aplikasi Server Apache (PHP) dan MySQL sudah berjalan pada
komputer/laptop anda
v Buatlah folder baru dengan nama WEBSISWA pada folder xampp/htdocs pada komputer/laptop anda.
v Buatlah File Baru Dan Ketik Code Php Dibawah Ini Dengan Menggunakan Notepad++ / Dream Weaver Atau
Text Editor Program lainnya, setelah selesai simpanlah pada folder WEBSISWA dengan nama index.php
<html> 1
<head> 2
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 3
<title>Sistim Informasi Siswa</title> 4
</head> 5
6
<body style="font-family:Arial, Helvetica, sans-serif"> 7
8
<!-- Kontainer ------------------------------------------------------------------------------------------> 9
<table width="900px" align="center" border="1" cellpadding="0" cellspacing="0"> 10
<tr><td> 11
12
<!-- Bagian Header ------------------------------------------------------------------------------------> 13
<table width="100%" align="center" border="0" cellpadding="3" cellspacing="0"> 14
<tr> 15
<td> 16
<img src="logosmk.jpeg" width="100" height="100"> 17
</td> 18
<td>Sistem Informasi Siswa<br>SMK Negeri 1 Ciomas<br> 19
Jl. Laladon Desa Laladon Kecamatan Ciomas Kab. Bogor 0251 7520933 20
Kode Pos 16610. 21
</td> 22
</tr> 23
</table> 24
<!-- akhir bagian Header ---------------------------------------------------------------------------> 25
Bagian Header
Bagian Navigasi
Bagian Isi
Bagian Footer
Kontainer
Document Summary
Praktikum pembelajaran mengintegrasika pemrogramman html, php dan database sikan basis data dengan sebuah web ini menggunakan base mysql. kan bahasa. Persiapan awal: v pastikan program xampp sudah terinsta v jika belum silahkan download terlebih v jalankan web server apache dan aplik v jika jendela xampp control panel belum. Silahkan pilih menu tersebut dari star v pada tampilan xampp control panel ini instal pada komputer/laptop anda bih dahulu dan install. aplikasi database mysql. elum terbuka, Materi belajar #1 (cid:216) untuk siswa yang mengikuti belajar sec. Untuk siswa yang mengikuti belajar dise melalui browser bukalah halaman web: atau http://192. 168. 4. 146/materi1 ar secara online / dirumah : web: http://guruputra. com/rpl/materi1 disekolah/kampus : web: http://192. 168. 0. 100/materi1 (cid:216) amatilah dan pelajari tiap-tiap bagian y ian yang ada pada web tersebut. Coba lakukan edit data, hapus data da d data pada halaman input data siswa dan tampil data, amati hasilnya. Instuktur: gatot imam s. , s. kom: bagian-bagian pada tampilan awal halaman web materi1 (index. php)
