Dasar2 Web Programming 1.0 2

rio astamal
DASAR- DASAR WEB PROGRAMMING

Versi 1.0-aplha3 UNCENSORED VERSION
Lisensidibawah: CreativeCommons AttributionShareAlike3.0
http://creativecommons.org
Madewith LinuxUserGroup STIKOMPSurabaya http://rioastamal.net/ http://lug.stikom.edu/
DASAR- DASAR WEB PROGRAMMING

Versi 1.0-alpha2 Februari 2008
Copyright 2008-2009
rio astamal (c0kr3x@gmail.com)
Lisensidibawah: CreativeCommons AttributionShareAlike3.0
http://creativecommons.org
LinuxUserGroup STIKOMPSurabaya
Pendahuluan
UNDERCONSTRUCTION....
LUGSTIKOMSurabaya
BabIHTMLdanWorldWideWeb
HTMLdanWorldWideWeb
1.1CaraKerjaWWW Ketikakitamengunjungisebuahsituskatakanlah,google.com,adasebuahprosesdibaliklayar yangtidakandaketahui.Prosestersebutcukupkompleksnamun,jikadigambarkandalamsebuah diagramsederhanakuranglebihakansepertiberikut: REQUEST Browser User INTERNET RESPONSE Server
BABI
Gambar1.1:CarakerjaWWW Secarakronologisurutanprosespadadiagramdiatasadalah: 1. 2. 3. 4. 5. Usermembukaalamatwebsitepadabrowser BrowsermengirimHTTPRequestkeserver ServermeresponHTTPRequestdaribrowser ServermengirimHTTPResponsekebrowser Browsermenampilkanhalamanwebsitekepadauser
1.2HTML HTML/XHTMLmerupakanformattampilanyangdigunakanuntukmenampilkanhalamanwebsite. HTMLterdiridarisimbolsimboltertentuyangseringdisebutdengantag.Sebuahhalamanwebsite yangvalidselaludiapittag<html></html>.FileHTMLumumnyamemilikiakhiran*.htmatau *.html. TagtagpadaHTMLselaludiawalidengan<x>...</x>,dimanaxtagHTMLseperti<strong>,<p>, <div>,danlainlain.DibawahiniadalahtabelbeberapatagHTMLyangseringdigunakan. TagHTML <html></html> <head></head> <title></title> <body></body> <style></style> <strong></strong> <div></div> <a></a> Keterangan TaguntukmengapithalamanHTML Tagyangberisiinformasiumumdarihalaman JudulHalaman* Akanditampilkandibrowser UntukCSS* Untukmenebalkanteks Untukmembuatlayer Untukmembuathyperlink
20082009RioAstamalHal.1
LUGSTIKOMSurabaya
<p></p> <hn></hn> <span></span>
Untukmembuatparagraf Untukmembuatheader** Untukinlinestyle(manipulasiteks)
<!> Komentar *Tagtersebutharusberadadidalamtag<head>...</head> **ndapatberupaangkadari15,contoh<h1>...</h1> PenerapanTeoriHTML 1. Bukaeditoranda(gedit(Linux),Notepad++(Windows),dsb)) 2. Ketikkodeberikut:

1. 2. 3. 4. 5. 6. 7. 8. <html> <head> <title>WebsitePertamaku</title> </head> <body> <h1>HelloF**kingWorld!!</h1> </body> </html>
3. Simpanpadadengannamahelloworld.html 4. Bukabrowseranda(Firefox,IE,dsb)danbukafileyangbarusajaandabuat. 5. Hasilnyaakansepertigambar1.1
Gambar1.1:helloworld.html 1.3ManipulasiFont Untukmemanipulasifontkitaakanmenggunakaninlinestyle/CSS(akandibahasdibagian berikutnya).Kitatidakakanmenggunakantag<font>karenataginisudahkunoaliasdeprecated. W3CsebagaipengembangHTMLsudahtidakmenyarankanuntukmenggunakantagfontlagi. Sebagaigantinyadigunakantag<span>daninlinestyle.Inlinestyleadalahattributstyleyang diberikanpadasebuahtagHTML.Contoh,untukmembuattampilantekstebalgunakancara berikut:

<spanstyle=fontweight:bold>Akuadalahtekstebal</span> 20082009RioAstamalHal.2
LUGSTIKOMSurabaya
Output: Akuadalahtekstebal Padacontohdiataskitamemberikanattributstyle,yangberisifontweight:bold.Maksudnya adalahkitaakanmengaplikasikanstyleboldpadateksyangdiapitolehtag<span></span>. Pemberianstyletidakhanyaterbataspadasatubagiansaja.andadapatmemberikanbeberapastyle sekaligusdenganmemberitandapemisahberupa;untuksetiapstyle.

<spanstyle=fontweight:bold;textdecoration:underline;fontstyle:italic>Aku adalahtekstebal,bergarisbawahdanmiring</span>
Output Akuadalahtekstebal,bergarisbawah,danmiring Padacontohdiataskitamenerapkantigastylepadatagspan.Dapatdilihatkalausetiapstyle dipisahkanolehtitikkoma.Intinyakitadapatmemberikanbanyakstylesekaliguspadasuatutag. Attributstyletidakterbataspadatagspansaja,hampirsemuatagyangdigunakan untukpresentasiteksdapatkitasisipitagstyle. PenerapanTeoriManipulasiTeks 1. Bukagedit/Notepad++ 2. KetikkodeHTMLberikutini

1. <html> 2. <head> 3. <title>ManipulasiTeks</title> 4. </head> 5. <body> 6. <h1style="color:red;textdecoration:underline">PENGUMUMAN!</h1> 7. <spanstyle="color:#FF0000"> 8. Barangsiapayangmenemukandompetsaya,akansayaberi 9. <spanstyle="fontweight:bold;fontstyle:italic">ISTRI,MOBIL,RUMAHdan 10. SegalaSERTIFIKATTANAHSAYA</span>DIJAMIN!!!.</span> 11.</body> 12.</html>
3. Simpandengannamamanipulasiteks.html 4. Bukadenganbrowseranda 5. Hasilnyaakansepertigambar1.2
LUGSTIKOMSurabaya
Gambar1.2 1.4Hyperlink Andatentuseringmelngklikgambaratautulisanyangmengarahkehalamanlainatauwebsite lainnya.Yangandaklikituadalahhyperlinkataulebihdikenaldenganistilahlinksaja.Untuk membuatlinkkitadapatmenggunakantag<a></a>.Duaattributyangpalingseringdigunakan padatag<a>adalahhrefdantarget. hrefdigunakanuntukmenentukanlokasitujuandarilink.DapatberuparelatifURLatauabsolut URL. targetdigunakanuntukmenentukanapakahhalamanakandibukapadajendela/windowbaruatau tidak.Defaultnyaadalahselfdimanalinktidakdibukapadawindowbaru.Jikainginmembukapada windowbarugunakannilai_blank. Untuklebihmemahamicarakerjalink,kitaakanmembuatduafileyaituprofilku.htmldandaftar situs.html. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:
1. <html> 2. <head> 3. <title>ProfilJSL</title> 4. </head> 5. <body> 6. <h2>ProfilKu</h2> 7. <ul> 8. <li><strong>NamaLengkap:</strong>JohnSeptianLennon<li> 9. <li><strong>Tempat/Tgl.Lahir:</strong>Lipermboh,14September1940</li> 10. <li><strong>Pekerjaan:</strong>RockerJalanan<li> 11. <li><strong>Wafat:</strong>Tewastertembakolehpenggemardidepan 12. kandangsapipada1980</li> 13. </ul> 14. <p>Inginlihatdaftarsitusfavoritsaya?<ahref="daftarsitus.html"> 15. klikdisini</a>.</p> 16.</body> 17.</html>
3. Simpandengannamaprofilku.html
LUGSTIKOMSurabaya
4. Buatfilebarulagi,kemudianketikkodeberikut:
1. <html> 2. <head> 3. <title>DaftarsitusfavoritJSL</title> 4. </head> 5. <body> 6. <h2>DaftarSitusfavoritku</h2> 7. <ol> 8. <li><atarget="_blank"href="http://www.google.com/">OmGoogle</a></li> 9. <li><atarget="_blank"href="http://www.milw0rm.com"> 10. CacingUnderground</a></li> 11. </ol> 12. <p><ahref="profilku.html">Lihatprofillengkap</a></p> 13.</body> 14.</html>
5. Simpandilokasiyangsamadenganprofilku.htmldanberinamadaftarsitus.html 6. Bukafileprofilku.htmldenganbrowseranda,dancobakliklinkyangadauntukmemahami carakerjanya
Gambar1.3 1.5MembuatTabel Untukmembuattabelkitadapatmenggunakantag<table></table>.Dalambeberapatahunterakhir, penggunaantabelsebagailayoutwebsitesudahtidakrelevanlagi,dandigantikanolehtagDIV.Saat inipenggunaantabeldikhususkanhanyauntukmenampilkandatasecaratabularsajatidakuntuk designhalaman. Beberapatagyangseringdigunakansaatmembuattabeladalah: Tag <tr></tr> <th></th>* Keterangan Digunakanuntukmembuatbarisbaru Digunakanuntukmembuatheadertabel
<td></td>* Digunakanuntukmembuatkolom *Tagtersebutselaluberadadidalamtag<tr>...</tr> Sepertihalnyataglainyangdigunakanuntukpresentasiteks,seperti<span>,andadapat menggunakanattributstyleuntukmemformattampilantampilantabel.Berikutiniadalahcontoh

LUGSTIKOMSurabaya
pembuatantabelmenggunakanHTML. 1. Bukatekseditor(gedit/Notepad++) 2. Ketikkodeberikut:

1. <html> 2. <head> 3. <title>TABELIPS/IPK</title> 4. </head> 5. <body> 6. <h2>TabelIPSampaisemester4:</h2> 7. <tablestyle="width:600px;"border="1"> 8. <trstyle="backgroundcolor:#cfcfcf"> 9. <th>SEMESTER</th> 10. <th>IPS</th> 11. </tr> 12. <tr> 13. <td>SEMESTER1</td><tdstyle="textalign:right">4.0</td> 14. </tr> 15. <tr> 16. <td>SEMESTER2</td><tdstyle="textalign:right">4.0</td> 17. </tr> 18. <tr> 19. <td>SEMESTER3</td><tdstyle="textalign:right">4.0</td> 20. </tr> 21. <tr> 22. <td>SEMESTER4</td><tdstyle="textalign:right">4.0</td> 23. </tr> 24. <trstyle="textalign:right;backgroundcolor:#FFCB68;fontweight:bold"> 25. <tdstyle="textalign:center;">NILAIIPK>>></td> 26. <tdstyle="textalign:inherit;">4.0</td> 27. </tr> 28. </table> 29.</body> 30.</html>
3. Simpandenannamatabel.html 4. Bukadenganbrowseranda,hasilnyaakannampaksepertigambar1.4
Gambar1.4
LUGSTIKOMSurabaya
>merupakanspecialcharacteruntuktanda>.DalamHTMLspecialcharacter diawalitandaampersand&dandiakhiri;.Contohlainadalah<untuk<, ©untuk 1.6HTMLForm HTMLFormseringdigunakanuntukmemintainputandariuseryangkemudiandiprosesoleh serversidescriptingsepertiPHP,JSP,dansebagainya.FormHTMLdiapitolehtag<form></form>. Duaattributyangpalingseringdigunakandalampenggunaanformadalah:

Action:Nilaidariattributinimenunjukkanlokasidarifilepemrosesdariform.Dapatberupa relatifURI,contohfolderX/file.phpatauabsolutURI,contohhttp://contoh.com/file.php. Method:Nilaidariattributmenentukanmetodedatayangdikirimkankefilepemroses,apakah melaluimetodeGETatauPOST.
Contohpenggunaantagformsebagaiberikut:
<formaction=file.phpmethod=POST> ... </form>
Tagformtidakbanyakbergunatanpaadanyataginputlain.Tagformberfungsihanyasebagai wrapperyangmengelompokkandatayangakandikirim.Tagyangdigunakanbersamatagform adalahtag<input>. 1.6.1Macammacaminput Untukmenampilkantextbox,checkbox,radiobutton,danlainnyahanyadiperlukantag<input>. Yangmembedakanoutputdarimasingmasingtampilanadalahnilaidariattributtype.Contoh berikutmerupakanpenggunaantaginputuntukmenampilkantextbox:

<inputtype=textsize=16maxlength=16>
Berikutinidaftarnilaiyangdapatdigunakanpadaattributtype: Nilaitype Keterangan text password file checkbox radio submit button reset Untukmenampilkantextbox Untukmenampilkanpasswordfield Untukmenampilkanprosesuploadfile(miripsepertitextboxnamun dengantombolBrowse) Untukmenampilkantombolcheckbox(lebihdarisatupilihan) Untukmenampilkantombolradio/option(hanyasatupilihan) Tomboluntukmensubmitform(defaultbuttonuntuksubmit) samadengansubmithanyasajabukandefaultbutton Untukmembersihkantampilkanform
LUGSTIKOMSurabaya
hidden
Inputtidakditampilkandibrowser.
Selaintag<input>masihadataglainyangbiasadigunakandalamformyaitutag<select>dan <textarea>. PENERARANTEORIHTMLFORM 1. Bukagedit/Notedpad++ 2. Ketikkodeberikut:

