SlideShare une entreprise Scribd logo
1  sur  10
Télécharger pour lire hors ligne
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
1
Contact : dltwebprogrammer@gmail.com
Website : www.dltwebdesign.com
PANDUAN
PEMROGRAMAN
BERBASIS WEB
MENGGUNAKAN HTML, PHP, DAN DATABASE MYSQL (PART 1)
By: Doni L. Tobing,S.Kom
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
2
Mengenal HTML
HTML merupakan bahasa markup yang digunakan untuk pembuatan tampilan, layout atau tata letak suatu
website.
Sintak HTML selalu dibuka dengan kode <html> dan diakhiri dengan </html>.
Berikut hierarki sintak HTML.
<html>
<head>
<title>Ini Judul Website Kamu</title>
</head>
<body>
Ini adalah tempat meletakkan isi website.
</body>
</html>
Beberapa tag penting dalam HTML :
 <b>
Berfungsi untuk menebalkan tulisan. Contoh <b>Tulisanku</b>, akan menghasilkan Tulisanku.
 <i>
Berfungsi untuk cetak miring tulisan. Contoh <i>Tulisanku</i>, akan menghasilkan Tulisanku.
 <u>
Berfungsi untuk menggarisbawahi tulisan. Contoh <u>Tulisanku</u>, akan menghasilkan Tulisanku.
 <p>
Berfungsi membuat paragraph baru
 <center>
Berfungsi mengetengahkan tulisan.
 <h1><h2><h3>..
Berfungsi membuat judul /headline dalam isi.
 <br/>
