![Page 1: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/1.jpg)
HTML, CSS, JavaScript, PHP ( untuk kalangan Sendiri )
DAFTAR ISI
HTML (HYPERTEXT MARKUP LANGUAGE)....................................................................11. ELEMEN DASAR HTML ............................................................................................12. <BR>..............................................................................................................................13. <P></P>.........................................................................................................................14. <HR> .............................................................................................................................25. <FONT></FONT> ........................................................................................................36. <H1></H1> …. <H6></H6>.........................................................................................57. <B></B> atau <STRONG></STRONG> .....................................................................68. <I></I> atau <EM></EM>............................................................................................69. <U></U>........................................................................................................................710. <IMG> .......................................................................................................................711. <TABLE></TABLE>................................................................................................812. <A></A>....................................................................................................................913. <DIV></DIV> .........................................................................................................1114. <SPAN></SPAN>...................................................................................................1215. <OL></OL>.............................................................................................................1316. <UL></UL>.............................................................................................................1317. <FRAMESET></FRAMESET>..............................................................................1418. <FORM></FORM>.................................................................................................1519. ELEMENT PADA FORM.......................................................................................16
CSS (CASCADING STYLE SHEET) ....................................................................................231. PENULISAN PADA TAG DENGAN ATRIBUT STYLE.........................................232. PENULISAN PADA HEAD .......................................................................................233. PENULISAN DENGAN CLASS ................................................................................244. PENULISAN DENGAN ID ........................................................................................25
JAVASCRIPT..........................................................................................................................261. PENULISAN PADA TAG ..........................................................................................262. PENULISAN DENGAN TAG <SCRIPT> .................................................................273. TIPE DATA.................................................................................................................274. VARIABEL .................................................................................................................275. OPERATOR, IF DAN PERULANGAN .....................................................................28
PHP (Hypertext Preprocessor).................................................................................................311. DASAR PENULISAN PHP ........................................................................................312. VARIABEL .................................................................................................................313. TANDA SAMBUNG ..................................................................................................324. OPERATOR MATEMATIKA ....................................................................................325. OPERATOR PERSAMAAN.......................................................................................336. OPERASI PERBANDINGAN ....................................................................................347. OPERATOR LOGIKA ................................................................................................348. IF ..................................................................................................................................349. PERULANGAN ..........................................................................................................3610. ARRAY....................................................................................................................3711. PHP DENGAN FORM............................................................................................3812. MEMBUAT DATABASE DENGAN NAVICAT..................................................4013. MEMBUAT TABEL ...............................................................................................4114. MEMBUAT USER DATABASE BARU ...............................................................4215. KONEKSI KE SERVER MYSQL ..........................................................................4316. KONEKSI KE DATABASE MYSQL ....................................................................44
![Page 2: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/2.jpg)
HTML, CSS, JavaScript, PHP
17. MENUTUP KONEKSI............................................................................................4418. MEMBERI PERINTAH KE DATABASE DENGAN QUERY.............................4419. SKRIP MENAMPILKAN DATA ...........................................................................4620. SKRIP MENAMBAHKAN DATA DENGAN FORM ..........................................4921. SKRIP UPDATE DATA DENGAN FORM ...........................................................5022. SKRIP HAPUS DATA............................................................................................5323. MENAMPILKAN DATA PER HALAMAN..........................................................55
LAMPIRAN.............................................................................................................................571. SETTING HOME SITE+ 5.5 ......................................................................................572. XAMPP........................................................................................................................613. NAVICAT 2004...........................................................................................................65
![Page 3: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/3.jpg)
HTML, CSS, JavaScript, PHP
1
BAB I.HTML (HYPERTEXT MARKUP LANGUAGE)
1. ELEMEN DASAR HTML
2. <BR>Untuk membuat baris baru gunakan <br>, spasi lebih dari satu akandiabaikan.
Contoh:
3. <P></P>Digunakan untuk membuat paragraf, jika tanpa tag penutup hasilnya sepertimenggunakan 2 kali <br>
Atribut: align
![Page 4: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/4.jpg)
HTML, CSS, JavaScript, PHP
2
Contoh:
4. <HR>Horizontal Line (Garis horizontal)
Atribut: Width Align
Contoh:
![Page 5: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/5.jpg)
HTML, CSS, JavaScript, PHP
3
5. <FONT></FONT>Tag ini dapat digunakan untuk mengatur ukuran, warna dan jenis huruf
Atribut: Size
Color Face
Contoh:
![Page 6: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/6.jpg)
HTML, CSS, JavaScript, PHP
4
![Page 7: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/7.jpg)
HTML, CSS, JavaScript, PHP
4
![Page 8: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/8.jpg)
HTML, CSS, JavaScript, PHP
5
6. <H1></H1> …. <H6></H6>Untuk membuat heading yang memberikan baris baru
Contoh:
![Page 9: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/9.jpg)
HTML, CSS, JavaScript, PHP
6
7. <B></B> atau <STRONG></STRONG>Membuat huruf tebal.
Contoh:
8. <I></I> atau <EM></EM>Membuat huruf miring
Contoh:
![Page 10: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/10.jpg)
HTML, CSS, JavaScript, PHP
7
9. <U></U>Membuat huruf dengan garis bawah
Contoh:
10. <IMG>Menampilkan gambar
Atribut: src (letak file gambar) align (perataan gambar) width (lebar gambar dlm persen atau pixel) height (tinggi gambar dlm persen atau pixel) alt (keterangan gambar)
![Page 11: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/11.jpg)
HTML, CSS, JavaScript, PHP
8
Contoh:
11. <TABLE></TABLE>Membuat table
Atribut pada <table></table> border
align (perataan table) width height bgcolor
Atribut pada <tr></tr> align bgcolor width height
Atribut pada <td></td> align bgcolor width height
Contoh:
![Page 12: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/12.jpg)
HTML, CSS, JavaScript, PHP
9
12. <A></A>Untuk membuat link
Atribut: href name
Contoh:
![Page 13: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/13.jpg)
HTML, CSS, JavaScript, PHP
10
Contoh Anchor:
![Page 14: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/14.jpg)
HTML, CSS, JavaScript, PHP
11
1. Klik link Ke atas 2. Maka akan tampil bagian atas
13. <DIV></DIV>Membuat blok paragraph dengan baris baru pada akhir paragraf (pengganti<p>, digunakan pada css)
Atribut: align (perataan paragraf) nilai left, right, center, justify
Contoh:
![Page 15: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/15.jpg)
HTML, CSS, JavaScript, PHP
12
14. <SPAN></SPAN>Digunakan pada css untuk memberikan format pada teks yang diblok, tanpamembuat baris baru
Contoh:
![Page 16: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/16.jpg)
HTML, CSS, JavaScript, PHP
13
15. <OL></OL>Order list (biasa dikenal dengan numbering)
Atribut: Type (jenis numbering), nilai: 1, A, a, I, i
Contoh
16. <UL></UL>Unorder List, biasa kita kenal dengan Bullet
Atribut: type (jenis bullet), nilai: disc, square, circle
![Page 17: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/17.jpg)
HTML, CSS, JavaScript, PHP
14
Contoh:
17. <FRAMESET></FRAMESET>Membagi satu halaman web menjadi beberapa halaman, halaman yang dibagimasih bisa dibagi lagi.
Contoh:- buat file dengan nama framset.html
![Page 18: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/18.jpg)
HTML, CSS, JavaScript, PHP
15
- buat file dengan nama halaman1.html
- buat file dengan nama halaman2.html
jalankan framset.html
18. <FORM></FORM>Digunakan sebagai blok dari elemen-elemen form seperti text,texarea.
Atribut:- name (nama form)- action (file tujuan dimana form dikirim, digunakan pada server side)- method (metode pengiriman, digunakan pada server side) nilai post, get
![Page 19: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/19.jpg)
HTML, CSS, JavaScript, PHP
16
19. ELEMENT PADA FORM
<INPUT>Tag ini teletak didalam blok tag form
Atribut:- Type (jenis input) nilai text, checkbox, radio, hidden, button,
submit, reset, file, image- Name (nama elemen)- Value (nilai isian)
Contoh:
Radio
![Page 20: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/20.jpg)
HTML, CSS, JavaScript, PHP
17
Checkbox
![Page 21: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/21.jpg)
HTML, CSS, JavaScript, PHP
18
![Page 22: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/22.jpg)
HTML, CSS, JavaScript, PHP
19
Hidden
Button
![Page 23: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/23.jpg)
HTML, CSS, JavaScript, PHP
20
Submit
Reset
![Page 24: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/24.jpg)
HTML, CSS, JavaScript, PHP
21
Textarea
Select
![Page 25: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/25.jpg)
HTML, CSS, JavaScript, PHP
22
![Page 26: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/26.jpg)
HTML, CSS, JavaScript, PHP
23
BAB IICSS (CASCADING STYLE SHEET)
1. PENULISAN PADA TAG DENGAN ATRIBUT STYLE
Contoh:
2. PENULISAN PADA HEAD
![Page 27: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/27.jpg)
HTML, CSS, JavaScript, PHP
24
3. PENULISAN DENGAN CLASS
![Page 28: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/28.jpg)
HTML, CSS, JavaScript, PHP
25
4. PENULISAN DENGAN ID
![Page 29: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/29.jpg)
HTML, CSS, JavaScript, PHP
26
BAB IIIJAVASCRIPT
1. PENULISAN PADA TAG
Contoh:
![Page 30: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/30.jpg)
HTML, CSS, JavaScript, PHP
27
2. PENULISAN DENGAN TAG <SCRIPT>
Contoh:
3. TIPE DATA
Tipe-tipe data pada javascript yaitu: string, number, boolean, null, object danfunction
4. VARIABEL
Dengan variabel kita dapat menyimpan informasi pada memori dan dapat kitapergunakan berkali-kali. Untuk membuat variabel ketik awalan var atau bisajuga langsung dengan nama variabel tersebut.
Contoh:var namaKu = “Fansyah”ataunamaKu = “Fansyah”
![Page 31: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/31.jpg)
HTML, CSS, JavaScript, PHP
28
5. OPERATOR, IF DAN PERULANGANOperator pada javascritp mirip dengan operator pada php, lihatpada bagian PHP untuk mempelajari operator matematika,perbandingan dan logika. Begitu juga dengan sintak if danperulangan.
![Page 32: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/32.jpg)
HTML, CSS, JavaScript, PHP
29
Contoh operator matematika:
Contoh if:
![Page 33: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/33.jpg)
HTML, CSS, JavaScript, PHP
30
Contoh perulangan dengan for:
Contoh penulisan function:
![Page 34: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/34.jpg)
HTML, CSS, JavaScript, PHP
31
BAB IVPHP (Hypertext Preprocessor)
1. DASAR PENULISAN PHPPenulisan php diawali oleh boleh diletakkan dimana saja pada halaman html.Penulisan lazimnya ditulis diantara blok <?php… ?>
2. VARIABELDengan variabel kita dapat menyimpan nilai atau informasi kedalam memori.Variabel dapat kita gunakan berkali-kali sesuai kebutuhan dan nilainya dapatkita ganti. Nama variable diawali tanda $. Misal $nama, $alamat. Namavariable case sensitif (tidak mengenal perbedaan huruf besar dan kecil). $Atidak sama dengan $a. Jenis variable bisa berupa bolean (true atau false)string (huruf, angka dan karakter), integer (angka bulat), float atau double(angka desimal/pecahan), array, object, NULL. Variabel string bisa diapittanda petik dua, atau petik satu.
![Page 35: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/35.jpg)
HTML, CSS, JavaScript, PHP
32
Variabel angka
3. TANDA SAMBUNGUntuk menyambung antara variabel yang satu dengan yang lain, ataumenggabungkan teks gunkan tanda titik.
4. OPERATOR MATEMATIKA
Operator Keterangan Contoh Hasil+ Penambahan x=2
x+24
- Pengurangan x=25-x
3
* Perkalian x=4x*5
20
![Page 36: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/36.jpg)
HTML, CSS, JavaScript, PHP
33
/ Pembagian 15/55/2
32.5
% Modulus (sisa pembagian) 5%210%810%2
120
++ Increment (penambahan dengan 1) x=5x++
x=6
-- Decrement (pengurangan dengan 1) x=5x--
x=4
5. OPERATOR PERSAMAAN
Operator Contoh Sama dengan= x=y x=y+= x+=y x=x+y-= x-=y x=x-y*= x*=y x=x*y
![Page 37: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/37.jpg)
HTML, CSS, JavaScript, PHP
34
/= x/=y x=x/y%= x%=y x=x%y
6. OPERASI PERBANDINGAN
Operator Keterangan Contoh== Sama dengan 5==8 hasil false!= Tidak sama dengan 5!=8 hasil true> Lebih besar 5>8 hasil false< Legih kecil 5<8 hasil true>= Lebih besar sama dengan 5>=8 hasil false<= Lebih kecil sama dengan 5<=8 hasil true
7. OPERATOR LOGIKA
Operator Keterangan Contoh&& And (dan) x=6
y=3
(x < 10 && y > 1) hasil true|| Or (atau) x=6
y=3
(x==5 || y==5) hasil false! Not (tidak) x=6
y=3
!(x==y) hasil true
8. IFDengan if kita dapat menjalankan kondisi sesuai dengan yang kita harapkan.Misal kita dapat menentukan alur program untuk yang mengisi passworddengan benar dan alur program untuk mengisi password yang salah.
Penulisan if dengan 1 statemen:
if (kondisi/ekpresi)kode ini/statemen ini akan dijalankan jika kondisi benar;
elsekode ini/statemen ini akan dijalankan jika kondisi salah;
Penulisan if dengan lebih dari 1 statemen:
if (kondisi/ekpresi){
}else{
}
kode ini/statemen ini akan dijalankan jika kondisi benar;kode ini/statemen ini akan dijalankan jika kondisi benar;
kode ini/statemen ini akan dijalankan jika kondisi salah;kode ini/statemen ini akan dijalankan jika kondisi salah;
![Page 38: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/38.jpg)
HTML, CSS, JavaScript, PHP
35
Contoh:IF dengan 2 kemungkinan
Contoh:IF dengan lebih dari 2 kemungkinan
![Page 39: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/39.jpg)
HTML, CSS, JavaScript, PHP
36
9. PERULANGANPerulangan berfungsi untuk mengulang alur program, misal kita bisamembuat nomor dari 1 sampai 100 dengan perulangan tanpa mengetikansatu persatu. Ada beberapa macam perulangan yaitu for, while,do..while, foreach
Contoh perlulangan for:
![Page 40: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/40.jpg)
HTML, CSS, JavaScript, PHP
37
Contoh perlulangan while:
10. ARRAYDengan array, kita bisa membuat variabel dengan tipe yang dinamis, dimanakita bisa menyimpan banyak data dalam satu variabel array.Contoh:
![Page 41: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/41.jpg)
HTML, CSS, JavaScript, PHP
38
11. PHP DENGAN FORM
Contoh dengan kotak text:
Buatlah file dengan nama data01.php dengan skrip:
Buatlah file dengan nama data02.php dengan skrip:
Kemudian jalankan file data01.php, isikan pada kotak nama dengan namaanda, kemudian klik tombol submit. Hasilnya akan tampil seperti gambardibawah ini.
![Page 42: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/42.jpg)
HTML, CSS, JavaScript, PHP
39
Contoh dengan checkbox:
Buatlah file dengan nama data03.php dengan skrip:
Buatlah file dengan nama data04.php dengan skrip:
![Page 43: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/43.jpg)
HTML, CSS, JavaScript, PHP
40
12. MEMBUAT DATABASE DENGAN NAVICAT
- Klik kanan localhost- Pilih New Database- Ketik nama database misal sekolah
![Page 44: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/44.jpg)
HTML, CSS, JavaScript, PHP
41
13. MEMBUAT TABELo Pilih database sekolah, klik New Table
o Isikan field2 id, smalint,6, auto increament nama, varchar, 50
![Page 45: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/45.jpg)
HTML, CSS, JavaScript, PHP
42
alamat, varchar, 255 umur, tinyint, 4
o Simpan dan beri nama guru
14. MEMBUAT USER DATABASE BARUKlik tombol Manage User
Klik tombol Add User
![Page 46: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/46.jpg)
HTML, CSS, JavaScript, PHP
43
Isikan User name, Host (alamat server mysql, biasanya localhost), password
Selanjutnya tentukan Privileges (hak istimewa) user. Pilih user, lalu pilihprivilages yang sesuai, untuk memberikan semua frivilages, klik Grant All,lalu klik tombol Set Priv dan Flush Priv
15. KONEKSI KE SERVER MYSQL
![Page 47: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/47.jpg)
HTML, CSS, JavaScript, PHP
44
localhost: server dimana database mysql beradafansyah: user namefans2006: password
16. KONEKSI KE DATABASE MYSQL
sekolah: nama database yang dikoneksikan$koneksi: nama koneksi
17. MENUTUP KONEKSI
18. MEMBERI PERINTAH KE DATABASE DENGAN QUERY
Ada beberapa perintah query- Melakukan perubahan pada data seperti:
insert into, update, delete
o INSERT INTOContoh: insert into guru values(‘Rina’,’Jakarta’,25) insert into guru(nama,umur) values(‘Rina’,25)
o UPDATEContoh: update guru set
nama=’Tuti’,alamat=’Yogyakarta’,umur=20 whereid=1
![Page 48: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/48.jpg)
HTML, CSS, JavaScript, PHP
45
o DELETEContoh: delete from guru where id=1
- Tidak melakukan perubahan pada data yaitu select.o SELECT
Contoh: select * from guru select * from guru where kota=’jakarta’ and
umur>20Contoh skrip dengan query insert into:
Lihat hasilnya dengan membuka tabel guru
Contoh skrip dengan query update:
![Page 49: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/49.jpg)
HTML, CSS, JavaScript, PHP
46
Klik tombol refresh, untuk melihat hasil perubahan
Contoh skrip dengan query delete:
19. SKRIP MENAMPILKAN DATA
Sebelum membuat skrip ini, tambahkan beberapa data pada tabel guru
![Page 50: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/50.jpg)
HTML, CSS, JavaScript, PHP
47
Buat file tampil_data1.php
![Page 51: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/51.jpg)
HTML, CSS, JavaScript, PHP
48
Kemudian buatlah file tampil_data2.php, berbeda dengan tampil_data1.php,tampilan data guru disini menggunakan tabel.
![Page 52: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/52.jpg)
HTML, CSS, JavaScript, PHP
49
20. SKRIP MENAMBAHKAN DATA DENGAN FORM
Buat file form_tambah1.php
Lalu buat pula file form_tambah2.php
Jalankan form_tambah1.php, isikan nama, alamat dan umur, lalu klik tombolSubmit
![Page 53: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/53.jpg)
HTML, CSS, JavaScript, PHP
50
Jika berhasil akan tampil
21. SKRIP UPDATE DATA DENGAN FORM
Ubah tampil_data2.php dengan menambahkan link edit disebelahnya.
![Page 54: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/54.jpg)
HTML, CSS, JavaScript, PHP
51
Kemudian buat file form_update2.php
Terakhir buat file form_update3.php
![Page 55: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/55.jpg)
HTML, CSS, JavaScript, PHP
52
Jalankan tampil_data2.php, klik salah satu yang akan diupdate
Lakukan perubahan, lalu klik tombol submit
Jika berhasil, akan tampil
Klik OK, lalu refresh tampilan awal (file tampil_data2.php) untuk melihat hasilperubahan.
![Page 56: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/56.jpg)
HTML, CSS, JavaScript, PHP
53
22. SKRIP HAPUS DATAUbah tampil_data2.php dengan menambahkan link hapus disebelahnya.
![Page 57: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/57.jpg)
HTML, CSS, JavaScript, PHP
54
Buat file form_hapus2.php
Jalankan tampil_data2.php, Klik hapus pada salah satu data
![Page 58: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/58.jpg)
HTML, CSS, JavaScript, PHP
55
Jalankan berhasil dihapus akan tampil
Klik OK, lalu refresh tampilan awal (file tampil_data2.php) untuk melihathasil perubahan.
23. MENAMPILKAN DATA PER HALAMAN
![Page 59: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/59.jpg)
HTML, CSS, JavaScript, PHP
56
![Page 60: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/60.jpg)
HTML, CSS, JavaScript, PHP
57
LAMPIRAN
1. SETTING HOME SITE+ 5.5
MEMBUKA DAN MENUTUP TAMPILAN FOLDER DAN FILE(RESOURCE TAB)
Tampilan Resource Tab:
Tekan tombol F9 atau klik tombol Resouce Tab untuk menampilkanatau menyembunyikan.
![Page 61: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/61.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom
58
MEMBUAT FOLDER BARU1. Pilih Drive atau Folder dimana folder baru akan dibuat2. Klik kanan pada Resource Tab bagian bawah, pilih Create Folder
3. Ketikan nama folder baru
MENAMPILKAN NOMOR BARIS
![Page 62: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/62.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom
59
MENGAKTIFKAN WORD WRAP (PENURUNAN BARIS SECARAOTOMATIS)
MENENTUKAN EKTENSI FILE YANG SERING DIGUNAKAN1. Buka menu Options, Settings lalu pilih Extention Manager pada
Default Extention, isikan file ekstensi yang diinginkan misal .html
![Page 63: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/63.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom
60
MEMBUAT CODE TEMPLATE (KODE/SKRIP YANG SERINGDITULISKAN)
1. Buka menu Options, Settings lalu pilih Code Templates, klik tombolAdd, kemudian isikan Keyword, Description dan ValueMisal anda ingin membuat pembuka dan penutup dari skrip php:
2. Untuk menggunakan Code Template yang sudah kita buat, tekanctrl + j
![Page 64: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/64.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom
61
2. XAMPPXAMPP merupakan php instaler kit yaitu program yang mampu mengiistallphp, mysql dan komponen-komponen lain menjadi satu kesatuan. XAMPP bisadidapatkan di http://www.apachefriends.org
• INSTALL XAMPP
1. Jalankan file installer xampp
2. Pilih bahasa Indonesia pada Installer Language
3. Klik Next, pada jendela Selamat datang…
![Page 65: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/65.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom62
![Page 66: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/66.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom63
• MENJALANKAN APACHE DAN MYSQL DARI XAMPPCONTROL PANEL
1. Double Click XAMPP Control Panel pada desktop
2. Klik tombol start pada Apache dan MySql
![Page 67: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/67.jpg)
HTML, CSS, JavaScript, PHP
SMA Negeri 85 Jakarta Barat Koswara, S.Kom
64
• MENGECEK APACHE
1. Pada browser buka http://localhostJika tampil halaman xampp, berarti apache sudah jalan.Klik English untuk masuk ke pengaturan xampp
![Page 68: DAFTAR ISI · PENULISAN PADA TAG DENGAN ATRIBUT STYLE ... OPERASI PERBANDINGAN ... dengan benar dan alur program untuk mengisi password yang salah](https://reader031.vdocuments.pub/reader031/viewer/2022021716/5caa687288c99319398b6647/html5/thumbnails/68.jpg)
HTML, CSS, JavaScript, PHP
3. NAVICAT 2004NAVICAT 2004 adalah program MySql Database Client. Anda bisamendapatkan NAVICAT di http://www.navicat.com/
o MEMBUAT KONEKSI KE SERVER DATABASE MYSQL
1. Buka Menu file, New Connection
2. Pada Tab General Setting, isikan Connection Name, Hostname/IP Address, User name dan PasswordUntuk koneksi awal, secara default, mysql server mempunyaikoneksi dengan username: root dan tanpa password, untukHost name isikan localhost
SMA Negeri 85 Jakarta Barat Koswara, S.Kom65
Web Mulok : http://www.mulok85.comEmail : [email protected]