1. <html> 2. <head> 3. <title>Registrasi</title> 4. </head> 5. <body> 6. <h2>FormRegistrasi</h2> 7. <formaction=""method="POST"> 8. <label>Nama:</label> 9. <inputtype="text"size="30"name="nama"><br> 10. <label>Username:</label> 11. <inputtype="text"size="16"name="uname"maxlength="16"><br> 12. <label>Password:</label> 13. <inputtype="password"size="16"name="pass"maxlength="16"><br> 14. <label>JenisKelamin:</label> 15. <inputtype="radio"name="jk"value="pria"checked><span>Pria</span> 16. <inputtype="radio"name="jk"value="wanita"><span>Wanita</span> 17. <br> 18. <label>Hoby:</label><br> 19. <inputtype="checkbox"name="hob"value="spkbola"><span>SepakBola</span> 20. <inputtype="checkbox"name="hob"value="game"><span>Game</span> 21. <inputtype="checkbox"name="hob"value="tidur"><span>Tidur</span><br> 22. <label>Deskripsikandirianda:<label><br> 23. <textareastyle="height:100px;width:400px"name="desc"></textarea> 24. <hr><br> 25. <label>Darimanaandamendengarkami?</label><br> 26. <selectname="dengar"> 27. <optionvalue="kuburan">Daridalamkubur</option> 28. <optionvalue="google">Google</option> 29. <optionvalue="mimpi">Mimpi</option> 30. </select><br> 31. <inputtype="submit"value="DAFTAR"> 32. <inputtype="reset"value="RESET"> 33. </form> 34.</body> 35.</html>
3. Simpandengannamaform.html 4. Bukadenganbrowserfiletersebut. Hasilnyamemangtidakbegitubaguskarenakitatidakmelakukanstylingpadaform.
LUGSTIKOMSurabaya
Gambar1.6
Dalamkasusrealworldnilaiyangadapadaattributnamedanvaluelahyangakandikirimkefile pemroses. 1.7MenampilkanGambar UntukmenampilkangambarpadahalamanHTMLdapatdigunakantag<img>.Beberapaattribut yangseringdigunakanadalahsrc,height,danwidth.Attributsrcdigunakanuntukmenentukan alamatdarigambaryangakanditampilkan,dapatberuparelatifURIatauabsolutURI.Attribut heightdigunakanuntukmenentukantinggi,sedangkanwidthuntukmenentukanlebar. Secaradefaultnilaiyangadapadaheightdanwidthadalahdalampixel,kecualiandamenambahkan tanda%.Makalebaratautinggidiukurmenggunakanpersen.Jikaandatidakmenyertakan attributheightdanwidth,makagambartersebutakanditampilkansesuaidenganukuranaslinya. Untuklebihmemahaminyaikutilangkahberikut: 1. 2. 3. 4.
1. 2. 3. 4. 5. 6. 7. 8.
Siapkanduabuahgambardalamfolderyangsamadenganfilehtml Dalamcontohinisayamenggunakan(1)stikom.jpgdan(2)joinrevolution.jpg Bukagedit/Notepad++ Ketikkodeberikut:
<html> <head> <title>JoinTheRevolution</title> </head> <body> <imgsrc="stikom.jpg"align="left"> <strongstyle="color:red">SHOULD</strong> <imgsrc="joinrevolution.jpg"align="center"> 20082009RioAstamalHal.9
LUGSTIKOMSurabaya 9. </body> 10.</html>
5. Simpandengannamagambar.html
Gambar1.7 1.8XHTMLdanDOCTYPE ApakahXHTMLitu?apakahiaberbedadenganHTML?SebenarnyaXHTMLadalahHTMLhanya sajaXHTMLmengikutiformatXMLsebagaistandarpenulisannya.Jadisetiaptagharusmemiliki penutup. Andatentupernahmengetiktagtagtanpapenutupseperti<br>,<img>,dan<input>pada pembahasansebelumnya.PadaXHTMLsemuatagharusmemilikipenutup,jikatidakmaka halamanyangandabuattidaksesuaidenganstandaryangtelahditentukandandianggaptidakvalid/ compliantdenganstandarW3C. BerikutiniadalahbeberapacontohpenulisanyangvaliddiHTMLtapitidakdiXHTML. SALAH
<strong><span>HelloWorld</strong></ span> <inputtype=radiochecked> <br> <imgborder=1> <inputtype=buttonvalue=GO>>>> <STRONG>Hello</strong>
BENAR
<strong><span>Hello World</span></strong> <inputtype=radiochecked=checked/> <br/>atau<br></br> <imgborder=1/> <inputtype=button value=GO>>>/> <strong>Hello</strong>
Mungkinandabertanya,lalubagaimanasayamemberitahubrowserbahwahalamansayaadalah XHTML?SemuaituterletakpadaDOCTYPEhalamananda.DOCTYPEadalahpententutipe
LUGSTIKOMSurabaya
documentyanginginandagunakanapakahHTML4.01,XHTML1.0Transitional,XHTML1.0 Strictdanlainnya. DOCTYPEjugaseringdisebutDTD(DocumentTypeDefinition).Berikutiniadalahcontoh penggunaantipedokumenHTML4.01,

<!DOCTYPEHTMLPUBLIC"//W3C/DTDHTML4.01//EN""http://www.w3c.org/TR/html4/ strict.dtd">
JikaandatidakmenyebutkanDTDyangandagunakanasumsidarisatubrowserdenganbrowser yanglainmungkinberbedabeda.JadijikamemangandainginmenggunakanHTMLmurnibukan XHTMLgunakanlahDTD4.01.DeklarasiDOCTYPEharusdiletakkanpalingawalsebelumtag <html>. UntukXHTMLbeberapaDTDyangseringdigunakanadalah 1.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1strict.dtd"> 2.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1frameset.dtd">
PerbedaanTransitionaldanStrictterdapatpadatoleransikesalahan.Padatransitionaljikamasihada kesalahanstandarpenulisanmasihdiberikantoleransi,sedangkanStricttidakmemberikantoleransi samasekali.ContohhalamanXHTMLyangvalidadalahsebagaiberikut:

<?xmlversion="1.0"encoding="UTF8"?> <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> <htmlxmlns="http://www.w3.org/TR/xhtml1"> <head> <title>Everydocumentmusthaveatitle</title> </head> <body> <span>HelloWorld</span> </body> </html>
DalampembahasanselanjutnyakitaakanselalumenggunakanXHTMLbukanlagiHTML. DeklarasiversiXMLpadaawalhalamantidakharusditulisnamunsangat dianjurkanuntukditulis.Attributxmlnsharusditulisuntukmenentukan namespaceyangdigunakan. 1.9CSS(CascadingStyleSheets) CSSmerupakansuatuteknologiyangdigunakanuntukmempermudahpembuatansebuahwebsite. DenganCSSkitadapatdengancepatmengaplikasikansuatustylepadatagtertentu.Bahkankita dapatmeletakkanCSSpadasuatufilesehinggadapatdigunakanolehbanyakhalamansekaligus. ItumerupakansalahsatukelebihanCSS.CSSdiapitolehtag<style></style>danberadadiantara tag<head></head>.KelebihanlainnyaadalahandadapatmenyisipkankomentarpadaCSS,halini
LUGSTIKOMSurabaya
cukuppentingjikajumlahCSSandasangatbanyak.KomentarpadaCSSdiapitolehkarakter/* */. Padapembahasanpembahasansebelumnyakitaseringmenggunakanattributstyleuntuk memformattampilanatauseringdisebutinlinestyle.Apayangadapadaattributstyletersebut sebenarnyaadalahCSSyangvalid,hanyasajaletaknyadidalamtag. HampirsemuatagdapatdimanipulasimenggunakanCSSseperti<body>,<span>,<div>,<table>, <p>,danmasihbanyaklagi.BerikutiniadalahcontohsederhanapenggunaanCSSpadatagbody.

body{fontface:Verdana;fontsize:11px}
Padacontohdiataskitamemformatsemuateksyangadapadatagbodymenjadiberjenishuruf Verdanadenganukuran11pixel.Tagbodypadacontohdisebutselectorsedangkanattributstyle didalamnyadisebutdeclaration.Declarationditandaidenganadanyakurungkurawal{...}. PenerapanTeoriCSS 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

1. <?xmlversion="1.0"encoding="UTF8"?> 2. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 4. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 5. <head> 6. <title>CSSCascadingStyleSheets</title> 7. <styletype="text/css"> 8. body{fontfamily:Verdana,Serif;fontsize:11px} 9. div{ 10. border:2pxsolid#cccccc; 11. padding:4px 12. } 13. h2{ 14. textdecoration:underline; 15. fontstyle:italic; 16. fontsize:18px 17. } 18. </style> 19.</head> 20.<body> 21. <div> 22. <h2>IniadalahcontohsederhanapenggunaanCSS</h2> 23. </div> 24.</body> 25.</html>
3. Simpandengannamacss.html 4. Lalujalankanpadabrowser,hasilnyaakanterlihatsepertigambar1.8
LUGSTIKOMSurabaya
Gambar1.8:ContohpenggunaanCSS DapatandalihatbahwatagyangkitadeklarasikanpadaCSSsecaraotomatisstyletagtersebut mengikutiaturanCSSyangkitabuat.Dengandemikiankitadapatdenganmudahmemodifikasi banyakelemensekaligushanyadarisebuahbarisCSS. 1.9.1CSSClassdanID Jikaandacukupkreatif,sayaharapmemangdemikian:)makaandamungkinberfikirkalau penggunaancarasepertipembahasansebelumnyatidaksepenuhnyabaik.Mengapa?Bayangkanjika padabeberapabagianpadahalaman,andatidakinginmengaplikasikanstyletersebut.Laluapayang andalakukan?Merubahnyasecaramanuallewatinlinestyle?Itumemangdapatdilakukantapitidak efisien. CarayangpalingefektifdanefisienadalahdenganmenggunakanclassdalamCSS.Dengan menggunakanclasskitadapatmenentukanletakbagianyangharuskitaaplikasikansuatustyle. Penggunakanclassdiawalidengantandatitik..Lihatcontohberikut:
.tebalmiring{fontweight:bold;fontstyle:italic} div.error{color:red;fontweight:bold}
Barispertamamerupakangeneralclasskarenasemuatagdapatmenggunakannya.Sedangkanpada bariskeduaadalahregularclasskarenaclasstersebuthanyaberlakupadatagdivsaja.Untuk mengaplikasikanstyleyangadapadaclasskitaharusmemasukkannamaclasstersebutpadaattribut class. Caralainadalahdenganmenggunakannilaidariattributidpadasetiaptag.Nilaidariattributid antaratagyangsatudengantagyanglaintidakbolehadayangsama.Tandayangdigunakanbukan titikmelainkantandapagar#.

#main{border:1pxsolid#000000} div#header{padding:4px}
OK,marikitabuatsebuahfileuntuklebihmemahaminya. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

1. <?xmlversion="1.0"encoding="UTF8"?> 2. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
LUGSTIKOMSurabaya
4. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 5. <head> 6. <title>CSSClass&ID</title> 7. <styletype="text/css"> 8. body{fontfamily:Verdana,Serif;fontsize:11px} 9. #main{ 10. border:1pxsolid#cccccc; 11. padding:4px 12. } 13. div.box{ 14. border:1pxsolidorange; 15. backgroundcolor:#FFF8B9; 16. padding:6px3px; 17. color:#c60000; 18. width:200px 19. } 20. .greenforce{ 21. fontweight:bold; 22. color:green 23. } 24. </style> 25.</head> 26.<body> 27. <divid="main"> 28. <divclass="box"> 29. I'mtheWalRUS...!!<br/>GOOGOOG'JOOB!!! 30. </div> 31. <spanclass="greenforce">Classgreenforcepadatagspan</span> 32. <pclass="greenforce">Classgreenforcepadatagp</p> 33. </div> 34.</body> 35.</html>
3. Simpandengannamacssclass.html 4. Hasilnyaakantampaksepertigambar1.9jikaandajalankanpadabrowser
Gambar1.9 1.9.2HyperlinkPseudoclass Jikaandapernahmengunjungisuatuwebsitedanandamenggerakkanmouseandakearahsebuah linklalulinktersebutberubahwarnadanmenjadibergarisbawahatausebaliknya.Apayanganda lihattersebutadalahhasildarihyperlinkpseudoclassnyaCSS. Sepertiyangsudahdibawassebelumnyauntukmembuatlinkkitamenggunakantag<a></a>.Oleh

LUGSTIKOMSurabaya
karenaitutaginiliahyangakankitamanipulasi.Formatpenulisanhyperlinkpseudoclassadalah a:nama_aksi,dimananama_aksidapatberupa:

link:Tampilanlinkketikatidakdipiliholehuser(biasanyatidakperluditulis) visited:Tampilanlinksetelahdiklik active:Tampilanketikalinkdiklik hover:Tampilanketikamousemelewatilink(lebihseringdigunakandaripadaactive)
Penasaran?langsungsajabuatfileuntukmencobanya. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