Berfungsi mengantarkan tulisan pada baris berikutnya
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
3
Membuat Tabel dengan HTML
Untuk membuat tabel digunakan perintah <table>
Contoh :
<table>
<tr><td>Nama</td><td>Usia</td></tr>
<tr><td>Budi</td><td>17</td></tr>
<tr><td>Jono</td><td>18</td></tr>
<tr><td>Agung</td><td>19</td></tr>
</table>
Akan Menghasilkan seperti berikut :
Nama Usia
Budi 17
Jono 18
Agung 19
Penjelasan
1. Perintah <table> berfungsi membuka tabel baru, yang ditutup dengan </table>
2. Perintah <tr> berfungsi membuka baris baru dan mengakhiri baris dengan </tr>
3. Perintah <td> diletakkan di dalam perintah <tr>, perintah <td> berfungsi membuka cell/blok, seperti
kode <td>Nama</td>, maka kata “Nama” akan ditulis pada satu cell/blok.
Sintak Dasar Yang Membedakan PHP dan HTML
HTML dan PHP merupakan dua bahasa yang digunakan secara bersamaan , di mana dalam hal ini HTMl
berfungsi sebagai perancang desain, layout atau tata letak yang menggambarkan suatu website. Sedangkan PHP
merupakan bahasa pemrograman yang berisi algoritma untuk mengolah suatu proses dalam website., salah
satunyai fungsi koneksi ke database.
Sintak PHP selalu dimulai dengan <? Atau <?php dan diakhiri dengan ?>. dan di dalam sintak php juga
dapat kita sisipkan kode html dengan menambahkan perintah echo “”;
Sebagai contoh :
<html>
<head>
<title>Contoh</title>
</head>
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
4
<body>
<b>Ini Contoh Pertama</b>
</body>
</html>
Selanjutnya perhatikan sintak berikut.
<html>
<head>
<title>Contoh</title>
</head>
<body>
<?php
echo “ <b>Ini Contoh Pertama</b>”;
?>
</body>
</html>
Perhatikan perbedaan kedua sintak tersebut, terlihat bahwa sintak HTML dapat dimasukkan ke dalam sintak
PHP dengan penambahan echo. Kedua sintak di atas akan menghasilkan program yang sama yaitu:
Ini Contoh Pertama
Sintak Dasar PHP
Untuk mengenal sintak dalam PHP, tentu saja kita juga harus sudah mengenal algoritma dalam pemrograman,
karena pada dasarnya semua bahasa pemrograman menggunakan algoritma yang sam. Mulai dari pengenalan
variable, proses pengulangan (looping), danmenghasilkan keluaran/output.
Di dalam PHP, setiap variable diberi tanda dollar ($).
Contoh pengenalan variable :
<?
$nama=”Budi”;
$usia=”15”;
Echo “Namaku $nama, dan usiaku $usia”;
?>
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
5
Maka hasil keluaran yang tampil adalah : Namaku Budi, dan usiaku 15
Selanjutnya untuk proses matematika :
<?
$panjang=20;
$lebar=15;
$luas=$panjang*$lebar;
Echo “ Luas Persegi Ini Adalah $luas”;
?>
Maka hasil keluaran yang tampil adalah : Luas Persegi Ini Adalah 300
Menggunakan Looping/Pengulangan Dalam PHP
Proses Looping/Pengulangan adalah salah satu proses yang sangat penting dalam pemrograman,
karena dengan menggunakan fungsi loop ini kita dapat menampilkan beberapa data secara bersamaan. Dan
dalam php sendiri fungsi loop berguna saat melakukan pemenggilan record dari database.
Di sini kita fokus pada penggunaan loop dengan while.
Contoh:
<?
$a=1;
while($a<=5){
echo "Budi<br/>";
$a=$a+1;
}
?>
Akan menghasilkan kata Budi sebanyak 5 kali.
Penjelasan :
1. $a=1; Memperkenalkan bahwa nilai variable a adalah 1;
2. Perintah while($a<=5), maksudnya selama nilai a kecil dari 5 maka perulangan akan dilakukan terus
menerus.
3. Echo “Budi<br/>”; Perintah untuk menampilkan tulisan Budi di layar. Perintah tersebut diletakkan di
dalam while, dengan tujuan untuk menampilkan kata Budi sebanyak perulangan yang terjadi.
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
6
4. $a=$a+1, maksudnya nilai variable $a akan ditambahkan 1, jika perintah tersebut tidak ada, maka
perulangan akan terjadi terus menerus dan tanpa batas.
Database MySQL
Dalam membuat suatu program atau website yang mampu menyimpan/merekam data dibutuhkan
suatu media penyimpanan yang disebut database. Dan dalam hal ini kita menggunakan database MySQL.
MySQL merupakan database yang bersifat Gratis dan bias didownload secara bebas di internet. Selain
MySQL, terdapat juga beberapa jenis database lain yang juga cukup popular, seperti Ms Access, Microsoft SQL
Server, Oracle, PostgreSQL,dll.
Ada beberapa tools yang dapat membantu kita untuk membuat database MySQL, salah satunya
phpMyAdmin. Dengan phpmyadmin kita tidak perlu lagi mengisikan sintak2 untuk membuat database, tabel
ataupun mengisikan record, karena semuanya telah disediakan dalam bentuk interface yang friendly dan
gampang untuk digunakan.
Untuk penginstalan phpMyadmin tersebut anda dapat mencarinya di beberapa sumber lain seperti buku
ataupun internet.
Berikut beberap query penting pada database MySQL, yang mungkin akan sering kita implementasikan pada
pemrograman PHP.
Misalnya kita telah memiliki data/tabel berikut. Nama Tabel : siswa
NIS Nama Kota Usia
001 Adi Padang 23
002 Budi Jakarta 24
003 Dedi Bandung 19
Pada tabel siswa tersebut kita memiliki 4 buah field, yaitu NIS, Nama, Kota, dan Usia, dan kita juga memiliki 3
buah record yaitu :
001-Adi-Padang-23
002-Budi-Jakarta-24
003-Dedi-Bandung-19.
Pada data tersebut kita dapat melihat bahwa NIS merupakan primary key(kunci utama). Yang dimaksud dengan
primary key yaitu suatu filed yang dijadikan sebagai keunikan dari suatu record. Dalam hal ini tidak ada
satupun siswa yang memiliki NIS yang sama sementara Nama, Kota, dan Usia masih ada kemungkinan sama.
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
7
Berikut beberapa perintah umum dari MySQL:
1. INSERT (Menambah record)
Perintahnya yaitu : INSERT into siswa values (‘Santi,’Pekanbaru’,’20’);
Maka record akan bertambah satu.
2. DELETE (Menghapus Record)
Perintahnya yaitu : DELETE FORM siswa where NIS=’001’;
Perintah tersebut akan menghapus record dengan NIS=001.
3. UPDATE(Mengubah Record)
Perintahnya yaitu : UPDATE siswa set nama=’Jono’ where nis=’001’
Perintah tersebut akan mengubah nama siswa dengan NIS 001 menjadi Jono.
Memulai Koneksi PHP dengan MySQL
Selanjutnya kita akan memahami bagaimana cara kerja atau proses pembacaan database menggunakan
bahasa pemrograman PHP. Berikut akan dijelaskan sedikit beberapa software yang diperlukan untuk memulai
belajar bahasa pemrograman PHP dan database MySQL
1. Notepad ++
Notepad++ merupakan software editor yang berfungsi sebagai wadah untuk menuliskan koding. Pada
dasarnya kita juga bisa menggunakan notepad, namun kita menemukan beberapa kendala pada notepad
untuk membuat program web yang lebih rumit dan kompleks. Notepad++ bias kita dapatkan di internet
dengan gratis/Free.
2. Web Server Package
Web Server Package merupakan software yang di dalamnya sudah terdapat Web Server dan database
MySQL. Contohnya seperti : XAMPP, Appserv, PHPTriad, dll, yang bisa didapatkan dengan mudah di
internet dan tentu saja gratis.
3. Browser
Browser digunakan untuk menjelajahi program/web yang kita buat.
Contoh browser : Internet Explorer, Mozilla Firefox, Google Chrome, Opera, dll
Dan penulis menganggap bahwa pembaca telah memahami cara instalasi dan fungsi ketiga software di atas.
Untuk selanjutnya kita dapat membuat sebuah database sederhana di MySQL dengan menggunakan
phpMyAdmin.
Buat database dengan nama : dbsekolah
Kemudian buat tabel siswa dengan field nip, nama, telp
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
8
Berikut perintahnya:
CREATE TABLE siswa (
nip varchar(20) NOT NULL,
nama varchar(40) NOT NULL,
telp varchar(15) NOT NULL,
PRIMARY KEY nip
);
Selanjutnya kita masukkan 2 buah data/record ke dalam tabel siswa tersebut.
Berikut perintahnya:
INSERT INTO siswa values (‘001’,’Adi’,’0751-12345’);
INSERT INTO siswa values (‘002’,’Budi’,’0751-12366’);
Maka akan terbuat tabel berikut :
Nip Nama telp
001 Adi 0751-12345
002 Budi 0751-12366
Setelah database berhasil dibuat, selanjutnya kita bekerja dengan Notepad++ untuk menghubungkan Program
Web dengan database MySQL (dbsekolah) tersebut
Buat sebuah file php dengan nama index.php. Lalu masukkan kode berikut :
<?php
$koneksiserver=mysql_connect(“localhost”,”root”,””) or die (“Gagal Koneksi ke Server”);
$koneksidatabase=mysql_select_db(“dbsekolah”) or die (“Gagal Koneksi ke Database”);
echo “ <h2>Data Siswa</h2>”;
$tampilsiswa=mysql_query(“select * from siswa”);
Nip, nama, dan telp merupakan field
dari tabel siswa
Kedua data ini merupakan record
001 dan 002 merupakan Primary Key/Kunci Utama. Karena tidak
ada satupun siswa yang memiliki nip yang sama
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
9
while($datasiswa=mysql_fetch_array($tampilsiswa)){
$noinduk=$datasiswa[‘nip’];
$namasiswa=$datasiswa[‘nama’];
$telpon=$datasiswa[‘telp’];
echo “$noinduk - $namasiswa - $telpon<br/>”;
}
?>
Penjelasan :
1. Perintah $koneksiserver=mysql_connect(“localhost”,”root”,””) or die (“Gagal Koneksi ke Server”);
merupakan perintah yang digunakan untuk melakukan koneksi ke server database. Di sini kita
memperkenalkan variable koneksi dengan nama $koneksiserver (terserah kita mau beri nama apapun
tidak masalah), selanjutnya kita tulis perintah mysql_connect(“nama server”,”username
server”,”password server”), dan di sini kita melakukan koneksi ke localhost, dengan username root, dan
tanpa password.
2. Perintah echo “ <h2>Data Siswa</h2>”; merupakan perintah untuk menulis tulisan dengan judul
(<h2>) Data Siswa.
3. Perintah $tampilsiswa=mysql_query(“select * from siswa”); maksudnya kita memperkenalkan variable
untuk membaca data tabel siswa (perintah select * from siswa).
4. Setelah query dieksekusi, selanjutnya kita akan menampilkan seluruh data yang terdapat pada tabel
siswa dengan menggunakan perulangan/looping dengan perintah while.
5. Lalu kita perkenalkan setiap field yang ada pada tabel siswa yaitu nip, nama, dan telp.
6. Lalu perintah echo “$noinduk - $namasiswa - $telpon<br/>”; akan menampilkan data/record yang telah
dipanggil. Dan perintah tersebut akan diulang sampai record yang paling akhir.
Mungkin sekian dulu pengenalan mengenai HTML, PHP, dan database MySQL. Untuk selanjutnya (Part 2) Kita
akan belajar mengenai Save, Edit, Delete data dengan menggunakan PHP.
Untuk info lengkap kunjungi : www.dltwebdesign.com
Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom
10
TENTANG PENULIS
Nama : Doni L. Tobing , S.Kom
Tempat/Tgl Lahir : Padang, 19 Januari 1992
Pendidikan : S1 Sistem Informasi Universitas Putra Indonesia
“YPTK” Padang
CONTACT
Facebook : www.facebook.com/deathaphrodite
Email : dltwebprogrammer@gmail.com
Website : www.dltwebdesign.com