1. <?xmlversion="1.0"encoding="UTF8"?> 2. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 4. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 5. <head> 6. <title>HyperlinkPseudoclass</title> 7. <styletype="text/css"> 8. body{fontfamily:Verdana,Serif;fontsize:14px} 9. a:link{ 10. color:green; 11. textdecoration:underline 12. } 13. a:visited{ 14. color:green; 15. textdecoration:underline 16. } 17. a:active{ 18. fontweight:bold; 19. textdecoration:none; 20. color:#c60000 21. } 22. a:hover{ 23. fontstyle:italic; 24. fontweight:bold; 25. color:#c60000; 26. textdecoration:none 27. } 28. </style> 29.</head> 30.<body> 31. <div> 32. <ahref="#">Link1</a><br/> 33. <ahref="#">Link2</a><br/> 34. <ahref="#">Link3</a> 35. </div> 36.</body> 37.</html>
3. Simpandengannamapseudoclass.html 4. Bukabrowserandalalubukafiletersebut
LUGSTIKOMSurabaya
Gambar:1.10 1.9.3ExternalCSS Sampaisaatiniandasudahtahubagaimanamudahnyamemodifikasistyledenganmenggunakan CSS.AgardalampembuatanwebsitekitalebihefisienmakasebaiknyakitameletakkanfileCSS kitapadasuatufiletersendiri.Sehinggakitadapatmeloadnyapadahalamanyangmembutuhkan styeyangadapadafileCSStersebut. FileCSSyangakankitaloadtidakharusberadasatukomputerdenganfileHTMLkita.FileCSS tersebutdapatberadapadawebsitelain,inidimungkinkankarenakitadapatmenggunakanURL padasaatpemanggilanfile. AdaduametodeuntukmemanggilfileCSS,yangpertamaadalahdenganmenggunakantag<link> danyangkeduaadalahmenggunakanstatement@importdidalamCSS.Carayanglebihsering digunakanadalahmenggunakantag<link>.Tidakadayanglebihjelasdaripadalearningbydoing, karenaitulangsungsajakitapraktikkan. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:
1. body{fontfamily:Verdana,Serif;fontsize:14px} 2. #main{ 3. border:1pxsolid#cccccc; 4. padding:4px 5. } 6. div.error{ 7. border:1pxsolid#c60000; 8. borderleft:5pxsolid#c60000; 9. color:#c60000; 10. fontsize:14px; 11. padding:4px6px; 12. fontweight:bold; 13. width:350px; 14.}
3. Simpandengannamamy.css 4. Buatfilebarulagi,kemudianketikkodeberikut:
1. 2. 3. 4. 5. 6. <?xmlversion="1.0"encoding="UTF8"?> <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> <htmlxmlns="http://www.w3.org/TR/xhtml1"> <head> <title>ExternalStylesheet</title> 20082009RioAstamalHal.16
LUGSTIKOMSurabaya
7. <linkrel="stylesheet"type="text/css"href="my.css"/> 8. </head> 9. <body> 10. <divid="main"> 11. <h2>ExternalStylesheet/CSS</h2> 12. <divclass="error"> 13. WARNING!,memoryotakandasudah90%penuhsilahkankosongkanpikiran 14. pikirankotoryangtidakdiperlukan...!!! 15. </div> 16. </div> 17.</body> 18.</html>
5. Simpandengannamaexternalcss.html 6. Jalankanpadabrowser,hasilnyaakanterlihatsepertigambar1.11
Gambar1.11 1.10MembuatLayoutdenganDIV Sepertiyangsudahdisinggungpadapembahasantentangtabel,kalaupembuatandesignwebsite yangmenggunakantabeldapatdikatakansudahtidakrelevanlagi.Sebagaipenggantidaritabel adalahtagdiv.Tagdivmemangdikhususkanuntukmembagihalamankedalambeberapasegmen. Jikakitagabungkandenganpenggunakanattributiddanclass,makadivdapatkitagunakanuntuk layoutsebuahhalaman. Secarakasarsetiaphalamanyangbaikpastimemilikibeberapabagaian,misalnyahalaman tersebutterdiridariheader,kemudianbeberapakolomuntukcontentutama,dansebagainya.Semua ituterserahpadadesignernya. Padacontohkasusyangakankitabuatnantinya,kitaakanmembuatsebuahlayouthalamanyang terdiridari: 1. 2. 3. 4. 5. Headerutamahalaman 2Kolom 1untukcontentutama 1untukberitaataulainnya lebarhalamantidaklebihdari800px(untukberjagajaga,karenamasihbanyakuseryang resolusimonitornya800x600) 6. Footerhalaman
LUGSTIKOMSurabaya
Designhalamanyangakandibuattidakmelibatkanpenggunaangambar,karenaprioritaskitadisini hanyalahbagaimanacaramengaturtataletakkomponenmenggunakantagdiv.OK,langsungsaja tanpabanyakmendriblebola,lhokok? 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

1. *{padding:0;margin:0} 2. body{ 3. fontfamily:Verdana,Arial,Serif; 4. fontsize:11px; 5. color:#333; 6. background:#fafafa; 7. } 8. /*pembatasutama*/ 9. #container{ 10. margin:6pxauto; 11. textalign:left; 12. clear:both; 13. background:#fff; 14. border:2pxsolid#666; 15. width:778px; 16. padding:0; 17.} 18.#header{ 19. clear:both; 20. margin:2px; 21. background:#FFEA8C; 22. border:1pxsolidorange; 23. height:95px; 24.} 25.#headerh1{ 26. fontsize:2em; 27. fontfamily:Arial; 28. color:#c60000; 29. margin:14px6px4px8px; 30.} 31.#menu{ 32. clear:both; 33. padding:0;margin:0025px2px; 34.} 35.#menuul{ 36. float:left; 37. border:none; 38. liststyle:none; 39. font:bold14pxArial; 40.} 41.#menuulli{ 42. display:inline; 43.} 44.#menuullia{ 45. paddingright:16px; 46. borderbottom:4pxsolidorange; 47.} 48.#menuullia:hover{ 49. borderbottom:4pxsolid#c60000; 50.} 51.#menuullia.aktif{ 52. borderbottom:4pxsolid#c60000; 20082009RioAstamalHal.18
LUGSTIKOMSurabaya 53.} 54.#footer{ 55. position:relative; 56. clear:both; 57. height:40px; 58. border:none; 59. background:#cfcfcf; 60. color:#fff; 61. width:100%; 62. textalign:center; 63.} 64.#footerspan{ 65. top:10px; 66. position:absolute; 67.} 68.#content{ 69. margin:2px2px8px2px; 70. float:left; 71. width:485px; 72. border:1pxsolid#ccc; 73. padding:6px10px; 74.} 75.#contenth1{ 76. borderbottom:2pxdashed#ccc; 77. marginbottom:16px; 78.} 79.#side{ 80. border:1pxsolid#ccc; 81. float:right; 82. margin:2px; 83. width:250px; 84. padding:2px; 85.} 86.#sideh1{ 87. borderbottom:1pxsolid#fafafa; 88.} 89.#sideh2{ 90. background:#cfcfcf; 91. padding:3px; 92. color:#333; 93. textalign:center; 94.} 95.#sidep{ 96. border:1pxsolid#ccc; 97. padding:4px; 98.} 99.a{textdecoration:none;color:#666} 100.a:visited{color:#666}
5. Simpandengannamalayout.css 6. Buatfilebaru,lanjutkandenganmengetikkodeberikut:
1. 2. 3. 4. 5. 6. 7. <?xmlversion="1.0"encoding="UTF8"?> <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> <htmlxmlns="http://www.w3.org/TR/xhtml1"> <head> <title>LayoutMenggunakanDIV</title> <linkrel="stylesheet"type="text/css"href="layout.css"/> 20082009RioAstamalHal.19
LUGSTIKOMSurabaya
8. </head> 9. <body> 10. <divid="container"> 11. <divid="header"> 12. <h1>R.I.PJohn</h1> 13. </div> 14. <divid="menu"> 15. <ul> 16. <li><aclass="aktif"href="#">Home</a></li> 17. <li><ahref="#">Books</a></li> 18. <li><ahref="#">Search</a></li> 19. <li><ahref="#">About</a></li> 20. <li><ahref="#">ContactUs</a></li> 21. </ul> 22. </div> 23. <divid="content"> 24. <h1>WorkingClassHero</h1> 25. <p>Assoonasyou'reborntheymakeyoufeelsmall<br/> 26.Bygivingyounotimeinsteadofitall<br/> 27.Tillthepainissobigyoufeelnothingatall<br/> 28.Aworkingclassheroissomethingtobe<br/> 29.<br/> 30.Theyhurtyouathomeandtheyhityouatschool<br/> 31.Theyhatedyourcleveranddespisedafool<br/> 32.Tillyou'resofuckingcrazyyoucan'tfollowtheirrules<br/> 33.Aworkingclassheroissomethingtobe<br/> 34.<br/> 35.Whenthey'vetorturedandscaredyoufortwentyhardyears<br/> 36.Thentheyexpectyoutopickacareer<br/> 37.Whenyoucan'treallyfunctionyou'resofulloffear<br/> 38.Aworkingclassheroissomethingtobe<br/> 39.<br/> 40.KeepyoudopedwithreligionandsexandTV<br/> 41.Andyouthinkyou'resocleverandclasslessandfree<br/> 42.Butyou'restillfuckingpeasantsasfarasIcansee<br/> 43.Aworkingclassheroissomethingtobe<br/> 44.Aworkingclassheroissomethingtobe<br/> 45.<br/> 46.There'sroomatthetoptheyaretellingyoustill<br/> 47.Butfirstyoumustlearnhowtosmileasyoukill<br/> 48.Ifyouwanttobelikeallthefolksonthehill<br/> 49.<br/> 50.Ifyouwanttobeaherowelljustfollowme</p> 51. </div> 52. <divid="side"> 53. <h2>IMAGINE...</h2> 54. <p>Imaginethere'snoheaven 55.It'seasyifyoutry 56.Nohellbelowus 57.Aboveusonlysky 58.Imagineallthepeople 59.Livingfortoday... 60.Imaginethere'snocountries 61.Itisn'thardtodo 62.Nothingtokillordiefor 63.Andnoreligiontoo 64.Imagineallthepeople 65.Livinglifeinpeace... 66.YoumaysayI'madreamer 67.ButI'mnottheonlyone 68.Ihopesomedayyou'lljoinus 20082009RioAstamalHal.20
LUGSTIKOMSurabaya 69.Andtheworldwillbeasone 70.Imaginenopossessions 71.Iwonderifyoucan 72.Noneedforgreedorhunger 73.Abrotherhoodofman 74.Imagineallthepeople 75.Sharingalltheworld... 76.YoumaysayI'madreamer 77.ButI'mnottheonlyone 78.Ihopesomedayyou'lljoinus 79.Andtheworldwillliveasone...</p> 80. </div> 81. <divid="footer"> 82. <span>19401980</span> 83. </div> 84. </div> 85.</body> 86.</html>
Gambar1.12
1.11Javascript
LUGSTIKOMSurabaya
Javascriptadalahsebuahbahasapemrogramanyangkhususdirancanguntukwebsite.Javascript hanyaberjalandisisiklien,artinyapenggunaanjavascripthanyaterbataspadawebbrowseranda saja,iatidakbisamelakukanmanipulasidatapadasisiserver.Saatinijavascriptmerupakansalah satuelementterpentingdariteknologiwebterkini.AJAXadalahsalahsatucontohpenggunakan javascriptyangsaatinibanyakdigunakanolehwebsiteWeb2.0. Namunpadabukuinisayahanyamembahasjavascriptsepintassaja,untuktahulebihjauhtentang javascriptandadapatmencarilewatgoogleatautunggubukusayaberikutnyahehehe... 1.11.1MenggunakanJavascript Secarasederhanasebuahscriptjavascriptdiapitolehtag<script></script>,namununtuklebih memperjelaspenggunaanjavascriptbiasanyaditambahkanattributlanguageatautype,contoh sepertiberikut:
<scriptlanguage=javascript> //javascriptkodedisini... </script> atau <scripttype=text/javascript> //javascriptkodedisini... </script>
Kenapademikian?KarenajikaandapenggunabrowserIEmakaiamemilikisatubahasalagiselain javascriptyaituvbscript.Namunpadakenyataannyahampirtidakadasitusyangmenggunakan vbscript,jadisecaradefaultpunjikaandahanyamenggunakantag<script></script>makaIEakan menganggapscripttersebutadalahjavascript. Tag<script>dapatandaletakkanpadalevelglobalyaitupadatag<head></head>atausecaralokal dimanapundalamtag<body></body>.OKlangsungsajakitacobascriptwongjowoini. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

1. <?xmlversion="1.0"encoding="UTF8"?> 2. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 4. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 5. <head> 6. <title>MenggunakanJavascript</title> 7. <scriptlanguage="javascript"> 8. varnama=prompt("Masukkannama:","namaanda"); 9. vartanya=confirm(nama+",apakahandalakilaki?"); 10. if(tanya==true){ 11. alert("Halo"+nama+"kamuadalahlakilaki!"); 12. }else{ 13. alert("Halooo"+nama+"...kamucewekya...?ataujanganjangan...?"); 14. } 15. </script> 16.</head> 17.<body> 20082009RioAstamalHal.22
LUGSTIKOMSurabaya 18.</body>
19.</html> 3. Simpandengannamajavascript.html 4. Jalankanpadabrowseruntukmelihathasilnya.
Gambar1.13:Javascriptprompt Padacontohdiataskitameletakkanjavascriptpadalevelglobaldenganmeletakkannyapadatag <head></head>.prompt,confirm,danalertadalahfungsifungsibuiltinjavascriptyangdapatkita gunakanuntukberinteraksidenganuser. JikaandafamiliardenganbahasasepertiJava,C++,C,atauanakcucunyamakaandatidakakan terlaluberlamalamamenyesuaikandiridengansyntaxjavascript.Halitukarenasyntaxjavascript sangatmiripdenganketigabahasayangtelahdisebutkandiatas.Untukmendeklarasikanvariabel padajavascriptkitadapatmenggunakankeywordvar. Javascriptversiterbarusudahmendukungpenggunaantipedatadalam pendeklarasianvariabelsepertiint,string,dll.Namununtukmenjagakompatibilitas sebaiknyatetapgunakankeywordvar. 1.11.2ManipulasiDOM SalahsatufungsiutamajavascriptadalahkemampuannyauntukmemanipulasiDOM(Document ObjectModel).DOMsendiriadalahsuatustrukturdidalamdokumenHTMLyangberbentukseperti treeyangkomponenkomponennyaadalahelemenHTMLsepertitag.Karenakemampuaninilah makadenganjavascriptkitadapatmenciptakanDHTMLEffect(DynamicHTMLEffect). SalahsatucontohpengaplikasianDHTMLEffectadalahhideandshowsuatuelemenHTML. Misal,jikasuatutomboldiklikmakatampilanhilangatautampil.Semuainidimungkinkankarena javascriptdapatmelakukanmodifikasistyleCSSpadaelemensecaralangsungatauparageeky lebihsukamenyebutnya:onthefly:). Untuklebihmemahaminyasebaiknyakitalangsungsajamencobanyalewatcontoh. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:
1. <?xmlversion="1.0"encoding="UTF8"?> 20082009RioAstamalHal.23
LUGSTIKOMSurabaya
2. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 4. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 5. <head> 6. <title>ManipulasiDOM</title> 7. <scriptlanguage="javascript"> 8. functionberiWarna(){ 9. varkotak=document.getElementById('kotak'); 10. varwarna=document.getElementById('warna'); 11. //gantiCSSonthefly 12. kotak.style.backgroundColor='#'+warna.value; 13. } 14. functionhideShow(){ 15. varkotak=document.getElementById('kotak'); 16. varstatus=kotak.style.display; 17. //setCSSdisplaykeblockataunone 18. if(status=='block'){ 19. kotak.style.display='none'; 20. }else{ 21. kotak.style.display='block'; 22. } 23. } 24. </script> 25. <styletype="text/css"> 26. #kotak{ 27. border:3pxsolid#000; 28. padding:4px; 29. backgroundcolor:#ccc; 30. fontsize:18px; 31. fontweight:bold; 32. width:300px;height:200px; 33. } 34. </style> 35.</head> 36.<body> 37. <form> 38. <label>Warna</label> 39. #<inputtype="text"id="warna"name="warna"size="5"value="ccc"/> 40. <inputtype="button"onclick="beriWarna()"value="GantiWarna"/> 41. <inputtype="button"onclick="hideShow()"value="HideorShow"/> 42. </form> 43. <br/> 44. <divid="kotak"style="display:block"> 45. SAYABUKANDUKUN,PESULAPATAUBAHKANBUNGLONTAPISAYABISABERUBAH 46.WARNADANMENGHILANG.HEBATKAHSAYA?TENTUTIDAK.YANGHEBATADALAH 47.YANGMENULISSAYABUKANBEGITU?:p 48. </div> 49.</body>
50.</html> 3. Simpandengannamadom.html 4. Bukafilemenggunakanbrowseruntukmelihathasilnya. Hasilnyakuranglebihakansamadengangambar1.14. PenjalasanSingkatFiledom.html Banyakhalbarumenyangkutpenggunaanjavascript,sepertipenggunaankeywordfunctiondan

LUGSTIKOMSurabaya
metodegetElementById.Jikatidakmengertiuntuksementaratelansaja:pkarenabukuinimemang tidakmengharuskanandamenguasaijavascript. Fungsipadajavascriptditandaidengankeywordfunction.Fungsimerupakanpengemlompokkan sejumlahperintahuntukdieksekusipadasatuwaktuketikafungsiitudipanggil.Padacontohkita membuatduafungsiyaituberiWarna()danhideShow().Objectyangakankitamodifikasistylenya adalahobjectdenganelemenidbernamakotakdalamhalinielementersebutadalahsebuahdiv.

<divid="kotak"style="display:block">
Agarobjectdivtersebutdapatkitamanipulasimakakitaperlumembuatkansebuahwadahuntuk menampungobjecttersebutdalamjavascript.UntukitudigunakanlahsalahsatufungsiDOMyaitu getElementById.Setelahkitamendapatkanobjecttersebutmakakitabebasuntukmemodifikasinya. Contohsederhanaadalahmengubahstylesheetdariobjecttersebut.Setiaptagyangdapat dimanipulasidenganCSSmemilikiatributstyle.BedanyajikapadaCSSformatpenulisannyajika terdiridariduakatamakadipisahdengantandacontoh:backgroundcolor,fontfamily,fontsize, dansebagainya.TapipadajavascriptdigunakanmodelCapitalis,contoh:backgroundColor, fontFamily,fontSizedansebagainya. Warnayangdigunakanpadacontohadalahmenggunakanhexadecimal.Contohcontohwarnayang dapatandagunakansebagaibahanujicobaadalah:90EE90,FFFF00,FFC0CB,danmasihbanyak lagi.
Gambar1.14:ManipulasiDOM
LUGSTIKOMSurabaya
RingkasanBabI PadababinikitatelahmempelajaridasardasarpenggunaanHTML,bagaimanamengunakantag tagnya,memanipulasiteksdenganCSSdanmendesainlayoutsederhanamenggunakanCSSdan DIV.HalyangperludiingatadalahkitaakanmenggunakanstandarXHTMLjadisetiaptagpasti memilikipenutup.OlehkarenaituuntukpembahasanselanjutnyaDOCTYPEyangakankitapakai adalahXHTMLTransitional. Padababinikitajugasedikitmembahastentangpenggunakanjavascriptsecarasederhanauntuk penyampaianinformasikeuserberupadialogboxdaninputbox.Selainitukitajugasedikit membahasbagaimanamemanipulasiDOMmenggunakanjavascript.FungsiDOMtersebutadalah getElementById.
LUGSTIKOMSurabaya
BabIIPengenalanPHP
BabII PengenalanPHP
2.1ApaItuPHP? PHP(akronimdariPHP:HypertextPreprocessor)adalahbahasaserversidescriptingyangdidesain khususuntukweb.PadahalamanHTMLandadapatmenempelkan(embed)kodePHP.KodePHP dieksekusidisisiserverbukandikomputerklien.DanhasilyangditampilkanadalahkodeHTML murni. PHPmerupakanhasilkerjaseorangbernamaRasmusLerdorfpada1995.NamunkemudianPHP berkembangdantidakhanyamerupakanproyekpribadiRasmus.PHPditulisulangdandengan banyakmenambahkanfungsifungsibaruolehZeevSuraskidanAndiGutmants(disingkatZend) danlahirlahPHP3pada1998. PHPmasihterusdikembangkan,padatahun2002PHPhadirdenganversike4.PHP4dilengkapi denganZendEnginedanmengalamibanyakpeningkatanperforma.Danyangpalingakhirpada tahun2005PHP5hadirdengandukunganZendEngine2.Banyakfiturbarukhususnyapada OOP(ObjectOrientedProgramming)danXML BerbedadengandenganPHP4,adopsiPHP5dikalanganindustrisangatlambat.Bahkanhingga sekarangmasihcukupbanyakhostingyangbelummenyediakanPHP5.Halinidikarenakan beberapafaktor,diantanranyakompatibilitasdenganversiPHP4. PadasaatbukuiniditulisversiterakhirdariPHPadalahversi5.2.8untukPHP5danversi4.4.9 untukPHP4.PHP6jugasudahdikembangkanmeskipundalamtahapalpha. Untuk instalasi PHP silahkan baca halaman pendahuluan.
2.2CaraKerjaPHP CarakerjaPHPyangakankitabahaspadabukuiniadalahPHPsebagaibahasapemrogramanuntuk mengembanganaplikasiberbasisweb.KarenaselainuntukwebprogrammingPHPjugadapat digunakanuntukmengembanganaplikasiberbasisdesktopdanCLI(CommandLineInterface).

RequestPHPFile HTTPRequest PHPRequest
Browser
HTMLResponse HTTPResponse
Web Server
PHP
HTMLResponse
Gambar2.1:CarakerjaPHP SecarasederhanacarakerjaPHPdapatdilihatpadagambar2.1diatas.Jikadiurutmakaproses tersebutterdiridari: 1. UsermemintasebuahhalamanPHP 2. BrowsermengirimHTTPRequestkepadaWebServer,misalApache 3. WebServermengirimpermintaanfilePHPtersebutkePHPprocessor.PHPprocessordapat

LUGSTIKOMSurabaya
BabIIPengenalanPHP
berupamodul(bagiandariwebserver)atauterpisah(sebagaiCGI/FastCGI) 4. PermintaandiprosesolehPHPprocessorkemudianhasilnyadikirimkembalikewebserver 5. WebservermemaketkembalihasiltersebutdenganmenambahkanHTTPheaderdan dikirimkembalikebrowser. 6. BrowsermemprosesHTTPpacketdanmenampilkannyasebagaiHTMLkepadauser. 2.3VariabelpadaPHP Variabelmerupakanelemenyangsangatpentingdalambahasapemrograman.Hampirsetiap bahasapemrogramanmengenalapaituyangnamanyavariabel.Variabelsendirimerupakan suatubentukpenyimpanandatasementarapadamemorikomputeryangakandiolahlebih lanjut.ContohvariabelpadaPHPantaranlain:
$nama='LUGSTIKOMPSurabaya'; $angka_1=1; $angka_2=2; $hasil=$angka_1+$angka_2;
Ketentuanketentuandalammembuatvariabel: Variabeldapatterdiridarihuruf,angkadanunderscore(_)dantentusajatandadollar$. Variabeltidakdapatdiawalidenganangka. Variabelbersifatcasesensitiveartinyamembedakanhurufkecildanhurufbesar. Variabel$namatidaksamadengan$NaMa.Untukituhatihatidalampenulisannama variabel. Padavariabelandadapatmengubahnilainya,contoh$angka_1=1dapatandaubahmenjadi $angka_1=2saatsuatuscriptdijalankan.Iniberbedadengankonstanta(akandibahasberikutnya). 2.3.1TipeVariabel PadaPHPkitatidakperlumendeklarasikantipevariabelsecaraeksplisit,istilahkerennyadynamic typing.KarenaPHPsecaraotomatisdapatmenentukantipevariabelberdasarkannilaiyangada padavariabeltersebut.BerikutiniadalahbeberapatipedatayangdikudungolehPHP. Tabel2.1:MacammacamTipeData TipeData Integer String Double Boolean Array Object 2.3.2Konstanta Hampirsamadenganvariabel,konstantajugadigunakanuntukpenyimpanannilaisementara. Namunperbedaankonstantadenganvariabeladalahpadakonstantaandatidakdapatmengubah
Keterangan Digunakanuntuksemuaangka Digunakanuntuksemuahuruf,angka,spasi,dansimbol Digunakanuntukbilanganreal DigunakanuntuknilaiTrueatauFalse Digunakanuntukmenampungbeberapadatasekaligus Digunakanuntukclass
LUGSTIKOMSurabaya
BabIIPengenalanPHP
nilainyajikasudahdideklarasikan.Carapendeklarasiannyapunberbedadenganvariabel.Pada konstantadigunakankeyworddefineuntukmendeklarasikanvariabel.Konstantajugatidak diawalidengantanda$(dollar).

define('HARGA',1500); define('NAMA','LUGSTIKOMPSurabaya');
DapatdilihatpadakodediatasbahwakitaselalugunakanhurufKAPITALuntukkonstanta.Halini tidakharusdilakukannamunsemacamperaturantidaktertulisjikakonstantamakasebaiknya gunakanhurufkapital. 2.3.3PenerapanTeoriVariabeldanKonstanta 1. 2. 3. 4. Jikabelumsilahkanbuatfolderbab2didalamfolderhtdocs/webpro. PastikanApachesudahberjalan. Bukagedit(Linux)/Notepad++(Windows) Ketikkodeberikut:
1. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 4. <head> 5. <title>VariabeldanKonstanta</title> 6. </head> 7. <body> 8. <?php 9. $menu='Menu:NasiPecel'; 10. define('HARGA',2500); 11. 12. $menu='Menu:NasiRawon'; 13. define('HARGA',5000); 14. 15. echo$menu.'<br/>'; 16. echoHARGA; 17.?> 18.</body> 19.</html>
5. Simpandengannamavariabel.phppadafolderbab2 6. Arahkanbrowserandakealamathttp://localhost/webpro/bab2/variabel.html 7. Outputdarifiletersebutadalah
Menu:NasiRawon 2500 KlikkananbrowserandalaluklikViewSource(untukFirefox)untukmelihatkodeHTMLdari halamantersebut.Perhatikanbahwatag<?phpdan?>yangadahanyalahkodeHTMLmurni. PenjelasanScriptvariabel.php Jikaandaperhatikan,samasepertipadababsebelumnyakitahanyamenulissebuahfilehtmlbiasa.

LUGSTIKOMSurabaya
BabIIPengenalanPHP
Namunadasedikitperbedaan,dimanapadafilevariabel.phpterdapatsebuahtagbaruyaitu<?php dan?>.ScriptdalamtaginilahyangakandiprosesolehPHPprocessor.Semuatulisandiluartag<? phpdan?>akandiabaikanolehPHP. Carasepertiyangkitalakukanpadafilevariabel.phpadalahmenempelkanPHPpadaHTML.Jika kumpulanmp3andaadalahwesternsongmungkinandalebihsukamendengarnyadengansebutan embeddingPHPinsideHTML:). Jikaandamasihingatteorisebelumnyatentangvariabel,dapatdilihatbahwavariabel$menukita deklarasiulangdannilainyadiubahmenjadi'Menu:NasiRawon'(Baris:12).Namunhaltersebut tidakberlakupadakonstanta,padabaris13kitadeklarasikanulangkonstantaHARGA.Nilaidari konstantatersebuttidakberubah. Halituditunjukkanketikakitamencetaknilaidari$menudanHARGA.$menuberubahmenjadi 'NasiRawon'dankonstantatetap2500. PadaPHPuntukmencetaksesuatudapatdigunakanperintahecho.Contohpenggunaandapatdilihat padabaris15dan16.Padakonstantatidakperludiberitanda$. TIPS: Selainperintahechoandajugadapatmenggunakanperintahprintuntukmencetak output. 2.4Komentar Komentarpadascriptbertujuanuntukmemberitahupembacanya,baikoranglainataupunanda sendiri.Biasanyakomentardigunakanuntukmenjelaskantujuandituliskannyascripttersebut,siapa penulisnya,kapanditulisdansebagainya.Komentarjugabergunabagiandasendiriketikasuatu waktuandalupamengapaandamenulisfileini,fungsifungsinyauntukapadanbanyaklainnya. PHPakanmengabaikansemuatextdidalamkomentar.Jaditidakakanberpengaruhpadajalannya suatuscript. PHPmengenaltigajenisgayakomentar.PertamamodelbahasaC(banyakbaris/multiline), biasanyadapatdiletakkanpadabagianatasscript.Lihatlahscriptdibawahini.
1. <?php 3. /* 4. Filename:db.php 5. Author:RioAstamal 6. Created:2002200918:22 7. Updated:2205200916:11 8. Desc:FileyangmenyimpankonfigurasiuntukkoneksikeMySQLDatabase 9. */ 10. 11.?>
2.
YangkeduaadalahmodelC++,sepertiyangditunjukkandibawahini.
echo$nama;//cetaknama
LUGSTIKOMSurabaya
BabIIPengenalanPHP
Yangketigaadalahmodelshellscript.
echoHARGA;#cetakharga
Sekarangcobamodifikasifilevariabel.phptersebutdenganmenambahkankomentarlalulihat hasilnya.Apakahmasihsamaatautidak. 2.5Operator Operatormerupakansimbolyangdapatdigunakanuntukmemanipulasinilaidanvariabel.Pada bagiansebelumnyakitasudahmenggunakanbeberapaoperatordiantaranya=,==,<,.,+,*dan lainnya.Selanjutnyakitakanmembahasoperatoropratorinidanoperatorlainnyalebihdetillagi. 2.5.1OperatorAritmatik Pastiandasudahbanyakmengenalberbagaimacamoperatoraritmatik.Jikaandapernhah mengenyampendidikanyangbernamaSekolahDasaratauSDpastiandaseringmenulisoperator operatorinipadabukuanda:). Tabel2.2:OperatorAritmatik Operator
+ * / %
Nama
Penambahan Pengurangan Perkalian Pembagian Modulus
Contoh
$a+$b $a$b $a*$b $a/$b $a%$b
YangmungkinbapakatauIbuguruSDkitalupamengajarkanadalahtentangmodulus.Modulus merupakansisapembagiandariduabilangan.Lihatcontohberikutuntuklebihjelas.
1. <?php 2. 3. $bil1=10; 4. $bil2=5; 5. $bil3=3; 6. 7. echo$bil1%$bil2;//output0 8. echo$bil1%$bil3;//output1 9. echo$bil2%$bil3;//output2 10. 11.?>
2.5.2OperatorKombinasi Sayasendiribingungmenjelaskanoperatorini,sayatakutkatakatasayamenyesatkanpikiran anda:).Jadilebihbaikkitalangsunglihatcontohsajabiarlebihjelas. Tabel2.3:OperatorKombinasi Operator

+= =
Penggunaan
$a+=$b $a=$b
Samadengan
$a=$a+$b $a=$a$b 20082009RioAstamalHal.31
LUGSTIKOMSurabaya *= /= %= $a*=$b $a/=$b $a%=$b
BabIIPengenalanPHP $a=$a*$b $a=$a/$b $a=$a%$b
Penggunaanoperatorkombinasimemangfavoritparaprogrammerkarenamemangmerekaini orangorangyangcenderungmalas.Waduh,sayajugatermasukkelihatannya:). 2.5.3OperatorPerbandingan Operatorperbandingandigunakanuntukmembandingkanduanilai.Penggunaanekspressiini jugaakanmenghasilkannilaitrueataufalsetergantingdariperbandingan. Tabel2.4:Operatorperbandingan Operator

== === != <> < > <= >=
Nama
samadengan identik(harusbertipesama) tidaksamadengan tidaksamadengan kurangdari lebihdari kurangdariatausamadengan lebihdariatausamadengan
Penggunaaan
$a==$b $a===$b $a!=$b $a<>$b $a<$b $a>$b $a<=$b $a>=$b
Operatorperbandinganbiasanyadigunakanpadastrukturkontrolsepertipercabangandan perulangan. 2.5.4OperatorLogika Operatorlogikadigunakanuntukmelakukantesterhadapsebuahkondisilogikadariduaataulebih perbandingan.Sebagaicontoh,kitamungkinmenemukankasusnilaidarivariabel$aberada diantara0sampai10.Untukmengeteskondisi$a>=0dan$a<=10,kitagunakanoperatorAND. Tabel2.5:OperatorLogika Operator

! || && xor
Nama
NOT OR AND XOR
Penggunaaan
!$a $a||$b $a&&$b $axor$b
Keterangan
TRUEjika$aadalahFALSE,berlaku sebaliknya TRUEjika$aatau$bbernilaiTRUEatau keduanyabernilaiTRUE TRUEjika$adan$bbernilaiTRUE TRUEjika$aatau$bbernilaiTRUE, tapitidakkeduanya
2.5.5OperatorIncrement/Decrement Operatorincrement/decrementdigunakanuntukmenambah/mengurangainilaidarisuatuvariabel dengansatu.Incrementmemilikisimbol++(doubleplus)sedangkandecrement(doubleminus).