Contenu connexe

Tendances

Cara mudah koneksi php dan mysql dengan database
Cara mudah koneksi php dan mysql dengan databaseCara mudah koneksi php dan mysql dengan database
Cara mudah koneksi php dan mysql dengan databaseProgrammer and Design
 
Makalah Desain web menggunakan dreamweaver 8
Makalah Desain web menggunakan dreamweaver 8Makalah Desain web menggunakan dreamweaver 8
Makalah Desain web menggunakan dreamweaver 8Ichsan Smith
 
Buku pemrograman web html-css-javascript
Buku pemrograman web html-css-javascriptBuku pemrograman web html-css-javascript
Buku pemrograman web html-css-javascriptDeka M Wildan
 
Modul dasar pemrograman web
Modul dasar pemrograman webModul dasar pemrograman web
Modul dasar pemrograman webDeka M Wildan
 
Modul pemrograman web
Modul pemrograman webModul pemrograman web
Modul pemrograman webexkun
 
Modul Web Programming dengan PHP dan MySQL
Modul Web Programming dengan PHP dan MySQLModul Web Programming dengan PHP dan MySQL
Modul Web Programming dengan PHP dan MySQLeddie Ismantoe
 
Entri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQuery
Entri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQueryEntri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQuery
Entri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQueryAchmad Solichin
 
Tutorial aplikasi toko online berbasis web dengan PHP
Tutorial aplikasi toko online berbasis web dengan PHPTutorial aplikasi toko online berbasis web dengan PHP
Tutorial aplikasi toko online berbasis web dengan PHPDeka M Wildan
 
E commerce dengan php mysql.docx
E commerce dengan php mysql.docxE commerce dengan php mysql.docx
E commerce dengan php mysql.docxCandra Adi Putra
 
Proyek+membangun+cms+tanpa+oop
Proyek+membangun+cms+tanpa+oopProyek+membangun+cms+tanpa+oop
Proyek+membangun+cms+tanpa+oopTelkomsat
 
P9 desain-web-statis-dinamis
P9 desain-web-statis-dinamisP9 desain-web-statis-dinamis
P9 desain-web-statis-dinamisrahmantaufik00
 
Sisfo akademik #1 - data kelas
Sisfo akademik #1 - data kelasSisfo akademik #1 - data kelas
Sisfo akademik #1 - data kelasDoni Andriansyah
 
Pengenalan Macromedia Dreamweaver
Pengenalan Macromedia DreamweaverPengenalan Macromedia Dreamweaver
Pengenalan Macromedia DreamweaverAchmad Solichin
 
Asas cakephp-mvc
Asas cakephp-mvcAsas cakephp-mvc
Asas cakephp-mvckriptonium
 
Buku tips & trik adobe dreamweaver cs5.5 2012_roki
Buku tips & trik adobe dreamweaver cs5.5 2012_rokiBuku tips & trik adobe dreamweaver cs5.5 2012_roki
Buku tips & trik adobe dreamweaver cs5.5 2012_rokiAmri Amri
 