LUGSTIKOMSurabaya
BabIIPengenalanPHP
Tabel2.5:OperatorIncrement/Decrement Nama
PreIncrement PostIncrement PreDecrement PostDecrement
Contoh
++$a $a++ $a $a
Keterangan
Tambah$adengansatu,lalukembalikannilainya Kembalikannilai$a,lalutambah$adengansatu Kurangi$adengansatu,lalukembalikannilainya Kembalikannilai$a,lalukurangi$adengansatu
Mungkinakanlebihjelasjikaandamelihatcontohdibawahini.
1. <?php 2. 3. echo"<h3>Postincrement</h3>"; 4. $a=5; 5. echo"Seharusnya5:".$a++."<br/>"; 6. echo"Seharusnya6:".$a."<br/>"; 7. 8. echo"<h3>Preincrement</h3>"; 9. $a=5; 10.echo"Seharusnya6:".++$a."<br/>"; 11.echo"Seharusnya6:".$a."<br/>"; 12. 13.echo"<h3>Postdecrement</h3>"; 14.$a=5; 15.echo"Seharusnya5:".$a."<br/>"; 16.echo"Seharusnya4:".$a."<br/>"; 17. 18.echo"<h3>Predecrement</h3>"; 19.$a=5; 20.echo"Seharusnya4:".$a."<br/>"; 21.echo"Seharusnya4:".$a."<br/>"; 22. 23.?>
2.5.6OperatorString Sebenarnyapadacontohcontohsebelumnyaoperatorstringinisudahseringkitagunakan.Operator stringyangdimaksudadalahtanda.(titik).Tandatitikinidapatdigunakanuntukmenggabung string.

1. <?php 2. 3. $a='LUG'; 4. $b='STIKOMP'; 5. $c=$a.''.$b;//hasil:LUGSTIKOMP 6. 7. //ataudengankombinasi 8. $a.='STIKOMP';//hasil:LUGSTIKOMP 9. 10.?>
2.6EscapeCharacter Padasaatmenuliskodeandaakansangatseringmenjumpaisuatukondisidimanakitaharus mencetaktandapetikbaikpetiksatumaupunpetikdua.Permasalahannyatandatersebutsudah

LUGSTIKOMSurabaya
BabIIPengenalanPHP
digunakansebagaipenandauntukmencetakstring.Lalu,bagaimanapemecahannya?Adabeberapa solusiuntukmencetakpetikdidalampetikitusendiri: 1. Gunakanpetiksatu(')sebagaipenutupstringjikainginmencetakpetikdua()dan sebaliknya. 2. MenggunakanEscapeCharacter\(backslash) Berikutiniadalahcontohpenyelesaiandarikeduasolusidiatas.

<?php /* SOLUSINo.1 ============ Jikainginmencetakpetiksatugunakanpetikduasebagaipenutupstring Jikainginmencetakpetikduagunakanpetiksatusebagaipenutupstring */ $a='JohnSays:"Mydear,ILoveYou."<br/>'; $b="TheGirlSays:'GotoHell...!!!'<br/>"; echo$a.$b.'<br/>'; /* SOLUSINo.2 ============ Gunakanescapecharacter\(backslash) */ $a="JohnSays:\"Mydear,ILoveYou.\"<br/>"; $b='TheGirlSays:\'GotoHell...!!!\'<br/>'; echo$a.$b; ?>
2.7SpecialCharacter Pembahasaninisebenarnyatidakbegitukrusialjikadihubungkandenganpembuatantampilanweb. Namunakansangatbergunadalamprosespencariankesalahanketikakitamendesainsuatuhalaman website.Bingung?Samasayajugabingungdenganapayangsayatulis:p. PadaintinyaHTMLmengabaikansemuakarakterwhitespace(spasi,tab,barisbaru)dan menggantinyahanyadengansatuspasiketikaditampilkan.Specialcharacterdisnimencakup

Barisbaru(\n) Tab(\t)
Sebenarnyamasihbanyakkarakterspesiallainnyaseperti\r,\0,\bdanlainlain.Untuklebih jelasnyacobalahcontohberikut.
1. 2. 3. 4. 5. 6. 7. 8. 9. <?php echo"INI\t\tBANYAK\t\tSPASI<br/>"; echo"INIBARISSATU<br/>"; echo"INIBARISDUA<br/>"; echo"INIBARISTIGA<br/>"; echo"\n\n<br/>\n\n"; echo"INIBARISSATU<br/>\nINIBARISDUA<br/>\nINIBARISTIGA"; 20082009RioAstamalHal.34
LUGSTIKOMSurabaya 10. 11.?>
BabIIPengenalanPHP
Outputdarikodediataskuranglebihsepertiberikut: INIBANYAKSPASI INIBARISSATU INIBARISDUA INIBARISTIGA INIBARISSATU INIBARISDUA INIBARISTIGA Jikadilihatdaribrowsertidakadayangberbedadarigroup1dangroup2yangadapadakode diatas.TapijikaandamelihatsourceHTMLdengancaraklikkananViewSource(Firefox)akan terlihatperbedaannya. TIPS: Untukmencetakspecialcharacterseperti\n,\t,\rdansebagainyaharusmenggunakan petikduasebagaipenutupstring.
LUGSTIKOMSurabaya
BabIIPengenalanPHP
RingkasanBabII PadaBabIIkitatelahmembahassejarahsingkattentangPHPyangdiciptakanolehRasmusLerdorf dankemudiandikembangkanolehZend.KitajugatelahmembahashalhaldasarseputarPHPyang meliputi:

Variabel Konstanta Operator SpecialCharacter
LUGSTIKOMSurabaya
BabIIIStrukturKontrol
BabIII StrukturKontrol
StrukturKontrolmerupakansebuahstrukturdalambahasapemrogramanyangmembolehkan kitauntukmengontrolalurdarieksekusisuatuprogramatauscript.Strukturkontrol mencakupstrukturkondisidanstrukturpengulanganataulooping.Strukturkondisiterdiridari beberapastatementyaitu:

if... if...else... if...elseif...else... switch...case...break...
Sedangkanstrukturperulanganterdiridari:

for... while... do...while... foreach...
3.1StrukturKondisi 3.1.1Statementif... Kitadapatmenggunakanstatemenifuntukmembuatsebuahkeputusan.Andaharusmemberiif sebuahkondisiuntukmembuatkeputusan.Jikakondisibernilaitruemakablokifakandieksekusi. Statemenifdikelilingiolehtanda{}(kurungkurawal).Syntaxdasarpenulisanstatemenifadalah:

if(kondisi){ //kodeyangdieksekusi }
JikakondisibernilaiTRUEmakaperintahyangadablokpada{}akandieksekusi.Perhatikan contohdibawah.
1. 2. 3. 4. 5. 6. 7. 8. <?php $nama='LUGSTIKOMP'; if($nama=='LUGSTIKOMP'){ echo'OK,andabolehmasuk.'; } ?>
Padacontohdiataskitamenggunakanvariabelnamasebagaikondisi,dimanajikanilaivariabel $namasamadenganLUGSTIKOMPmakablokperintahakandieksekusi.Ingat,bahwaoperator perbandinganuntuksamadenganadalah==bukan=. Contohlainjikakitamenggunakanangkauntukperbandinganadalah:

1. <?php 2. 20082009RioAstamalHal.37
LUGSTIKOMSurabaya 3. 4. 5. 6. 7. 8. 9. $usia=21; $black_list=FALSE; if($usia>=21&&$black_list==FALSE){ echo'OK,andasudahdewasa.Silahkanmasuk.'; } ?>
Padacontohkeduaini,blokifhanyaakandieksekusijikanilaidariusialebihdariatausama dengan21DANnilaidariblack_listsamadenganfalse. TIPS: Andadapatmeletakkanifdidalamif(ifbersarang).Inijugaberlakuterhadapsemua strukturkontrollain. 3.1.2Statementif...else... Statementinihampirsamadenganifhanyasajapadaifelsekitadiberikanopsialternatifuntuk menentukanaksiyangdilakukanjikakondisibernilaifalse.Statementiniakansangatseringanda gunakandibandingpenggunakanifsaja.Syntaxpenulisanstatementif...else...adalahsebagai berikut:
if(kondisi){ //kodeyangdieksekusijikakondisitrue }else{ //kodeyangdieksekusijikakondisifalse }
Contohstatementif...else...sederhanadapatandalihatberikutini.
1. <?php 2. 3. $peghasilan=5000000; 4. if($penghasilan>=3000000){ 5. echo'PakToyib:"Nakjohn,kamubolehmenikahiputrisaya:)"'; 6. }else{ 7. echo'PakToyib:"Maukamukasihmakanapaputrisayananti!!!"'; 8. } 9. 10.?>
Alurdariscriptdiatassudahjelas,dimanajikanilaidari$penghasilanlebihdari3.000.000maka johndiperbolehkannikahdenganputrinyaPakToyib:).Namunjikakurangdari3.000.000alamat kenamarahPakToyib:(. 3.1.3Statemenif...elseif...else... Jikastatemenif...else...hanyadapatmenggunakansatualternatifjikakondisiawalbernilaifalse. Statemenif...elseif...memberilebihdarisatuaksialternatif.Halinimemungkinkankitauntuk memilihaksidaribanyakkemungkinankondisi.Syntaxdasarpenulisanif...elseif...adalahsebagai berikut:

if(kondisi_1){ 20082009RioAstamalHal.38
LUGSTIKOMSurabaya //kodeyangdieksekusi }elseif(kondisi_2){ //kodeyangdieksekusi }elseif(kondisi_3){ //kodeyangdieksekusi }elseif(kondisi_4){ //kodeyangdieksekusi }else{ //kodeyangdieksekusi }
Andadapatmenulisstatementelseifdenganspasi,yaituelseif.Keduanyasamasamadianggap validolehPHP. 3.1.4PenerapanTeoriif...elseif...else... HalyangpalingseringdilakukanolehPHPsebagaibahasaserversidescriptingadalahmemproses HTMLForm.PadacontohiniadalahintiawalandamemahamitugasPHPsebagaipemrosesHTML Form.KitaakanmembuatduafileyangpertamaadalahfileHTMLmurnisebagaiinputdatabagi user(HTMLForm).DanfileyangkeduaadalahfilePHPyangbertugasmemprosesdatayang dikirimolehfileHTML. 1. 2. 3. 4. 5. Jikabelumsilahkanbuatfolderbab3padafolderhtdocs/webpro PastikanApachesudahberjalan Bukagedit/Notepad++ Simpanfiletersebutdengannamaformtoko.html Ketikkodeberikut:
1. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 4. <head> 5. <title>PembelianOnline</title> 6. </head> 7. <body> 8. <h3>LUGONLINESTORE</h3><hr/> 9. <formaction="formproses.php"method="post"> 10.<label>StickerLinux(Rp7.500,)</label><br/> 11.<label>Jumlah:</label> 12.<inputtype="text"name="sticker"value="0"size="4"/><br/><br/> 13. 14.<label>KaosLinux(Rp35.000,)</label><br/> 15.<label>Jumlah:</label> 16.<inputtype="text"name="kaos"value="0"size="4"/><br/><br/> 17. 18.<label>JacketLinux(Rp35.000,)</label><br/> 19.<label>Jumlah:</label> 20.<inputtype="text"name="jacket"value="0"size="4"/><br/><br/> 21. 22.<inputtype="submit"value="Proses"/> 23.</form> 24.</body> 25.</html>
6. Savekembalifiletersebut 7. Sekarangbuatfilebaru 8. Simpandengannamaformproses.phpmasihdifolderyangsama.

LUGSTIKOMSurabaya
9. Ketikkodeberikut:
1. <?php 2. 3. //buatvariabeluntukmenampungdatadarifileformtoko.html 4. $sticker=$_POST['sticker'];//datasticker 5. $kaos=$_POST['kaos'];//datakaos 6. $jacket=$_POST['jacket'];//datajacket 7. 8. //hargadarimasingmasingproduk 9. define('HARGA_STCIKER',7500); 10.define('HARGA_KAOS',35000); 11.define('HARGA_JACKET',55000); 12. 13.//totalharga 14.$total=(HARGA_STICKER*$sticker)+(HARGA_KAOS*$kaos)+ 15.(HARGA_JACKET*$jacket); 16. 17.$diskon=0; 18.$pesan_diskon='0%'; 19. 20.//cektotaluntukmenentukandiskon 21.if($total>=50000&&$total<75000){ 22.$diskon=0.05;//diskon5% 23.$pesan_diskon='5%'; 24.}elseif($total>=75000&&$total<100000){ 25.$diskon=0.1;//diskon10% 26.$pesan_diskon='10%'; 27.}elseif($total>=100000){ 28.$diskon=0.15;//diskon15% 29.$pesan_diskon='15%'; 30.} 31.$subtotal=$total($total*$diskon); 32. 33.?> 34.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 35."http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 36.<htmlxmlns="http://www.w3.org/TR/xhtml1"> 37.<head> 38.<title>PembelianOnline</title> 39.<styletype="text/css"> 40..tanda{backgroundcolor:#cfcfcf;} 41.</style> 42.</head> 43.<body> 44.<strong>LUGONLINESTOREDATAPEMBELIAN</strong><hr/> 45.<tableborder="1"> 46.<trclass="tanda"> 47.<th>Barang</th><th>Jumlah</th><th>Total</th> 48.</tr> 49.<tr> 50.<td>Sticker</td> 51.<td><?phpecho$sticker;?></td> 52.<td><?phpecho($sticker*HARGA_STCIKER);?> 53.</tr> 54.<tr> 55.<td>Kaos</td> 56.<td><?phpecho$kaos;?></td> 57.<td><?phpecho($kaos*HARGA_KAOS);?> 58.</tr> 59.<tr> 60.<td>Jacket</td> 20082009RioAstamalHal.40
LUGSTIKOMSurabaya 61.<td><?phpecho$jacket;?></td> 62.<td><?phpecho($jacket*HARGA_JACKET);?> 63.</tr> 64.<trclass="tanda"> 65.<tdcolspan="2">TOTAL</td> 66.<td><?phpecho$total;?></td> 67.</tr> 68.<trclass="tanda"> 69.<tdcolspan="2">Diskon</td> 70.<td><?phpecho$pesan_diskon;?></td> 71.</tr> 72.<trclass="tanda"> 73.<tdcolspan="2">SUBTOTAL</td> 74.<td><?phpecho$subtotal;?></td> 75.</tr> 76.</table> 77.</body> 78.</html>
10. Simpankembalifiletersebut 11. Bukabrowserandadanarahkankehttp://localhost/webpro/bab3/formtoko.html 12. Hasilnyaterlihatsepertigambar3.1dan3.2
Gambar3.1
Gambar3.2
Penjelasansingkatformtoko.htmldanformproses.php Kitamulaidarifileformtoko.htmlterlebihdulu.Padafileiniyangperludiperhatikanadalahdata yangterletakpada<form>dan</form>.Perhatikancuplikanscriptformberikut:

<formaction="formproses.php"method="post">
Perhatikannilaidariaction,fileyangdiberikehormatanuntukmenjalankantugasmemproses datayangdikirimolehformadalahfileformproses.php.Letakfiletersebutsatufolderdengan formtoko.html.MetodeyangdigunakanadalahPOSTbukanGET.

LUGSTIKOMSurabaya
<inputtype="text"name="sticker"value="0"size="4"/>
Artidarikodediatasadalahdatayangakankitakirimkankefileformproses.phpbernamasticker. Jadipadafileformproses.phpkitamengambilnyadengancara:
$sticker=$_POST['sticker'];//datasticker
Kodediatasberartikitamenangkapdatayangdikirimdenganmetodepostdandatatersebut bernamasticker.Isidari$_POSTharussamadenganisidarinamepadaform.Namavariabel penampungtidakharussamaakantetapilebihmudahjikasamadengandatayangdipost. TIPS: PHPtidakmemperdulikantataletakkodeanda.Jadidesainlahkodeandasenyaman mungkinuntukdibaca. 3.1.5Statementswitch...case...break Sebenarnyastatementswitch...case...breaksamadenganif...elseif...dimanakitadapatmemilihlebih dariduakondisiataulebih.Selainitupadaswitchkitadapatmemilihkondisitidakhanyapadanilai trueataufalsesajatetapikitajugadapatmemilihdariberbagaitipelainsepertiinteger,boolean, stringdanlainlain.Syntaxpenulisanstatementswitchadalahsebagaiberikut.
switch($kondisi){ casekondisi_1: //kodeyangdieksekusi break; casekondisi_2: //kodeyangdieksekusi break; casekondisi_3: //kodeyangdieksekusi break; default: //kodeyangdieksekusijikatidakadayangmemenuhi break; }
Blockdefaultpadaswitchsamadenganelsepadastatementif...elseif...else....Yaitublokyangakan dieksekusijikasemuakondisitidakterpenuhi.Sebagaicontohandadapatmenggantikodepada formproses.phpbaris2130dengankodeberikut:

21.switch($total){ 22.case$total>=50000&&$total<75000: 23.$diskon=0.05;//diskon5% 24.$pesan_diskon='5%'; 25.break; 26.case$total>=75000&&$total<100000: 27.$diskon=0.05;//diskon5% 28.$pesan_diskon='5%'; 29.break; 30.case$total>=100000; 31.$diskon=0.05;//diskon5% 32.$pesan_diskon='5%'; 20082009RioAstamalHal.42
LUGSTIKOMSurabaya 33.break; 34.}
3.2StrukturPerulangan(Looping) Salahsatukelebihankomputeradalahmelakukanpekerjaanselamaberulangulangtanparasabosan sedikitpun.Berbedadenganmanusia,tidakdapatdibayangkanjikakomputertibatibabosanketika menjalankanperintah:D.Dalampemrogramanperulanganatauloopingadalaheksekusisuatublok kodeselamasuatukondisiloopingmasihterpenuhi.Iniberbedadenganstrukturkontrolyanghanya mengeksekusiblokkodesatukalisaja. Agarpengertianloopingmudahdicerna,sepertimakanansajadicerna:p,kitaakanmembuatsebuah fileHTMLstaticyangkemudianakankitabuatduplikatnyatetapimenggunakanloop. 1. 2. 3. 4. Bukagedit/Notepad++ Buatfilebaru Simpandengannamabensin.htmlletakkanpadafolderhtdocs/webpro/bab3 Ketikkodeberikut:
1. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 4. <head> 5. <title>BensinStatic</title> 6. </head> 7. <body> 8. <tablecellpadding="4"> 9. <trstyle="backgroundcolor:#cfcfcf"> 10.<th>Bensin(Liter)</th><th>Harga(Rp)</th> 11.</tr> 12.<tr> 13.<td>5</td><td>22500</td> 14.</tr> 15.<tr> 16.<td>10</td><td>45000</td> 17.</tr> 18.<tr> 19.<td>15</td><td>67500</td> 20.</tr> 21.<tr> 22.<td>20</td><td>90000</td> 23.</tr> 24.<tr> 25.<td>25</td><td>112500</td> 26.</tr> 27.</table> 28.</body> 29.</html>
6. Savekembalifilebensin.html 7. Bukafiletersebutpadabrowser,http://localhost/webpro/bab3/bensin.html 8. Hasilnyaakanterlihatsepertigambar3.3
LUGSTIKOMSurabaya
Gambar3.3 3.2.1Statementfor... Bentukperulanganpertamayangakankitabahasadalahperulangandenganfor.Bentukpenulisan loopingforadalahsebagaiberikut.

for(ekspresi1;kondisi;ekspresi2){ //kodeyangakandieksekusi }
Keterangan: ekspresi1:dieksekusisatukalisaatloopmulaidieksekusi,biasanyauntukinisialisasi variabelcounter kondisi:diceksetiaploopapakahkondisimasihtrue,jikayamakablokkodetetap dieksekusi,berlakusebaliknyajikafalse ekspresi2:dieksekusisetiapakhirloop,disinibiasanyadigunakanuntukmengubahnilai variabelcounter 3.2.2PenerapanTeorifor... Sepertiyangpernahdisinggungsebelumnya,bahwakitaakankanmenduplikasifilebensin.html tetapidenganmenggunakanperulangan,dalamhalinikitagunakanfor. 1. 2. 3. 4.
1. 2. 3. 4. 5. 6. 7. 8. 9.
Bukagedit/Notepad++ Buatfilebaru Simpan dengan nama bensin_for.php pada folder htdocs/webpro/bab3 Ketikkodeberikut:
<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> <htmlxmlns="http://www.w3.org/TR/xhtml1"> <head> <title>BensinFor</title> </head> <body> <tablecellpadding="4"> <trstyle="backgroundcolor:#cfcfcf"> 20082009RioAstamalHal.44
LUGSTIKOMSurabaya
10.<th>Bensin(Liter)</th><th>Harga(Rp)</th> 11.</tr> 12.<?php 13.$harga=4500;//semogatidaknaiklagi:p 14. 15.//lakukanloopdengankelipatan5sampaidengan25 16.for($liter=5;$liter<=25;$liter+=5){ 17.echo"<tr>\n"; 18.echo"<td>$liter</td><td>".($harga*$liter)."</td>\n"; 19.echo"</tr>\n"; 20.} 21.?> 22.</table> 23.</body> 24.</html>
6. Simpankembalifilebensin_for.php 7. Arahkanbrowserandakehttp://localhost/webpro/bab3/bensin_for.php 8. Hasilnyaakansamapersissepertigambar3.3 PenjelasanSingkatFilebensin_for.php Nilaivariabel$literawalkitaset5,kondisiyangingincekadalahjika$liter<=25.Selamamasih terpenuhi(kondisitrue)makablokkodeakantetapdieksekusi.Setiapselesaieksekusinilaidari variabelcounteryaitu$literkitatambahdengan5. Loopingakanberhentijikasudahmencapaistep6.Karenapadasaatitunilai$litersudahmencapai 30danitutidakmemenuhisyaratkondisidimana$liter<=25. 3.2.3Statementwhile... Berbedadenganforpadawhilekitatidakbisameletakkaninisialisasivariabel,kondisi,dancounter padasatubarissaja.Syntaxpenulisanwhileadalahsebagaiberikut.
while(kondisi){ //blokkodeyangdieksekusi }
Jadiselamakondisimasihtruemakablokkodeakanterusdieksekusi.Whilebiasadigunakanjika kitatidaktahubatasakhirkapansuatuperulanganharusdihentikan. 3.2.4PenerapanTeoriwhile... Kitamasihtetapmenggunakanfilebensin.htmlsebagaiacuanoutputyangakandiselesaikan menggunakanwhile. 1. 2. 3. 4. Bukagedit/Notepad++ Buatfilebaru Simpandengannamabensin_while.phppadafolderhtdocs/webpro/bab3 Ketikkodeberikut:
1. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 20082009RioAstamalHal.45
LUGSTIKOMSurabaya
4. <head> 5. <title>BensinWhile</title> 6. </head> 7. <body> 8. <tablecellpadding="4"> 9. <trstyle="backgroundcolor:#cfcfcf"> 10.<th>Bensin(Liter)</th><th>Harga(Rp)</th> 11.</tr> 12.<?php 13.$harga=4500;//semogatidaknaiklagi:p 14.$liter=5;//inisialisasi$literdiluarloop 15. 16.//lakukanloopdengankelipatan5sampaidengan25 17.while($liter<=25){ 18.echo"<tr>\n"; 19.echo"<td>$liter</td><td>".($harga*$liter)."</td>\n"; 20.echo"</tr>\n"; 21.$liter+=5;//tambahcounter 22.} 23.?> 24.</table> 25.</body> 26.</html>
5. Simpankembalifiletersebut 6. Cobalihathasilnya,http://localhost/webpro/bab3/bensin_while.php 7. Hasilnyaakanterlihatsepertigambar3.3sebelumnya 3.2.5Statementdo...while Berbededengandualoopsebelumnya,dimanapadafordanwhilepengecekankondisidilakukan padaawalsebelumblokkodedieksekusi.Padado...whilepengecekandilakukandiakhireksekusi kode.Jadisetidaktidaknyablokkodedo...whilepastidieksekusiminimalsatukali.Syntaxdasar darido...whileadalahsebagaiberikut.

do{ //kodeyangdieksekusi }while(kondisi)
Blokkodedoakandieksekusiselamakondisiwhilemasihbernilaitrue. 3.2.6PenerapanTeorido...while 1. 2. 3. 4.
1. 2. 3. 4. 5. 6. 7. 8.
Bukagedit/Notepad++ Buatfilebaru Simpandengannamabensin_do_while.phppadafolderhtdocs/webpro/bab3 Ketikkodeberikut:
<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> <htmlxmlns="http://www.w3.org/TR/xhtml1"> <head> <title>BensinDoWhile</title> </head> <body> <tablecellpadding="4">
LUGSTIKOMSurabaya
9. <trstyle="backgroundcolor:#cfcfcf"> 10. <th>Bensin(Liter)</th><th>Harga(Rp)</th> 11. </tr> 12. <?php 13. $harga=4500;//semogatidaknaiklagi:p 14. $liter=5;//inisialisasi$literdiluarloop 15. 16. //lakukanloopdengankelipatan5sampaidengan25 17. do{ 18. echo"<tr>\n"; 19. echo"<td>$liter</td><td>".($harga*$liter)."</td>\n"; 20. echo"</tr>\n"; 21. $liter+=5;//tambahcounter 22. }while($liter<=25) 23. ?> 24. </table> 25.</body> 26.</html>
5. Simpankembalifiletersebut 6. Arahkanbrowserkehttp://localhost/webpro/bab3/bensin_while.phpuntukmelihathasilnya Jikaandamasihpenasarandengankatakataminimaldieksekusisatukalicobagantinilai$liter dari5menjadi30saatinisialisasi.Kodepastiakandieksekusisatukalikemudianselesai.Halini tidakberlakuuntukfordanwhile. Jikaditanyakapankitamenggunakando...while,susahjugajawabnya.Yangjelassecaranalurinanti andaakanmenggunakannyatanpadisuruhsuruhoranglain:p. TIPS: Loopingforbiasadigunakanjikakitatelahmengetahuibatasawaldanakhirdarisuatu perulangan. Untuksementarakitatidakmenbahasduluforeachkarenaloopinididesainkhususuntuk penggunaandidalamarray.Jadipembahasanforeachakankitalakukansaatmembahastentang array.
LUGSTIKOMSurabaya
RingkasanBabIII PadababIIIinikitatelahmembahasaspekterpentingdaribahasapemrogramanstrukturkontrol. Strukturkontrolterdaridaristrukturpercabangan(branching)danperlulangan(looping).PadaPHP percabanganterdiridari:

if... if...else... if...elseif...else... switch...case...break...
Sedangkanstrukturperulanganterdiridari:

for... while... do...while... foreach...
LUGSTIKOMSurabaya
BabIVFiledanArray
BabIV FiledanArray
4.1BerinteraksidenganFile Filemerupakansalahsatuaspekpentingdalamsebuahaplikasi.Seringkalisebuahfiledibuatuntuk berbagaitujuanmisalnya,menyimpankonfigurasi,temporaryfile,cachedanmasihbanyaklagi. InteraksiPHPdenganfilesangatmiripdenganbahasaC.Prosesumumyangdilakukanadalah:

Membuatresourcedenganperintahfopen() Menulis(fwrite())/membacafile Menutupfilefclose()
4.1.1MenyimpanFile Dibandingdenganpenyimpananpadadatabasepenyimpananpadafilerelatifsederhana.Namun memilikibanyakkekuranganterutamajikamenyangkutmasalahkeamanandankecepatanakses data.PadaPHPlangkahlangkahuntukmenyimpansebuahfileadalah:

Membukafiledenganfopen() Menulisfiledenganfwrite() Menutupfiledenganfclose()
fopen()minimalmemerlukanduaparameteryaitu1)stringnamafiledan2)stringmode.Yangperlu diperhatikandisiniadalahmodedarifile.Syntaxyangdigunakanadalah: Parameter 1

fopen(string_nama_file,string_mode);
Parameter 2 Modeyangdapatdigunakanpadafopenadalah: Mode Deskripsi 'r' 'r+' 'w' 'w+' 'a' 'a+' Bukafilehanyauntukbacasaja;pointerfilediletakkandiawalfile. Bukafileuntukbacadantulis;ponterfilediletakkandiawalfile. Bukafileuntuktulissaja;pointerdiletakkandiawalfilelalutruncate(overwrite);jika filetidakada,buatfiletersebut. Bukafileuntukbacadantulis;pointerdiletakkandiawalfilelalutruncate(overwrite); jikafiletidakada,buatfiletersebut. Bukafileuntuktulissaja;pointerdiletakkandiakhirfile(append);jikafiletidakada, buatfiletersebut. Bukafileuntukbacadantulis;pointerdiletakkandiakhirfile(append);jikafiletidak ada,buatfiletersebut.
Copyright2009RioAstamalHal.49
LUGSTIKOMSurabaya
BabIVFiledanArray
TIPS: AgarkompatibelantarsistemoperasiyangmemilikiendinglineyangberbedaLinux (\n),MacOS(\r),danWindows(\r\n)tambahkanopsi'b',misal'wb'.(b=binarymode) Kitaakanmenggunakancontohformtoko.htmlyangterdapatpadabab3.Formatpenyimpanan yangkitagunakanadalah: jml_kaosSticker#harga_kaos#jml_kaosKaos#harga_kaos#jml_jacketJacket# harga_jacket#total#diskon#subtotal OK,langsungajakitacobauntukmenulisfile. 4.1.3PenerapanTeoriPenyimpananFile Sebelummemulaipastikanandasudahmembuatfolderbarudidirektorihtdocsandadengannama bab4.Kitaakanmenyimpanfiletersebutdidalamfolderbab4dengannamafaktur.txt.Ikutilangkah langkahberikut: 1. Copyfileformtoko.htmldanformprosesdarifolderbab3kebab4 2. Modifikasifileformproses.php(padabab4)agarmenampilkanlinkkehalamanfaktur.
1.<?php 2.//buatvariabeluntukmenampungdatadarifileformtoko.html 3.$sticker=$_POST['sticker'];//datasticker 4.$kaos=$_POST['kaos'];//datakaos 5.$jacket=$_POST['jacket'];//datajacket 6.//hargadarimasingmasingproduk 7.define('HARGA_STICKER',7500); 8.define('HARGA_KAOS',35000); 9.define('HARGA_JACKET',55000); 10.//totalharga 11.$total=(HARGA_STICKER*$sticker)+(HARGA_KAOS*$kaos)+ 12.(HARGA_JACKET*$jacket); 13.$diskon=0; 14.$pesan_diskon='0%'; 15.//cektotaluntukmenentukandiskon 16.if($total>=50000&&$total<75000){ 17.$diskon=0.05;//diskon5% 18.$pesan_diskon='5%'; 19.}elseif($total>=75000&&$total<100000){ 20.$diskon=0.1;//diskon10% 21.$pesan_diskon='10%'; 22.}elseif($total>=100000){ 23.$diskon=0.15;//diskon15% 24.$pesan_diskon='15%'; 25.} 26.$subtotal=$total($total*$diskon); 27.//tuliskefile,modeyangdigunakanadalah'a'=>append 28.//filefaktur.txtakandibuatotomatisjikabelumada 29.$fp=fopen('faktur.txt','a'); 30.$isi_file="$stickerSticker#".(HARGA_STICKER*$sticker)."#". 31."$kaosKaos#".(HARGA_KAOS*$kaos)."#". 32."$jacketJacket#".(HARGA_JACKET*$jacket)."#". 33."$total#$pesan_diskon#$subtotal\n"; 34.fwrite($fp,$isi_file); 35.fclose($fp); Copyright2009RioAstamalHal.50
LUGSTIKOMSurabaya
BabIVFiledanArray
36.?> 37.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 38."http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 39.<htmlxmlns="http://www.w3.org/TR/xhtml1"> 40.<head> 41.<title>PembelianOnline</title> 42.<styletype="text/css"> 43..tanda{backgroundcolor:#cfcfcf;} 44.</style> 45.</head> 46.<body> 47.<strong>LUGONLINESTOREDATAPEMBELIAN</strong><hr/> 48.<tableborder="1"> 49.<trclass="tanda"> 50.<th>Barang</th><th>Jumlah</th><th>Total</th> 51.</tr> 52.<tr> 53.<td>Sticker</td> 54.<td><?phpecho$sticker;?></td> 55.<td><?phpecho($sticker*HARGA_STCIKER);?> 56.</tr> 57.<tr> 58.<td>Kaos</td> 59.<td><?phpecho$kaos;?></td> 60.<td><?phpecho($kaos*HARGA_KAOS);?> 61.</tr> 62.<tr> 63.<td>Jacket</td> 64.<td><?phpecho$jacket;?></td> 65.<td><?phpecho($jacket*HARGA_JACKET);?> 66.</tr> 67.<trclass="tanda"> 68.<tdcolspan="2">TOTAL</td> 69.<td><?phpecho$total;?></td> 70.</tr> 71.<trclass="tanda"> 72.<tdcolspan="2">Diskon</td> 73.<td><?phpecho$pesan_diskon;?></td> 74.</tr> 75.<trclass="tanda"> 76.<tdcolspan="2">SUBTOTAL</td> 77.<td><?phpecho$subtotal;?></td> 78.</tr> 79.</table> 80.<p><ahref="faktur.php">LihatFaktur</a></p> 81.</body> 82.</html>
3. Simpankembalifileformproses.php 4. Buatsebuahdokumenbarudengannamafaktur.php 5. Isidarifilefaktur.phpadalah:

1.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2."http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3.<htmlxmlns="http://www.w3.org/TR/xhtml1"> 4.<head> 5.<title>PembelianOnline</title> 6.</head> 7.<body> 8.<h2>DataFakturPembelian</h2> 9.<pre> Copyright2009RioAstamalHal.51
LUGSTIKOMSurabaya 10.<?php 11.//bacaseluruhisifile 12.readfile('faktur.txt'); 13.?> 14.</pre> 15.<ahref="formtoko.html">KembalikeForm</a> 16.</body> 17.</html>
BabIVFiledanArray
6. Simpankembalifilefaktur.php 7. Bukaalamathttp://localhost/webpro/bab4/formtoko.htmluntukmelihatproses penyimpananfile.
Gambar4.1:TambahanlinkLihatFaktur
Gambar4.2:Databeberapafakturtransaksiyangtercatat
4.1.4PenjelasanSingkatPenerapanTeoriPenyimpananFile
LUGSTIKOMSurabaya
BabIVFiledanArray
Padafileformproses.phpmodifikasiyangdilakukandapatdilihatmulaidaribaris2735danjuga bariske80.Padabaris2735yangkitalakukanadalahmelakukanpenulisansebuahfiledengan namafaktur.txt.Karenakitatidakmenyertakanpathuntukdirektorifilemakadiasumsikanfile faktur.txtakanditulispadadirektoriyangsama. Modefileyangkitagunakanadalah'a',agardatafakturfaktursebelumnyayangsudahtertulistidak tertimpa/overwritemelainkankitatambahkandiakhir(append).Separatoryangdigunakanuntuk setiapitemadalah#.Formatiniakantetapkitagunakan,karenapadapembahasanarraykita akanmengextractsetiapitemberdasarkanseparatortersebut. Padafilefaktur.phppembacaanfiledilakukandenganmemanggilfungsireadfile().Fungsireadfile akanmembacasebuahfiledanlangsungmenampilkannyakeoutput.Karenasetiapbarisdipasahkan dengankarakter\nmakakitaperlutagpreformattedtext<pre>agarfileditampilkanapaadanya. 4.1.5FungsifungsiLain Beberapafungsilainyangdapatdigunakanuntukmanajemenfilediantarnyabacadanhapusantara lainfungsifile_get_contents(),fread(),danunlink(). a.file_get_contents() Fungsifile_get_contents()digunakanuntukmembacasebuahfiledanmenyimpannyasebagai string.Sebagaicontohkitadapatmenggantifungsidarireadfile()padafilefaktur.phpdengan perintahberikut:
$data=file_get_contents('faktur.txt'); echo$data;
b.fread() Padafungsifread()terdapatduaparameteryangharusdisertakanyaitupointer/resourceyangdibuka denganfopendanpanjangbytesdaridatayangakandibaca.Contohpenggantireadfile()padafile faktur.phpadalahsebagaiberikut:

$fp=fopen('faktur.txt','r'); $ukuran=filesize('faktur.txt'); $data=fread($fp,$ukuran); echo$data; fclose($fp);
atau
$fp=fopen('faktur.txt','r'); $data=''; while(!feof($fp)){ $data.=fread($fp,2048); } fclose($fp); echo$data;
Fungsifilesize()digunakanuntukmengetahuiukuransebuahfiledalambytes.Sedangkanfungsi feof()digunakanuntukmegecekapakahakhirsebuahfilesudahtercapaiEOF(EndofFile).Pada contohdiataskitamembacasebanyak2048bytesatau2kbsetiaploop.

LUGSTIKOMSurabaya
BabIVFiledanArray
c.fgets() Penggunaanfungsifgets()hampirsamadenganfread()padametodeyangkedua.
$fp=fopen('faktur.txt','r'); $data=''; while(!feof($fp)){ $data.=fgets($fp,2048); } fclose($fp); echo$data;
d.unlink() Berbedadenganbeberapafungsisebelumnya,fungsiunlink()digunakanuntukmenghapussebuah file.Contohpenggunaanunlinkadalahsebagaiberikut:

if(unlink('faktur.txt')) echoFilefaktur.txtberhasildihapus; else echoFilefaktur.txtgagaldihapus;
Fungsiunlink()akanmengembalikannilaibooleanmengenaistatuspenghapusandarisebuahfile. TRUEjikafileberhasildihapusdanFALSEjikagagaldihapus. TIPS: Masalahyangseringmunculjikamenyangkutpembuatandanpenghapusanfileadalah masalahpermission(hakakses).Haliniumumterjadipadasistemoperasiberbasis UNIX.Jadiperhatikanpermissiondaridirektori/fileyangmenjadiobjek. 4.2ArraypadaPHP Arraymerupakansalahsatuaspekterpentingdalambahasapemrograman.Sebenarnyaapasiharray itu?Secarasederhanaarraymerupakansuatuvariabelyangdapatmenyimpanbeberapanilai sekaligus.Berbedadenganvariabelbiasayanghanyadapatmenampungsebuahnilaisaja.Array jugadapatberisiarraylainnya(arraydidalamarray),arraysepertiiniseringdisebutarraymulti dimensi. PadaPHPdikenalduatipearrayberdasarkancarapengaksesannyayaituarrayindexnumerikdan arrayindexstring(associativearray).Bingung?Yesakhirnyasayabisamembuatandabingung:p. OK,biarandatidakstresslangsungsajakitabahasyangpertamaduluyaituarraiindexnumerik. 4.2.1ArraydenganIndexNumerik Kitaakantetapmenggunakancontohprodukpadababasebelumnyayaitusticker,kaos,danjacket dalampembahsancontoh.Sebuaharraydenganindexnumerikdiberiindexmulaidari0,1,2,3,...dan seterusnya.Untukmembuatsebuaharraydenganindexnumericterdapatbeberapacaradiantaranya: Cara1
$produk=array('sticker','kaos','jacket'); Copyright2009RioAstamalHal.54
LUGSTIKOMSurabaya
BabIVFiledanArray
Perintahdiatasberartikitamembuatsebuaharraydengannama$produkdengantigabuahelemen didalamnya.Indexakandiberikanotomatisdimulaidari0yaitusticker,1adalahkaosdan2adalah jacket. Cara2

$produk[0]='sticker'; $produk[1]='kaos'; $produk[2]='jacket';
Caradiatasadalahsebuahcaramanualyaitudenganmemberiindexlangsungpadaarray. Cara3
$produk[]='sticker'; $produk[]='kaos'; $produk[]='jacket';
Caraketigahampirsamadenganyangpertama,hanyaberbedacarapenulisansaja.Carainisangat bergunasaatkitaakanmemberisebuahnilaipadaarraysaatloopingdimanaindexakanbertambah secaraotomatis. 4.2.3MengaksesIsiArray Untukmengaksessebuaharrayhalyangdiperlukanadalahnamaarraytersebutdanindexnya. Dimanapenulisanindexdiapitolehtandakurungsiku[].Perhatikancontohberikut:

echo$produk[0].''.$produk[1].''.$produk[2];
Outputdariperintahdiatasadalah: Output1 stickerkaosjacket Untukarraydenganjumlahyangbisadihitungdenganjaripengaksesansecaramanualmungkin tidakmasalah.Namunjikajumlaharraymencapaipuluhanbahkanratusan?Solusinyayapakai looping. 4.2.4LoopingArrayIndexNumerik Padababbabawalkitasudahmembahaspenggunaanlooping.Loopingsangatbergunauntuk mengaksesarraydalamjumlahbesar.Padabagianinikitajugaakanmembahasforeach()satu satunyaperintahloopingyangbelumdibahas.Outputdariperintahperintahloopingberikutakan mengacupadaoutput1.Haliniditujukanagarmemudahkanandamemahamicarakerjaarraydan loopingitusendiri. a.LoopingArraydenganfor()
//setvariabelindexke0 Copyright2009RioAstamalHal.55
LUGSTIKOMSurabaya for($i=0;$i<3;$i++){ echo$produk[$i]; }
BabIVFiledanArray
Hasilyangditampilkanakansamadenganoutput1. b.LoopingArraydenganwhile()
//setvariabelindexke0 $i=0; while($i<3){ echo$produk[$i]; $i++;//increment$i }
c.LoopingArraydenganforeach() Nah,inilahsaatyangtepatkitaberkenalandengansiforeach().Loopinginimemangkhusus dirancanguntukdigunakandenganarray.Jadijikamemungkinkansebaiknyagunakanlooptipeini dibandingyanglainjikamengaksesarray. Syntaxdasardariforeachadalah:

foreach(ekspresi1as[eskpresi2=>]ekspresi3){ //kodeyangakandieksekusi }
dimana: ekspresi1:variabelarrayyangakandimanipulasi ekpsresi2(opsional):variabelbarutempatmenyimpanindexarray ekspresi3:variabelbarupenampungnilaidarielemenarray Untukmenghasilkanoutputsepertioutput1,makapenulisanforeachyangdigunakanadalah:

foreach($produkas$prd){ echo$prd; }
Padacontohdiataskitahanyamenuliskanekspresi1danekspresi3.Penggunaanekspresi2dapat andalihatpadacontohberikut:
foreach($produkas$index=>$prd){ echo$index:$prd<br/>; }
Outputyangditampilkanadalah:
0:sticker 1:kaos 2:jacket
4.2.5PenerapanTeoriArrayIndexNumerik Untukcontohkaliinikitaakancobamenampilkanisidarifaktur.txttapidengantampilanyanglebih
LUGSTIKOMSurabaya
BabIVFiledanArray
baik.Tidakhanyasekedarisinyasecaralangsung.Ikutilangkahlangkagberikut: 1. Bukagedit(Linux)/Notepad++(Windows) 2. Buatfilebarudidalamdirektorihtdocs/bab4dengannamafaktur2.php 3. Ketikkodeberikut:

1.<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2."http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3.<htmlxmlns="http://www.w3.org/TR/xhtml1"> 4.<head> 5.<title>PembelianOnline</title> 6.</head> 7.<body> 8.<h2>DataFakturPembelian</h2> 9.<tableborder="1"cellpadding="4"> 10.<trstyle="background:#ccc"> 11.<th>No.</th> 12.<th>JmlSticker</th> 13.<th>TotalSticker</th> 14.<th>JmlKaos</th> 15.<th>TotalKaos</th> 16.<th>JmlJacket</th> 17.<th>TotalJacket</th> 18.<th>Total</th> 19.<th>Diskon</th> 20.<th>SubTotal</th> 21.</tr> 22.<?php 23.//pecahsetiapbarismenjadiarraydenganfungsifile() 24.$baris=file('faktur.txt'); 25.//bacaarray 26.foreach($barisas$nomor=>$isi){ 27.echo"<tr>\n"; 28.echo"<td>".++$nomor."</td>\n";//incrementkarenadimulaidari0 29.//extractdatapadasetiapbarisdenganseparator'#' 30.$data=explode('#',$isi);//$datasekarangberupaarray 31.foreach($dataas$data_item){ 32.echo"<td>$data_item</td>\n"; 33.} 34.echo"</tr>\n"; 35.} 36.?> 37.</table> 38.</body> 39.</html>
4. Simpankembalifilefaktur2.php 5. Arahkanbrowserandapadaalamathttp://localhost/webpro/bab4/faktur2.php 6. Hasilnyaakanterlihatsepertigambar4.3. TIPS: Andadapatbereksperimendenganperintahexplode(),misalnyatidakmenggunakan fungsifileuntukmemecahbarismelainkandenganexplode()denganseparator\n.
LUGSTIKOMSurabaya
BabIVFiledanArray
Gambar4.3:Tampilandatafakturlebihbaikdarisebelumnya 4.2.6ArraydenganIndexString(AssociativeArray) Padakasustertentupenggunaanassociativearraylebihbaikdibandingkandenganarrayindex numerik.Padaassociativearray,pengaksesanbukandenganindexangkamelainkanstringsesuai dengankeinginankita.Sebagaicontohkitaakanmembuatsebuaharray$produksepertisebelumnya namundenganassociativearray. Cara1

$produk=array('stc'=>'sticker','ks'=>'kaos','jkt'=>'jacket');
Padacontohdiataskitamemberiindexpadastickerdenganstc,kaosdenganksdanjacketdengan jkt. Cara2

$produk=array('stc'=>'sticker'); $produk=array('ks'=>'kaos'); $produk=array('jkt'=>'jacket');
Cara3
$produk['stc']='sticker'; $produk['ks']='kaos'; $produk['jkt']='jacket';
4.2.7MengaksesAssociativeArray Sebenarnyapengaksesanassociativearraysamadenganarrayindexnumerik.Halyangdiperlukan tentunamadariarraydannamaindexyangakandiakses.Perhatikancontohberikut,output tampilandibawahakansamadenganoutput1padabahasansebelumnya.

echo$produk['stc'].''.$produk['ks'].''.$produk['jkt'];
atau
echo{$produk['stc']}{$produk['ks'}{$produk['jkt']}; Copyright2009RioAstamalHal.58
LUGSTIKOMSurabaya
BabIVFiledanArray
Jikaakanmencetakassociativearraydalamsuatustringmakagunakantanda{}(kurungkurawal) sebagaipembungkusarray. 4.2.8LoopingpadaAssociativeArray Karenapadaassociativearraytidakmenggunakanangkasebagaiindex,makakitatidakdapat menggunakanloopingforpadaarraytipeini. a.Loopingdenganforeach() Associativearraymemangsangatcocokdigunakandenganloopforeach.Kesederhanaansyntax foreachmembuatlebihmudahdibaca.

foreach($produkas$index=>$prd){ echo$index::$prd<br/>; }
Outputdariscriptdiatasadalahsebagaiberikut:
stc :: sticker ks :: kaos jkt :: jacket
tobecontinue...

Dasar2 Web Programming 1.0 2

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Dasar2 Web Programming 1.0 2

Uploaded by

Copyright:

Available Formats

rio astamal

DASAR- DASAR WEB PROGRAMMING

Lisensidibawah: CreativeCommons AttributionShareAlike3.0

Madewith LinuxUserGroup STIKOMPSurabaya http://rioastamal.net/ http://lug.stikom.edu/

DASAR- DASAR WEB PROGRAMMING

rio astamal (c0kr3x@gmail.com)

Lisensidibawah: CreativeCommons AttributionShareAlike3.0

Gambar1.1:CarakerjaWWW Secarakronologisurutanprosespadadiagramdiatasadalah: 1. 2. 3. 4. 5. Usermembukaalamatwebsitepadabrowser BrowsermengirimHTTPRequestkeserver ServermeresponHTTPRequestdaribrowser ServermengirimHTTPResponsekebrowser Browsermenampilkanhalamanwebsitekepadauser

<p></p> <hn></hn> <span></span>

Untukmembuatparagraf Untukmembuatheader** Untukinlinestyle(manipulasiteks)

<!> Komentar *Tagtersebutharusberadadidalamtag<head>...</head> **ndapatberupaangkadari15,contoh<h1>...</h1> PenerapanTeoriHTML 1. Bukaeditoranda(gedit(Linux),Notepad++(Windows),dsb)) 2. Ketikkodeberikut:

3. Simpanpadadengannamahelloworld.html 4. Bukabrowseranda(Firefox,IE,dsb)danbukafileyangbarusajaandabuat. 5. Hasilnyaakansepertigambar1.1

3. Simpandengannamamanipulasiteks.html 4. Bukadenganbrowseranda 5. Hasilnyaakansepertigambar1.2

5. Simpandilokasiyangsamadenganprofilku.htmldanberinamadaftarsitus.html 6. Bukafileprofilku.htmldenganbrowseranda,dancobakliklinkyangadauntukmemahami carakerjanya

<td></td>* Digunakanuntukmembuatkolom *Tagtersebutselaluberadadidalamtag<tr>...</tr> Sepertihalnyataglainyangdigunakanuntukpresentasiteks,seperti<span>,andadapat menggunakanattributstyleuntukmemformattampilantampilantabel.Berikutiniadalahcontoh

pembuatantabelmenggunakanHTML. 1. Bukatekseditor(gedit/Notepad++) 2. Ketikkodeberikut:

Action:Nilaidariattributinimenunjukkanlokasidarifilepemrosesdariform.Dapatberupa relatifURI,contohfolderX/file.phpatauabsolutURI,contohhttp://contoh.com/file.php. Method:Nilaidariattributmenentukanmetodedatayangdikirimkankefilepemroses,apakah melaluimetodeGETatauPOST.

Selaintag<input>masihadataglainyangbiasadigunakandalamformyaitutag<select>dan <textarea>. PENERARANTEORIHTMLFORM 1. Bukagedit/Notedpad++ 2. Ketikkodeberikut:

3. Simpandengannamaform.html 4. Bukadenganbrowserfiletersebut. Hasilnyamemangtidakbegitubaguskarenakitatidakmelakukanstylingpadaform.

Siapkanduabuahgambardalamfolderyangsamadenganfilehtml Dalamcontohinisayamenggunakan(1)stikom.jpgdan(2)joinrevolution.jpg Bukagedit/Notepad++ Ketikkodeberikut:

<html> <head> <title>JoinTheRevolution</title> </head> <body> <imgsrc="stikom.jpg"align="left"> <strongstyle="color:red">SHOULD</strong> <imgsrc="joinrevolution.jpg"align="center"> 20082009RioAstamalHal.9

LUGSTIKOMSurabaya 9. </body> 10.</html>

documentyanginginandagunakanapakahHTML4.01,XHTML1.0Transitional,XHTML1.0 Strictdanlainnya. DOCTYPEjugaseringdisebutDTD(DocumentTypeDefinition).Berikutiniadalahcontoh penggunaantipedokumenHTML4.01,

PerbedaanTransitionaldanStrictterdapatpadatoleransikesalahan.Padatransitionaljikamasihada kesalahanstandarpenulisanmasihdiberikantoleransi,sedangkanStricttidakmemberikantoleransi samasekali.ContohhalamanXHTMLyangvalidadalahsebagaiberikut:

OK,marikitabuatsebuahfileuntuklebihmemahaminya. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

link:Tampilanlinkketikatidakdipiliholehuser(biasanyatidakperluditulis) visited:Tampilanlinksetelahdiklik active:Tampilanketikalinkdiklik hover:Tampilanketikamousemelewatilink(lebihseringdigunakandaripadaactive)

Penasaran?langsungsajabuatfileuntukmencobanya. 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

Designhalamanyangakandibuattidakmelibatkanpenggunaangambar,karenaprioritaskitadisini hanyalahbagaimanacaramengaturtataletakkomponenmenggunakantagdiv.OK,langsungsaja tanpabanyakmendriblebola,lhokok? 1. Bukagedit/Notepad++ 2. Ketikkodeberikut:

19.</html> 3. Simpandengannamajavascript.html 4. Jalankanpadabrowseruntukmelihathasilnya.

50.</html> 3. Simpandengannamadom.html 4. Bukafilemenggunakanbrowseruntukmelihathasilnya. Hasilnyakuranglebihakansamadengangambar1.14. PenjalasanSingkatFiledom.html Banyakhalbarumenyangkutpenggunaanjavascript,sepertipenggunaankeywordfunctiondan

2.2CaraKerjaPHP CarakerjaPHPyangakankitabahaspadabukuiniadalahPHPsebagaibahasapemrogramanuntuk mengembanganaplikasiberbasisweb.KarenaselainuntukwebprogrammingPHPjugadapat digunakanuntukmengembanganaplikasiberbasisdesktopdanCLI(CommandLineInterface).

Gambar2.1:CarakerjaPHP SecarasederhanacarakerjaPHPdapatdilihatpadagambar2.1diatas.Jikadiurutmakaproses tersebutterdiridari: 1. UsermemintasebuahhalamanPHP 2. BrowsermengirimHTTPRequestkepadaWebServer,misalApache 3. WebServermengirimpermintaanfilePHPtersebutkePHPprocessor.PHPprocessordapat

Keterangan Digunakanuntuksemuaangka Digunakanuntuksemuahuruf,angka,spasi,dansimbol Digunakanuntukbilanganreal DigunakanuntuknilaiTrueatauFalse Digunakanuntukmenampungbeberapadatasekaligus Digunakanuntukclass

nilainyajikasudahdideklarasikan.Carapendeklarasiannyapunberbedadenganvariabel.Pada konstantadigunakankeyworddefineuntukmendeklarasikanvariabel.Konstantajugatidak diawalidengantanda$(dollar).

5. Simpandengannamavariabel.phppadafolderbab2 6. Arahkanbrowserandakealamathttp://localhost/webpro/bab2/variabel.html 7. Outputdarifiletersebutadalah

Menu:NasiRawon 2500 KlikkananbrowserandalaluklikViewSource(untukFirefox)untukmelihatkodeHTMLdari halamantersebut.Perhatikanbahwatag<?phpdan?>yangadahanyalahkodeHTMLmurni. PenjelasanScriptvariabel.php Jikaandaperhatikan,samasepertipadababsebelumnyakitahanyamenulissebuahfilehtmlbiasa.

2.5.2OperatorKombinasi Sayasendiribingungmenjelaskanoperatorini,sayatakutkatakatasayamenyesatkanpikiran anda:).Jadilebihbaikkitalangsunglihatcontohsajabiarlebihjelas. Tabel2.3:OperatorKombinasi Operator

LUGSTIKOMSurabaya *= /= %= $a*=$b $a/=$b $a%=$b

BabIIPengenalanPHP $a=$a*$b $a=$a/$b $a=$a%$b

2.5.5OperatorIncrement/Decrement Operatorincrement/decrementdigunakanuntukmenambah/mengurangainilaidarisuatuvariabel dengansatu.Incrementmemilikisimbol++(doubleplus)sedangkandecrement(doubleminus).

2.5.6OperatorString Sebenarnyapadacontohcontohsebelumnyaoperatorstringinisudahseringkitagunakan.Operator stringyangdimaksudadalahtanda.(titik).Tandatitikinidapatdigunakanuntukmenggabung string.

2.6EscapeCharacter Padasaatmenuliskodeandaakansangatseringmenjumpaisuatukondisidimanakitaharus mencetaktandapetikbaikpetiksatumaupunpetikdua.Permasalahannyatandatersebutsudah

LUGSTIKOMSurabaya 10. 11.?>

RingkasanBabII PadaBabIIkitatelahmembahassejarahsingkattentangPHPyangdiciptakanolehRasmusLerdorf dankemudiandikembangkanolehZend.KitajugatelahmembahashalhaldasarseputarPHPyang meliputi:

Variabel Konstanta Operator SpecialCharacter

if... if...else... if...elseif...else... switch...case...break...

for... while... do...while... foreach...

3.1StrukturKondisi 3.1.1Statementif... Kitadapatmenggunakanstatemenifuntukmembuatsebuahkeputusan.Andaharusmemberiif sebuahkondisiuntukmembuatkeputusan.Jikakondisibernilaitruemakablokifakandieksekusi. Statemenifdikelilingiolehtanda{}(kurungkurawal).Syntaxdasarpenulisanstatemenifadalah:

Padacontohdiataskitamenggunakanvariabelnamasebagaikondisi,dimanajikanilaivariabel $namasamadenganLUGSTIKOMPmakablokperintahakandieksekusi.Ingat,bahwaoperator perbandinganuntuksamadenganadalah==bukan=. Contohlainjikakitamenggunakanangkauntukperbandinganadalah:

LUGSTIKOMSurabaya 3. 4. 5. 6. 7. 8. 9. $usia=21; $black_list=FALSE; if($usia>=21&&$black_list==FALSE){ echo'OK,andasudahdewasa.Silahkanmasuk.'; } ?>

6. Savekembalifiletersebut 7. Sekarangbuatfilebaru 8. Simpandengannamaformproses.phpmasihdifolderyangsama.

10. Simpankembalifiletersebut 11. Bukabrowserandadanarahkankehttp://localhost/webpro/bab3/formtoko.html 12. Hasilnyaterlihatsepertigambar3.1dan3.2

Penjelasansingkatformtoko.htmldanformproses.php Kitamulaidarifileformtoko.htmlterlebihdulu.Padafileiniyangperludiperhatikanadalahdata yangterletakpada<form>dan</form>.Perhatikancuplikanscriptformberikut:

Perhatikannilaidariaction,fileyangdiberikehormatanuntukmenjalankantugasmemproses datayangdikirimolehformadalahfileformproses.php.Letakfiletersebutsatufolderdengan formtoko.html.MetodeyangdigunakanadalahPOSTbukanGET.

Blockdefaultpadaswitchsamadenganelsepadastatementif...elseif...else....Yaitublokyangakan dieksekusijikasemuakondisitidakterpenuhi.Sebagaicontohandadapatmenggantikodepada formproses.phpbaris2130dengankodeberikut:

LUGSTIKOMSurabaya 33.break; 34.}

6. Savekembalifilebensin.html 7. Bukafiletersebutpadabrowser,http://localhost/webpro/bab3/bensin.html 8. Hasilnyaakanterlihatsepertigambar3.3

Gambar3.3 3.2.1Statementfor... Bentukperulanganpertamayangakankitabahasadalahperulangandenganfor.Bentukpenulisan loopingforadalahsebagaiberikut.

1. <!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" 2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> 3. <htmlxmlns="http://www.w3.org/TR/xhtml1"> 20082009RioAstamalHal.45

Bukagedit/Notepad++ Buatfilebaru Simpandengannamabensin_do_while.phppadafolderhtdocs/webpro/bab3 Ketikkodeberikut:

<!DOCTYPEhtmlPUBLIC"//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd"> <htmlxmlns="http://www.w3.org/TR/xhtml1"> <head> <title>BensinDoWhile</title> </head> <body> <tablecellpadding="4">

RingkasanBabIII PadababIIIinikitatelahmembahasaspekterpentingdaribahasapemrogramanstrukturkontrol. Strukturkontrolterdaridaristrukturpercabangan(branching)danperlulangan(looping).PadaPHP percabanganterdiridari:

if... if...else... if...elseif...else... switch...case...break...

for... while... do...while... foreach...

LUGSTIKOMSurabaya = /= %= $a=$b $a/=$b $a%=$b