Modul web design - studi kasus website portal berita
Modul web design - studi kasus website portal beritaModul web design - studi kasus website portal berita
Modul web design - studi kasus website portal beritaDoni Andriansyah
 
Web dengan php mysql dreamweaver
Web dengan php mysql dreamweaverWeb dengan php mysql dreamweaver
Web dengan php mysql dreamweaverAlbertz Ace-Red
 

Tendances (20)

Cara mudah koneksi php dan mysql dengan database
Cara mudah koneksi php dan mysql dengan databaseCara mudah koneksi php dan mysql dengan database
Cara mudah koneksi php dan mysql dengan database
 
Makalah Desain web menggunakan dreamweaver 8
Makalah Desain web menggunakan dreamweaver 8Makalah Desain web menggunakan dreamweaver 8
Makalah Desain web menggunakan dreamweaver 8
 
Buku pemrograman web html-css-javascript
Buku pemrograman web html-css-javascriptBuku pemrograman web html-css-javascript
Buku pemrograman web html-css-javascript
 
Modul dasar pemrograman web
Modul dasar pemrograman webModul dasar pemrograman web
Modul dasar pemrograman web
 
Modul pemrograman web
Modul pemrograman webModul pemrograman web
Modul pemrograman web
 
Modul Web Programming dengan PHP dan MySQL
Modul Web Programming dengan PHP dan MySQLModul Web Programming dengan PHP dan MySQL
Modul Web Programming dengan PHP dan MySQL
 
Entri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQuery
Entri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQueryEntri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQuery
Entri, Edit, Delete, Tampil (CRUD) dengan PHP dan Ajax JQuery
 
Tugas php
Tugas phpTugas php
Tugas php
 
Tutorial aplikasi toko online berbasis web dengan PHP
Tutorial aplikasi toko online berbasis web dengan PHPTutorial aplikasi toko online berbasis web dengan PHP
Tutorial aplikasi toko online berbasis web dengan PHP
 
Adit
AditAdit
Adit
 
E commerce dengan php mysql.docx
E commerce dengan php mysql.docxE commerce dengan php mysql.docx
E commerce dengan php mysql.docx
 
Proyek+membangun+cms+tanpa+oop
Proyek+membangun+cms+tanpa+oopProyek+membangun+cms+tanpa+oop
Proyek+membangun+cms+tanpa+oop
 
P9 desain-web-statis-dinamis
P9 desain-web-statis-dinamisP9 desain-web-statis-dinamis
P9 desain-web-statis-dinamis
 
Sisfo akademik #1 - data kelas
Sisfo akademik #1 - data kelasSisfo akademik #1 - data kelas
Sisfo akademik #1 - data kelas
 
Pengenalan Macromedia Dreamweaver
Pengenalan Macromedia DreamweaverPengenalan Macromedia Dreamweaver
Pengenalan Macromedia Dreamweaver
 
Laporan Aplikasi Website
Laporan Aplikasi WebsiteLaporan Aplikasi Website
Laporan Aplikasi Website
 
Asas cakephp-mvc
Asas cakephp-mvcAsas cakephp-mvc
Asas cakephp-mvc
 
Buku tips & trik adobe dreamweaver cs5.5 2012_roki
Buku tips & trik adobe dreamweaver cs5.5 2012_rokiBuku tips & trik adobe dreamweaver cs5.5 2012_roki
Buku tips & trik adobe dreamweaver cs5.5 2012_roki
 
Modul web design - studi kasus website portal berita
Modul web design - studi kasus website portal beritaModul web design - studi kasus website portal berita
Modul web design - studi kasus website portal berita
 
Web dengan php mysql dreamweaver
Web dengan php mysql dreamweaverWeb dengan php mysql dreamweaver
Web dengan php mysql dreamweaver
 

En vedette

Buat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverBuat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverHaswi Haswi
 
BUKU SMK KELAS 10 PEMROGRAMAN WEB.PDF
BUKU SMK KELAS 10 PEMROGRAMAN WEB.PDFBUKU SMK KELAS 10 PEMROGRAMAN WEB.PDF
BUKU SMK KELAS 10 PEMROGRAMAN WEB.PDFAbdulloh Aqil
 
| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...
| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...
| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...Home
 
Dasar pemrograman web HTML
Dasar pemrograman web HTMLDasar pemrograman web HTML
Dasar pemrograman web HTMLBambang Herlandi
 
Tugas modul praktikum pemrograman web
Tugas modul praktikum pemrograman  webTugas modul praktikum pemrograman  web
Tugas modul praktikum pemrograman webWayan Suntara
 
Pemrograman Web - Konsep Pemrograman Internet
Pemrograman Web - Konsep Pemrograman InternetPemrograman Web - Konsep Pemrograman Internet
Pemrograman Web - Konsep Pemrograman InternetKuliahKita
 
Rancang bangun Website penerimaan siswa baru di SMKN 3 jombang
Rancang  bangun Website penerimaan siswa baru di SMKN 3 jombang Rancang  bangun Website penerimaan siswa baru di SMKN 3 jombang
Rancang bangun Website penerimaan siswa baru di SMKN 3 jombang Unipdu
 
Tutorial Lengkap Cara Membuat Aplikasi Android Sederhana
Tutorial Lengkap Cara Membuat Aplikasi Android SederhanaTutorial Lengkap Cara Membuat Aplikasi Android Sederhana
Tutorial Lengkap Cara Membuat Aplikasi Android Sederhanacreatorb dev
 
Cara membuat web dinamis dengan php mysql part1
Cara membuat web dinamis dengan php mysql part1Cara membuat web dinamis dengan php mysql part1
Cara membuat web dinamis dengan php mysql part1Rafidi Gokil
 
Rangkuman 3 buku TA (Prototype & Test) // Sheila Arjun Friskila
Rangkuman 3 buku TA (Prototype & Test) // Sheila Arjun FriskilaRangkuman 3 buku TA (Prototype & Test) // Sheila Arjun Friskila
Rangkuman 3 buku TA (Prototype & Test) // Sheila Arjun FriskilaFriskila E P
 
Ukk 2016 - pemrograman web menggunakan wordpress - ilham fiqih
Ukk 2016 - pemrograman web menggunakan wordpress - ilham fiqihUkk 2016 - pemrograman web menggunakan wordpress - ilham fiqih
Ukk 2016 - pemrograman web menggunakan wordpress - ilham fiqihSyiroy Uddin
 
1) dasar dasar programan web
1) dasar dasar programan web1) dasar dasar programan web
1) dasar dasar programan webImam Fathur
 
Pemrograman Web - Pengenalan CSS
Pemrograman Web - Pengenalan CSSPemrograman Web - Pengenalan CSS
Pemrograman Web - Pengenalan CSSKuliahKita
 

En vedette (15)

Buat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaverBuat web dgn php mysql dreamweaver
Buat web dgn php mysql dreamweaver
 
Buku Ajar Pemrograman Web
Buku Ajar Pemrograman WebBuku Ajar Pemrograman Web
Buku Ajar Pemrograman Web
 
BUKU SMK KELAS 10 PEMROGRAMAN WEB.PDF
BUKU SMK KELAS 10 PEMROGRAMAN WEB.PDFBUKU SMK KELAS 10 PEMROGRAMAN WEB.PDF
BUKU SMK KELAS 10 PEMROGRAMAN WEB.PDF
 
| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...
| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...
| Tutorial Membuat Sebuah Aplikasi Berbasis Web | How To Create A Web-Based A...
 
Dasar pemrograman web HTML
Dasar pemrograman web HTMLDasar pemrograman web HTML
Dasar pemrograman web HTML
 
Tugas modul praktikum pemrograman web
Tugas modul praktikum pemrograman  webTugas modul praktikum pemrograman  web
Tugas modul praktikum pemrograman web
 
Pemrograman Web - Konsep Pemrograman Internet
Pemrograman Web - Konsep Pemrograman InternetPemrograman Web - Konsep Pemrograman Internet
Pemrograman Web - Konsep Pemrograman Internet
 
Rancang bangun Website penerimaan siswa baru di SMKN 3 jombang
Rancang  bangun Website penerimaan siswa baru di SMKN 3 jombang Rancang  bangun Website penerimaan siswa baru di SMKN 3 jombang
Rancang bangun Website penerimaan siswa baru di SMKN 3 jombang
 
Tutorial Lengkap Cara Membuat Aplikasi Android Sederhana
Tutorial Lengkap Cara Membuat Aplikasi Android SederhanaTutorial Lengkap Cara Membuat Aplikasi Android Sederhana
Tutorial Lengkap Cara Membuat Aplikasi Android Sederhana
 
Cara membuat web dinamis dengan php mysql part1
Cara membuat web dinamis dengan php mysql part1Cara membuat web dinamis dengan php mysql part1
Cara membuat web dinamis dengan php mysql part1
 
Pencatatan sipil
Pencatatan sipilPencatatan sipil
Pencatatan sipil
 
Rangkuman 3 buku TA (Prototype & Test) // Sheila Arjun Friskila
Rangkuman 3 buku TA (Prototype & Test) // Sheila Arjun FriskilaRangkuman 3 buku TA (Prototype & Test) // Sheila Arjun Friskila
Rangkuman 3 buku TA (Prototype & Test) // Sheila Arjun Friskila
 
Ukk 2016 - pemrograman web menggunakan wordpress - ilham fiqih
Ukk 2016 - pemrograman web menggunakan wordpress - ilham fiqihUkk 2016 - pemrograman web menggunakan wordpress - ilham fiqih
Ukk 2016 - pemrograman web menggunakan wordpress - ilham fiqih
 
1) dasar dasar programan web
1) dasar dasar programan web1) dasar dasar programan web
1) dasar dasar programan web
 
Pemrograman Web - Pengenalan CSS
Pemrograman Web - Pengenalan CSSPemrograman Web - Pengenalan CSS
Pemrograman Web - Pengenalan CSS
 

Similaire à Panduan HTML PHP MySQL

80325555 modul-7-jam-membuat-web-dari-nol
80325555 modul-7-jam-membuat-web-dari-nol80325555 modul-7-jam-membuat-web-dari-nol
80325555 modul-7-jam-membuat-web-dari-nolAgilNur1
 
Belajar php-dengan-framework-code-igniter1
Belajar php-dengan-framework-code-igniter1Belajar php-dengan-framework-code-igniter1
Belajar php-dengan-framework-code-igniter1Al-dhimas Purnama
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterGeorge Kartutu
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterMuhammad Rais
 
Php dgn framework code ignitier
Php dgn framework code ignitierPhp dgn framework code ignitier
Php dgn framework code ignitierAlbertz Ace-Red
 
Php dgn frame work code ignitier
Php dgn frame work code ignitierPhp dgn frame work code ignitier
Php dgn frame work code ignitierHaswi Haswi
 
Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3iimpunya3
 
Belajar framework code igniter xii rpl
Belajar framework code igniter xii rplBelajar framework code igniter xii rpl
Belajar framework code igniter xii rplDenny Yahya
 
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)riarel
 
Webprograming
WebprogramingWebprograming
Webprogramingandreboys
 
Manipulasi database mysql dgn php
Manipulasi database mysql dgn phpManipulasi database mysql dgn php
Manipulasi database mysql dgn phpHaswi Haswi
 
Tugas besar (pbw) web sekolah
Tugas besar (pbw)   web sekolahTugas besar (pbw)   web sekolah
Tugas besar (pbw) web sekolahrizqipratama15
 
PPT Pertemuan 06 Web Developer VSGA DTS 2022.pptx
PPT Pertemuan 06 Web Developer VSGA DTS 2022.pptxPPT Pertemuan 06 Web Developer VSGA DTS 2022.pptx
PPT Pertemuan 06 Web Developer VSGA DTS 2022.pptxAgustianNoor
 

Similaire à Panduan HTML PHP MySQL (20)

Modul web php
Modul web phpModul web php
Modul web php
 
80325555 modul-7-jam-membuat-web-dari-nol
80325555 modul-7-jam-membuat-web-dari-nol80325555 modul-7-jam-membuat-web-dari-nol
80325555 modul-7-jam-membuat-web-dari-nol
 
Belajar php-dengan-framework-code-igniter1
Belajar php-dengan-framework-code-igniter1Belajar php-dengan-framework-code-igniter1
Belajar php-dengan-framework-code-igniter1
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniter
 
Belajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniterBelajar php-dengan-framework-code-igniter
Belajar php-dengan-framework-code-igniter
 
Php dgn framework code ignitier
Php dgn framework code ignitierPhp dgn framework code ignitier
Php dgn framework code ignitier
 
Php dgn frame work code ignitier
Php dgn frame work code ignitierPhp dgn frame work code ignitier
Php dgn frame work code ignitier
 
Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3Belajar php dengan framework code igniter3
Belajar php dengan framework code igniter3
 
Belajar framework code igniter xii rpl
Belajar framework code igniter xii rplBelajar framework code igniter xii rpl
Belajar framework code igniter xii rpl
 
Php coder
Php coderPhp coder
Php coder
 
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
Belajar Framework CodeIgnitier Lengkap (bahasa Indonesia)
 
Dasar PHP
Dasar PHPDasar PHP
Dasar PHP
 
7 jam membuat web dari nol
7 jam membuat web dari nol7 jam membuat web dari nol
7 jam membuat web dari nol
 
W E B P R O G R A M M I N G
W E B  P R O G R A M M I N GW E B  P R O G R A M M I N G
W E B P R O G R A M M I N G
 
Webprograming
WebprogramingWebprograming
Webprograming
 
Web programming
Web programmingWeb programming
Web programming
 
Tutorial ci
Tutorial ciTutorial ci
Tutorial ci
 
Manipulasi database mysql dgn php
Manipulasi database mysql dgn phpManipulasi database mysql dgn php
Manipulasi database mysql dgn php
 
Tugas besar (pbw) web sekolah
Tugas besar (pbw)   web sekolahTugas besar (pbw)   web sekolah
Tugas besar (pbw) web sekolah
 
PPT Pertemuan 06 Web Developer VSGA DTS 2022.pptx
PPT Pertemuan 06 Web Developer VSGA DTS 2022.pptxPPT Pertemuan 06 Web Developer VSGA DTS 2022.pptx
PPT Pertemuan 06 Web Developer VSGA DTS 2022.pptx
 

Panduan HTML PHP MySQL

  • 1. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 1 Contact : dltwebprogrammer@gmail.com Website : www.dltwebdesign.com PANDUAN PEMROGRAMAN BERBASIS WEB MENGGUNAKAN HTML, PHP, DAN DATABASE MYSQL (PART 1) By: Doni L. Tobing,S.Kom
  • 2. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 2 Mengenal HTML HTML merupakan bahasa markup yang digunakan untuk pembuatan tampilan, layout atau tata letak suatu website. Sintak HTML selalu dibuka dengan kode <html> dan diakhiri dengan </html>. Berikut hierarki sintak HTML. <html> <head> <title>Ini Judul Website Kamu</title> </head> <body> Ini adalah tempat meletakkan isi website. </body> </html> Beberapa tag penting dalam HTML :  <b> Berfungsi untuk menebalkan tulisan. Contoh <b>Tulisanku</b>, akan menghasilkan Tulisanku.  <i> Berfungsi untuk cetak miring tulisan. Contoh <i>Tulisanku</i>, akan menghasilkan Tulisanku.  <u> Berfungsi untuk menggarisbawahi tulisan. Contoh <u>Tulisanku</u>, akan menghasilkan Tulisanku.  <p> Berfungsi membuat paragraph baru  <center> Berfungsi mengetengahkan tulisan.  <h1><h2><h3>.. Berfungsi membuat judul /headline dalam isi.  <br/> Berfungsi mengantarkan tulisan pada baris berikutnya
  • 3. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 3 Membuat Tabel dengan HTML Untuk membuat tabel digunakan perintah <table> Contoh : <table> <tr><td>Nama</td><td>Usia</td></tr> <tr><td>Budi</td><td>17</td></tr> <tr><td>Jono</td><td>18</td></tr> <tr><td>Agung</td><td>19</td></tr> </table> Akan Menghasilkan seperti berikut : Nama Usia Budi 17 Jono 18 Agung 19 Penjelasan 1. Perintah <table> berfungsi membuka tabel baru, yang ditutup dengan </table> 2. Perintah <tr> berfungsi membuka baris baru dan mengakhiri baris dengan </tr> 3. Perintah <td> diletakkan di dalam perintah <tr>, perintah <td> berfungsi membuka cell/blok, seperti kode <td>Nama</td>, maka kata “Nama” akan ditulis pada satu cell/blok. Sintak Dasar Yang Membedakan PHP dan HTML HTML dan PHP merupakan dua bahasa yang digunakan secara bersamaan , di mana dalam hal ini HTMl berfungsi sebagai perancang desain, layout atau tata letak yang menggambarkan suatu website. Sedangkan PHP merupakan bahasa pemrograman yang berisi algoritma untuk mengolah suatu proses dalam website., salah satunyai fungsi koneksi ke database. Sintak PHP selalu dimulai dengan <? Atau <?php dan diakhiri dengan ?>. dan di dalam sintak php juga dapat kita sisipkan kode html dengan menambahkan perintah echo “”; Sebagai contoh : <html> <head> <title>Contoh</title> </head>
  • 4. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 4 <body> <b>Ini Contoh Pertama</b> </body> </html> Selanjutnya perhatikan sintak berikut. <html> <head> <title>Contoh</title> </head> <body> <?php echo “ <b>Ini Contoh Pertama</b>”; ?> </body> </html> Perhatikan perbedaan kedua sintak tersebut, terlihat bahwa sintak HTML dapat dimasukkan ke dalam sintak PHP dengan penambahan echo. Kedua sintak di atas akan menghasilkan program yang sama yaitu: Ini Contoh Pertama Sintak Dasar PHP Untuk mengenal sintak dalam PHP, tentu saja kita juga harus sudah mengenal algoritma dalam pemrograman, karena pada dasarnya semua bahasa pemrograman menggunakan algoritma yang sam. Mulai dari pengenalan variable, proses pengulangan (looping), danmenghasilkan keluaran/output. Di dalam PHP, setiap variable diberi tanda dollar ($). Contoh pengenalan variable : <? $nama=”Budi”; $usia=”15”; Echo “Namaku $nama, dan usiaku $usia”; ?>
  • 5. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 5 Maka hasil keluaran yang tampil adalah : Namaku Budi, dan usiaku 15 Selanjutnya untuk proses matematika : <? $panjang=20; $lebar=15; $luas=$panjang*$lebar; Echo “ Luas Persegi Ini Adalah $luas”; ?> Maka hasil keluaran yang tampil adalah : Luas Persegi Ini Adalah 300 Menggunakan Looping/Pengulangan Dalam PHP Proses Looping/Pengulangan adalah salah satu proses yang sangat penting dalam pemrograman, karena dengan menggunakan fungsi loop ini kita dapat menampilkan beberapa data secara bersamaan. Dan dalam php sendiri fungsi loop berguna saat melakukan pemenggilan record dari database. Di sini kita fokus pada penggunaan loop dengan while. Contoh: <? $a=1; while($a<=5){ echo "Budi<br/>"; $a=$a+1; } ?> Akan menghasilkan kata Budi sebanyak 5 kali. Penjelasan : 1. $a=1; Memperkenalkan bahwa nilai variable a adalah 1; 2. Perintah while($a<=5), maksudnya selama nilai a kecil dari 5 maka perulangan akan dilakukan terus menerus. 3. Echo “Budi<br/>”; Perintah untuk menampilkan tulisan Budi di layar. Perintah tersebut diletakkan di dalam while, dengan tujuan untuk menampilkan kata Budi sebanyak perulangan yang terjadi.
  • 6. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 6 4. $a=$a+1, maksudnya nilai variable $a akan ditambahkan 1, jika perintah tersebut tidak ada, maka perulangan akan terjadi terus menerus dan tanpa batas. Database MySQL Dalam membuat suatu program atau website yang mampu menyimpan/merekam data dibutuhkan suatu media penyimpanan yang disebut database. Dan dalam hal ini kita menggunakan database MySQL. MySQL merupakan database yang bersifat Gratis dan bias didownload secara bebas di internet. Selain MySQL, terdapat juga beberapa jenis database lain yang juga cukup popular, seperti Ms Access, Microsoft SQL Server, Oracle, PostgreSQL,dll. Ada beberapa tools yang dapat membantu kita untuk membuat database MySQL, salah satunya phpMyAdmin. Dengan phpmyadmin kita tidak perlu lagi mengisikan sintak2 untuk membuat database, tabel ataupun mengisikan record, karena semuanya telah disediakan dalam bentuk interface yang friendly dan gampang untuk digunakan. Untuk penginstalan phpMyadmin tersebut anda dapat mencarinya di beberapa sumber lain seperti buku ataupun internet. Berikut beberap query penting pada database MySQL, yang mungkin akan sering kita implementasikan pada pemrograman PHP. Misalnya kita telah memiliki data/tabel berikut. Nama Tabel : siswa NIS Nama Kota Usia 001 Adi Padang 23 002 Budi Jakarta 24 003 Dedi Bandung 19 Pada tabel siswa tersebut kita memiliki 4 buah field, yaitu NIS, Nama, Kota, dan Usia, dan kita juga memiliki 3 buah record yaitu : 001-Adi-Padang-23 002-Budi-Jakarta-24 003-Dedi-Bandung-19. Pada data tersebut kita dapat melihat bahwa NIS merupakan primary key(kunci utama). Yang dimaksud dengan primary key yaitu suatu filed yang dijadikan sebagai keunikan dari suatu record. Dalam hal ini tidak ada satupun siswa yang memiliki NIS yang sama sementara Nama, Kota, dan Usia masih ada kemungkinan sama.
  • 7. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 7 Berikut beberapa perintah umum dari MySQL: 1. INSERT (Menambah record) Perintahnya yaitu : INSERT into siswa values (‘Santi,’Pekanbaru’,’20’); Maka record akan bertambah satu. 2. DELETE (Menghapus Record) Perintahnya yaitu : DELETE FORM siswa where NIS=’001’; Perintah tersebut akan menghapus record dengan NIS=001. 3. UPDATE(Mengubah Record) Perintahnya yaitu : UPDATE siswa set nama=’Jono’ where nis=’001’ Perintah tersebut akan mengubah nama siswa dengan NIS 001 menjadi Jono. Memulai Koneksi PHP dengan MySQL Selanjutnya kita akan memahami bagaimana cara kerja atau proses pembacaan database menggunakan bahasa pemrograman PHP. Berikut akan dijelaskan sedikit beberapa software yang diperlukan untuk memulai belajar bahasa pemrograman PHP dan database MySQL 1. Notepad ++ Notepad++ merupakan software editor yang berfungsi sebagai wadah untuk menuliskan koding. Pada dasarnya kita juga bisa menggunakan notepad, namun kita menemukan beberapa kendala pada notepad untuk membuat program web yang lebih rumit dan kompleks. Notepad++ bias kita dapatkan di internet dengan gratis/Free. 2. Web Server Package Web Server Package merupakan software yang di dalamnya sudah terdapat Web Server dan database MySQL. Contohnya seperti : XAMPP, Appserv, PHPTriad, dll, yang bisa didapatkan dengan mudah di internet dan tentu saja gratis. 3. Browser Browser digunakan untuk menjelajahi program/web yang kita buat. Contoh browser : Internet Explorer, Mozilla Firefox, Google Chrome, Opera, dll Dan penulis menganggap bahwa pembaca telah memahami cara instalasi dan fungsi ketiga software di atas. Untuk selanjutnya kita dapat membuat sebuah database sederhana di MySQL dengan menggunakan phpMyAdmin. Buat database dengan nama : dbsekolah Kemudian buat tabel siswa dengan field nip, nama, telp
  • 8. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 8 Berikut perintahnya: CREATE TABLE siswa ( nip varchar(20) NOT NULL, nama varchar(40) NOT NULL, telp varchar(15) NOT NULL, PRIMARY KEY nip ); Selanjutnya kita masukkan 2 buah data/record ke dalam tabel siswa tersebut. Berikut perintahnya: INSERT INTO siswa values (‘001’,’Adi’,’0751-12345’); INSERT INTO siswa values (‘002’,’Budi’,’0751-12366’); Maka akan terbuat tabel berikut : Nip Nama telp 001 Adi 0751-12345 002 Budi 0751-12366 Setelah database berhasil dibuat, selanjutnya kita bekerja dengan Notepad++ untuk menghubungkan Program Web dengan database MySQL (dbsekolah) tersebut Buat sebuah file php dengan nama index.php. Lalu masukkan kode berikut : <?php $koneksiserver=mysql_connect(“localhost”,”root”,””) or die (“Gagal Koneksi ke Server”); $koneksidatabase=mysql_select_db(“dbsekolah”) or die (“Gagal Koneksi ke Database”); echo “ <h2>Data Siswa</h2>”; $tampilsiswa=mysql_query(“select * from siswa”); Nip, nama, dan telp merupakan field dari tabel siswa Kedua data ini merupakan record 001 dan 002 merupakan Primary Key/Kunci Utama. Karena tidak ada satupun siswa yang memiliki nip yang sama
  • 9. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 9 while($datasiswa=mysql_fetch_array($tampilsiswa)){ $noinduk=$datasiswa[‘nip’]; $namasiswa=$datasiswa[‘nama’]; $telpon=$datasiswa[‘telp’]; echo “$noinduk - $namasiswa - $telpon<br/>”; } ?> Penjelasan : 1. Perintah $koneksiserver=mysql_connect(“localhost”,”root”,””) or die (“Gagal Koneksi ke Server”); merupakan perintah yang digunakan untuk melakukan koneksi ke server database. Di sini kita memperkenalkan variable koneksi dengan nama $koneksiserver (terserah kita mau beri nama apapun tidak masalah), selanjutnya kita tulis perintah mysql_connect(“nama server”,”username server”,”password server”), dan di sini kita melakukan koneksi ke localhost, dengan username root, dan tanpa password. 2. Perintah echo “ <h2>Data Siswa</h2>”; merupakan perintah untuk menulis tulisan dengan judul (<h2>) Data Siswa. 3. Perintah $tampilsiswa=mysql_query(“select * from siswa”); maksudnya kita memperkenalkan variable untuk membaca data tabel siswa (perintah select * from siswa). 4. Setelah query dieksekusi, selanjutnya kita akan menampilkan seluruh data yang terdapat pada tabel siswa dengan menggunakan perulangan/looping dengan perintah while. 5. Lalu kita perkenalkan setiap field yang ada pada tabel siswa yaitu nip, nama, dan telp. 6. Lalu perintah echo “$noinduk - $namasiswa - $telpon<br/>”; akan menampilkan data/record yang telah dipanggil. Dan perintah tersebut akan diulang sampai record yang paling akhir. Mungkin sekian dulu pengenalan mengenai HTML, PHP, dan database MySQL. Untuk selanjutnya (Part 2) Kita akan belajar mengenai Save, Edit, Delete data dengan menggunakan PHP. Untuk info lengkap kunjungi : www.dltwebdesign.com
  • 10. Panduan Pemrograman Berbasis Web | www.dltwebdesign.com | Doni L. Tobing,S.Kom 10 TENTANG PENULIS Nama : Doni L. Tobing , S.Kom Tempat/Tgl Lahir : Padang, 19 Januari 1992 Pendidikan : S1 Sistem Informasi Universitas Putra Indonesia “YPTK” Padang CONTACT Facebook : www.facebook.com/deathaphrodite Email : dltwebprogrammer@gmail.com Website : www.dltwebdesign.com