Belajar HTML Gratis

83
H T M L Belajar HTML gratis, mudah dan menyenangkan di prothelon.com aja. Nah kita mulai ya. Belajar HTML merupakan proses pertama yang umumnya dilakukan oleh para web programer. Nah setelah selesai dengan belajar HTML, maka kamu akan memiliki kemampuan untuk membuat halaman web statis. Berikutnya kamu pasti pengen bisa bikin halaman web yang memiliki kemampuan untuk berinteraksi dengan pengunjung secara lebih intens. Waktu itulah kamu perlu mulai belajar PHP. Setelah belajar PHP maka kamu bisa melanjutkan dengan belajar MySQL untuk menambah kemampuan PHP kamu. Saya bisa dengan singkat menjelaskan sabagai berikut. HTML diperlukan terutama untuk membuat tampilan web, PHP untuk menambah kemampuan interaksi dengan pengunjung dan kemampuan menyimpan data akan disupport oleh MySQL. Lengkap sudah semuanya. Namun tentu saja web programming tidak hanya sebatas itu. Selain belajar HTML, PHP dan MySQL, tentu saja kamu dapat mempelajari juga bahasa script lain yang akan lebih memperindah tampilan web kamu dan mempermudah proses desain web kamu seperti CSS dan Javascript. Kamu juga mungkin akan perlu menambah ketrampilan kamu dalam membuat desain web dangan berbagai aplikasi pembuat web seperti Dreamweaver dan FrontPage serta belajar aplikasi pengolah gambar seperti Fireworks dan Adobe. Tetapi untuk saat ini kita akan konsentrasi ke materi belajar HTML yang menjadi dasar semua pemrograman web. Perlu saya sampaikan di sini bahwa meskipun kamu sudah menguasai berbagai aplikasi yang mempermudah desain web, tetapi walau bagaimanapun pada akhirnya kamu tetap akan memerlukan kemampuan untuk melakukan pemrograman hands on alias manual untuk melakukan berbagai tuning dalam program kamu. Elemen HTML, apa tuh? Nah, dalam tutorial Belajar HTML yang lalu, kamu udah nyoba bikin halaman HTML pertama kamu dan mengerti cara bikinnya. Berikutnya kamu harus mengerti tentang elemen HTML dan cara menuliskannya. Kamu akan memerlukan definisi dasar ini dalam proses belajar HTML yang kamu lakukan sepanjang tutorial di sini. Berikut petunjuk pentingnya. Ingat petunjuk penting ini: Dokumen HTML adalah file teks yang terdiri dari elemen HTML. Nah, elemen HTML itu didefinisikan menggunakan apa yang disebut dengan tag HTML. Berikut poin-poin yang akan membantu kamu mengingat dan memahami pengertian Tag HTML:

description

Bisa di baca dan di coba

Transcript of Belajar HTML Gratis

Page 1: Belajar HTML Gratis

H T M LBelajar HTML gratis, mudah dan menyenangkan di prothelon.com aja. Nah kita mulai ya. Belajar

HTML merupakan proses pertama yang umumnya dilakukan oleh para web programer. Nah setelah selesai

dengan belajar HTML, maka kamu akan memiliki kemampuan untuk membuat halaman web statis. Berikutnya

kamu pasti pengen bisa bikin halaman web yang memiliki kemampuan untuk berinteraksi dengan pengunjung

secara lebih intens. Waktu itulah kamu perlu mulai belajar PHP. Setelah belajar PHP maka kamu bisa

melanjutkan dengan belajar MySQL untuk menambah kemampuan PHP kamu.

Saya bisa dengan singkat menjelaskan sabagai berikut. HTML diperlukan terutama untuk membuat tampilan

web, PHP untuk menambah kemampuan interaksi dengan pengunjung dan kemampuan menyimpan data akan

disupport oleh MySQL. Lengkap sudah semuanya. Namun tentu saja web programming tidak hanya sebatas

itu. Selain belajar HTML, PHP dan MySQL, tentu saja kamu dapat mempelajari juga bahasa script lain yang

akan lebih memperindah tampilan web kamu dan mempermudah proses desain web kamu seperti CSS dan

Javascript. Kamu juga mungkin akan perlu menambah ketrampilan kamu dalam membuat desain web dangan

berbagai aplikasi pembuat web seperti Dreamweaver dan FrontPage serta belajar aplikasi pengolah gambar

seperti Fireworks dan Adobe. Tetapi untuk saat ini kita akan konsentrasi ke materi belajar HTML yang menjadi

dasar semua pemrograman web. Perlu saya sampaikan di sini bahwa meskipun kamu sudah menguasai

berbagai aplikasi yang mempermudah desain web, tetapi walau bagaimanapun pada akhirnya kamu tetap

akan memerlukan kemampuan untuk melakukan pemrograman hands on alias manual untuk melakukan

berbagai tuning dalam program kamu. Elemen HTML, apa tuh? Nah, dalam tutorial Belajar HTML yang lalu,

kamu udah nyoba bikin halaman HTML pertama kamu dan mengerti cara bikinnya. Berikutnya kamu harus

mengerti tentang elemen HTML dan cara menuliskannya. Kamu akan memerlukan definisi dasar ini dalam

proses belajar HTML yang kamu lakukan sepanjang tutorial di sini. Berikut petunjuk pentingnya. Ingat

petunjuk penting ini:

Dokumen HTML adalah file teks yang terdiri dari elemen HTML. Nah, elemen HTML itu didefinisikan

menggunakan apa yang disebut dengan tag HTML.

Berikut poin-poin yang akan membantu kamu mengingat dan memahami pengertian Tag HTML:

Tag HTML digunakan untuk menandai (mark-up) elemen HTML

Tag HTML berada di antara dua karakter penanda berikut < dan >

Karakter penanda itu disebut dengan tanda kurung siku

Tag HTML umumnya selalu berpasangan seperti <b> dan </b>

Tag pertama adalah tag pembuka, dan tag kedua adalah tag penutup

Teks di antara kedua tag tersebut disebut isi elemen

Tag HTML tidak bersifat case sensitif, <b> memiliki arti yang sama dengan <B>

Elemen HTML

Page 2: Belajar HTML Gratis

Ingat contoh HTML di tutorial sebelumnya kan:

<html>

<head>

<title>Judul Halaman</title>

</head>

<body>

Ini halaman pertama saya. <b>Teks ini ditebalkan</b>

</body>

</html>

Ini adalah elemen HTML:

<b>Teks ini ditebalkan</b>

Elemen HTML ini dimulai dengan tag pembuka: <b>

Isi dari elemen HTML adalah: Teks ini ditebalkan

Elemen HTML diakhiri dengan tag penutup: </b>

Fungsi tag <b> adalah untuk mendefinisikan sebuah elemen HTML yang harus ditampilkan dengan huruf tebal.

Nah, ini juga elemen HTML:

<body>

Ini adalah halaman pertama saya. <b>Teks ini ditebalkan</b>

</body>

Elemen HTML ini dimulai dengan tag pembuka <body>, dan berakhir dengan tag penutup </body> Fungsi dari

tag <body> adalah untuk mendefiniskkan elemen HTML yang berisi badan (isi) dari dokumen HTML. Mengapa

kita menggunakan tag dalam huruf kecil? Kita sudah membahas sebelumnya bahwa tag HTML tidak case

sensitif: <B> memiliki arti yang sama dengan <b>. Kalau kamu lagi surfing web, kamu akan melihat bahwa

banyak situs web menggunakan tag HTML dalam huruf besar dalam source codenya. Tapi dalam contoh di

atas, kita menggunakan huruf kecil. Tahu kenapa? Kalau kamu mengikuti standar web terbaru, kamu harus

selalu menggunakan tag dalam huruf besar. World Wide Web Consortium (W3C) merekomendasikan

penggunaan huruf kecil dalam rekomendasi HTML 4 mereka, dan XHTML (generasi berikutnya dari HTML)

memerlukan tag dalam huruf kecil. Ok, kamu baru aja belajar tentang elemen HTML. Dan mustinya saat ini

kamu udah mulai terbiasa dengan istilah tag. Kalau belum biasakan diri kamu dengan istilah ini, karena dalam

proses belajar HTML, kamu kudu familiar dengan kata tag. Lha wong HTML itu ya tag-tag itu ko. Berikutnya,

kita akan membahas tentang dasar HTML terutama beberapa TAG menarik untuk mengubah tampilan

paragraf, judul, dll. Tag HTML yang paling penting adalah tag-tag yang mendefinisikan judul, paragraf dan

ganti baris. Seperti umumnya bahasa pemrograman lainnya, maka cara terbaik untuk mempelajari HTML

adalah dengan banyak berlatih. Latihan tentu saja memerlukan alat bantu. Nah, pada dasarnya kamu bisa

bikin file HTML menggunakan notepad, tapi tentu saja banyak software untuk menulis dengan berbagai

fasilitas yang akan memudahkan. Googling aja atau cari di download.com dengan kata kunci HTML Editor.

Judul, Judul didefinisikan dengan menggunakan tag <h1> sampai >h6>. <h1> mendefinisikan huruf judul yang

Page 3: Belajar HTML Gratis

paling besar, dan <h6> yang terkecil. Untuk latihan coba kamu bikin file HTML berikut ini dan perhatikan

hasilnya.

<h1>Ini Judul</h1>

<h2>Ini Judul</h2>

<h3>Ini Judul</h3>

<h4>Ini Judul</h4>

<h5>Ini Judul</h5>

<h6>Ini Judul</h6>

HTML secara otomatis akan menambahkan baris kosong sebelum dan sesudah judul.

Paragraf

Paragraf didefinisikan dengan menggunakan tag <p>.

<p>Ini adalah sebuah paragraf</p>

<p>Ini paragraf lainnya</p>

Sama seperti judul, HTML secara otomatis akan menambahkan baris kosong sebelum dan sesudah paragraf.

Jangan lupa Tag penutup

Kamu pastinya udah pernah ngeliat bahwa paragraf dapat ditulis tanpa tag penutup </p> kayak ginii:

<p>Ini adalah sebuah paragraf

<p>Ini paragraf lain

Contoh barusan dapat digunakan pada hampir semua jenis browser, tapi jangan ngandelin hal itu. Versi-versi

HTML ke depan kayaknya ndak akan ngijinin kamu untuk melewatkan tag penutup.

Menutup semua elemen HTML dengan tag penutup adalah cara yang ampuh untuk menulis HTML yang

kompatibel dengan smeua browser dan pengembangan ke depan. Hal ini juga membuat kode kita lebih mudah

dimengerti (baik dibaca maupun di browse).

Ganti Baris

Tag <br> digunakan pada saat kamu pengen membuat baris baru, tapi belum ingin ganti paragraf. Tag <br>

akan membuatkan sebuah baris baru buat kamu dimanapun kamu letakkan tag itu.

<p>Ini <br> adalah sebuah pa<br>ragaraf dengan ganti baris </p>

Tag <br> adalah tag yang kosong. Nah, karena itu dia tidak punya tag penutup

seperti misalnya </br>, karena jadi ndak masuk akal. Ya tho?

<br> atau <br />

Page 4: Belajar HTML Gratis

Kamu akan makin sering melihat penulisan tag <br> dengan cara begini: <br /> Karena tag <br> tidak memiliki

tag penutup, maka tag tersebut melanggar salah satu aturan dasar dalam penulisan HTML ke depannya

(XHTML yang berbasis XML), di mana semua elemen harus ditutup. Menuliskan penggantian baris dengan

cara <br/> ini menjamin bahwa file HTML kamu akan kompatibel dengan XML maupun cara penulisan HTML di

masa datang.

Menuliskan Komentar dalam HTML

Tag komentar digunakan untuk menyisipkan sebuah komentar dalam kode sumber HTML. Sebuah

komentas akan diabaikan oleh browser. Kamu bisa menggunakan komentar untuk menjelaskan kode

yang kamu bikin, dan tentu saja hal ini akan membantu kamu saat kamu perlu melakukan perubahan

pada kode kamu kapan-kapan. <!-- Ini adalah sebuah komentar --> Perhatikan bahwa kamu perlu

menuliskan tanda seru setelah kurung buka, tetapi tidak sebelum kurung tutupnya.

Ingat hal-hal berikut!

Setiap tag HTML memiliki sebuah nama elemen (body, h1, p, br)

Tag pembuka adalah nama yang dilingkupi oleh tanda kurung siku: <h1>

Tag penutup adalah tanda garis miring dan nama yang dilingkupi oleh tanda kurung siku </h1>

Isi elemen berada di antara tag pembuka dan tag penutup

Beberapa elemen HTML tidak memiliki isi elemen

Beberapa elemen HTML tidak memiliki tag penutup

Beberapa Tips Yang Bermanfaat

Waktu kamu menulis teks HTML, maka kamu tidak akan pernah bisa yakin bagaimana teks itu ditampilkan

oleh browser lain. Beberapa orang memiliki monitor yang lebih besar, dan yang lainnya. Teks akan diatur ulang

setiap kali pengunjung mengubah ukuran windownya. Jangan pernah mencoba untuk membantuk teks yang

memiliki baris kosong atau spasi dekat dengan teks itu. HTML akan menghapus spasi dalam teks kamu.

Berapa banyakpun kamu tuliskan spasi, tetap akan dihitung satu. Satu lagi, dalam HTML sebuah baris baru

dihitung sebagai satu spasi. Menggunakan paragraf kosong <p> untuk menyisipkan baris kosong adalah

kebiasaan yang kurang baik. Gunakan tag <br> sebagai penggantinya. (tapi jangan juga gunakan tag <br>

untuk membuat daftar. Tunggu sampai pelajaran tentang daftar dimulai ya). HTML secara otomatis akan

menambah baris kosong sebelum dan sesudah beberapa elemen, seperti sebelum dan sesudah paragraf dan

judul.

Tag HTML Dasar

Berikut adalah tag-tag penting yang akan sangat sering kamu pakai. Dan kamu akan mempelajari masing-

masing secara lebih detil terutama yang menyangkut atributnya.

Page 5: Belajar HTML Gratis

Tag - Description

<html> - Mendefinsikan sebuah dokumen HTML

<body> - Mendefinisikan isi utama

<h1> to <h6> - Mendefinisikan judul 1 sampai 6

<p> - Mendefinisikan paragraf

<br> - Menyisipkan sebuah baris

<hr> - Mendefinisikan garis horisontal

<!--> - Bikin komentar

Asik kan? Ini belum seberapa, tunggu sampai kamu udah bisa bikin tabel, huruf berwarna dan masih banyak

lagi variasi tampilan yang bisa digunakan untuk mempercantik halaman web kamu.

Atribut Tag HTML

Tag HTML dapat memiliki atribut. Atribut memungkinkan informasi tambahan pada elemn HTML.

Atribut selalu memiliki pasangan nama/nilai seperti ini: nama=”nilai”.

Atribut selalu dicantumkan pada awal tag elemen HTML.

Contoh Atribut 1:

<h1> mendefinisikan awal sebuah judul.

<h1 align=”center”> memiliki informasi tambahan tentang perataan baris.

Contoh Atribut 2:

<body> mendefinisikan badan/isi halaman HTML kita.

<body bgcolor=”red”> akan membuat background layar menjadi merah.

Contoh Atribut 3:

<table> mendefinisikan sebuah tabel HTML (nanti kita pelajari lebih lanjut).

<table border=”1”> memiliki tambahan informasi mengenai ketebalan garis pada tabel.

Selalu Gunakan Tanda Kutip pada Nilai Atribut

Page 6: Belajar HTML Gratis

Nilai atribut seharusnya selalu diapit oleh tanda kutip. Tanda kutip ganda paling sering digunakan, tapi

sebenarnya tanda kutip tunggal juga boleh ko.

Pada beberapa situasi tertantu yang sangat jarang terjadi, seperti misalnya saat nilai atribut itu sendiri berisi

tanda kutip, maka kamu bisa gunakan tanda kutip tunggal.

Contohnya kayak gini:

nama=’Uzumaki “Jurus Seribu Bayangan” Naruto’

Ok.

Selamat mencoba atribut tag HTML.

Entitas karakter

Beberapa karakter memiliki arti khusus dalam HTML, seperti tanda lebih kecil (<) yang mendefinisikan awal

dari sebuah tag HTML. Kalau kita ingin agar browser menampilkan tanda lebih kecil itu (<), kita harus

menyisipkan entitas karakter dalam kode HTML kita.

Entitas karakter memiliki 3 komponen: sebuah tanda dan (&), nama entitas atau sebuah # yang diikuti nomor

entitas dan diakhiri dengan tanda titik koma (;).

Untuk menampilkan tanda lebih kecil dalam halaman HTML kita, maka kita harus menuliskan : &lt; atau &#60;

Keuntungan menggunakan nama dibandingkan nomor adalah bahwa nama lebih mudah untuk diingat.

Kekurangannya adalah bahwa tidak semua browser mendukung nama-nama entitas yang baru, namun

demikian hampir semua browser mendukung nama entitas standar.

Catatan: entitas bersifat case sensitif.

Spasi berurutan

Entitas karakter yang mungkin akan paling sering kamu pakai adalah spasi.

HTML akan menghilangkan spasi dalam teks HTML kamu. Kalau kamu menuliskan 10 spasi pada kode HTML

kamu, maka HTML akan menghapus 9 spasi. Nah, untuk menambahkan spasi pada dokumen HTML kamu,

gunakan entitas karakter &nbsp;

Beberapa entitas karakter yang sering dipakai:

 

Hasil Penjelasan Nama Entitas Nomor Entitas

Spasi &nbsp; &#160;

< Kurang dari &lt; &#60;

> Lebih dari &gt; &#62;

Page 7: Belajar HTML Gratis

" Tanda kutip &quot; &#34;

' Kutip tunggal &apos; (Ndak berlaku di IE) &#39;

& Dan &amp; &#38;

Beberapa komentar yang ada meminta agar tutorial ini ditambah dengan contoh agar lebih jelas.

Nah, berikut ini contoh untuk memperjelas tentang apa yang dimaksud dengan entitas karakter.

Kasusnya sangat mudah kok. Kita kan udah tahu, kalau yang namanya HTML itu menggunakan tag,

iya kan? Salah satu contoh adalah tag <b> </b>untuk menebalkan huruf. Sekarang bayangkan kalau

suatu ketika kamu diminta untuk menulis tutorial tentang HTML dan kebetulan akan menulis

tentang tag HTML yang berfungsi untuk menebelkan huruf. Misalnya kamu pengen baris berikut

tampil di tutorial kamu (perhatikan, kamu ingin agar tag <b> dan </b> muncul dalam baris tersebut).

Untuk menebalkan huruf seperti kata tebal ini, kamu memerlukan tag <b> dan </b>Nah, coba

pikirkan, bagaimana menuliskan bari sederhana ini tanpa entitas karakter. Ndak bisa kan? Misalnya

kamu menulis seperti ini: Untuk menebalkan huruf seperti kata <b>tebal</b> ini,  kamu memerlukan

tag <b> dan </b>Apa yang terjadi? Browser akan menampilkan kalimat berikut:

Untuk menebalkan huruf seperti kata tebal ini, kamu memerlukan tag danApa bedanya? Ya...tag

<b> dan </b> tidak muncul, sebagai gantinya, kata dan akan tampil dalam huruf tebal. Untuk

membuat agar tag <b> dan </b> dapat muncul, kamu memerlukan entitas karakter, sehingga kamu

harus menuliskan kode HTML menjadi seperti ini: Untuk menebalkan huruf seperti kata

<b>tebal</b> ini, kamu memerlukan tag &lt;b&gt; dan &lt;/b&gt;

Perhatikan, tanda < saya ganti dengan entitas karakter &lt;, sedangkan tanda > saya ganti dengan &gt;.

Lhah ... nambah lagi tuh pertanyaan di komentar. Gini pertanyaannya, terus gimana dunks cara kita

menampilkan &gt; biar yang keluar bukan >.

Mudah aja, kita bisa gunakan &amp di depannya untuk meng-escape tanda & sehingga kamu bisa tulis seperti

ini &amp; &gt; (tanpa spasi di antara &amp; dan &gt;. Saya terpaksa menuliskan menggunakan spasi, karena

tidak mungkin saya tuliskan tanpa spasi.)

Gampang kan? Ok, mudah-mudahan contoh ini bisa meningkatkan pemahaman kamu tentang apa yang

dimaksud dengan entitas karakter ini.

Nah, kamu udah belajar HTML cukup jauh saat ini. So, jangan lupa kembali lagi ke Prothelon.com

tempat di mana tutorial terbaik tersedia secara gratis. Kalau udah menguasai HTML dengan cukup

baik, saya sarankan kamu mulai belajar PHP, bisa yang gratis atau yang lebih canggih lengkap

dengan tempat praktek online. Mudahnya gini. Sebuah link adalah sebuah alamat yang merujuk ke dokumen

atau alamat lainnya di Internet. Menurut saya sebenarnya konsep link inilah yang akhirnya benar-benar

membuat web menjadi sangat bermanfaat dan akhirnya menjadi sangat besar seperti sekarang ini.

Orang sangat mudah merujuk ke referensi lain yang semuanya tersedia online. Bener-bener jenius :).

Jadi, pelajari baik-baik ya…Ndak usah pake contoh ya , kan udah banyak banget di Internet. Link ya tempat

kamu main klak klik itu lah.

Page 8: Belajar HTML Gratis

Hyperlinks, Anchors, dan Links

Dalam istilah web, hyperlink adalah referensi (sebuah alamat) ke sumber-sumber informasi lain di

Internet.Hyperlink biasanya merujuk ke sebuah halaman HTML, sebuah gambar, file suara, movie,

dll.Sedangkan anchor (bahasa Indonesianya Jangkar) adalah istilah yang digunakan untuk

mendefinisikan tujuan hyperlink dalam sebuah dokumen. Jadi gini, alamat halamannya ditunjukkan

oleh hyperlink, sedangkan kalau di dalam dokumen itu ada bab 2, maka kita bisa langsung merujuk

ke bab 2 tadi dengan bantuan anchor.

Untuk membuat hyperlink dan anchor kita menggunakan elemen HTML anchor <a>.

Dalam tutorial kali ini, kita akan menggunakan istilah link HTML saat elemen <a> merujuk ke sebuah halaman

dan istilah anchor HTML saat element <a> tersebut merujuk ke sebuah alamat di dalam dokumen.

Bikin Link HTML

Sintaks Link:

<a href="/caramembuatwebsite/url">Teks Link</a>

Tag pembuka berisi atribut link tersebut. Isi elemen (Teks link) mendefinisikan apa yang ingin anda tampilkan

ke pengunjung. Catatan: Isi elemen tidak harus berupa teks lho. Kamu juga bisa me-link dari sebuah gambar

atau elemen HTML lainnya.

Atribut href

Atribut href adalah alamat yang akan dibuka saat seseorang mengklik link yang kita buat. Elemen <a> ini

mendefinisikan sebuah link yang akan menuju ke sebuah web site yang saya kelola juga yaitu kursus-

online.com:

<a href="http://www.kursus-online.com/">Pengen belajar bikin web

sambil Praktek sekalian bisa dapet duit?. Klik di sini aja!</a>

Kode tersebut akan ditampilkan seperti ini. Sok atuh dicoba klik biar kerasa. :)

Pengen belajar bikin web sambil Praktek sekalian bisa dapet duit? Klik di sini aja!!

Atribut target

Atribut target sangat berguna bagi kita untuk mengatur halaman yang kita tuju itu akan dibuka di mana.

Kita bisa membukanya di halaman utama ini langsung atau membukanya di halaman baru saat seorang

pengunjung mengklik link yang kita sediakan.

Berbeda dengan kode sebelumnya yang membuka web site kursus-online.com di jendela yang sama, kode ini

akan membuka web site kursus-online.com pada sebuah jendela baru:

Page 9: Belajar HTML Gratis

<a href="http://www.kursus-online.com/"

target="_blank"> Pengen belajar bikin web sambil Praktek sekalian

bisa dapet duit?. Klik di sini aja!</a>

Sok di klik link di bawah ini biar tahu bedanya:

Pengen belajar bikin web sambil Praktek sekalian bisa dapet duit? Klik di sini aja!!

Attribute name

Saat kita menggunakan atribut name, maka itu berarti kita mendefinisikan sebuah nama anchor yang berada di

dalam sebuah halaman HTML. Nama anchor tidak akan nampak di mata pengunjung. Itu hanya merupakan

pendefinisian di sebuah halaman web aja.

Cara membuat sebuah anchor:

<a name="label">Apapun</a>

Nah, link yang menuju ke halaman itu bikinnya gini:

<a href="#label">Apapun</a>

Perhatikan tanda # yang mendefinisikan nama anchor

Contoh:

Sebuah anchor dalam dokumen HTML:

<a name="top">Ini bagian paling atas</a>

Sebuah link yang merujuk ke bagian paling atas dalam dokumen yang sama:

<a href="#top">Kembali ke atas</a>

Sebuah link yang menuju ke sebuah anchor di halaman web lain:

<a href="http://www.prothelon.com/mambo/contoh.htm#top">

Kembali ke halaman utama paling atas</a> Nah, kalau mau lihat bagaimana

sebuah link anchor bekerja, klik di sini untuk menuju ke bagian paling atas dari

halaman ini.

Catatan penting dan tips yang pastinya akan berguna buat kamu

Ingat untuk selalu menambahkan garis miring di akhir sub folder link kita.

Jika link kita bentuknya seperti ini:

Page 10: Belajar HTML Gratis

href="http://www.prothelon.com/mambo",

maka kamu akan membuat 2 buah permintaan http ke server, karena server akan menambahkan garis miring

dan membuat alamat yang kita minta tadi menjadi seperti ini:

href="http://www.prothelon.com/mambo/"

Nah, dengan menambahkan garis miring di akhir sub folder, kita sudah menghemat resource di server.

Kamu bisa menggunakan Anchor untuk membuat daftar isi di awal sebuah dokumen yang panjang.

Kalau browser tidak bisa menemukan anchor yang kita tentukan, maka secara otomatis akan menuju ke

bagian paling atas dari dokumen. Tanpa error.

Menulis dokumen apapun pasti memerlukan paragraf. Mari kita lihat tag HTML yang digunakan

untuk membuat sebuah paragraf yaitu tag Kita menggunakan tag <p> untuk membuat sebuah

paragraf baru.

Saat kita menggunakan tag ini, dia akan menambahkan sebuah baris kosong di atas dan di bawah teks

paragraf yang kita tulis. Baris-baris kosong tersebut adalah baris yang menandakan sebuah paragraf dan

memisahkan paragraf tersebut dari paragraf-paragraf yang lainnya. Dan...tentu saja kita harus menutup

paragraf kita dangan pasangannya yaitu tag </p>.

Contoh kode HTML:

<p>Ini adalah sebuah contoh paragraf yang panjang dan menarik,

sehingga kalimat ini tidak ada isinya sama sekali. <p>

Kamu juga bisa melakukan proses perataan pada paragraf yang kamu bikin. Hal ini sangat mudah dilakukan,

yaitu dengan menambahkan atribut HTML align.

Contoh tag di bawah ini akan membuat paragraf kamu rata kiri kanan.

<p align="justify">Ini adalah paragraf yang rata kanan dan rata

kiri.</p> Kamu bisa ganti-ganti isi atribut align tersebut dengan kata center

untuk membuat paragraf menjadi di tengah, left rata kiri, dan right untuk rata

kanan.

Buat kamu yang baru belajar HTML, mungkin penasaran bagaimana cara mengubah huruf menjadi

tebal atau membuatnya menjadi miring. Tampilan huruf seperti ini sangat penting untuk dilakukan,

mislanya pada saat kita perlu memberikan penekanan pada kata-kata tertentu yang kita anggap

penting, pada umumnya kita menggunakan huruf tebal, atau pada saat menggunakan istilah asing,

maka kita perlu membuatnya menjadi miring (atau istilah lainnya italic). Jika iya, maka tutorial

HTML kali ini pas banget buat kamu. Gampang kok untuk mengubah tampilan huruf seperti itu.

Seperti yang sudah kamu ketahui dari tutorial elemen HTML ini, kamu pastinya udah tahu kalau

Page 11: Belajar HTML Gratis

HTML menggunakan tag untuk semua perintah yang dilakukannya. Nah, untuk mengubah tampilan

dan format teks, HTML juga menggunakan tag-tag seperti <b> (untuk menebalkan huruf) dan <i>

(untuk menampilkan huruf miring) untuk menampilkan teks atau huruf sesuai dengan kebutuhan

kita.

Berikut beberapa tag untuk mengubah tampilan huruf yang sering digunakan:

Tag Deskripsi

<b> Menebalkan huruf

<i> Menampilkan huruf miring

<big> Menampilkan huruf dalam ukuran besar

<small> Menampilkan huruf dalam ukuran kecil

<strong> Mirip dengan <b>, menampilkan dengan tebal

<sub> Subscript (Tulisan kecil di bawah, misalnya untuk menulis rumus kimia)

<sup> Superscript (Yang ini kecil di atas, misalnya menulis kuadrat)

<u> Menulis huruf bergaris bawah.

Bagaimana contoh pemakaiannya? Berikut ini contoh untuk menampilkan tulisan tebal dan miring:

<b><i>Tulisan ini tebal dan miring</i></b> Mudah bukan? Selamat mencoba.

Dalam tutorial belajar program HTML kali ini, kita akan mencoba membuat daftar.

Apa itu daftar? Gini... pada saat kamu menggunakan ms-word untuk membuat sebuah

dokumen, maka kemungkinan besar kamu akan membuat sebuah daftar atau yang sering

disebut juga dengan istilah list. Dalam ms-word kamu mungkin mengingatnya

sebagai bulleted dan numbered list. Nah. kita juga bisa membuat list tersebut

menggunakan program HTML lho. Coba yuk...

Dengan HTML, sebenarnya kita bisa membuat beberapa jenis daftar. Namun yang paling umum digunakan adalah apa

yang dikenal dengan istilah ordered list dan unordered list. Seperti apa tuh? Mari kita lihat contohnya.

Ordered list adalah daftar yang berurutan, atau gampangnya daftar yang ada nomornya seperti contoh berikut ini:

Saat mempelajari program HTML, kamu harus mempelajari hal-hal berikut ini secara berurutan:

1. Mempelajari Tag HTML

2. Membuat paragraf

3. Membuat link

Sedangkan unordered list biasanya hanya menggunakan bullet seperti daftar berikut ini:

Saat mempelajari program HTML, kamu harus mempelajari hal-hal berikut ini secara berurutan:

Mempelajari Tag HTML

Membuat paragraf

Membuat link

Cara membuatnya juga sebenarnya sangat mudah, dan umumnya semua editor HTML sudah bisa

membuatnya dengan mudah. Namun tidak ada salahnya kalau kamu juga mengenal tag-tag untuk

Page 12: Belajar HTML Gratis

pembuatan list ini. Hal ini penting untuk kamu pelajari agar pada saat membuat program PHP

nantinya, kamu harus membuat list ini berdasarkan beberapa data yang diambil dari tabel, nah

disinalh sebenarnya pengetahuan tentang tag list ini akan sangat bermanfaat.

Ok, dalam tutorial berikutnya saya akan sampaikan tag-tag tersebut dimulai dengan tag ordered list

HTML. Ok. Setelah sebelumnya kamu mempelajari konsep dan jenis-jenis daftar/list dalam program

HTML, sekarang waktunya untuk mempelajari cara membuat ordered list alias daftar bernomor.

Caranya guamping......

Kamu cuman perlu tahu 2 tag yaitu <OL> dan <LI>.

Tag <OL> adalah tanda mulainya sebuah daftar bernomor urut, sedangkan tag <LI> adalah isi dari daftar.

Biasa..paling gampang kalau menjelaskan pakai contoh kan?

Nah kode berikut ini:

<OL><LI>Mempelajari HTML</LI><LI>Mempelajari PHP</LI><LI>Mempelajari MySQL</LI></OL>

Akan tampil seperti ini di browser:

1. Mempelajari HTML

2. Mempelajari PHP

3. Mempelajari MySQL

Mudah bukan? Sebagai catatan tambahan, kamu tidak usah repot-repot menuliskan nomornya untuk

setiap isi daftar. Hal ini sudah dilakukan secara otomatis oleh browser (tentu saja hal ini sangat

memudahkan pembuat kode). Ok. Tutorial berikutnya akan membahas tentang tag HTML unordered

list. Check back soon ya... Ok. Setelah sebelumnya kamu mempelajari konsep dan jenis-jenis daftar/list

dalam program HTML dan membuat daftar bernomor (ordered list) HTML, sekarang waktunya untuk

mempelajari cara membuat unordered list alias daftar tanpa nomor (cuman pakai bullet ajah).

Caranya juga guamping...... Lagi-lagi kamu cuman perlu tahu 2 tag yaitu <UL> dan <LI> yang sudah

kita bahas sebelumnya. Tag <UL> adalah tanda mulainya sebuah daftar tanpa nomor, sedangkan tag <LI>

adalah isi dari daftar.

Mari kita lihat contohnya.

Kode berikut ini:

<UL><LI>Cara membuat website</LI><LI>Membuat Website</LI><LI>Cara membuat web</LI></UL>

Akan tampil seperti ini di browser:

- Cara membuat website

- Membuat Website

Page 13: Belajar HTML Gratis

- Cara membuat web

sama seperti sebelumnya...sangat mudah bukan?

Sampai saat ini, kamu udah belajar beberapa tag HTML penting. Sebelum melanjutkan ke materi

yang lain, ada baiknya kita review sedikit apa yang sudah kamu dapatkan sampai saat ini. Tanda

lebih besar dan kecil (< dan >)digunakan untuk mengawali dan mengakhiri tag HTML. Kata-kata

yang ada di antara kedua tanda tersebut disebut juga elemen HTML.

Semua dokumen HTML memiliki tag-tag utama sebagai berikut:

<html>…</html> tag file HTML

<head>…</head> tag HTML informasi umum untuk header dan info lainnya

<title>…</title> tag HTML judul

<body>…</body> tag HTML body tempat content anda berada

Untuk membuat jarak di antara paragraf, gunakan tag HTML paragraf:

<p>…</p>

Untuk membuat baris baru gunakan tag HTML:

<br />

Daftar/list bisa bernomor (ordered list) atau tanpa nomor (unordered list).

Cara membuatnya:

<ol>…</ol> tag HTML ordered list

<ul>…</ul> tag HTML unordered list

<li>…</li> tag HTML isi daftar

Ternyata belajar HTML tidak serumit yang dibayangkan ya?

Page 14: Belajar HTML Gratis

P H PTutorial ini ditujukan bagi rekan-rekan yang newbie (alias baru) di dunia PHP tapi minimal sudah mengerti tentang HTML (kalo belum silahkan belajar HTML dulu, ndak rumit kok).

PHP adalah sebuah bahasa script yang sangat bagus dan merupakan pasangan yang pas untuk bahasa HTML. Dengan kemampuan PHP untuk membuat website yang dinamis serta keindahan desain menggunakan HTML, maka nyaris tidak ada yang tidak dapat dilakukan gabungan kedua bahasa ini di dunia web. Enaknya lagi, PHP ini merupakan bahasa yang sangat mudah (bagi yang pernah mempelajari C atau bahasa pemrograman lain akan sangat merasakan perbedaaan ini. Contoh salah satu perbedaan yang paling terasa adalah bahwa kita ndak usah repot-repot deklarasi variabel di awal, kalau butuh variabel tinggal pakai).

Kelebihan lain PHP adalah lisensinya yang open source, artinya selain boleh make secara gratis anda memiliki keuntungan tambahan yaitu tersedia banyak sekali materi pendukung yang tersebar di Internet (salah satunya di situs ini). Setelah kita memahami dasar-dasarnya, akan sangat mudah bagi kita untuk mengembangkan kemampuan kita karena ada begitu banyak materi tentang PHP yang bisa kita pelajari lebih lanjut.Saya sangat menyarankan agar anda mempelajari lebih lanjut pembuatan website menggunakan PHP ini dengan cara mempelajari script-script PHP yang sudah ada. Tentu saja dimulai dari yang sederhana dulu, dan nantinya akan meningkat ke yang lebih kompleks seiring perkembangan kemampuan kita.  

Saya sendiri mengenal PHP saat harus membuat aplikasi berbasis web di kantor. Kebetulan disuruh kursus, dan ternyata sangat mudah. Enjoy aja, dan tetap terusin bacanya.

Kamu bisa baca juga artikel tentang Belajar PHP ini untuk mengerti lebih dalam tentang apa dan mengapa kita perlu pake PHP. Selain itu, mungkin anda perlu menyempatkan diri untuk mempelajari strategi belajar PHP terlebih dahulu untuk mengerti urut-urutan yang disarankan untuk mempelajari PHP.

Page 15: Belajar HTML Gratis

Sebelum mulai, anda perlu menginstal server di komputer anda untuk mencoba script yang anda buat secara lokal. (Jika anda memiliki space di server yang support PHP anda juga bisa ngetes script di sana, tapi lebih rumit dan makan biaya soalnya perlu FTP, akses internet, lama, and so on gitu loh). Kalo belum punya software untuk menambahkan fungsi web server, PHP di komputer anda, coba cari di google kata kunci phptriad download, terus instal aja di PC anda. Kalo udah selesai instal, nyalain Apachenya (kalau udah perlu database nyalain juga MySQLnya, untuk cara koneksi PHP ke MySQL lihat di artikel “menghubungkan PHP dengan MySQL”) terus coba ketik di addres http://localhost kalo dah keluar halaman awal Apache, berarti PC anda sudah siap untuk ngetes PHP. (Sebelum lupa, direktori tempat kita harus meletakkan file-file nanti ada di c:\apache\htdocs, kalo ndak percaya, lihat aja di file index yang ada di direktori itu isinya sama dengan yang muncul di halaman awal waktu kita akses ke localhost). Kamu bisa baca juga artikel tentang cara download PHP dan download MySQL sebelum mulai.

Kalau kamu udah selesai membaca tutorial dasar ini, maka kamu bisa melihat tutorial lain tentang HTML, MySQL, PHP dan MySQL, Contoh Script PHP, contoh proyek PHP dan tutorial lanjutan PHP yang juga tersedia di prothelon.com.

Pengen belajar sambil praktek? klik di sini.

OK, silahkan disiapkan dulu, tutorial berikutnya akan berisi tentang filosofi pemrograman PHP (server side script, hubungannya dengan HTML, dll), hal-hal apa saja yang bisa dilakukan PHP, dan tentu saja, contoh script sederhana kecil untuk menampilkan tulisan di halaman web situs anda. 

OK, server sudah siap. Pertanyaan berikutnya adalah sebetulnya PHP itu apa sih ?

Penjelasan sederhananya adalah bahwa PHP merupakan sebuah program tambahan yang ada dalam software web server anda. PHP bisa anda temukan di web server Apache, Microsoft IIS, dan server-server lainnya (dalam kasus phptriad, web server yang digunakan adalah Apache Web Server). PHP ini gampang dipelajari lho, sama seperti VB yang tutorial dasar-dasar VB nya juga bisa anda baca di prothelon.com ini.

Cara menggunakan PHP juga sangat mudah. Pada prinsipnya anda hanya perlu menyisipkan kode PHP ke dalam tag-tag HTML yang sudah ada di situs anda.

Cara bekerjanya secara singkat adalah seperti ini. Ketika ada yang mengakses web anda di halaman yang berisi kode PHP (tentunya dengan file berekstensi .php), server anda akan mengeksekusinya dan kemudian mengirimkan hasil eksekusinya ke web server untuk selanjutnya ditampilkan menggunakan kode HTML.

Itulah sebabnya anda perlu menginstal server anda sendiri untuk mengetes kode PHP anda secara lokal. Dalam hal ini, server merupakan otaknya dan fungsi browser hanyalah untuk menampilkan hasil output serverPHP ke PC klien, yaitu PC anda.

Ingat, PC anda tidak memerlukan tambahan khusus atau apapun untuk melihat hasil eksekusi kode PHP anda.

Mengapa?

Karena begini. Browser anda kan sudah mengerti dan bisa menampilkan bahasa HTML. Web server akan mengolah kode PHP anda dan menampilkan outputnya langsung dalam format HTML. HTML inilah yang dikirimkan ke browser anda. Jadi, hasil output PHP akan diterima melalui internet oleh browser anda dalam format standar HTML. Tentu saja browser anda tidak memerlukan tambahan apapun, karena dia tetap menjalankan tugasnya persis seperti saat menampilkan halaman web tanpa script PHP.

Page 16: Belajar HTML Gratis

Anda juga perlu tahu bahwa sama seperti HTML, PHP merupakan sebuah bahasa script atau kalau jaman saya dulu sering disebut interpreter. Hal ini berarti kode tidak perlu di-compile sebelum digunakan. Kode yang kita buat hanya akan diproses saat diperlukan. Ini berbeda dengan bahasa pemrograman seperti C, VB maupun Delphi yang perlu di-compile (di-compile artinya di ubah dari bentuk text ke bentuk bahasa mesin yang bisa langsung dieksekusi oleh komputer, biasanya ekstensi filenya adalah EXE).

Konsekuensinya enak, anda menulis kode PHP dalam bentuk teks dan menyimpannya dalam bentuk teks juga. Tapi...... script PHP anda jadi memerlukan interpreter yaitu server PHP untuk mengeksekusi kode PHP yang masih dalam bentuk teks, sedangkan pada program hasil compile dalam bentuk executable file tidak memerlukan program lain untuk bisa dieksekusi. Server PHP ini adalah penerjemah kode PHP menjadi bahasa mesin yang dikenal oleh hardware komputer.

Oh ya, kalau anda memerlukan pendalaman lebih detil tentang sintak-sintaks PHP, maka anda bisa mengunjungi situs  php.net. Situs ini berfungsi sebagai pusat pengembangan dan dokumentasi resmi dari PHP (ingat kan, PHP itu sifatnya open source, jadi harus ada tempat berkumpul dan berkoordinasi buat para pengembangnya. (kebayang kalau ndak ada yang koordinasi, bakalan ribet banget tuh proses pengembangannya, iya kan?).

Php.net memiliki banyak materi referensi mengenai PHP dan berbagai macam tips yang dikirim para programmer dari seluruh penjuru dunia. PHP.net memiliki informasi yang sangat hebat dan mendalam mengenai PHP, tapi akan sangat mengerikan bagi pemula untuk langsung terjun ke sana. Itulah sebabnya situs ini dibuat, selain materi di sana sudah advance, yang bikin repot buat kita ya bahasa inggrisnya itu loh. Tapi jangan khawatir, di akhir tutorial ini kita akan membicarakan mengenai bagaimana cara untuk memanfaatkan situs php.net tersebut.

OK, sekarang kita sudah tahu mengenai PHP, so what gitu loh? Emang PHP bisa apaan aja sih ? Gini loh, PHP itu bisa:

Mengambil informasi dari form berbasis web dan menggunakannya untuk berbagai macam keperluan (menyimpan dalam database, membuat halaman berkondisi berdasarkan isi form, ngirimin e-mail, ngirim e-mail ke pacar secara otomatis saat ultah do’i, pokoknya macem-macemlah);

Autentikasi dan menelusuri pengunjung, artinya kita bisa tau pengunjung situs kita itu lebih senang ngeliat halaman yang mana;

Melayani halaman yang berbeda-beda tergantung pada penggunaan browser atau peralatan (misalnya kita bisa tahu pengunjung situs kita itu pake IE atau Firefox atau PDA dan memperlakukannya secara berbeda. Kebayangkan kalau layar sekecil PDA dicekokin halaman web standar yang gede?);

Menampilkan seluruh halaman situs kita dengan hanya menggunakan satu layout. Kalau halamannya statis, kita harus membuat satu layout untuk satu halaman bisa bete tuh;

Namun sebelum kita mempelajari penggunaan khusus PHP, seperti biasa, kita perlu mulai dari yang sederhana dulu. Diawali dengan cara membuat blok program PHP dengan skrip sederhana berikut.

Tolong tulis kode di bawah ini (yang berwarna merah itu) pake notepad aja yah. Terus simpan dengan nama prothelon.php. Jangan lupa saat menyimpan di kotak file name, nama file harus diapit dengan tanda kutip (“prothelon.php”) soalnya kalau tidak begitu, nanti ekstensinya akan jadi txt dan nama filenya jadi prothelon.php.txt. Skrip sederhana ini akan menampilkan tulisan:

“Anda berada di situs Prothelon!”pada browser anda.

<?print ("Anda berada di situs Prothelon!");?>

Kata-kata dalam tanda kurung adalah teks yang akan di tampilkan oleh browser, sedangkan sisanya merupakan kode PHP.

Tag merupakan awal dan akhir skrip, sedangkan karya-karya anda harus diletakkan di tengahnya. Gimana, dah ngerti? OK dah.

Page 17: Belajar HTML Gratis

Dalam artikel selanjutnya kita akan mempelajari aturan-aturan dasar dalam menulis kode PHP yang harus anda ketahui sebelum anda menulis skrip PHP pertama anda termasuk cara ngegabungin PHP sama HTML. Jadi Kembalilah minggu depan OK?

Masih ingat kan? Kalau kode-kode PHP anda akan disisipkan di antara kode-kode HTML. Sebagai akibatnya, PHP dan HTML akan sama-sama kita tulis dalam bentuk teks biasa. Kode PHP anda (misalnya dalam contoh di bawah ini  adalah sebuah halaman yang menampilkan kata-kata “Anda berada di situs Prothelon!”) akan berada di sela-sela kode-kode dalam sebuah file HTML yang berekstensi .php, bukan .htm atau .html seperti biasanya.Pengen belajar sambil praktek? klik di sini.

 

Contoh halaman dari penjelasan tersebut adalah sebagai berikut :

 

<html><head><title> Contoh Halaman PHP </title></head><body><font color="blue">PHP kode saya akan membuat halaman ini menampilkan:</font><p>  <?php  print ("Anda berada di situs Prothelon!");  ?></body></html> 

Nah, perhatikan contohdi atas. Anda mungkin sudah mulai memahami cara kerja PHP dan HTML. HTML tetap diperlakukan sebagaimana HTML persis seperti HTML tanpa kode PHP, tetapi semua kode yang berada di antara tag akan dianggap kode PHP dan diproses oleh server PHP.

 

Ingat kan? Hasil output dari proses PHP itu yang akan ditampilkan oleh HTML ke browser. Perhatikan bahwa jika anda menyimpan file dengan ekstensi .htm/html, maka browser juga akan muncul akan menampilkan juga tag php namun tidak memprosesnya, sehingga muncul seperti ini:

<?php  print ("Anda berada di situs Prothelon!");?>

Sedangkan jika anda menyimpan dalam ekstensi .php, maka yang muncul hanya:

Anda berada di situs Prothelon!

Gitu….

Pengen belajar sambil praktek? klik di sini.

Cara Penulisan Kode PHPSetelah anda memahami bagaimana sebuah kode PHP dan HTML dikawinkan dan diproses, sekarang saatnya bagi anda untuk mempelajari aturan-aturan dasar penulisan sintaks PHP. Aturan-aturan dasarnya secara singkat adalah sebagai berikut:

Penamaan FileFile PHP anda harus disimpan dengan ekstensi .php (jika anda menemukan file dengan

Page 18: Belajar HTML Gratis

ekstensi .php3 atau phtml maka kemungkinan besar file-file tersebut ditulis menggunakan PHP versi 3 ke bawah). Seperti sudah saya jelaskan sebelumnya, file-file tersebut akan disimpan sebagai file teks biasa. (Artinya kita ndak butuh editor khusus kalau kepepet, cukup notepad. Namun perlu diingat bahwa notepad tidak memunculkan nomor baris yang akan kita perlukan saat melakukan debugging jika ada masalah dengan kode kita).

KomentarKomentar adalah bagian penting dalam kode PHP yang anda buat. Anda akan memerlukan komentar ini untuk membantu mengingat lagi kegunaan sebuah blok kode nantinya. Anda harus membiasakandiri untuk menuliskan catatan tentang kode-kode anda dengan tag komentar, sehingga sifat manusiawi kita yang pelupa bisa terbantu jika suatu saat anda perlu mereview kembali kode-kode yang pernah anda buat. Cara untuk membuat komentar yang tidak ingin anda tampilkan atau eksekusi adalah  dengan menambahkan “//” di awal baris atau mengapit komentar dengan “/*” dan “*/” jika perlu membuat komentar yang panjang:<?php// Baris ini akan diabaikan. Catatan untuk kita sendiri: // Saya membuat script ini sambil//Membaca, berenang dan menyelam.print ("Anda berada di situs Prothelon!");/* Tiga baris berikut ini juga akan diabaikan. Dan jangan lupa untuk kembali ke situs ini setiap mingguuntuk melihat artikel/tutorial baru!*/?>

Permulaan Kode Blok kode PHP diawali dengan “<?php” (atau cukup disingkat “<?” saja bila server anda mengijinkan...dan biasanya bisa).

Akhir Kode Blok kode PHP ditutup dengan menambahkan “?>” di akhir blok kodenya.

Akhir Baris Program Setiap baris instruksi program diakhiri dengan tanda titik koma “;”. Artinya walaupun anda menuliskannya lebih dari 1 baris tetap akan dianggap satu baris instruksi program jika belum ada tanda titik koma (lihat contoh di penjelasan tanda kurung di bawah).

Tanda KurungTanda kurung akan banyak anda gunakan dalam kode PHP. Salah satu penggunaan yang sering dilakukan adalah dalam memanggil fungsi. Secara sederhana, setiap fungsi PHP akan berbentuk seperti ini ….

print ( );

"print" adalah nama fungsi dan informasi lain yang perlu ditambahkan pada fungsi tersebut akan anda tuliskandi dalam tanda kurung. Ingat..... jangan lupa untuk mengakhiri dengan tanda titik koma (kesalahan tidak mengakhiri dengan titik koma ini paling sering terjadi pada pemula). Oh iya, sebelum lupa, echo() juga memiliki kegunaan yang sama dengan print().Spasi, pergantian baris, dll tidak akan mempengaruhi output lho. Sehingga, bagian kode berikut ini ...

<?phpprint ("Anda berada di situs Prothelon!");?>

... akan menghasilkan hal yang sama dengan kode berikut ini:

<?php print ("Anda berada di situs Prothelon!"); ?>

Page 19: Belajar HTML Gratis

Saran saya, anda tetap menuliskan dengan menggunakan spasi, kurung dan tab secara wajar. Hal ini penting untuk mempermudah kita membaca program yang panjang. (Biasain yach…)

Dasar-dasar PHP 4 — Kode Pertama Anda

OK deh, sekarang kita coba menulis kode pertama kita. Tolong salin kode berikut ke sebuah file (pakai notepad aja bisa), dan tuliskan apa yang ingin anda tampilkan pada browser di antara tanda kutip.

"Echo" dalam kode dibawah ini artinya tampilkan pada layar web browser saat anda membuka file tersebut:

<?phpecho ("Anda berada di situs Prothelon");?>

Simpan file tersebut dengan nama apa saja tanpa spasi dan diakhiri dengan .php (perhatian para pengguna notepad:saat menulis nama file apitlah dengan tanda kutip), dan jika anda sudah menginstal server di komputer anda sendiri, anda harus menyimpannya di directory khusus tempat root web server anda (jika anda menggunakan phptriad lokasinya adalah c:\apache\htdocs).Langkah berikutnya adalah membuka file pertama anda di browser. Ketik http://localhost/namafile.php untuk melihat hasil karya besar anda, dan ya, anda seharusnya melihat tulisan "Anda berada di situs Prothelon" (jangan gunakan file -> open, dan jangan lupa menyalakan server web anda. Untuk phptriad klik phptriad ->start apache).  Jika anda mencoba kode di server web di internet, FTP file anda ke root server web anda.Ayo, sekarang coba dulu dan buat kode pertama anda bekerja. Kalau sudah berhasil, kembali lagi ke sini dan kita akan bermain-main lagi. (kalau belum berhasil, kontak kami saja).

Perhatikan ErrorAsyik kan? Pasti ..... kalau sukses, kalau tidak bete nih pasti. Apalagi ketemu error di skrip. Anda sangat mungkin akan mendapat error mirip seperti ini (habis, sering sih....dapat error model gini.):

Parse error: parse error in http://localhost/namafile.php on line 12

Pesan error ini sangat bermanfaat dan anda akan banyak bertemu dengan pesan tersebut, pesan error tuh mirip sama orang yang gak suka sama kita, hobinya ngritik terus, tapi kalau kritik itu kita manfaatkan untuk perbaikan, kita bisa mendapat manfaat. Sukurin tuh, orang yang ngritik kita, niat mencela, malah kia manfaatin. Anda akan memperoleh pesan seperti itu untuk tiap baris kode kita yang salah. Untuk kebutuhan kita, sebetulnya yg perlu kita ketahui adalah bahwa ada yg salah pada kode kita di baris 12. Langkah berikutnya tentu saja mengecek kode kita. Saat inilah mulai terasa repotnya pakai notepad. Harus ngitung baris. Makanya coba pakai editor lain, saya sendiri menyukai crimson editor. Untuk kebutuhan kita, kita hanya perlu tahu bahwa ada sesuatu yang salah dengan kode kita di baris 12, jadi mari segera kita lihat baris tsb, dan siapa tahu bisa mengetahui penyebabnya.  Saya selalu mulai dengan melihat apakah sintaks dasar saya sudah benar, misalnya apakah saya sudah menuliskan ; di akhir baris, tag penutup, tanda kurung ?

Pengen belajar sambil praktek? klik di sini.

Terusin yah ...

Mari kita meneruskan kode kita dengan menambahkan beberapa bagian yang penting ke halaman terakhir kita tadi.Dalam kode yang sudah anda tulis, tolong tuliskan beberapa baris lagi. kalau anda perhatikan, anda dapat menggabungkan lebih dari satu fungsi PHP dalam sebuah tag PHP. Ingat, gunakan komentar sesering mungkin. Komentar dalam kode bisa anda gunakan untuk menjelaskan apa yang dilakukan setiap bagian sebagai referensi nantinya saat membaca ulang kode script kita lagi.Berikut scriptnya, dan saya akan menggunakan print sebagai alternatif dari perintah echo pada contoh sebelumnya. Keduanya berfungsi untuk menampilkan sesuatu ke layar browser anda.

Page 20: Belajar HTML Gratis

Teks ini (atau HTML apapun yang ingin anda tampilkan) akan muncul persis sebelum kode-kode PHP.<html><body><p><p><?php// contoh pertama yang kita gunakan, phpversion ini adalah // sebuah fungsi yang akan menampilkan versi PHP yang anda gunakanphpversion();// berikutnya, kita coba menampilkan kode HTML // ke browser untuk membentuk  // layout halaman yang kita tampilkan. // Dalam kasus contoh kali ini, kita akan menggunakan tag <p>,// tag <p> dapat diletakkan // dalam baris print yang sama seperti saat kita menuliskan // teks "Anda berada di situs prothelon.com"// di antara teks phpversion dan // hal-hal lain di baris sesudahnya.print ("<p>"); /* tag <p> digunakan untuk membuat paragraf baru*/print ("Anda berada di situs prothelon.com");print ("<p>");/* fungsi "phpinfo" berikut ini akan menampilkan sebuah halaman yang panjang yang memberikan kita informasi mengenai konfigurasi versi PHP yang kita gunakan. Ini akan sangat berguna saat kita melakukan troubleshooting nantinya */phpinfo();?></body></html>  

CATATAN: fungsi phpinfo akan menghasilkan informasi yang sangat panjang mengenai versi dan status server PHP anda. Jangan khawatir, karena untuk saat ini Anda tidak perlu memahami semua artinya, saya hanya ingin menunjukkan pada anda bahwa ada fungsi tersebut. Suatu saat anda akan memerlukannya, misalnya untuk melihat versi server PHP, lokasi file-file konfigurasi, dll.

Dasar-dasar PHP 5 — Variabel yang Flexible

Seperti yang sudah pernah saya sebutkan di bagian pertama, bahwa salah satu kemudahan menggunakan PHP adalah variabelnya itu lho! Sangat flexibel. Bagi yang sudah pernah belajar bahasa pemrograman sebelumnya, tentu tahu bahwa kita harus mendeklarasikan variabel yang akan kita gunakan dalam program kita di awal . Deklarasi meliputi nama variabel, jenisnya, panjangnya, global atau lokal, dll yang bikin pusiiiing. Nah kalau di PHP, kita tidak perlu mendeklarasikan variabel kita di awal program, perlu variabel, tinggal pakai. Gitu. Nah dalam bagian ini kita akan mempelajari mengapa kita perlu variabel, dan bagaimana cara menggunakannya di PHP. Percaya deh, gampang banget.

 

Baiklah, jika anda perhatikan, sampai saat ini, apa yang sudah kita lakukan hanyalah membuat PHP mencetak teks baik hasil output fungsi (akan kita bahas lebih detil nanti) serta menggunakan perintah echo dan print. Nah, apakah itu sudah cukup menjadikan kita sebagai programmer? Walah, ya belum. Untuk itu, mari sekarang kita masuk lebih dalam lagi dengan mencoba mengenal variabel.Variabel ini merupakan salah satu materi penting yang wajib anda pelajari dalam PHP, jadi.... perhatikan baik-baik ya. 

Pengen belajar sambil praktek? klik di sini.

Untuk mudahnya, coba bayangkan sebuah variabel sebagai sebuah wadah. Nah, berbeda dengan wadah yang biasa kita gunakan, variabel ini akan digunakan untuk menampung satu atau beberapa nilai (bagi yang udah jago, skip aja nih paragraf). Dengan kata lain, variabel ini adalah tempat yang

Page 21: Belajar HTML Gratis

digunakan oleh PHP untuk menyimpan informasi dan meneruskannya ke berbagai tempat. Variabel ini bisa diteruskan ke dokumen lain, fungsi dan sebagainya. 

Untuk memberikan gambaran lebih jelas, saya coba gunakan pendekatan yang mudah-mudahan lebih baik. Anda yang pernah belajar matematika tentu pernah mengingat variabel dalam persamaan kan? Anda tentu masih bisa mengingat persamaan sederhana ini  “ x+3=7”. x adalah variabel, dan dengan sangat mudah, Anda  bisa mengetahui bahwa isi variabel x adalah nilai 4. Nah...variabel dalam PHP kira-kira berfungsi seperti itu, menampung sebuah nilai, dengan sedikit penambahan kemampuan yaitu variabel dalam PHP dapat kita gunakan lagi dalam file atau fungsi lain. Jangan khawatir, anda akan merasa lebih jelas setelah mempelajari contoh yang akan saya sampaikan di bawah nanti.

Alasan mengapa variabel begitu penting dalam PHP adalah karena pada saat Anda membuat halaman web dinamis (halaman yang dapat merespon input dari user) maka anda akan bergantung pada data yang dikirimkan antara halaman web. Pada saat itulah Anda harus menggunakan variabel. Variabel merupakan mekanisme utama dalam pengiriman data seperti ini.

Kayaknya sih, cara paling mudah untuk menerangkan cara kerja variabel dalam PHP adalah dengan menunjukkan aksi mereka dalam contoh ya? Namun sebelum itu, perlu diingat ada 3 hal yang dapat anda lakukan dengan variabel:Menyimpan nilai dengan memberi nilai pada mereka. Kadang disebut juga dengan istilah inisialisasi variabel;Mengubah nilai dalam variabel, tentu saja jika sudah di isi sebelumnya;Mengakses variabel (artinya anda bisa membaca nilai dari variabel itu dan melakukan hal yang diperlukan terhadap mereka)Nah, setelah anda mengetahui tentang apa saja yang bisa anda lakukan dengan variabel, mari kita pelajari lebih dalam dengan menggunakan contoh. 

Pertama, anda perlu mengetahui bahwa variabel dalam PHP dimulai dengan tanda dolar (“$”). Dalam kode di bawah ini , kita akan mengisi variabel, menggunakannya, kemudian mengupdate isinya untuk kemudian digunakan lagi. Nilai yang ada dalam variabel dapat diubah kapanpun kita mau.

Mari kita perhatikan script pendek berikut ini. Jangan khawatir, Saya akan coba jelaskan secara detil apa yang terjadi pada masing-masing baris.

1. <?php2. $isi_variabel = "Ini isi awal variabel!";3. print ("Menampilkan isi variabel awal : $isi_variabel");4. print ("<p>");5. $isi_variabel = "Ini isi Variabel setelah diupdate!";6. print ("Isi variabel setelah diupdate : $isi_variabel");7. ?>

Hasil dari kode tersebut adalah sebagai berikut:

Menampilkan isi variabel awal : Ini isi awal variabel!

Isi variabel setelah diupdate : Ini isi Variabel setelah diupdate!

Penjelasan kode tersebut adalah sebagai berikut. Pada baris kedua, saya memutuskan untuk membuat variabel yang bernama “isi_variabel”. Ingat, semua variabel dimulai dengan tanda dolar, sehingga variabel saya tadi ditulis menjadi “$isi_variabel”. Berikut ini adalah penjelasan rinci mengenai apa yang dikerjakan masing-masing baris.

Baris 1 memberitahu browser bahwa : “Kode PHP mulai di sini”.

Baris 2 buat variabel $isi_variabel sekaligus mengisinya dengan nilai awal berupa kalimat “Ini isi awal variabel!”.

Baris 3 tampilkan kalimat pengantar untuk variabel $isi_variabel dan sekaligus menampilkan nilai dari $isi_variabel

Baris 4 membuat tag <p> dalam HTML untuk membuat paragraf baru.

Page 22: Belajar HTML Gratis

Baris 5 Mengupdate isi variabel $isi_variabel dan mengisinya dengan kalimat “Ini isi Variabel setelah diupdate!”.

Baris 6 tampilkan kalimat pengantara kedua dan nilai untuk isi variabel $isi_variabel yang baru.

Baris 7 ngasih tahu si Browser bahwa kode PHP sudah berakhir.

Anda sudah melihat bahwa variabel $isi_variabel digunakan sebagai semacam wadah yang dapat menampung nilai yang bermacam-macam (Kita juga bisa mengisi berbagai jenis variabel ke dalam variabel yang sama, misalnya setelah kita isi dengan variabel numeric, langsung bisa kita update isinya menjadi varaibel karakter. Hal ini umumnya tidak bisa dilakukan bahasa pemrograman lain). Kita baru saja mengisi variabel dan memanggil isinya dalam sebuah skrip yang sama, namun kekuatan PHP yang masih tersembunyi adalah bahwa kita dapat mengisi variabel kita di suatu halaman web, misalnya sebuah form isian yang harus diisi pelanggan kita dan kemudian menggunakan variabel tersebut kemudian di halaman web lain. 

Sintaks untuk mengeset variabel adalah dengan:

Mendefinisikannya dengan tanda = ($isi_variabel=”Ini isi awal variabel!”);  Menggunakan tanda kutip jika megisinya dengan string atau huruf ("Ini isi awal variabel!”;

angka tidak memerlukan tanda kutip);  Akhiri setiap baris dengan titik koma. 

Kemudian anda dapat memanggilnya denagn mengacu pada nama variabel ($isi_variabel pada baris 3 dan 6 – perhatikan bahwa saat memanggil variabel kita tidak menggunakan tanda kutip).

Pengen belajar sambil praktek? klik di sini.

Penamaan Variabel

Anda dapat menamai sebuah variabel dengan nama apapun selama mengikuti aturan berikut ini:

Dimulai dengan huruf; Terdiri dari huruf, angka dan karakter garis bawah (karakter _ seperti dalam $isi_variabel"); Bukan merupakan kata kunci PHP (misalnya print). 

Hati-hati: nama variabel adalah case sensitif (sehingga variabel $prothelon akan berbeda dengan $PROthelon. Sebagai tips, anda sebaiknya membuat nama variabel yang memiliki arti tertentu sehingga anda lebih mudah memahaminya seandainya beberapa tahun kemudian terpaksa harus membaca kode tersebut. 

Dalam contoh-contoh kita tadi, kita mengisi variabel dengan teks alias string. Variabel juga dapat menampung nilai berupa angka dan lainnya (obyek, array, booleans).

Catatan akhir: Satu hal yang biasanya menjadi pertanyaan adalah penggunaan tanda kutip. Kita bisa menggunakan tanda kutip tunggal maupun ganda untuk mengisi teks, misalnya:

print ("Saya berada di situs Prothelon!");

Baris ini akan mencetak teks Saya berasa di situs Prothelon.

Jika anda ingin agar tanda kutip yang kita sayangi itu ikut tampil, anda harus menambahkan karakter “\” di depannya yang memberitahukan PHP bahwa tanda kutip sesudahnya bukan merupakan bagian dari kode, melainkan bagian dari kalimat. Cara ini dikenal dengan istilah escape characters, Dengan demikian, jika anda ingin menampilkan tulisan “Saya berada di situs Prothelon!” (lengkap dengan tanda kutipnya juga), kode anda akan seperti ini:

print (" \"Saya berada di situs Prothelon!\"" );

Dasar-dasar PHP 6 — Menggunakan PHP dan Form HTML

Page 23: Belajar HTML Gratis

Hmmmm. Terima  kasih atas tanggapan dari pengunjung mengenai situs ini melalui e-mail kami (prothelord [ath} yahoo [dot] co [dot] id). Semoga apa yang sudah disampaikan pada kami akan makin menambah kualitas situs ini.OK deh Prothelors (maksudnya anda), kita lanjutkan tutorial kita dengan melihat bagaimana caranya untuk menggabungkan form HTML dengan kode PHP.

Dalam contoh-contoh kita sampai saat ini, kita sudah berhasil mengisi variabel dan menggunakannya dalam satu kode yang sama. Kayaknya hal ini agak kurang bermanfaat ya? Emang sih. Lha gimana nggak, daripada repot-repot masukin nilai yang kita inginkan, dilanjutkan dengan menampilkan apa yang kita inginkan melalui variabel kita tadi, kan mendingan langsung aja tuh nampilin apa yang kita iningkan tanpa menggunakan variabel, lebih singkat, cepat dan mudah. Jadi, gimana dong? Tenang ..... di tutorial inilah anda akan melihat kekuatan variabel yang sesungguhnya.

Nah, sekarang ayo kita coba sesuatu yang lebih menarik, dan bisa menunjukkan kegunaan variabel kita tercinta dalam sebuah program. 

Baiklah, tanpa membuang waktu lagi, sekarang saatnya untuk membuat sebuah halaman web yang akan kita gunakan untuk menginput nama kita dan nama orang yang kita sukai dan kemudian menampilkannya secara bersamaan di halaman lain. Apa …… halaman lain? Ya, di halaman lain, ini yang membedakan dengan kode-kode kita sebelumnya, untuk itulah, mohon konsentrasi di bagian ini, karena ini sangat penting bagi perkembangan PHP anda di masa datang. Pahami betul bagaimana cara kita mengirimkan variabel kita dari satu halaman ke halaman yang lain yach… 

Sebelum membuatnya, bayangkan kembali skenario ini. Anda membuat sebuah halaman website di mana pengunjung bisa mengisi nama mereka dan nama kekasih mereka dalam sebuah form dan kemudian menampilkan kembali nama-nama tersebut di halaman web lainnya.

Untuk melakukan hal itu, kita perlu membuat 2 buah file PHP. File pertama adalah sebuah form HTML untuk mengumpulkan input dari user, mengisikan input tersebut ke dalam variabel dan kemudian mengirimkannya ke file kedua yang bertugas menampilkan kembali isi variabel tersebut ditambah dengan beberapa hal sederhana lainnya. Maaf kalau cara penyampaiannya payah ya, tapi saya berharap paling enggak bisa tetap fun deh buat Prothelors dalam mempelajari PHP. 

Pertama-tama, kita buat dulu halaman formnya, halaman ini adalah halaman HTML biasa dengan FORM di dalamnya. Sesudah ini kita akan buat sebuah halaman lain (PHP) untuk memproses apa yang diinputkan dari halaman HTML kita ini. Kita namai dengan form_saya.html

1. <html>2. <head>3. <title>Form Saya</title>4. </head>5. <body>6.7. <form action="hasil_form_saya.php" method=post>8.9. Nama saya adalah: 10. <br> <input type="text" name="NamaAnda">11.12. <p> Nama orang yang saya sukai:  13. <br> <input type="text" name="NamaDia">14. <p>15.16. <input type="submit" name="submit" value="Cocokkan!">17. </form>18.19. </body>20. </html> 

Page 24: Belajar HTML Gratis

Ini adalah sebuah form HTML biasa tapi mengandung beberapa hal penting yang perlu Prothelors semua pahami. Bagian-bagian pentingnya adalah:

Baris 7: HTML membaca action="hasil_form_saya.php" yang menunjukkan pada browser file PHP mana yang akan memproses hasil form kita. Implikasinya, beberapa saat lagi anda harus membuat sebuah file yang bernama hasil_form_saya.php yang merupakan mesin kecil yang bertugas untuk menampilkan hasil input di form kita. (Jangan khawatir, kita akan membahas method=post belakangan)

Baris 10: input type="text" menentukan jenis elemen form apa yang kita inginkan,dalam kasus kita ini adalah sebuah inputan teks atau text box (kita juga bisa mendefinisikannya sebagai radio button, check box, dll); name="NamaAnda" artinya adalah bahwa apapun yang kita ketikkan ke dalam text box kita tadi akan mengisi sebuah variabel yang bernama “NamaAnda”. Inilah yang menghubungkan antara form dan variabel – setiap field dalam sebuah form dapat digunakan untuk mengisi variabel untuk kemudian kita gunakan sesuka kita (asik ya?).

Baris 13: di baris ini, kita memiliki sebuah teks input yang akan kita gunakan untuk mengisi variabel lain yang kita beri nama “NamaDia” yang merupakan nama orang yang kita sukai.

Baris 16, 17: Kode ini membuat sebuah tombol submit dengan tulisan “Cocokkan!” (maksudnya adalah coba cocokkan nama anda dengan nama orang yang anda sukai).

Dan berakhirlah form kita.

Nah, tugas form kita itu adalah mengumpulkan informasi nama anda dan nama orang yang anda sukai (tentu saja saat praktek, anda harus memasukkan nama-nama tersebut ke dalam form) dan mengisikannya ke dalam variabel masing-masing. Setelah itu ngapain ya? Berikutnya tentu saja adalah membawa dan menampilkan variabel yang sudah terisi dengan nama-nama tersebut dalam bentuk yang berbeda di …… ya, di halaman lain.

Masih inget kan, bahwa pada baris 7 kode HTML di atas, kita memberitahu form kita agar menuju atau mengeksekusi file hasil_form_saya.php begitu kita klik tombol submit (yang bertuliskan Cocokkan! itu). Berikut ini kira-kira isi file hasil_form_saya.php:

<html><head><title>Sayang Sekali!</title></head><body bgcolor="#FFFFFF" text="#000000"><p>Kayaknya <?php print $NamaAnda; ?><p>gak bakalan bisa jadian sama<b> <?php print $NamaDia; ?> deh!?! </b><p>Cobalah berusaha lebih keras ya…siapa tahu ada kesempatan.</body></html>

Gimana, udah ngerti ya bagaimana caranya form kita mengirimkan sebuah variabel dari form kita itu ke sebuah file PHP? 

Cat: FIle hasil_form_saya.php di atas hanya bisa berjalan jika setting register global php server kamu on. Kalau kebetulan settingnya off, maka kamu harus tambah baris setelah seperti ini:

<?$NamaAnda=$_POST['NamaAnda'];$NamaDia=$_POST['NamaDia'];?>

Perhatikan bahwa pada file hasil_form_saya.php kita sebuah variabel dipanggil dengan menambahkan tanda $ ($NamaAnda) di depan variabel yang kita definisikan pada file HTML form_saya.html sebelumnya (NamaAnda).

Page 25: Belajar HTML Gratis

Get vs Post

Kita sudah menggunakan metode "Post" untuk mengirimkan data form dengan cara yang berbeda menggunakan metode lain yaitu “Get”. Ingat, ini merupakan bagian dari form kita di mana tertulis <form action="hasil_form_saya.php" method=post>. 

Perbedaan antara kedua metode ini adalah bahwa metode post secara transparan mengirimkan semua informasi yang sudah dikumpulkan oleh halaman form kita, sedangkan metode Get akan mengirimkan semua informasi itu sebagai bagian dari URL (dalam contoh form kita tadi, akan seperti ini: http://localhost/hasil_form_saya.php?NamaAnda=panjul&NamaDia=cinta&submit=Cocokkan! — Perhatikan bagaimana informasi yang sudah dimasukkan user mengenai namanya dan nama orang yang disukainya ditambahkan pada URL? Ini akan sangat membantu nanti jika anda sudah mempelajari cara pengiriman variabel antar halaman lebih lanjut). 

Pengen belajar sambil praktek? klik di sini.

Baiklah untuk bagian ini kita akhiri dulu ya, dan akan kita lanjutkan lagi ke bagian 7 yang akan membahas mengenai senjata tambahan sebuah variabel, yaitu Array. Terima kasih atas kunjungannya dan kembalilah lagi jika kamu sudah sempat untuk mempelajari lebih lanjut mengenai PHP ini. Jangan lupa untuk mendaftar sebagai anggota, sehingga kamu akan bisa mendapat berbagai informasi penting dari saya. Kamu juga bisa belajar HTML lebih jauh untuk meningkatkan pengetahuan kamu tentang tag-tagnya.

Mempelajari array sangat penting dalam pembuatan program karena sangat menambah tingkat fleksibilitas sebuah variabel, itulah sebabnya, saya menyebutnya senjata tambahan dalam menggunakan variabel (yang sudah anda kuasai dalam bagian sebalumnya, kan?). Contoh yang dapat anda lakukan dengan array adalah melakukan transpose data ke bentuk yang kita inginkan, memanipulasi data dari database, dll. Tertarik ? Silahkan baca lebih lanjut….

Jika saya ingin membuat sebuah daftar yang berisi nama semua binatang yang ada di rumah saya, saya dapat memasukkan masing-masing ke dalam sebuah variabel yang terpisah. Misalnya, saya punya 2 ekor jerapah bernama Diana dan Bejo, serta seekor cicak yang bernama Sawiyah (sayang dia sudah mati dimakan kucing). Kita akan mencoba mengisikannya masing-masing ke dalam sebuah variabel:

$jerapah1 = "Diana";$Jerapah2 = "Bejo";$cicak = "Sawiyah”;

Dengan array, kita dapat menyimpan semua isi variabel tersebut ke dalam sebuah variabel misalnya kita beri nama $hewan. Setiap elemen variebal akan memiliki “penanda” sendiri (dapat berupa angka atau huruf) yang digunakan untuk mengakses bagian array tertentu.

Saya akan coba jelaskan konsep “penanda” dengan cara lain: Jika kita menyimpan 3 buah variabel yang berbeda ke dalam sebuah variabel (seperti menyimpan Diana, Bejo dan Sawiyah ke dalam $hewan), kita memerlukan suatu cara untuk mengambil kembali bagian tertentu (misalnya Diana saja) untuk kita gunakan selanjutnya. Sebuah array secara otomatis akan menomori setiap elemen yang membentuka array tersebut, sehingga penandanya dapata berupa elemen 1, elemen 2 dan elemen 3. Atau, sebagaimana yang akan kita lihat nanti, kita dapat menamai setiap bagian array menggunakan teks.  Dalam kasus kita kali ini, kita bisa saja menandai masing-masing elemen $hewan dengan penanda “jerapah pendak”, jerapah tinggi” dan “cicak” untuk kemudian menggunakan penanda tersebut untuk mengenali setiap anggota array.

Baiklah, kita coba saja membuat array sederhana dan kemudian menggunakannya. Cara paling mudah untuk mebuat array adalah menggunakan fungsi array(), yang akan mengisi array kita dengan variabel yang kita inginkan. Contoh :

$hewan = array ( "Diana", "Bejo", "Sawiyah" );

Page 26: Belajar HTML Gratis

Perintah ini akan menyimpan semua nama hewan kesayangan kita itu ke dalam sebuah variabel ($hewan), dan otomatis mengalokasikan sebuah nomor “penanda”  ke setiap elemen array secara berurutan dimulai dari 0 (mohon diingat, mulai dari 0, agar tidak bingung saat menggunakan array untuk memanipulasi variabel kita nantinya). Dengan demikian, Diana adalah elemen [0], Bejo [1] dan Sawiyah [2]. Kita memberikan nama array sesuai keinginan kita ($hewan). 

Anda sekarang sudah bisa mangambil bagian array yang kita inginkan dengan mengacu pada nama bariabel diikuti dengan nomor elemen dalam tanda kurung siku ($hewan[0] akan berisi Diana). Sekarang kita coba melihat array kita beraksi:

<?php print "$hewan[2]"; ?> 

Kode ini cuma akan menampilkan isi dari elemen ketiga dalam variabel $hewan yaitu Sawiyah (sekali lagi ingat, bahwa nomor array dimulai dengan angka 0, sehingga elemen ketiga adalah $hewan[2], OK?.)

Cara lain untuk membuat array atau bahkan menambah anggota array adalah dengan menambah array secara terpisah:

$hewan[] = "Diana";$hewan[] = "Bejo";$hewan[] = "Sawiyah”; 

Cara ini akan memberikan hasil yang sama dengan saat kita menggunakan fungsi array(). Dengan cara ini kita juga bisa manambahakan nama kucing tetangga ke dalam array kita ini, misalnya namanya Belang dengan cara yang sama:

$hewan[] = "Belang";

Anda tidak perlu khawatir, PHP sudah lulus SD. Dia sudah bisa menghitung jumlah elemen yang ada sehingga dapat memberikan penanda elemen yang pas untuk isi variabel kita yang baru.

Artinya, si Belang akan secara otomatis mendapat nomor elemen [3]. 

Untuk mengingatkan lagi tentang konsep array ini, kita ingat kembali bahwa kita dapat mengisi array dengan nama hewan peliharaan kita (dan tetangga kita) dengan dua cara, yaitu:

$hewan[] = "Diana";$hewan[] = "Bejo";$hewan[] = "Sawiyah";$hewan[] = "Belang"; 

atau dengan cara:

$hewan = array ( "Diana", "Bejo", "Swaiyah", "Belang" );

Keduanya akan diindeks oleh komputer dengan nilai sebagai berikut

$hewan[0] = "Diana";$hewan[1] = "Bejo";$hewan[2] = "Sawiyah";$hewan[3] = "Belang"; 

Dan dalam kedua kasus tersebut, kita dapat mengambil elemen manapun dalam array kita dengan menambahkan nomor penandanya.... Misalnya:

<?phpprint "$hewan[3]";?>

... akan menampilkan apa?

Page 27: Belajar HTML Gratis

Ya..... akan menampilkan Belang ke browser kita.

Array dapat dibuat untuk mengerjakan berbagai macam hal, misalnya mengurutkan berdasarkan abjad, menampilkan dalam berbagai kategori yang berbeda, dan masih banyak lagi.

OK. Kita akan lanjutkan lagi pada bagian barikutnya. Yang akan membahas mengenai array yang sedikit lebih kompleks yaitu array asosiatif. Makasih udah membaca tutorial ini . Semoga bermanfaat.

Array Asosiatif

Dalam tulisan sebelumnya, kita sudah belajar tentang array. Jika anda sudah siap untuk mempelajari array yang lebih rumit, silahkan baca tutorial ini. Array asosiatif mengindeks elemen di dalamnya menggunakan nama yang kita tentukan dan bukan menggunakan nomor seperti yang sudah pernah kita pelajari. Cara membuatnya adalah menggunakan fungsi array. Dalam fungsi array, kita bisa mengeset sepasang atribut sebagai nama elemen dan nilai elemen itu sendiri menggunakan gabungan “=” dan “>”, misalnya: nama_elemen=>”nilai”. Contoh riilnya adalah sebagai berikut:$pacarku = array (nama=>"Juwita",Sifat=>"Baik hati, tidak sombong dan rajin menabung",rambut=>"panjang terurai",umur=>17);Di sini, kita membuat array bernama pacarku, dengan nama elemen “nama”,”Sifat”,”rambut” dan “umur”; dan kita mengisi masing-masing nama elemen tersebut dengan nilai (nama diisi dengan “Juwita”, Sifat”Baik hati, tidak sombong dan rajin menabung”, dan seterusnya).Setelah array kita buat, kita dapat mengambil bagian manapun dari array tersebut dengan menggunakan “nama elemen” yang sudah kita alokasikan, contoh:print $pacarku[nama];akan memberikan kita nilai Juwita. Kita dapat juga mengeset setiap nama elemen secara sendiri-sendiri, misalnya:$pacarku[nama] = "Juwita";$pacarku[Sifat] = " Baik hati, tidak sombong dan rajin menabung ";$pacarku[rambut] = "panjang terurai";$pacarku[umur] = 17;Sebelum topik array ini berakhir, mari kita buat sedikit lebih rumit. Kita akan menggunakan kekuatan array yang sebenarnya dengan membuat array multi dimensi (kali kayak dimensi ruang dan waktunya Einstein ya?). Sebuah array multi dimensi adalah array (misalnya pacar-pacar kita) yang terbuat dari array yang lain (yaitu array-array setiap pacar kita, berisi nama, sifat dan umurnya).Kita membuat array multi dimensi dengan membuat sebuah array:$hewan = array( );...dan kemudian kita isi array tersebut dengan array-array hewan di rumah kita yang sudah kita definisikan nama elemennya seperti ini:$pacarku = array (array ( nama=>"Rosa",sifat=>"Baik Hati",umur=>17 ),array ( nama=>"Ruby",sifat=>"Tidak Sombong",umur=>27 ),array ( nama=>"Sri",sifat=>"Rajin Menabung",umur=>37 ),array ( nama=>"Nety",sifat=>"Pemalas",umur=>15 ));Untuk menggunakannya, kita dapat mengambil setiap bagian informasi dari array kita tersebut dengan menyebut nama array ($pacar), nomor dari sub-array yang kita inginkan (Rosa adalah [0],

Page 28: Belajar HTML Gratis

Ruby dengan [1], dst) dan kemudian menyebut nama elemen untuk atribut yang kita inginkan (nama, sifat dan umur). Ngomong-omong, kalau melihat daftar pacarnya, pasti dia orang yang hobi berpetualang, dari yang daun muda sampai yang tua disamber semua. Payah.Untuk mengetahui umur Nety, kita akan menuliskan seperti ini:print $pacarku[3][umur];Berikut ini adalah keseluruhan kode yang sudah kita buat tadi. Semua kita buat dalam satu halaman, namun perlu diingat bahwa anda dapat mengeset array di suatu tempat (katakanlah dalam kode atau fields di form yang berada di halaman lain atau dalam database) dan mengambil informasi yang ada di dalamnya dari tempat lain. Di dini kita akan meletakkan semua dalam satu halaman agar anda dapat melihat semuanya sekaligus.<html><head><title>Array Pacar</title></head><body><?php$pacarku = array (array ( nama=>"Rosa",sifat=>"Baik Hati",umur=>17 ),array ( nama=>"Ruby",sifat=>"Tidak Sombong",umur=>27 ),array ( nama=>"Sri",sifat=>"Rajin Menabung",umur=>37 ),array ( nama=>"Nety",sifat=>"Pemalas",umur=>15 )); print $pacarku[2]["sifat"];print ("<br>");print $pacarku[3]["umur"];?></body></html>akan menampilkan :Rajin Menabung15Apa yang sudah kita lakukan adalah membuat array yang mengandung sub array untuk setiap pacar kita yang berisi informasi detil tentang mereka; kemudian menampilkan sebuah kalimat yang menggunakan sifat dan umur dari 2 pacar kita yang terakhir.Sudah…sudah masalah array kita sudahi sampai di sini dulu yach. Kalau masih bingung kontak aja prothelord di [email protected]. Silahkan latihan dulu dan kembali lagi jika sudah lihai, OK?Dalam bagian 8 kita akan membahas masalah operator. Ini merupakan topik yang penting karena merupakan inti sebuah program di mana kita bisa membuat percabangan yang membuat program kita bisa “berpikir dan mengambil keputusan” berdasarkan suatu input.

ekedar mengingatkan, sampai saat ini anda sudah memiliki beberapa ketrampilan dasar dalam olah PHP yaitu cara membuat program PHP, Variabel dan Array. Dengan variabel anda sudah dapat menghubungkan antar halaman PHP, ditambah dengan array, maka nampaknya anda sudah memiliki semua pengetahuan tentang PHP, khan? Belum…. Masih banyak yang bisa kita pelajari. Salah satu bagian penting adalah mempelajari operator, yang dalam bagian ini operator yang akan dibahas adalah If dan else. Mengapa operator itu penting? Karena merekalah yang memungkinkan sebuah program dapat memutuskan dan “berpikir” (tentu saja sesuai yang telah kita tentukan).

Kemampuan sebuah program dalam mengambil keputusan inilah yang diperlukan dalam membuat sebuah web site yang dinamis dan pandai, yaitu membuat sebuah program yang dapat mengambil keputusan berdasarkan bermaca-macam input dari user, kondisi user (misalnya browser apa yang dipakai seorang pengunjung ?), maupun informasi yang anda tentukan sendiri. Contohnya bisa saja seperti ini: Setelah seorang pengunjung memasukkan sebuah alamat email, mengecek apakah formatnya benar (mis.: [email protected]) dan jika tidak segera menampilkan sebuah halaman yang mengatakan “Maaf, mbok kalo memasukkan alamat email itu yang betul to”

Page 29: Belajar HTML Gratis

Mengetahui apakah seorang pelanggan telah memasukkan login dan password yang tepat.

Dan masih banyak lagi, pokoknya kemungkinannya tidak terbatas lah. Siap? Ayo kita mulai dengan mencoba berkenalan sama "if".

If Cara untuk membuat halaman anda menjadi “pandai” adalah dengan menggunakan perintah If, Else dan Elseif yang disertai operator-operator logika dan perbandingan. Yang paling penting adalah perintah if, yang memungkinkan anda bisa membuat kode seperti ini:

Jika sebuah kondisi benar, maka kerjakan sesuatu; Jika kondisi tersebut salah, maka abaikan saja;

 

Sintaks untuk pernyataan di atas adalah sebagai berikut:

if (kondisi) {

// Tulis kode yang ingin anda eksekusi jika kondisi benar di sini} Berikut adalah contoh yang lebih riil. Pertama kita akan mengeset variabel $WarnaKesukaan dengan biru (baris 3). Kemudian kita akan mengatakan ”Jika WarnaKesukaan adalah biru, maka tampilkan ’Saya juga suka warna biru lho!’” <?php$WarnaKesukaan = "biru";

if ($WarnaKesukaan == "biru") {print ("Saya juga suka warna biru lho!");}?>

 

Else

Else merupakan bagian dari perintah if, untuk mengatakan hal sebagai berikut:

Jika sebuah kondisi benar, maka kerjakan sesuatu; atau, jika kondisi pertama tidak benar, maka kerjakan hal yang lain ini.

 Contoh: if (kondisi) {

// Tulis kode yang ingin anda eksekusi jika kondisi benar di sini} else {// Tulis kode yang ingin anda eksekusi jika kondisi salah di sini} Berikut contoh riil kelanjutan dari yang tadi: <?php$WarnaKesukaan = "kuning"; if ($WarnaKesukaan == "biru") { print ("Saya juga suka warna biru lho!");} else {print ("Anda tidak suka biru?! Dasar!");}?> Apa yang anda lihat di atas adalah format umum dalam menulis pernyataan tersebut. Kuncinya adalah untuk melihat di mana tuh letak kurung keriting eh kurawal sehingga anda tidak bingung misalnya perintah mana yang merupakan bagian kode tertentu. Dalam kode di atas, pasangan { dan } pertama adalah milik ”if”, sedangkan { dan } kedua milik ”else”.

Sekedar mengingatkan, sampai saat ini anda sudah memiliki beberapa ketrampilan dasar dalam olah PHP yaitu cara membuat program PHP, Variabel dan Array. Dengan variabel anda sudah dapat menghubungkan antar halaman PHP, ditambah dengan array, maka nampaknya anda sudah

Page 30: Belajar HTML Gratis

memiliki semua pengetahuan tentang PHP, khan? Belum…. Masih banyak yang bisa kita pelajari. Salah satu bagian penting adalah mempelajari operator, yang dalam bagian ini operator yang akan dibahas adalah If dan else. Mengapa operator itu penting? Karena merekalah yang memungkinkan sebuah program dapat memutuskan dan “berpikir” (tentu saja sesuai yang telah kita tentukan).

Kemampuan sebuah program dalam mengambil keputusan inilah yang diperlukan dalam membuat sebuah web site yang dinamis dan pandai, yaitu membuat sebuah program yang dapat mengambil keputusan berdasarkan bermaca-macam input dari user, kondisi user (misalnya browser apa yang dipakai seorang pengunjung ?), maupun informasi yang anda tentukan sendiri. Contohnya bisa saja seperti ini:

Setelah seorang pengunjung memasukkan sebuah alamat email, mengecek apakah formatnya benar (mis.: [email protected]) dan jika tidak segera menampilkan sebuah halaman yang mengatakan “Maaf, mbok kalo memasukkan alamat email itu yang betul to”

Mengetahui apakah seorang pelanggan telah memasukkan login dan password yang tepat.

Dan masih banyak lagi, pokoknya kemungkinannya tidak terbatas lah.

Siap? Ayo kita mulai dengan mencoba berkenalan sama "if".

If

Cara untuk membuat halaman anda menjadi “pandai” adalah dengan menggunakan perintah If, Else dan Elseif yang disertai operator-operator logika dan perbandingan. Yang paling penting adalah perintah if, yang memungkinkan anda bisa membuat kode seperti ini:

 

Jika sebuah kondisi benar, maka kerjakan sesuatu; Jika kondisi tersebut salah, maka abaikan saja;

 Sintaks untuk pernyataan di atas adalah sebagai berikut:

 

if (kondisi) {// Tulis kode yang ingin anda eksekusi jika kondisi benar di sini} Berikut adalah contoh yang lebih riil. Pertama kita akan mengeset variabel $WarnaKesukaan dengan biru (baris 3). Kemudian kita akan mengatakan ”Jika WarnaKesukaan adalah biru, maka tampilkan ’Saya juga suka warna biru lho!’”

 

<?php$WarnaKesukaan = "biru";

if ($WarnaKesukaan == "biru") {print ("Saya juga suka warna biru lho!");}?>

 

Else

 Else merupakan bagian dari perintah if, untuk mengatakan hal sebagai berikut:

Jika sebuah kondisi benar, maka kerjakan sesuatu; atau, jika kondisi pertama tidak benar, maka kerjakan hal yang lain ini.

Page 31: Belajar HTML Gratis

 Contoh:

 

if (kondisi) {// Tulis kode yang ingin anda eksekusi jika kondisi benar di sini} else {// Tulis kode yang ingin anda eksekusi jika kondisi salah di sini}

 

Berikut contoh riil kelanjutan dari yang tadi:

 <?php

$WarnaKesukaan = "kuning"; if ($WarnaKesukaan == "biru") { print ("Saya juga suka warna biru lho!");} else {print ("Anda tidak suka biru?! Dasar!");}?>

 

 

Apa yang anda lihat di atas adalah format umum dalam menulis pernyataan tersebut. Kuncinya adalah untuk melihat di mana tuh letak kurung keriting eh kurawal sehingga anda tidak bingung misalnya perintah mana yang merupakan bagian kode tertentu. Dalam kode di atas, pasangan { dan } pertama adalah milik ”if”, sedangkan { dan } kedua milik ”else”.

Jika punya masukan atau ingin berkontribusi tulisan silahkan kontak kami di prothelord [ath] yahoo [ndhot] co [doth] id

Untuk melengkapi ilmu kita tentang operator percabangan, kita perlu mengetahui di dalam if kita bisa memakai apa saja. Nah, untuk itu kita akan mempelajari tentang operator. Siap ?

Kita sudah melihat bagaimana penggunaan tanda “=” saat kita mengisi variabel dalam skrip yang sudah kita tulis (misalnya $WarnaFavorite=”biru”). Tanda sama dengan tersebut disebut dengan “assignment operator” dan merupakan operator paling sederhana yang sudah kita miliki: $a = b berarti “variabel a diisi dengan nilai b (untuk saat ini)”.

Tetapi anda dapat memperoleh lebih banyak dari PHP dengan apa yang disebut dengan “comparison operator” (operator perbandingan) , “logical operator” (operator logika) dan “arithmetic operator” (operator aritmatika). Berikut adalah operator-operator tersebut diambil dari PHP.net

Operator Perbandingan

Operator ini membuat anda bisa melakukan pembandingan apakah beberapa elemen sama, identik, kurang dari atau lebih besar dari yang lain.

Contoh Name Result

$a == $b Sama dengan BENAR jika $ a sama dengan $b.

$a === $b Identik BENAR jika $a sama dengan $b, dan keduanya memiliki tipe yang sama.

Page 32: Belajar HTML Gratis

$a != $b Tidak sama dengan BENAR jika $a tidak sama dengan $b.

$a <> $b Tidak sama dengan BENAR jika $a tidak sama dengan $b.

$a !== $b Tidak identikBENAR jika $a tidak sama dengan $b, atau tidak memiliki tipe yang sama.

$a < $b Kurang dari BENAR jika $a kurang dari $b.

$a > $b Lebih besar dari BENAR jika $a lebih besar dari $b.

$a <= $bKurang dari atau sama dengan

BENAR jika $a kurang dari atau sama dengan $b.

$a >= $bLebih besar dari atau sama dengan

BENAR jika $a lebih besar dari atau sama dengan $b.

Kesalahan yang cukup sering saya lakukan adalah menggunakan operator assignment (“=”) untuk membandingkan, sehingga untuk mambandingkan apakah 2 variabel sama atau tidak dalam sebuah percabangan saya tuliskan:

If ($a = $b)

Yang seharusnya

If ($a == $b)

Operator Logika

Di sini anda dapat membandingkan elemen-elemen menggunakan pembandingan logika and dan or.

Contoh Nama Hasil

$a and $b And BENAR jika baik $a dan $b keduanya BENAR.

$a or $b Or BENAR jika salah satu dari $a atau $b BENAR.

$a xor $b Xor BENAR jika salah satu dari $a atau $b BENAR, tetapi tidak keduanya.

! $a Not BENAR jika $a tidak BENAR.

$a && $b And BENAR jika baik $a dan $b keduanya BENAR.

$a || $b Or BENAR jika salah satu dari $a atau $b BENAR.

Operator Aritmatika

Persis seperti namanya, operator ini melakukan matematika dasar (artinya, kalau anda menginginkan operasi matematika lainnya misalnya integral atau differensial ya harus bikin sendiri, lagian siapa yang mau pake ya?)

Contoh Nama Hasil

Page 33: Belajar HTML Gratis

$a + $b Penjumlahan Jumlah $a dan $b.

$a - $b Pengurangan Selisih $a dan $b.

$a * $b Perkalian Perkalian $a dan $b.

$a / $b Pembagian Pembagian $a dan $b.

$a % $b Modulus Sisa $a dibagi $b.

Saat ini anda seharusnya sudah tahu mengenai operator apa saja yang bisa dimasukkan ke dalam tanda kurung pada if yaitu operator lohika dan operator perbandingan. Nah, sekarang kita akan mempelajari bagaimana operator-operator tersebut dapat digunakan pada hal-hal lain misalnya membuat looping. Dalam tutorial kali ini kita akan mempelajari penggunaan operator tersebut dalam while. Mari kita mulai….

Loop sangat bermanfaat dan praktis. Dengan loop, program anda dapat melakukan sebuah pekerjaan secara berulang secara otomatis (dan tentu saja menentukan berapa kali sebuah pekerjaan harus dilakukan sebelum berhenti). Loop memiliki instruksi untuk “tetap melakukan beberapa baris kode secara berulang sampai suatu kondisi tertentu terpenuhi”. Anda dapat menggunakan lebih dari satu jenis loop. Nah, dalam tutorial kali ini kita hanya akan membahas mengenai loop yang sangat dasar yaitu menggunakan “while”.

Loop while dapat digambarkan sebagai berikut:

while (sesuatu benar) (baca: saat suatu kondisi adalah benar…)

{

// lakukan sesuatu yang anda tentukan

}

Loop yang menggunakan While ini sering digunakan bersamaan dengan increment dan decrement sebuah variabel integer. Whalah, maksudnya apa tuh? Artinya…..bahwa anda dapat memiliki skrip penambahan (atau pengurangan) sebuah nomor (1,2,3, dst) dari dari bagian sebuah skrip yang dilewati, sampai angka-angka tersebut mencapai suatu nilai maksimum atau minimum yang anda tentukan.

Jadi, jika anda ingin sebuah skrip menampilkan angka 1 sampai dengan 10, anda dapat dapat mengatakan seperti ini:

a. Variabel $AngkaSaya = 1;

b. Tampilkan $AngkaSaya;

c. Tambahkan 1 ke $AngkaSaya;

d. Kembali ke langkah a. dan kerjakan skrip ini lagi dengan nilai $AngkaSaya yang baru;

d. Berhenti saat $AngkaSaya mencapai nilai 11;

Sintaks untuk melakukan increment dan decrement terhadap sebuah variabel adalah sebagai berikut::

Page 34: Belajar HTML Gratis

$a++; Tambahkan 1 kepada nilai variabel $a setiap kali lewat

$a--; Kurangi 1 kepada nilai variabel $a setiap kali lewat

Setelah mengetahui hal itu, mari kita coba membuat kode yang akan ssecara otomatis menampilkan angka 1 s.d 10:

1.2.3.4.5.6.7.8.9.10.11.12.13.14.15.

$AngkaSaya = 1;

while ($AngkaSaya <= 10)

{

print ("$AngkaSaya");

$AngkaSaya++;

}

?>

baris 1: mulai kode PHP;baris 3: Isi nilai variabel $AngkaSaya dengan 1;baris 5: Awali loop "while": Ketika variabel $AngkaSaya kurang dari atau sama dengan 10, kerjakan hal di bawah ini, atau jika tidak keluar dari loop;baris 9: tampilkan nilai $AngkaSaya saat ini;baris 11: tambahkan 1 kepada nilai $AngkaSaya;baris 15: Akhir kode PHP.

(Tentu saja anda dapat juga menampilkan angka 1 s.d 10 dengan melakukan print angka 1 hingga 10, tapi dengan loop ini jauh lebih praktis dan pendek. Coba aj banyangin kalo kita harus nulis program untuk menampilkan angka 1 s.d sejuta, bisa teler tuh)

Untuk membuat loop anda dapat menggunakan operator-operator yang pernah kita pelajari dalam bagian 9 terdahulu, sebagai batasan atau ketentuan kondisi yang harus dipenuhi untuk menghentikan sebuah loop. Gunakanlah secara kreatif untuk memperoleh hasil optimal.

Loop-loop Lain

PHP memiliki jenis-jenis loop yang lain, namun di luar cakupan tutorial ini. Jika anda ingin mempelajari mereka dan bagaimana cara menggunakannya, klik link di bawah ini dan pelajari di PHP.net (tentu saja dalam bahasa Inggris):

do..while loop

for loop

foreach loop

Gimana? Dah mulai BeTe ? Sebaiknya jangan karena sudah tiba saatnya kita mempelajari bagian akhir dari tutorial PHP ini. Dalam bagian akhir ini kita akan mempelajari mengenai fungsi. Fungsi kita perlukan untuk mempermudah kita dalam mengulangi pekerjaan yang sama tanpa harus menuliskan kode yang panjang. Lalu apa bedanya dengan loops yang sudah pernaha kita pelajari?

Page 35: Belajar HTML Gratis

Bukankah loop juga dapat melakukan pekerjaan yang sama? Tentu saja berbeda, dalam loop kita hanya dapat mengulangi perkerjaan yang sama pada bagian kode yang sama, sedangkan dengan fungsi, kita dapat mengulangi pekerjaan yang sama tersebut di bagian manapun dari kode kita. Tertarik? Silahkan baca lebih lanjut. Setelah ini kita akan sampai pada bagian penutup dari tutorial kita.

Jika anda sudah cukup sering menggunakan HTML, anda pasti tahu bahwa HTML merupakan bahasa yang memiliki banyak keterbatasan yang rasanya kok dibuat pada jaman batu, sebelum kita semua mengetahui kemampuan Internet yang sesungguhnya. PHP, di sisi lain sangat fleksibel. PHP tidak hanya memiliki banyak fungsi built ini yang membantu kita dalam mengerjakan banyak hal mulai dari mengurutkan secara alfabet sampai mengirimkan e-mail, menghubungkan database dan lain sebagainya. Di luar fungsi-fungsi built in tersebut, kita masih dapat membuat fungsi kita sendiri sesuai kebutuhan situs kita. Fungsi buatan kita akan dieksekusi oleh PHP sama seperti dia mengeksekusi fungsi built in PHP, hanya saja fungsi tersebut milik anda sendiri. Berikut ini kita akan melihat bersama bagaimana cara membuat fungsi kita sendiri dan merasakan kegunaannya.Fungsi yang anda buat dapat dibayangkan seperti mesin kecil yang melakukan sesuatu untuk anda. Setelah anda buat, anda dapat memanggil fungsi itu sesuai kebutuhan.Anda akan melihat kembali struktur kode pertama kita yang hanya berisi perintah “print” sebagai berikut:print ("apapun yang ingin anda tampilkan di layar");

?>

Fungsi yang anda buat dibangun berdasarkan bentuk yang yang sama, hanya dibuat lebih keren dengan struktur seperti ini:

function FungsiSaya ()

{      

       perintah-perintah yang membangun fungsi;

}

?>

Jadi, anda memulai sebuah fungsi dengan kata function NamaPilihanAnda (), dengan NamaPilihanAnda() dapat bernama apa saja (tanpa spasi).Kemudian anda definisikan aturan-aturan fungsi dalam kurung kurawal sesudahnya ({ dan } pada baris 5 dan 9 itu loh).Mari kita mencoba membuat beberapa fungsi. Fungsi dapat dibuat 2 macam, yang memerlukan argumen dan yang tidak. Sebuah argumen adalah variabel yang datang dari luar fungsi, tetapi diperlukan oleh fungsi untuk bekerja.

Mari kita lihat contoh fungsi yang tidak memerlukan argumen:

function FungsiPertamaku()

{

print "Ini Fungsi Pertamaku!";

}

FungsiPertamaku();

Page 36: Belajar HTML Gratis

?>

baris 1: mulai PHP;baris 3: membuat fungsi FungsiPertamaku;baris 5: mulai definisi fungsi FungsiPertamaku;baris 7: definisi FungsiPertamaku adalah menampilkan kalimat “Ini Fungsi Pertamaku!” di antara tag-tag dan ;baris 9: akhir definisi FungsiPertamaku;baris 11: memanggil fungsi FungsiPertamaku (artinya “lakukan hal-hal yang kita definisikan dalam fungsi”);baris 13: tutup PHP;

Di manapun dalam halaman web anda tersebut anda tuliskan “FungsiPertamaku();” di antara tag , dia akan menampilkan kalimat pendek yang sudah anda definisikan sebelumnya. Gimana, sudah keliatan kan kegunaannya untuk melakukan pekerjaan berulangkali dengan menghemat tenaga kita dalam menuliskan kode?

OK, sampai di sini dulu yach. Jika tidak keberatan mohon disempatkan kirim komentar atau isi pool di kanan atas. Dalam tutorial berikutnya kita akan mencoba membuat fungsi yang memerlukan argumen. Stay tuned....

Salam Hangat.

Pada tutorial yang lalu, kita sudah berkenalan dengan fungsi sederhana. Nah sekarang mari kita coba hal agak lebih rumit, dan membuat sebuah fungsi yang menggunakan argumen.

  Sebagai kasus, bayangkanlah saya menjadi seorang rentenir dan akan meminjamkan uang pada anda untuk membeli sebuah mobil mewah yang sangat anda inginkan. Nah, saya akan meminjamkan uang pada anda, tetapi anda harus membayar bunga sebesar 10% per bulan. Dan jangan lupa, kalau anda gak bayar, saya akan menyewa tukang pukul untuk menagih pada anda.

Saya akan membuat fungsi yang kita sebut dengan PembayaranBunga, yang menghitung kewajiban bulanan anda untuk membayar (samapai anda melunasi semua hutang anda).

Pertama, kita akan membuat sebuah halaman form tempat kita memasukkan jumlah pinjaman yang anda inginkan. Kita akan memasukkan harga mobil mewah anda tadi di form tersebut, dan angka tersebut akan dikirimkan ke form lain sebagai sebuah variabel yang kita beri nama $Pinjaman (masih ingatkan cara mengirimkan variabel antar file, kalau lupa silahkan lihat bagian-bagian awal tutorial dasar PHP ini.

Berikutnya, fungsi kita akan mengambil jumlah pinjaman dalam variabel $Pinjaman tersebut, dan menghitung 10% dari nilai di dalamnya yang harus dibayar peminjam tiap bulan. Hal ini akan kita kerjakan dalam file php yang kita beri nama “proses_pinjaman.php” yang diacu oleh halaman form tempat kita mengisi jumlah pinjaman (hal ini dilakukan dengan menambahkan baris berikut dalam file form html kita ). Berikut ini adalah skrip fungsinya:

1.2.3.4.5.6.7.8.9.10.11.

$suku_bunga = .10;

function HutangAnda($pinjaman, $suku_bunga) {

Page 37: Belajar HTML Gratis

12.13.14.15.16.17.18.19.20.21.22.23.24.25.26.

$pembayaran_bulanan = ($pinjaman*$suku_bunga);

print "Anda sebaiknya mencicil Rp. $pembayaran_bulanan tiap bulan!";

}

HutangAnda($pinjaman, $suku_bunga);

?>

Berikut penjelasan tiap baris.baris 8: mulai php;baris 10: mengeset variabel $suku_bunga menjadi 10%;baris 12: membuat fungsi HutangAnda yang memiliki argumen $pinjaman dan $suku_bunga;baris 14: membuat variabel $pembayaran_bulanan, yang nilainya adalah hasil perkalian antara jumlah pinjaman dan suku bunga;baris 16: menampilkan ke layar sebuah kalimat yang menggunakan nilai dari variabel $pembayaran bulanan;baris 20: kerjakan fungsi HutangAnda, yang (karena fungsi sudah didefinisikan sebelumnya) hanya menampilkan kalimat Anda lebih baik membayar [10% dari jumlah pinjaman yang dimasukkan pada halaman form] tiap bulan!OK, jadi sekarang anda sudah bisa membuat fungsi yang menggunakan argumen kan. Sip, dengan demikian secara kurikulum anda sudah cukup memiliki semua dasar yang diperlukan untuk membuat kode PHP sederhana anda dan untuk mempelajari PHP lebih lanjut. Semoga bermanfaat. Dalam tutorial bagian terakhir, kita akan melihat beberapa tips yang mungkin bermanfaat dalam penulisan kode PHP anda. Silahkan kirim komentar anda ataupun tutorial yang anda perlukan, siapa tahu kami bisa memenuhinya. Jangan lupa tolong isi pools di kiri atas yach. Makasih.Sampailah kita di bagian penutup dari tutorial singkat kita tentang PHP. Sebelum mengakhiri, berikut sedikit materi yang mungkin akan bermanfaat dalam kehidupan anda mengarungi dunia PHP selanjutnya.

Jika anda masih belum sepenuhnya memahami tentang fungsi, tidak perlu khawatir. Dengan dasar yang sudah kamu miliki sekarang, sudah cukup untuk mulai bisa memahami kode-kode PHP. Setelah kamu mulai membaca kode-kode yang dibuat oleh orang lain,  anda akan makin terbiasa dengan fungsi dan hal-hal lain tentang PHP.

Kamu juga bisa mencoba mengunjungi situs www.kursus-online.com untuk memperoleh tutorial yan lebih komprehensif dan enaknya lagi, di sana juga bisa langsung praktek, lihat teori, lihat kodenya, langsung lihat hasil eksekusi kode, dan latihan dalam satu layar yang terintegrasi. Try it, saya sangat merekomendasikan untuk belajar di sana. keren banget tuh situs. 

Sebuah tips, jika kamu sedang memikirkan sebuah fungsi yang anda ingin buat, cobalah untuk terlebih dahulu mencari di internet, biasanya sudah ada orang yang membuat fungsi itu dan bersedia dengan sukarela membaginya dengan anda. Karena PHP adalah bahasa open-source (artinya bahwa source code-nya dibagi secara terbuka dan bukannya dikangkangi oleh sebuah perusahaan saja), maka bahasa ini didukung oleh semangat kerjasama, dan banyak yang akan dengan senang hati membantu kamu. (contohnya tutorial ini, 100% ndak bayar kan?). Kamu bisa baca tips lain yang saya tulis tentang penggunaan PHP script untuk mempercepat programming PHP dan meningkatkan pemahaman kamu tentang PHP. Dengan pengetahuan kamu tentang PHP saat ini, kamu sudah bisa pergi kemanapun untuk mendalami urusan PHP ini. Untuk lebih memudahkan kamu, berikut adalah tempat-tempat yang mungkin bermanfaat (tentu saja masih banyak situs-situs lain yang bertebaran di Internet):

Page 38: Belajar HTML Gratis

PHP.netSumber dari segala sumber hukum PHP.

Manual: Berisi dokumen manual umum tentang PHP.

FAQ: Berisi informasi tetnang FAQ PHP.

Webmonkey's PHP collection tempat yang jadi referensi saya belajar PHP. Masih banyak tutorial lain yang dapat anda manfaatkan di sana.

Kayaknya sudah cukup apa yang dapat saya sampaikan, semoga tutorial ini dapat membawa manfaat bagi kamu semua. Silahkan kirim e-mail jika ada yang perlu anda diskusikan, saya akan dengan senang hati berusaha membantu sebisanya. Jika tidak merepotkan, mohon bantuannya untuk mengisi polling di kiri atas.Tk’s.

MY SQLTutorial MySQL di situs ini memang buat kamu-kamu yg pengen belajar MySQL? Jangan kuatir, gampang, gratis dan ditulis dengan gaya khas prothelon.com. Nah, buwat previewnya, kamu harus tahu dulu, kalo MySQL tuh adalah sebuah server database open source yang kayaknya paling populer keberadaannya. MySQL umumnya digunakan bersamaan dengan skrip PHP untuk membuat aplikasi server yang dinamis dan powerful.

Tertarik? Baca aja dan kita mulai tutorial MySQL pertama. Selamat belajar. Yuk yak, yuukkkkkkk.

Database, apaan tuh?Sebuah database adalah sebuah struktur yang umumnya dikategorikan dalam 2 hal: Sebuah database flat dan sebuah database relasional. Database relasional lebih disukai karena lebih masuk akal dibandingkan database flat. Nah, MySQL adalah sebuah database relasional. Pada database yang memiliki struktur relasional. Ada tabel-tabel yang menyimpan data. Setiap tabel terdiri dari kolom dan baris. Sebuah kolom mendefinisikan jenis informasi apa yang akan disimpan. Kamu memerlukan kolom khusus untuk setiap jenis informasi yang ingin kamu simpan (misalnya umur, tinggi, berat, alamat) Kalau kolom mendefinisikan jenis informasi apa yang akan disimpan, maka sebuah baris adalah data aktual yang disimpan. Setiap baris dari tabel adalah masukan dari tabel tersebut dan berisi nilai-nilai untuk setiap kolom tabel tersebut. (contoh masukannya adalah Bambang: umur 40 tahun, 65 kg dan 160cm). Jika pembahasan database ini membingungkan buat kamu, jangan putus asa, kita akan membahas dan menunjukkan beberapa contoh tabel dalam tutorial selanjutnya.Mengapa menggunakan Database?Database akan menjadi sangat berguna saat kamu perlu menyimpan informasi yang dikategorikan secara logis. Contoh, katakanlah kamu ingin menyimpan informasi tentang semua karyawan pada sebuah perusahaan. Dengan database, kamu bisa mengelompokkan berbagai hal dalam bisnis menjadi beberapa tabel. Contoh tabelnya bisa saja tabel penjualan, karyawan, piutang, kinerja, dll.

SQL?

SQL (dibaca "ess-que-el") merupakan kependekan dari Structured Query Language. SQL digunakan untuk berkomunikasi dengan sebuah Database. Sesuai dengan ANSI,SQL merupakan bahasa standar

Page 39: Belajar HTML Gratis

untuk sistem menajemen database relasional. Statemen SQL digunakan untuk melakukan tugas-tugas seperti melakukan update terhadap database, atau mengambil data dari sebuah database. Beberapa database relasional yang menggunakan SQL dan cukup ngetop adalah: MySQL, Oracle, Sybase, Microsoft SQL Server, Access, Ingres, etc. Meskipun sebagian besar sistem database menggunakan SQL, namun sebagian besar dari mereka juga memiliki ekstensi khusus yang hanya bisa digunakan di sistem masing-masing. Namun demikian, perintah standar SQL seperti "Select", "Insert", "Update", "Delete", "Create", dan "Drop" dapat digunakan untuk melakukan hampir semua hal yang perlu dilakukan terhadap sebuah database. Tutorial ini akan mengenalkan kamu pada penggunaan dasar dari perintah tersebut. Kamu bisa praktek dengan menginstal MySQL atau database lain di komputer kamu.

Ok, berikutnya kita akan mencoba mengenal istilah yang sangat penting dalam SQL yaitu

Pengenalan Query. Dalam tutorial MySQL sebelumnya, kamu dah belajar tentang database kan?

Nah dalam dunia praktek sehari-hari kamu bakalan jarang tuh make teori database. Kamu akan

banyak berhubungan dengan yang namanya Query. Ingat, Query merupakan senjata utama kamu

dalam bekerja sehari-hari dengan database. Kalau mau belajar MySQL, pelajari dulu tuh Query.

Siap untuk mempelajari Query? Keep reading guys... 

Query merupakan istilah yang digunakan untuk menyatakan berbagai perintah SQL. Setiap perintah melakukan beberapa hal terhadap database. Sebagai contoh, perintah CREATE akan membuat tabel dan database, sedangkan SELECT akan memilih baris-baris yang sudah pernah kamu sisipkan dalam database. Kita akan mendalami secara detil nantinya, namun untuk tahap awal, kita akan coba review beberapa struktur Query.

Konstruksi Query dimulai dengan salah satu perintah berikut: ADD DROP CREATE INSERT SELECT UPDATE REPLACE DELETE

Query memiliki banyak kelonggaran dalam penulisannya. Spasi dan Enter gak begitu diperhatiken dalam penulisannya. Artinya kalau kebetulan salah tulis spasinya kebanyakan, ndak masalah. Gitu.Naj, Sekarang kita sudah ngerti kalau Query itu diawali dengan perintah. Apa yang harus kamu tulis sesudahnya tergantung perintah apa yang kamu gunakan. Hal itu akan kita bahas pada bagian selanjutnya dari tutorial ini.Dalam tutorial sebelumnya, kamu sudah belajar tentang query, nah dalam tutorial ini kamu akan mempelajari bagaimana cara menuliskan sintaks Query dengan baik dan benar.Sintaks atau cara penulisan query bersifat longgar, artinya kamu bebas mengetikkan enter di manapun tanpa mengganggu kode yang ditulis. Beberapa perintah memerlukan tanda kurung kurawal ({}), seperti perintah insert di bawah ini. Penulisan tanda kurung ini akan kita bahas juga dalam pembahasan fungsi. Pastikan saja untuk mengakhiri setiap perintah yang kamu buat dengan tanda titik koma (;).

Untuk memberikan gambaran buat kamu saya akan tuliskan beberapa contoh query dan perhatikan kesederhanaannya ya, biar semangat !! 

Kode SQL:

SELECT * FROM nama_tabel;

Kode di atas memilih semua baris dan kolom dari tabel nama_tabel dan menampilkannya pada kita.

Page 40: Belajar HTML Gratis

Berikut ini beberapa query lagi yang akan sangat sering kamu pakai seiring dengan berjalannya tutorial kita. Kode SQL:INSERT INTO nama_tabel (kolom_satu, kolom_dua)

 VALUES(nilai_satu, nilai_dua);UPDATE nama_tabel SET kolom_satu = nilai_satu, kolom_dua = nilai_dua;

Kurang ajar nih Prothelord, ngapain ngasih tahu kode-kode ndak genah seperti itu. jangan khawatir, nanti akan kita bahas bersama di tutorial-tutorial berikutnya. Untuk saat ini kamu hanya perlu tahu bahwa perintah insert digunakan untuk menyisipkan sebuah baris baru, sedangkan update untuk mengedit sebuah baris dalam tabel SQL. Ingat kembali bahwa Query adalah bagaimana kamu berkomunikasi dengan program database kamu. Hampir semua yang akan kamu tulis diprompt perintah SQL adalah query, jadi biasakanlah diri anda dengan query.Setelah memahami cara menulis sintaks query sql dengan benar, maka langkah pertama yang harus

dilakukan adalah menyiapkan database dan tabelnya. Kita akan mulai dengan melihat query

membuat database MySQL dulu.

Database MySQL adalah hal pertama yang harus kamu buat untuk bisa praktek MySQL. Setelah kamu belajar tentang cara penulisan query dalam tutorial sebelumnya, kita akan coba saja langsung masuk ke prakteknya langsung. Melihat beberapa komentar yang ada, nampaknya prothelonians pengennya langsung bisa praktek. Konsukuensinya, teori dasarnya seperti operator, jenis data dll, kita skip ajah, dan nanti akan kita singgung sebagian di tengah-tengah tutorial. Ok, siap, kita langsung membuat database MySQL.Sebuah database sebenarnya tidak lebih dari sebuah wadah yang kosong. Kamu bisa bayangin database MySQL tuh kayak gudang kosong gitulah. Database MySQL tidak memiliki fungsi apapun, selain mamiliki nama. Tabel adalah tahap berikutnya dalam struktur database MySQL yang memiliki berbagai kagunaan dan fungsi. Kalau kita kembali ke contoh gudang kita tadi, sebuah tabel MySQL bisa kamu analogikan dengan lemari penyimpan dalam gudang tadi. Barang-barang yang kamu simpan di gudang tadi dapat dipindah ke lemari lain, dikeluarkan, pengaturan ulang atau manipulasi lainnya tergantung situasi. Tabel MySQL juga dapat dimanipulasi sesuai kebutuhan kita. Kita bisa pidahkan data dari tabel, menghapus data, menampilkannya sesuai urutan yang kita inginkan, dan masih banyak fungsi lainnya. Nah setelah memahami penjelasan ini, kamu seharusnya sudah siap untuk memulai langkah kamu dalam praktek MySQL, yaitu membuat database MySQL.By the way, sebelum mulai praktek, pasti kamu bertanya-tanya kan. Lha prakteknya pakai apa? Nah, untuk prakteknya, kamu harus install dulu MySQL server di PC kamu. Dalam tutorial di sini, saya asumsikan kamu make WINDOWS XP dan XAMPP sebagai MySQL servernya. Kamu bias donlot XAMPP di web sitenya secara gratis.

Pengen belajar sambil praktek? klik di sini.

Alternatif lainnya, kamu juga bisa coba situs kursus online ini sehingga ndak usah repot install MySQL server sendiri dan bisa langsung praktek di browser kamu.

Membuat Database MySQL

Sebelum melakukan perintah apapun, kamu harus login dulu ke MySQL command prompt kamu. (Ingat, saya sumsikan kamu menggunakan XAMPP yah. Kamu harus melakukan langkah-langkah berikut untuk bisa masuk ke MySQL prompt:1.        Buka command prompt (klik Start, Accessories, DOS Prompt).2.        Ketikkan CD Program*3.        Ketikkan CD XAMPP/MySQL/bin4.        Ketikkan mysql –u rootKamu akan menghadapi sebuah layer dengan prompt mysql>. Prompt inilah yang akan menjadi tempat kamu melakukan praktek. Ready? It set, go…..Hampir lupa, untuk keluar dari prompt, kamu bisa ketikkan exit diikuti Enter. Nah sekarang kita bisa mulai.Tolong diingat bahwa sebelum dapat melakukan apapun di MySQL, kita harus membangun gudang kita atau dalam kasus MySQL membuat database MySQL yang bernama bisnis. Perintah CREATE

Page 41: Belajar HTML Gratis

akan kita gunakan untuk melakukan hal tersebut. Perintah ini sangat pendek dan kamu pasti akan langsung mengingatnya.

Kode MySQL:CREATE DATABASE bisnis;

 Tekan Enter, dandatabase MySQL pertama kamu sudah jadi.Cuman gitu aja? Iya, emang gitu aja. Gampang kan? Pastilah, mana ada yang susah di Prothelon.com :).Ok, next kita akan pelajari cara membuat table MySQL. C U.Tabel database adalah langkah selanjutnya dalam praktek MySQL kita setelah membuat gudang kita yaitu database.Gudang database kita yang masih kosong tadi tidak akan ada gunanya kalau kosong kan? Nah kita akan membuat tabel sebagai lemari-lemari penyimpanan untuk menyimpan dan mengelola data kita. Kita akan menggunakan perintah CREATE yang sama dengan pembuatan database MySQL. Meskipun menggunakan perintah CREATE yang sama, tetapi perintah pembuatan tabel MySQL agak lebih kompleks dibandingkan perintah CREATE database kita sebelumnya. Dalam perintah kita nanti, kita juga harus menyertakan parameter untuk setiap kolom tabel database dan menamainya dengan baik. Memberi nama pada tabel kamu bisa dilakukan secara sederhana maupun rumit.Tipe kolom akan menentukan jenis data yang dapat disimpan dalam kolom tabel mulai dari angka, paragraph, atau string singkat. Sebagai contoh, dengan mendefinisikan sebuah kolom sebagai int, artinya bahwa database kamu cuman akan menerima nilai integer untuk jenis kolom ini.Beberapa tipe kolom yang akan cukup sering kamu gunakan adalah : int, char, varchar, text dan datetime. Dan saya rasa, dari namanya kamu pasti udah bisa menebak jenis data apa yang bisa disimpan oleh masing-masing tipe kolom tersebut kan :).Ok, kita langsung aja membuat tabel database MySQL kita, ingat bahwa kita tadi mendefinisikan gudang kita dengan nama bisnis. Nah untuk memastikan bahwa kita berada di gudang bisnis, gunakan perintah ini:

USE bisnis;

Sekarang buat tabel database pertama kamu:CREATE TABLE karyawan (id INT(3) NOT NULL AUTO_INCREMENT, nama_belakang VARCHAR (50), nama_depan VARCHAR (25), jabatan VARCHAR (10) DEFAULT ‘staf’ NULL);

Bingung? Tenang aja, nih penjelasannya.Kamu baru saja membuat sebuah tabel database bernama ‘karyawan’. Kolom pertama adalah sekedar angka penanda unik yang akan ditambahkan ke tabel hingga maksimum sebanyak 3 digit (999) secara otomatis (AUTO_INCREMENT). VARCHAR berarti bahwa dia akan menyimpan angka, digit atau symbol, yang sangat cocok untuk nama orang. Kolom terakhir memiliki nilai default ‘staf’, sehingga jika kita menambahkan sebuah record, nilai default tersebut akan langsung ditambahkan.  Ok, mudah-mudahan penjelasan singkat tentang cara membuat tabel database tadi bisa berguna buat kamu semua.Download MySQL bisa dilakukan melalui 2 cara, apa dan di mana? Kalau kamu pengen belajar MySQL tentu saja kamu akan sangat memerlukan server database MySQL terinstal di komputer kamu. Nah, ada 2 cara untuk memiliki server MySQL di komputer kamu, cara pertama adalah melakukan download MySQL dari web site resmi MySQL atau melakukan download MySQL yang terintegrasi dalam paket.

Pengen belajar sambil praktek? klik di sini.

Apa bedanya? Kalau kamu melakukan download MySQL langsung dari web site resminya, maka kamu akan mendapat paket MySQL yang lengkap dan terbaru.Namun demikian, dengan melakukan download MySQL dari situs resminya tersebut, kamu harus melakukan instalasi yang sedikit rumit terutama saat melakukan koneksi antara MySQL dengan server web kamu. Cara download MySQL ini tidak saya sarankan untuk dilakukan bagi para pemula. Kenapa, karena bisa bikin frustasi kalau ndak berhasil. Bukannya belajar MySQL malahan sibuk instalasi MySQL :).Untuk pemula saya sarankan untuk melakukan download MySQL dalam bentuk paket. Saya sendiri seperti dalam tulisan sebelumnya tentang database MySQL menyarankan XAMPP sebagai paket perkenalan kamu. It's free kok. Cuman downloadnya memang harus sabar, karena ukuran filenya

Page 42: Belajar HTML Gratis

cukup besar. Ok. Kita sudah membuat tabelnya... so what? Untuk bisa mendayagunakan database MySQL, kamu kudu belajar cara mengambi dan menyimpan data ke MySQL. Kita akan belajar cara mengambil data dari MySQL dulu ya. Nah, Untuk mengambil data dari server database MySQL, kamu harus menggunakan perintah SELECT dari SQL.

Bentuk umum dari perintah SELECT ini adalah seperti di bawah ini:

 SELECT column_name1,column_name2...

FROM tables[WHERE conditions][GROUP BY group[HAVING group_conditions][ORDER BY sort_columns][LIMIT limits];Perintah SELECT SQL tersebut memiliki banyak pilihan yang bisa kamu gunakan untuk mengatur pemilihan data agar sesuai dengan kebutuhan kamu. Urutan pilihan-pilihan tersebut (FROM, WHERE, GROUP BY, HAVING, ORDER BY dan LIMIT) harus sesuai dengan bentuk umum di atas. Untuk memilih semua kolom dalam tabel, kamu bisa menggunakan notasi (*) yang jauh lebih singkat dibandingkan kami harus menuliskan semua nama field yang ingin kamu tampilkan. Sebagai contoh, saat kamu inginmelihat semua data pada semua kolom dalam tabel karyawan, kamu tinggal menggunakan query di bahwah ini.

 

SELECT * FROM karyawan; Simpel kan? Kita lanjutin nanti ya. Oh ya...kalau pengen belajar perintah MySQL, bagusnya langsung praktek. Kamu bisa coba tempat belajar MySQL dan web site ini biar bisa belajar langsung praktek.

 Seperti yang sudah kita pelajari sebelumnya, select MySQL memiliki beberapa pilihan, yang selanjutnya akan kita sebut parameter. Kita juga sudah melihat cara memilih semua kolom atau hanya beberapa kolom tertentu untuk ditampilkan. Namun demikian, sampai tutorial select MySQL sebelumnya, kita baru bisa menampilkan seluruh data. Nah, pertanyaannya, bagaimana cara kita memfilter atau memilih data tertentu saja yang ingin kita tampilkan. Misalnya kita memiliki tabel data_temanku seperti ini:

Nama AlamatProthelord Jl. Bunga no 12Bambang Sumringah Jl. Candi I no 13Bambang Sumantri Jl. Bunga I no 14

 Jika kita hanya menggunakan select saja, maka memang kita bisa menampilkan semua kolom atau kolom nama saja, namun kita hanya bisa menampilkan semua record.

Misalnya untuk menampilkan semua record untuk semua kolom, kita menggunakan perintah berikut ini:

SELECT * FROM data_temanku;

Pertanyaannya adalah, bagaimana kita bisa memilih untuk menampilkan record yang bernama Prothelord saja, misalnya. Hmmm.... di sinilah kita akan menggunakan bantuan parameter WHERE dari MySQL. Bagaimana caranya?

Page 43: Belajar HTML Gratis

Buat WEBAnda sudah bisa membuat situs web sendiri? Waktunya untuk mempublikasikan karya anda. Salah satu cara untuk mempublikasikan web buatan anda sendiri adalah dengan menyewa web hosting. Pada bagian pertama tulisan ini, saya akan memberikan penjelasan tentang web hosting. Pada bagian kedua, akan saya sampaikan beberapa tips yang menarik tentang cara memilih web hosting.Tertarik? Silahkan lanjutkan :)Setelah karya anda jadi, maka anda memerlukan tempat untuk mempublikasikan situs web buatan anda. Akan tidak lucu jadinya kalau situs yang sudah anda buat dengan susah payah hanya bisa dilihat oleh anda sendiri kan?Untuk mempublikasikan sebuah situs web buatan anda sendiri anda harus meletakkan situs web tersebut di sebuah server yang selalu terhubung ke Internet kan? Memang sih anda bisa saja menggunakan PC anda sendiri dan langsung dihubungkan ke Internet, tapi umumnya cara itu lebih mahal dan memiliki bandwidth terbatas.Cara yang umum dilakukan adalah dengan menyewa web hosting. Web hosting artinya anda menyewa space (tempat di hard disk untuk meletakkan file-file anda yang indah) dan bandwidth (batasan seberapa banyak data boleh ditransfer oleh pengunjung situs anda). Paket web hosting umumnya memiliki kriteria utama batasan space dan bandwidth. Masih ada kriteria tambahan lain seperti batasan jumlah account FTP, Email dsb. Nah, setelah anda menyewa space dan bandwidth apakah web site anda sudah bisa diakses oleh penggemar anda?Sabar dulu. Anda masih memerlukan sebuah domain name. Domain name adalah alamat web yang dituliskan oleh pengunjung anda di browser mereka untuk mengakses situs web anda. Tanpa domain name, situs anda akan menjadi sebuah pulau dewata di tengan samudra Internet yang tidak seorangpun menyadari keberadaanya.Domain name inilah yang akan mengarahkan pengunjung situs anda menuju file yang sudah anda letakkan di server yang anda sewa.SO, Anda akan memerlukan space, bandwidth dan domain name untuk membuat situs buatan anda dapat diakses oleh penggemar anda.Saat ini, hampir semua penyedia hosting sudah menyediakan layanan tambahan secara default seperti email, ftp dan statistic. jadi anda memiliki banyak pilihan untuk menentukan provide web yang akan anda jadikan partner.Anda dapat menggunakan google untuk mencari calon provider web hosting yang anda inginkan dengan mengetikkan kata kunci "web hosting Indonesia".Selamat berburu. Jika sudah menemukan beberapa calon, kita akan bahas bagaimana cara memilih hosting Indonesia yang paling cocok dengan kebutuhan anda. Tahukah kamu bahwa kamu bisa

Page 44: Belajar HTML Gratis

menyewa hosting hanya dengan Rp. 10.000/6bulan? Kalau ndak percaya, cek aja di situs ini. Mereka bahkan memperbolehkan kita mencoba dulu secara Gratis (yang sebenarnya tidak perlu karena layanannya sudah cukup Tips penting dalam memilih web hosting Indonesia, seperti biasa ditulis dengan gaya khas Prothelord yang mudah dimengerti. Semoga bermanfaat.

TIPS MEMILIH WEB HOSTING INDONESIA Artikel ini merupakan kelanjutan dari artikel sebelumnya tentang pemilihan web hosting di indonesia yang menjelaskan mengapa kita perlu menyewa hosting sendiri.Memilih penyedia hosting di Indonesia memang merupakan hal yang perlu dilakukan dengan hati-hati karena menyengkut kelangsungan hidup situs kita. Apalagi dengan banyaknya penyedia web hosting Indonesia saat ini, maka akan makin membuat daftar pilihan kita semakin panjang dan mempersulit pemilihan. Namun di lain pihak, kita juga jadi memiliki keleluasaan untuk menetukan pilihan atas penyedia layanan hosting yang kita inginkan. Nah khusus untuk layanan hosting di Indonesia, berikut beberapa tips dari prothelord, semoga bermanfaat.

1. Support Penyedia Layanan Hosting

Support merupakan hal yang terpenting dari sebuah layanan hosting terutama hosting di Indonesia. Sebab apabila support susah dihubungi, respon lambat, dll akan menyulitkan klien bila sedang menghadapi masalah. Bayangkan saja jika web site anda sudah anda bangun susah-susah dan sudah memiliki pengunjung yang sangat banyak, ternyata malah supportnya ndak bener. Kadang malah kemungkinan domain kita juga amblas tuh. Hindari hosting dgn support melalui Handphone saja, sebab bisa jadi yang mengelola hosting hanya satu orang saja, kecuali hosting bersangkutan mencantumkan juga no telepon kantor. Cari penyedia hosting Indonesia yang memiliki akses support sebanyak mungkin antara lain: Telepon Kantor (nomor telepon kabel), Messenger (Yaho Messenger, Google Talk, dll dan jangan lupa perhatikan availabilitasnya dalam arti sering online atau tidak), E-mail, Web based dan Telepon Seluler/CDMA. Dan yang lebih penting lagi cobalah terlebih dahulu melakukan kontak dengan penyedia hosting indonesia tersebut dan cek respon timenya. Prothelord pernah terjebak dengan penyedia hosting yang tidak keren di Yogyakarta dan sekarang sudah gulung tikar. Percayalah, saat kena hosting yang payah, akan sangat tidak menyenangkan. 

2. Perhatikan jenis layanan yang diberikan. Hal ini sangat penting karena umumnya service yang diberikan akan sangat bervariasi. Jangan sampai terjadi hal yang konyol, dimana kita butuh PHP tetapi malah hosting yang hanya provide ASP. Kan ndak lucu. Nah, beberapa parameter penting dalam service yang diberikan antara lain :

Support Bahasa pemrograman (PHP, ASP, dll) Database yang disediakan (MySQL, PostGRESQL, dll) E-mail Ukuran space hardisk bandwidth Fantastico (untuk memudahkan instalasi aplikasi)

Jangan lupa perhatikan juga batasan/limit service yang diberikan misalnya limit user database, limit bandwidth, user email, dll. Sebisa mungkin hindari penyedia hosting indonesia yang memberikan layanan unlimited, layanan ini secara umum akan menghabiskan bandwidth dan resource server.

3. Pilihlah  web hosting Indonesia yang mempunyai lokasi kantor tetap dan berbadan hukum. Kalau perlu datang langsung ke lokasi untuk mengetahui keberadaannya atau minimal lakukan kontak dengan supportnya dan tanyakan lokasi kantornya. 4. Lihat dan cek pengalaman perusahaan tersebut dalam mengelola hosting. Semakin berpengalaman sebuah perusahaan penyedia jasa hosting, maka umumnya supportnya semakin baik. Namun hal ini ada juga sisi negatifnya yaitu semakin laku sebuah penyedia jasa hosting Indonesia, maka semakin banyak pengguna dalam sebuah servernya. Hal ini tentu saja akan berakibat pada makin tingginya trafik yang masuk dan berdampak pada lambatnya respon server. Mintalah pada penyedia jasa kita untuk meletakkan hosting di server yang masih rendah trafiknya.

5. Cek spesifikasi server, stabilitas server dan koneksi server yang digunakan. Apakah di

Page 45: Belajar HTML Gratis

USA, IIX, dll. Pilihlan penyedia hosting indonesia yang menyediakan lokasi server yang bervariasi. Pemilihan lokasi server harus memperhatikan target pengunjung yang akan kamu tuju. Kalau kamu menargetkan pengunjung dari Indonesia, sebaiknya pilih lokasi server di Indonesia. hal ini akan mempengaruhi kecepatan akses ke web site kamu.  6. Cek kepemilikan domain klien, apakah atas nama klien atau atas nama webhosting bersangkutan. Hal ini perlu untuk memberikan keleluasaan klien dalam memanage domainnya sendiri. Atau jika menggunakan nama web hosting Indonesia yang bersangkutan, maka pastikan mereka bersedia mengubah menjadi nama anda. Dan lakukan penggantian nama dan password segera setelah hosting anda siap. 7. Backup, back up dan back up.Back up merupakan hal yang penting untuk memastikan bahwa data-data anda aman, sebab seringkali data-data klien hilang karena salah delete, dll. Cek jadwal back up hosting anda, dan jangan lupa lakukan back up anda sendiri.8. Program PromoNah ini juga hal yang penting. Dengan adanya program promo, maka kita akan bisa menghemat biaya. Namun perhatikan, sebaiknya jangan mengambil penyedia hosting Indonesia yang terlalu sering memberikan promo. Jangan-jangan harga aslinya memang kemahalan :).

9. Pastikan bebas masalahlakukan Googling untuk mencari problem yang pernah dialami oleh penyedia hosting yang kamu pilih. Gunakan kata kunci "nama_penyedia_hosting masalah". Cara lain adalah dengan melakukan pengecekan ke forum yang disediakan penyedia hosting di Indonesia tersebut. Jika banyak komplain maka perlu kamu cek ulang tuh pilihan kamu. Perhatikan juga cara mereka dalam menyelesaikan masalah.

10. Bandingkan paket-paket yang disediakan.Yah, memang proses membandingkan ini cukup menyebalkan, tetapi perlu dilakukan. Pertama bandingkan dulu space dan bandwidthnya dan kalau perlu di konversi ke satuan yang sama, karena masing-masing penyedia layanan hosting Indoenesia tesebut pasti memiliki paket yang berlainan. Setelah iti bandingkan servicenya. Pertanyaan terakhir, manakah yang paling kompetitif ? Dari sana kita bisa memiliki beberapa alternatif untuk kita follow up dengan membandingkan faktor-faktor dari tips lainnya di artikel ini.11. Sesuaikan harga dengan kocekPastilah, pilih paket yang sesuai dengan kantong kamu. Pilihlan web hosting yang menyediakan paket bervariasi dan kalau kamu perlu paket yang murah sebagai awal karir kamu di dunia web, cari yang menyediakan paket murah.12. PembayaranPilih yang menyediakan pembayaran melalui berbagai bank terutama bank-bank besar seperti BCA dan Mandiri serta kalau ada palayan online seperti Paypal. Jangan lupa bahwa akan lebih baik jika support juga bank yang kamu miliki atau kalau tidak pastikan mereka memiliki prosedur untuk menerima pembayaran dari bank lain.13. Lihat TestimonialWalaupun berat sebelah dan cenderung hanya menampilkan testi yang positif, paling tidak dari testimonial kamu bisa melihat seberapa puas pelanggan hosting tersebut.Membuat website itu gampang kok. Hanya saja kadang kita belum tahu apa yang harus dilakukan untuk membuat web kita bisa nongol di Internet. Tulisan kali ini saya tujukan bagi teman-teman yang pengen belajar cara membuat website tapi masih blank dan belum tahu pertama-tama harus ngapain untuk menampilkan website yang dibuat ke hosting di internet. Buat teman-teman yang ingin mengetahui langkah-langkah/cara membuat website secara global, saran saya terlebih dahulu lihat tulisan tentang panduan cara membuat website ini. Silahkan lanjutkan.

Apa yang kamu perlukan untuk memulai membuat sebuah website?Pada dasarnya kamu hanya memerlukan 2 hal untuk membuat website:

1)      Sebuah nama domain (prothelon.com, situskamu.com, dll)2)      Web hosting

Page 46: Belajar HTML Gratis

Secara umum, buat kita-kita ini ada 2 pilihan untuk membuat website kita bisa tampil di internet. Yang pertama adalah menggunakan hosting gratisan dan berbayar. Kalau kamu pernah bikin blog pake blogspot atau wordpress, maka kamu sudah menggunakan hosting gratisan. Tentu saja ada hosting gratisan lain yang menyediakan fleksibilitas lebih tinggi dalam mengatur website yang ingin kita tampilkan.

Namun demikian, tulisan saya kali ini saya fokuskan pada cara menggunakan hosting berbayar untuk membuat web kita tampil di internet sesuai saran untuk memilih web hosting berbayar.Ok, ini langkah-langkah praktisnya:3)      Pertama-tama kamu harus memilih web hosting yang baik.4)      Tentukan nama domain yang kamu inginkan,  paling baik jika menggunakan ekstension com. Umumnya pada web hosting provider sudah menyediakan layanan untuk registrasi nama domain juga. Proses pemilihan nama domain ini bisa sangat menyulitkan, karena biasanya nama domain yang bagus sudah disewa oleh orang lain. Berikut beberapa tips dalam memilih nama domain kalau terlanjur sudah diambil orang:a)      Coba cari alternatif nama domain dengan 2-3 kata. b)      Gunakan variasi kata-kata disambung langsung atau dipisahkan dengan tanda -. Misalnya situssaya.com atau situs-saya.com.5)      Berikutnya memilih paket hosting yang pas untuk website kita. Untuk tahap awal pilih paket yang paling kecil saja. Jangan khawatir, kita bisa upgrade ke paket yang lebih besar seiring dengan perkembangan trafik di website kita.6)      Langkah berikutnya memilih lokasi server. Umumnya kita diberi pilihan untuk memilih lokasi server di USA, Singapore atau Indonesia. Tentukan pilihan berdasarkan target visitor yang kamu tuju.7)      Setelah beres, kita harus melakukan pembayaran. Pembayaran biasanya dilakukan via transfer bank.8)      Setelah bayar, maka kita tinggal menunggu 2-3 hari agar nama domain kita menyebar di Internet.Sampai di sini, proses sewa nama domain dan web hosting sudah selesai. Kita akan melanjutkan tulisan mengenai membuat website ini dengan mempelajari cpanel dan proses upload web site kita di tulisan berikutnya. Membuat web site sendiri memang memiliki kelebihan sendiri. Setelah mempelajari cara membuat web site, dan membuat file proyek kamu sendiri, tiba saatnya untuk mengupload file tersebut ke web site kamu.

Nah, setelah kita mengetahu fungsi dan cara mengakses Cpanel, kini saatnya tiba buat kamu untuk mempelajari cara mengupload file PHP hasil karya anda ke website yang sesungguhnya. Pada dasarnya kita bisa melakukan upload ke web site dengan menggunakan 2 cara:

Menggunakan FTP Client Menggunakan File Manager

Yang akan kita bahas di sini adalah menggunakan File Manager Cpanel. Penggunaan file manager ini merupakan cara yang praktis untuk mengupload file dalam jumlah yang tidak terlalu banyak. Jika kamu perlu mengupload file dalam jumlah besar, maka kamu kudu pake FTP Client. Saya seneng pake Leech FTP (Search aja di google ya).Cara penggunaan File Manager ini sangat mudah. Silahkan akses Cpanel kamu dan klik 2 kali pada File Manager (saya menggunakan Legacy File Manager).Pilih web root dan klik ok.Biasanya kita akan di bawa pada root direktori account kita. Nama direktori tersebut adalah public_html. Di dalam direktori inilah kita bisa meletakkan file-file PHP atau web apapun bikinan kita. Jika nama file kita adalah coba.php, maka setelah kita upload ke direktori public_html ini, kita bisa memanggilnya dengan http://namadomain.com/coba.php . Di direktori ini kita akan melihat menu upload file di bagian atas. Klik aja tuh link upload file. Setelah itu kita akan disajikan dengan beberapa field upload file. Silahkan klik browse dan cari file yang ingin kamu upload. Setelah itu klik open. Kemudian klik upload. Kamu bisa juga mencentang overwrite jika ingin menimpa file eksisting.Kamu bisa melakukan upload beberapa file secara sekaligun di form ini.Ok, kamu sekarang udah bisa melakukan upload file karya kamu dan file tersebut sudah siap untuk dilihat oleh seluruh dunia melalui domain kamu.Selamat ya.

Page 47: Belajar HTML Gratis

Dreamweaver, PHP, HTML dan MySQL sebenarnya saling berhubungan. Pengen tahu? Bahkan ada juga alternatif gratisan dari Dreamweaver, yang cukup powerful lho.HTML penting buat bikin desain tampilan web, PHP buat proses data yang ada di MySQL untuk ditampilkan melalui HTML, yang itu mungkin udah pada tahu kan? Nah, Dreamweaver apa lagi tuh?Dreamweaver pada awalnya adalah sebuah software yang berguna untuk membantu kita mendesain web, atau dengan kata lain untuk mempermudah kita agar tidak terlalu pusing dengan kode-kode HTML. Dengan Dreamweaver, kita akan lebih mudah mendesain karena tidak perlu membayangkan desain tata letak web site yang kita buat. Kita bisa langsung melihat di layar, hasil desain web yang kita bikin. Jika kita membuat kode HTML menggunakan notepad misalnya, maka kita harus menyimpannya dulu dan membukanya menggunakan browser. Jika menggunakan Dreamweaver, maka kita bisa langsung melihat. Istilah kerennya WYSIWYG, What You See Is What You Get.Saya ulangi lagi, Dreamweaver pada awalnya adalah alat bantu untuk membuat kode HTML.Dalam perkembangannya, Dreamweaver juga bisa digunakan untuk membuat kode PHP. Bahkan untuk akses ke database MySQL kamu bisa dengan mudah membuatnya dengan Dreamweaver. Sebenarnya yang dilakukan Dreamweaver adalah membuatkan koneksi dan query standar PHP untuk akses ke MySQL dengan menggunakan fungsi-fungsi yang di tanam dalam software Dreamweaver.Namun demikian, pada akhirnya kita akan tetap perlu utak-atik kode yang dihasilkan oleh Dreamweaver untuk menyesuaikan dengan kebutuhan kita secara lebih detil.Jadi, tetaplah semangat untuk belajar HTML, PHP dan MySQL ya. Penting banget tuh, dijamin bakal kepake terus biarpun udah ada software bantu.Next, saya akan bahas beberapa software alternatif dari Deamweaver ini.

Saat membuat web site, kita bisa menggunakan software bantu yang sangat membantu kita karena sifatnya yang WYSIWYG (What You See Is What You Get). Kita bisa mendesain secara visual halaman web yang kita inginkan. Salah satu yang paling ngetop adalah Deamweaver. Kita bahkan bisa menambahkan kode PHP menggunakan Deamweaver ini. Namun, sebenarnya ada alternatif selain Dreamweaver ini, dan bahkan beberapa di antaranya Gratis alias open source.Salah satu software yang bisa membantu kita adalah Frontpage. Software ini relatif mudah digunakan karena softwarenya mirip dengan aplikasi MS-Ofice yang sering kita gunakan.Bahkan sebenarnya kita bisa juga menggunakan MS-Word dan MS-Powerpoint untuk mendesain web kita. Cukup membuat dokumen seperti biasa dan menyimpannya dalam format HTML, maka jadilah web page kita.Nah, selain software-software tersebut, ada juga alternatif lainnya yang bersifat open source. Saya pernah menggunakan NVU dan KompoZer untuk mendesain halaman depan web site kursus online. Hasilnya juga tidak kalah dengan buatan Deamweaver.Silahkan di lihat untuk melihat contoh hasilnya. Tentu saja untuk membuat desain web kita juga memerlukan software bantu lainnya. Dan yang paling umum adalah software pengolah gambar.Nah dalam tulisan berikutnya kita coba akan bahas beberapa software pengolah gambar yang umum digunakan untuk mendesain web site. lagi-lagi ada alternatif open sourcenya lho.Mudah-mudahan bermanfaat. Salam hangat.

Kamu mungkin udah tahu kalau untuk mempermudah pekerjaan desain web, kita bisa menggunakan software bantuan seperti Dreamweaver, Frontpage atau kalau pengen gratisan bisa pakai KompoZer. Software-software itu biasanya dikenal dengan istilah web authoring software. Namun demikian, untuk membuat desain web yang indah, kamu masih memerlukan alat bantu lain. Yang saya maksudkan adalah software untuk memanipulasi gambar. Ya, Dreamweaver dan kawan-kawannya tidak bisa memanipulasi gambar. Yang saya maksudkan dengan manipulasi gambar di sini adalah mengubah gambar yang akan kita gunakan di web site, seperti mengubah ukuran, memotong, mengubah warna atau bahkan menggabungkan beberapa gambar agar nampak lebih enak dilihat.Semua itu hanya bisa dilakukan oleh software yang digunakan khusus untuk memanipulasi gambar. Dan tentu saja yang mungkin paling sering kamu denger adalah Adobe Photoshop. Selain Adobe, saya juga pernah beberapa kali menggunakan Macromedia Dreamweaver dan akhir-akhir ini saya mencoba software pengolah gambar open source yang bernama GIMP. Saya coba terapkan di situs ini. Silahkan lihat untuk mengetahui apa yang bisa dilakukan oleh GIMP. Meskipun filternya tidak

Page 48: Belajar HTML Gratis

selengkap Adobe, namun untuk pemula sudah sangat cukup. Nah, umumnya langkah-langkah yang dilakukan saat saya mendesain sebuah web site adalah seperti ini:•    Membuat gambar desain template web menggunakan GIMP•    Memotong-motong gambar tersebut sesuai areanya (misalnya header, menu, body, footer, dll).•    Menyusun potongan-potongan gambar itu kembali dalam web site menggunakan KompoZer.•    Jika web site saya merupakan web site dinamis, maka langkah berikutnya adalah menyisipkan kode-kode PHP ke dalam web site hasil dari KompoZer.Kalau halaman web kamu udah beres, kamu bisa melanjutkan dengan langkah-langkah membuat web site di internet. Ok, mudah-mudahan penjelasan singkat ini bisa bermanfaat minimal memberikan gambaran awal bagaimana sebenarnya proses membuat desain sebuah halaman web secara umum. Kalau ingin mengetahui lebih detil langkah-langkah desain web tersebut, silahkan coba kunjungi situs ini.

Mendesain web menggunakan kode-kode seperti yang kamu pelajari saat Belajar HTML memang sangat mudah. Namun demikian, kalau kamu seneng dengan software bantu untuk mendesain web site, silahkan coba KompoZer.Tentu saja masih ada banyak pilihan lain selain software ini. Namun demikian, menurut saya, software KompoZer ini cukup mudah yang free, sehingga merupakan alternatif software web desain (web authoring) yang layak untuk kamu coba.Dengan software gratisan ini, kamu bisa mendesain web secara visual sehingga memudahkan proses desain kita.Tentu saja kamu sebaiknya tetap melakukan penyempurnaan atas hasil desain KompoZer ini terutama jika perlu membersihkan kode kamu agar lebih ringan dan ingin menambahkan script PHP ke dalam halaman web yang kamu desain.Tertarik?SIlahkan download KompoZer dan mencobanya. Kecila kok ukuran filenya.

Belajar web sebenarnya merupakan proses mempelajari beberapa pengetahuan penting. Secara umum, sebagai dasar untuk belajar web, kamu akan memerlukan paling tidak 3 hal. Apa saja itu? Hal pertama yang harus kamu lakukan adalah belajar HTML. HTML merupakan basis awal buat kamu untuk membuat tampilan web yang nantinya akan muncul di browser. Kalau kamu sudah puas dengan web site yang sifatnya statis, maka proses belajar web kamu bisa berhenti sampai di sini.Namun demikian, pada umumnya, kamu akan memerlukan versi interaktif dari web yang kamu buat. Untuk itu, proses selanjutnya dalam belajar web adalah menambahkan elemen dinamis atau interaktif pada web site yang sudah kamu buat. Untuk itu kamu akan perlu belajar PHP, karena PHP merupakan bahasa pemrograman web yang bisa menggunakan logika. Kemampuan ini tidak dimiliki oleh HTML.Apa sudah cukup? Sayangnya belum.

Sebuah web site yang dinamis umumnya akan memerlukan media penyimpanan data. Sebagai contoh, kamu akan memerlukan tempat penyimpanan data-data orang yang yang mengisi komentar di buku tamu atau blog kamu. Walaupun PHP bisa menyimpannya dalam bentuk teks file, namun pada umumnya kita akan lebih mudah jika menggunakan apa yang disebut dengan database.

Nah, dengan demikian, proses belajar web yang harus kamu lakukan selanjutnya adalah belajar database. Dan database yang merupakan pasangan abadi dari PHP adalah MySQL. Jadi jangan lupa untuk belajar MySQL juga ya.

Jadi urut-urutan buat kamu yang ingin belajar web adalah :1. Belajar HTML 2. Belajar PHP 3. Belajar MySQL

Tentu saja kamu akan memerlukan ilmu-ilmu tambahan lagi nantinya, seperti CSS, Javascript AJAX, dana juga teori desain seperti tata letak, warna dan yang tidak kalah penting adalah mempelajari alat bantu desain web seperti Dreamweaver, Front page dan versi gratisnya seperti KompoZer atau NVU. Software-softaware tersebut sangat membantu kita dalam mendesain web

Page 49: Belajar HTML Gratis

terutama sebagai alat untuk menggantikan penulisan kode HTML secara manual.

Jika kamu akan memerlukan desain sistem web untuk support sistem dalam perusahaan, maka kamu juga harus mempelajari bagaimana melakukan analisa terhadap permintaan user, membuat Data Flow Diagram (DFD), Membuat Entity Relationship Diagram (ERD), melakukan normalisasi dalam desain database, dan pengelolaan project.

Banyak ya? Jangan khawatir, itu kan kalau benar-benar mau mengerjakan proyek gede secara profesional. Ingat, sebagai permulaan, untuk membuat web site sendiri, sebenarnya kamu cuman butuh belajar HTML, PHP dan MySQL. Dan ketiganya bisa kamu pelajari di prothelon.com ini secara gratis. SIlahkan klik link-link di atas untuk mempelajari masing-masing materi. Mudah dipelajari kok, yang penting tekun dan jangan mudah putus asa ya.

Membuat website sederhana bisa kamu lakukan dalam waktu  cepat. Hal ini terutama berlaku jika kamu hanya perlu membuat website yang bersifat statis. Membuat website statis artinya kamu hanya menggunakan HTML saja untuk mendesain website kamu. Kamu bisa belajar HTML lebih lanjut nantinya setelah praktek sederhana ini.Coba buka notepad kamu, terus tuliskan baris berikut ini:

Asyik Saya sudah bisa membuat website sendiri!

Kalau sudah, simpan dengan nama "coba.html", jangan lupa tanda kutipnya juga kamu tulis saat memasukkan nama filenya.Setelah beres, coba kamu buka Firefox kamu dan klik File - Open File.Browse ke file coba.html yang berusan kamu buat, dan ....Ya, tulisan yang kamu buat tadi muncul di browser.Gampang banget kan membuat website sendiri?

Tutorial ini akan menunjukkan bagaimana membuat sebuah website. Panduan ini ditujukan bagi para pemula, dan akan menunjukkan langkah demi langkah keseluruhan proses membuat website sendiri dari dasar banget. Tentu saja saya mengasumsikan kalau kamu hampir ndak tau apa-apa mengenai cara membaut website sendiri (kecuali tentu saja kamu harus bisa browsing dan membaca). Saya juga membuat beberapa link menuju tutorial lain yang terkait untuk memudahkan kamu untuk mempelajari lebih lanjut topik-topik tertentu yang diperlukan. Hampir semua topik itu udah ada di prothelon.com kok. Yuk, kita mulai...

Panduan penting langkah demi langkah membuat website sendiri

Dapatkan nama domain kamu sendiri

Hal pertama yang harus kamu lakukan saat membuat website sendiri adalah memperoleh nama domain kamu sendiri. Sebuah domain adalah nama yang ingin kamu berikan untuk website yang kamu buat. Sebagi contoh, nama domain website yang sedang kamu baca ini adalah "prothelon.com". Untuk memperoleh nama domain, kamu harus membayar biaya sewa tahunan sebagai hak penggunaan nama tersebut. Yah, kamu tahu sendirikan, kalau nama website itu harus unik, dan hanya satu-satunya di internet. Kalau tidak orang pasti akan bingung mana web site punya kamu dan mana website yang milik orang lain. Jadi, di seluruh internet, kamu pasti hanya akan menemukan sebuah website yang alamatnya prothelon.com. Got that?

Nah, sebelum kamu berpikir macam-macam, perlu saya ingetin bahwa memiliki nama domain bukan berarti kamu sudah memiliki sebuah website. Belum. Ingat, nama domain ini hanyalah sebuah nama. Seperti kamu mendaftarkan ijin usaha sebuah PT atau CV dalam dunia nyata. Memiliki ijin usaha ini bukan berarti kamu memiliki toko atau gudangnya kan?

Pilih Sebuah Web Hosting

Langkah berikutnya dalam proses membuat website sendiri ini adalah memilih web hosting. Sebuah web hosting pada dasarnya adalah sebuah perusahaan yang memiliki beberapa komputer yang selalu terhubung ke internet. Jika kamu menempatkan halaman-halaman web kamu di

Page 50: Belajar HTML Gratis

komputer mereka, maka seluruh dunia bisa menghubungi komputer itu dan melihat halaman website kamu. Kamu perlu mendaftarkan diri dulu ke web hosting agar website yang kamu buat memiliki "rumah". Jika memiliki nama domain bisa diibaratkan dengan memiliki ijin usaha, maka memiliki akun web hosting kira-kira mirip dengan menyewa kantor atau toko untuk bisnis kamu. Menyewa? Ya, untuk web hosting yang berbayar. Tentu saja kamu bisa memilih web hosting berbayar ataupun yang Web Hosting gratisan. Kamu juga bisa baca tutorial singkat tentang membuat website di hosting berbayar ini.Kamu bisa melihat beberapa tips menarik saat memilih web hosting yang pernah saya tulis sebelumnya. Silahkan baca dulu agar kamu punya panduan saat menentukan pilihan nantinya.

Baiklah, dalam tutorial sebelumnya mengenai Cara Membuat Website, kamu sudah menyiapkan domain name dan hosting yang bagus. Saatnya untuk mengisi hosting kamu.

Langkah penting berikutnya adalah mendesain website kamu.

Begitu kamu sudah siap dengan domain dan hostingnya, tiba waktunya untuk mengisi hosting kamu dengan file-file yang akan kamu pamerkan ke seluruh dunia. Nah, file-file tersebut tentu saja harus dibuat kan? Tentu saja kamu harus mempelajari terlebih dahulu cara membuat desain website ini sebelum kamu bisa menampilkannya di internet. Untuk itu kamu bisa mempelajarinya mulai dari HTML, PHP dan MySQL, yang semuanya bisa kamu pelajari di prothelon.com secara gratis.

Langkah berikutnya adalah Mengetes Website kamu

Proses ini harus kamu lakukan secara kontinyu. Mengapa? Karena website yang kamu buat biasanay akan nampakberbeda-beda di setiap browser. Usahakan untuk selalau mengetesnya di setiap browser utama jika kamu melakukan perubahan terhadap desain atau isi website kamu.Perlu kamu ketahui, bahwa meskipun sudah menggunakan standar yang sama, namun tempilan halaman web si Internet Explorer, Firefox, Chrome, Safari dll bisa sangat berbeda untuk halaman web yang sama.Ada baiknya kalau kamau menggunakan google analytics untuk mengetahui jenis browser apa yang paling sering digunakan pengunjung website kamu. Dengan cara ini kamu bisa konsentrasi ke jenis browser tertentu saat membuat website.

Salah satu langkah penting dalam membuat website adalah menyiapkan web hosting. Selain web hosting berbayar, ada juga yang gratisan. Nah, tulisan ini akan menunjukkan langkah-langkah membuat akun di hosting gratisan yaitu free0host.com.Langkah pertama tentu saja membuat akun di free0host.com. Silahkan langsung menuju ke free0hsot.com untuk membuat akun kamu.Klik link pendaftaran yang ada, dan kamu akan diminta beberapa data pribadi kamu di sana. Isi saja sesuai dengan keinginan dan data kamu.Perhatikan, kamu harsu mengisi alamat email dengan benar, karena free0host akan mengirimkan email konfirmasi ke alamat email kamu ini.Setelah selesai, kamu akan diminta untuk mengklik link konfirmasi yang sudah dikirimkan melalui email kamu.Buka email yang kamu gunakan untuk mendaftar dan klik link yang ada di sana.Link tersebut akan membawa kamu kembali ke website free0host.com dan kamu akan diminta untuk membuat data hosting kamu.Perhatikan, data yang pertama kamu isi adalah data akun kamu, sedangkan yang sekarang adalah data hosting. Sedikit berbeda.

Saat membuat website, kita tentu menginginkan agar website yang kita buat tersebut berguna dan dibaca pengunjung kan? Setelah susah-susah kita buat dan berbagai cara kita lakukan untuk mendatangkan trafik sudah kita lakukan, tentu kita tidak ingin pengunjung yang datang ke website kita pergi begitu saja karena beberapa kesalahan kecil yang sebenarnya bisa kita hindari dengan mudah. Apa saja tips dalam membuat website? Mari kita lihat satu persatu...Meyediakan konten yang berguna di website kita.

Page 51: Belajar HTML Gratis

Pastikan bahwa setiap halaman website kita memiliki sesuatu yang penting untuk diketahui pengunjung.

Hal ini memang tidak terkait langsung dengan desain sebuah website, tetapi menurut saya hal ini jauh lebih penting daripada desain website itu sendiri. Jika kamu perhatikan, maka kamu akan melihat bahwa desain di prothelon.com ini sangat sederhana. Dan itu memang saya sengaja karena saya lebih fokus pada konten daripada pada desain webnya. Memang ada beberapa pengunjung yang "memprotes" kesederhanaan desain ini karena seolah-olah tidak menunjukkan kualitas saya sebagai pembuat website, namun demikian, saya sudah membuktikan sendiri bahwa yang namanya konten itu jauh lebih penting daripada desainnya terutama untuk website yang memberikan informasi seperti prothelon.com ini.Saya tahu bahwa banyak orang mencari cara untuk membuat website mereka nampak cantik untuk dilihat, karena mereka pikir, desain bagus adalah hal yang paling penting.Namun demikian, mari kita coba pikirkan lagi dan sadari bahwa tujuan utama membuat website pada dasarnya adalah  memberikan sesuatu yang menarik dan berguna bagi pengunjung. Kalau halaman-halaman website kamu belum menyediakan itu, maka kamu harus memperbaiki masalah itu dulu sebelum mengkhawatirkan warna, tampilan, dan desain website yang kamu buat.Ilustrasi berikut ini mungkin bisa membantu kamu memahami apa yang saya meksud. Kalau kamu melemparkan tanah ke sebuah kanvas, dan membingkainya dengan bingkai emas, tetap saja yang kamu buat itu adalah kanvas yang ada tanahnya. Bingkai emas tidak secara ajaib mengubahnya menjadi lukisan yang indah.Apa yang kamu tawarkan pada pengunjung? Apa yang membuat waktu mereka tidak terbuang sia-sia saat membaca website yang kamu buat? Fokuslah ke sana sebelum mengkhawatirkan masalah desain website.

Kalau kamu berencana untuk membuat website yang menghasilkan uang dari iklan, maka saran saya jangan gunakan lebih dari 25% dari halaman website kamu untuk iklan. Usahakan agar lebih dari 75% benar-benar merupakan konten yang berharga untuk dibaca pengunjung. Kadang-kadang kita melihat sebuah website yang dipenuhi iklan sampai-sampai kita sulit mengetahui di mana isi yang sebenarnya berada kan? Perhatikan hal ini: Orang tidak menyalakan TV untuk melihat iklan komersial tetapi menonton acaranya, mereka juga tidak membeli majalah untuk iklannya tetapi untuk artikel yang ada di dalamnya. Sama persis, website yang kamu buat harus lebih banyak isinya dibanding iklannya.

Itu adalah tips pertama yang perlu kamu perhatikan saat membuat website. Berikutnya kita akan membahas tips yang menarik terkait elemen-elemen halaman yang perlu kamu hindari pada website kamu.Dalam tips cara membuat website sebelumnya, saya sudah sampaikan bahwa konten lebih penting

dibandingkan desain. Nah, sekarang kita akan lihat apa saja elemen website yang sebaiknya tidak

kamu tampilkan.

Yang pertama: jangan ganggu pengunjung kamu dengan teks yang nge-blink, teks berjalan

atau musik.

Lagu atau suara adalah elemen yang mengganggu. Pengunjung kita juga akan sulit berkonsentrasi

pada isi website kita kalau diganggu berbagai hal yang beterbangan di website kita.

Page 52: Belajar HTML Gratis

Selain itu, lagu dan berbagai elemen script yang akrobatik sangat memperlambat website kita untuk

di load oleh pengunjung. Mereka akan membuang waktu percuma untuk menunggu animasi atau

lagu yang sebenarnya tidak mereka perlukan.

Masalah lain dengan teks yang berjalan adalah bahwa pengunjung kita tidak bisa membacanya

dengan kecepatan mereka. Mereka terpaksa membacanya sesuai kecepatan yang sudah kita setting.

Jika kita set terlalu cepat, mereka akan sulit membacanya, sedangkan jika terlalu pelan, mereka

terpaksa harus menunggu dengan sabar sampai semua teksnya muncul yang sebenarnya.

Ini membuat kita sampai pada hal yang penting, selalu buat pengunjung kita pikirannya tertarik.

Pastikan bahwa kamu membuat mereka tertarik dan bukan fokus pada diri kamu sendiri. Jangan

berpikir gini yah, "Lihat nih, gw bisa bikin website yang keren". Jangan desain website untuk diri

kamu tapi desainlah untuk orang-orang yang akan menggunakannya nanti.

Kedua: Jangan Ganggu Pengunjung dengan Pop Up Windows.

Perhatikan ini, tidak ada seorangpun yang menyukai Pop Up Windows. Alasan satu-satunya untuk

mengeluarkan pop up windows adalah demi kepentingan kamu sebagai pemilik website kan?

Coba bayangin kalau kamu lagi browsing, kamu pasti gak suka pop up, dijamin deh. Jawab dengan

jujur pertanyaan ini. Kalau ada pengunjung website melihat Pop up windows kira-kira apa yang ada

di pikiran mereka:

"Pop up windows? Wow, aku senang dengan pop up windows! Saya akan book mark website ini dan

mengunjunginya sesering mungkin. Saya bahkan akan men klik link atau iklan yang ada di pop up

karena aku seneng banget ama pop up."

atau ini

"@#@%$@&%?. SIapapun yg bikin website ini tidak menghormati aku sebagai pengunjung. Aku

ga akan pernah lagi ke website ini"

Dalam artikel cara membuat website sebelumnya, kita sudah membahas mengenai beberapa elemen

website yang sebaiknya dihindari saat mendesain sebuah website. Artikel ini adalah kelanjutannya.

Gambar background itu seolah-olah nunjukin kalau kamu tuw amatiran. Kenapa? Karena sebagian

besar website amatir menggunakan gambar background. Coba pikirin sebuah website terkenal yang

menggunakan gambar background! Misalnya Google, Yahoo, Amazon, atau yang lainnya.

Perhatikan, bahwa website-website tersebut tidak menggunakan gambar background saat

webmasternya membuat website mereka.

Website yang menggunakan gambar background umumnya juga sangat dipebuhi dengan elemen

website yang menunjukkan "siapa" pemiliknya. Ini biasanya karena pembuatnya ingin menunjukkan

jati dirinya tapi dengan cara yang "lebay". Pakai background, musik, mouse trail, gambar yang

beterbangan ke sana kemari, dan lain-lain.

Kembali lagi, tolong diingat, bahwa tujuan kamu membuat website adalah untuk pengunjung kamu,

bukan buat kamu sendiri. Saat membuat website, konten lebih penting daripada desain....

Selain itu, latar belakang gambar juga membuat website kamu lebih lambat loadingnya. Ya, sebuah

gambar memang memiliki arti seribu kata... tapi sayangnya sebuah gambar juga memiliki ukuran

seribu kata :).

Page 53: Belajar HTML Gratis

Jadi, gunakan gambar latar belakang dengan baik ya... Jika memang terpaksa, perhatikan agar

kekontrasannya tinggi agar teksnya kelihatan, atau lebih baik lagi jangan ada teks sama sekali di

halaman yang menggunakan latar belakang gambar.

Saat kamu belajar PHP, maka tentu saja kamu harus melakukan praktek bukan? Ya, belajar PHP tanpa praktek hanya akan menghasilkan teori tanpa tahu cara membuat program yang sebenarnya. Untuk bisa melakukan praktek di PC kamu sendiri, maka kamu tidak perlu menginstall PHP, MYSQL dan Apache server sendiri-sendiri. Kamu bisa menginstall paket PHP server, MySQL server dan Web server yang jauh lebih mudah dalam pengoperasiannya. Apa saja pilihannya? Mari kita lihat.

Beberapa paket server yang tersedia dan support PHP adalah : XAMPP WAMPP PHPTriad Appserv

Cukup menarik untuk mencoba masing-masing. Kalau saya sendiri menggunakan XAMPP.

Tidak hanya saat belajar, namun pada saat kamu sudah membuat program yang sebenarnya, maka

kamu akan melakukan development di PC dan setelah selesai baru kamu upload ke server yang

sebenanrnya. Untuk melakukan hal tersebut, lagi-lagi kamu akan membutuhkan paket server-server

tersebut.

Saya yakin kalau teman-teman yang baru belajar HTML ada yang memiliki pertanyaan yang sangat

mendasar seperti ini. Adakah cara membuat website dengan HTML saja tanpa perlu belajar PHP?

Jawabannya tentu saja ya.

Bahkan sebenarnya pada awal kemunculan layanan world wide web di internet, orang hanya

mengandalkan HTML saja untuk membuat website mereka saat itu. Ya, HTML merupakan cikal

bakal munculnya internet seperti yang kalian lihat sekarang.

Kekuatan HTML terletak pada kemampuannya untuk mereferensi halaman web lainnya

menggunakan link. Dan itulah yang membuatnya sangat populer saat ini dibandingkan layanan

lainnya ketika itu seperti newsgroup, gopher dan lainnya.

Dengan HTML sebetulnya kita sudah bia membuat halaman web yang benar-benar bisa tampil

dengan baik di internet. HTML sangat bermanfaat untuk membuat website yang sifatnya statis.

Halaman website statis yang saya maksudkan di sini adalah halaman web yang selalu tetap isinya,

tidak pernah berubah. Untuk melakukan perubahan terhadap website statis, kita harus menulis ulang

kode HTML yang ingin kita edit seduai dengan update yang kita perlukan.

Sebagai contoh misalnya kita membuat website yang isinya adalah sebiuah kalimat seperti ini:

Ini Halaman website prothelon. Sekarang ini hari Rabu.

Untuk membuat website tersebut, kita cukup menggunakan kode HTML singkat seperti ini:

Ini Halaman website prothelon. Sekarang ini hari Rabu.

Kita bisa menyimpan file tersebut dengan eksteni htm atau html dan langsung menguploadnya ke

server yang terhubung dengan internet. Maka jadilah website kita tersebut dan bisa dinikmati oleh

semua pengguna internet.

Untuk melakukan manipulasi tampilan, huruf, latar belakang, paragraf, tabel dll, kita cukup

mempelajari bahasa HTML yang kita kenal dengan istilah tag. Misalnya untuk membuat hurufnya

menjadi tebal kita bisa menambahkan tag (bold) di depan kalimat yang ingin kita tebalkan

Page 54: Belajar HTML Gratis

hurufnya.

Selama ini saya hanya fokus pada CMS Mambo atau Joomla. Ternyata CMS Drupal juga cukup

menarik. Apa menariknya?

Setelah saya baca-baca, ternyata kita bisa membuat content sesuai kebutuhan kita yang sangat

customized di Drupal.

Sebagai contoh, kita bisa membuat field-field tambahan khusus yang akan kita gunakan sendiri di

luar field-field standar yang sudah tersedia di Drupal.

Sanagt menarik, karena menurut saya ini membuka peluang besar untuk membuat website

menggunakan CMS secara lebih fleksibel. Dan itu bisa dilakukan dengan menambahkan modul

CCK.

Jadi ndak sabar untuk explore lebih jauh nih.

Kalau sudah, nanti saya share deh... Atau udah ada yang punya pengalaman dan pengen share?

Silakan tulis aja di comment.

Salah satu pembeli buku saya sempat menanyakan sebuah pertanyaan menarik tentang domain. Isi emailnya seperti ini:

Boleh nanya lagi ga? Kalau ga boleh, ya ga usah di jawab. pertanyaannya umum saja kok. 1. Kenapa untuk alamat URL ada yang di tulis dengan www dan ada yang tidak?2. Kenapa alamat URL yang biasanya ditulis dengan www tetap bisa diakses jika tanpa www?3. Kenapa jika ada alamat URL yang memang tidak pakai www, justru ga bisa diakses jika pakai www? Makasih ya Pak. Setelah ini saya tidak akan bertanya-tanya lagi, paling tidak dalam jangka waktu dekat sampai web saya jadi. :)

Nah, buat kamu yang memiliki pertanyaan serupa tentang domain, mudah-mudahan sharing saya tentang domain ini bisa membantu sedikit ya.Ini jawaban saya:Silakan saja kalau mau diskusi, cuman kalau kadang jawabnya agak lama harap maklum ya, soalnya kalau pas banyak yg email suka liyeur hehehe...Saya coba jawab secara sederhana saja ya, sebatas pengetahuan saya.

Jadi begini...

Alamat sebuah website, secara umum terdiri dari 4 bagian. Saya akan gunakan contoh http://www.prothelon.com1. http:// --> ini adalah protokol internet yg digunakan. Yang umum dipakai biasanya http, https (biasanya untuk yg perlu dienkripsi seperti saat anda masuk ke web perbankan) dan ftp (untuk melakukan transfer file).2. www, ini disebut dengan sub domain. Secara default, subdomain standar adalah www (world Wide Web).3. prothelon, ini adalah nama domainnya. Nama domain ini yang bisa kita minta sesuai kebutuhan kita.4. com, ini adalah ekstension domain atau kadang dikenal juga sebagai top level domain.Sebuah browser akan mengecek alamat domain secara berurutan mulai dari yang paling kanan. Pertama dia akan mengecek top level domainnya, kemudian nama domain, sub domain dan protokol yang digunakan.Nah, pertanyaan dari Anda fokus di sub domain. jadi saya akan coba sedikit berbagi tentang sub domain ini.Pada dasarnya, kita bisa memanggil semua alamat website dengan protokol, nama domain dan ekstensionnya saja. Pada kasus standar ini, kita tidak bisa memanggil website kita dengan menggunakan subdomain www di depannya.Namun kita juga bisa setting di server agar sub domain www, secara default akan menuju ke nama

Page 55: Belajar HTML Gratis

domain utama kita. Jika setting ini kita lakukan, maka kita bisa memanggil website kita dengan www dan tanpa www.Sebagai tambahan, kita sebetulnya bisa membuat banyak subdomain di website kita yang masing-masing menuju ke aplikasi tersendiri. Agar lebih jelasnya, silakan coba beberapa alamat subdomain dari prothelon.com ini:http://prothelon.comhttp://www.prothelon.comhttp://blog.prothelon.comhttp://iklan-baris.prothelon.com

Untuk mengetahui negara asal IP address pengunjung website, kita bisa menggunakan beberapa

metode.

Yang paling mudah adalah menggunakan versi pure PHP.

Kamu harus download dulu geoip free country file dan mengekstrak di direktori tertentu di website

kamu.

Jika sudah, berikut adalah contoh kodenya, untuk melihat penjelasan detil, silakan ke website ini:

Pada saat menggunakan atribut color (warna) pada HTML, kita bisa menggunakan 2 cara. Kita bisa menuliskan warna tersebut menggunakan kode hexa atau nama warnanya sendiri. HTML memiliki beberapa warna standar yang bisa dipanggil langsung namanya. Sesuai standar W3C, HTML mengenal 16 warna yang valid digunakan dalam HTML.Nama warna-warna tersebut adalah: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.Jika mencoba menuliskan warna lain selain nama-nama tersebut, maka bisa saja jalan, tapi ndak ngikutin standar valid HTML.Saran saya gunakan selalu kode hex untuk menuliskan isi dari atribut color ini agar lebih terjamin validitasnya.Ok. Pada artikel kali ini, saya akan coba jelaskan secara singkat cara membuat website yang dilengkapi box facebook like this atau facebook suka, seperti yang ada di box sebelah kanan halaman ini.

Langkah pertama adalah anda harus membuat fanpage terlebih dahulu. Tentu saja saya mengasumsikan kalau kamu sudah memiliki akun facebook. Buatlah fan page ini dari halaman login utama facebook di facebook.com.

Setelah selesai, masuklah ke halaman fanpage tersebut dan perhatikan alamat yang tertera di tempat kamu biasa menulis alamat website pada browser kamu.Di sana ada alamat fanpage kamu, dan copy angka yang ada di bagian akhir alamat tersebut. Ini adalah page id facebook fanpage kamu.Kamu bisa gunakan fanpage untuk komunitas saat diminta memilih.Setelah ok, silakan ke halaman facebook developer ini http://developers.facebook.com/docs/reference/plugins/like-box

Kamu bisa pilih apakah mau berbentuk button atau box dan melakukan kustomisasi tampilan sesuai yang diinginkan. Paste angka yang tadi kamu copy tadi ke field facebook page id.

Setelah beres, klik Get Code.

Langkah selanjutnya adalah copykan kode dari facebook ini ke halaman website kamu. Kalau kamu pake joomla atau mambo seperti prothelon.com ini, tinggal buat sebuah modul HTML baru, dan pastekan kode facebook ini ke sana. Banyak pengunjung yang masih bingung dalam membedakan cara membuat website. Beberapa dari mereka belum bisa membedakan cara membuat website menggunakan HTML, PHP dan MySQL dengan menggunakan cara instan seperti blogspot, wordpress atau CMS. Saya yakin, bahwa banyak dari teman-teman pengunjung prothelon.com sudah memiliki facebook kan? Nah, sebenarnya kita juga bisa membuat halaman web sendiri di facebook, seperti yang bisa kita lakukan di multiply atau website social network lainnya. Apakah ketika bisa membuat website dengan cara itu, maka sudah bisa dikatakan "membuat website"?

Page 56: Belajar HTML Gratis

Menurut saya pribadi jawabannya ya. Kita bisa membuat website dengan berbagai cara. Cara paling mudah dan murah adalah dengan memanfaatkan fasilitas di facebook untuk membuat halaman web seperti fan page. Atau jika kita ingin sedikit lebih fleksibel, maka kita bisa memanfaatkan blogspot atau wordpress.

Cara membuat website seperti itu, menurut saya praktis dan instan. Sangat cocok bagi Anda yang masih pemula dan ingin segera memulai bisnis atau sekedar memiliki web site di internet. Bagaimana dengan cara lainnya? Dan apakah masih perlu belajar cara membuat website menggunakan HTML, PHP dan MySQL? Dalam artikel sebelumnya kita sudah mulai membahas kelebihan website yang dibuat secara instan. Lalu bagaimana dengan PHP, HTML dan MySQL? perlukan kita mempelajarinya? Menurut saya ya. Kita masih sangat perlu untuk mempelajari cara membuat website dengan HTML, PHP dan MySQL. Hal ini karena pembuatan website instan umumnyamenyisakan sedikit sekali ruang untuk melakukan penyesuaian. Pada tahap awal, memang kita cukup membuat website secara instan untuk memulai penjualan. Namun, begitu kita mulai memiliki kebutuhan lain yang tidak disupport oleh website instan tersebut, maka kita perlu untuk membuat website menggunakan HTML, PHP dan MySQL. Dengan HTML, PHP dan MySQL, kita bisa membuat website yang sangat customized dan bisa disesuaikan dengan kebutuhan kita. Jadi, mulailah belajar membuat website, namun jangan tunggu selesai belajar dulu untuk mulai memanfaatkan internet dalam bisnis kita. Segera manfaatkan internet dengan apa yang kita bisa dulu.

 

Page 57: Belajar HTML Gratis

VISUAL BASIC

Belajar Visual Basic di prothelon.com saja, seperti biasa dengan bahasa yang mudah dipahami. Seperti juga PHP, Visual basic adalah sebuah bahasa pemrograman yang mudah dipelajari dan tutorial ini akan mengantarkan anda untuk memasuki dunia VB dengan enjoy. Dengan Visual basic, kamu bisa ngembangin aplikasi dan game-game berbasis Windows. Visual Basic jauh lebih mudah dipelajari dibandingkan bahasa pemrograman lainnya (seperti Visual C++) namun tetap merupakan bahasa pemrograman yang sangat powerful.

Tertarik? Baca aja tutorial ini lebih lanjut.

Visual basic lebih cocok untuk pengembangan aplikasi dibandingkan pengembangan game. Kamu bisa aja membuat game yang menakjubkan menggunakan Visual basic, tetapi jika kamu ingin membuat game profesional yang lebih canggih seperti Quake 2, maka kamu mungkin lebih baik memilih untuk menggunakan bahasa lain (seperti C++), yang tentunya akan jauh lebih sulit untuk digunakan.Namun demikian, Visual basic sebenarnya sudah sangat memadai untuk memenuhi hampir semua kebutuhan pemrograman aplikasi dangame yang kamu inginkan.Keuntungan Visual basic:

-          Bahasa yang sederhana. Banyak hal yang mungkin sulit dilakukan jikak kita menggunakan bahasa pemrograman lainnya, akan dapat dilakukan dengan mudah dengan menggunakan Visual basic.

-          Karena Visual basic sangat populer, maka sangat banyak sumber-sumber yang dapat kamu gunakan untuk belajar dan mengembangkan kemampuan kau baik berupa buku, web site dll (tentu saja salah satunya adalah http://prothelon.com J). Dengan banyaknya sumber-sumber tersebut, maka tentu saja kamu akan sangat mudah menemukan jawaban atas persoalan yang kamu hadapi kan?

-          Kamu bisa memperoleh banyak tools baik gratis maupun tidak di Internet yang akan sangat membantu menghemat waktu kamu dalam pemrograman. Contoh, jika kamu ingin membuat program untuk melakukan ping ke salah satu komputer di jaringan kamu, alih-alih membuat program ping tersebut sendiri, kamu bisa donlot sebuah kontrol yang melakukan hal tersebut dan menempelkannya di program kamu. Jika dibandingkan dengan bahasa lain, Visual basic memiliki variasi tools yang paling luas lho.Kekurangan Visual basic:

-          Visual Basic adalah bahasa pemrograman yang powerful, tetapi sebenarnya tidak terlalu bagus untuk membuat game-game yang benar-benar memuaskan.

-          Lebih lambat dibandingkan bahasa pemrograman lain.Proses belajar VB kamu akan dimulai dengan cara membuat program pertama kamu. Nah, sebelumnya kamu perlu tahu dulu, interface VB yang akan kamu hadapi.

Page 58: Belajar HTML Gratis

Ok, sekarang kita akan mulai. Sebagai catatan, semua gambar dalam tutorial ini diambil dari Visual basic versi 6.0. Namun demikian, ndak perlu khawatir, karena versi lainnya tidak jauh berbeda kok.Saat kamu memulai program Visual basic, maka hal pertama yang akan mau lihat adalah layar ini:Di sini, kamu harus memilih jenis program yang akan kamu bikin. Sebagai awalnya, kita akan membuat sebuah program sederhana, untuk itu pilihlah Standar EXE, dan klik tombol Open. (Kalau gambar di atas bukan gambar pertama yang kamu lihat, pilihlah File à New Project dari menu Visual basic seperti pada gambar di bawah ini).

Setelah kamu mengklik tombol open, kamu akan melihat layar utama tempat kamu akan menghabiskan sebagian besar waktu kamu dalam membuat program Visual Basic ini. Dalam proses Belajar VB ini, kamu akan banyak bertemu dengannya.Ok, berikutnya kita akan melanjutkan proses belajar VB ini dengan melihat lebih lanjut proses membuat program sederhana kamu yang pertama.

Proses belajar VB kamu akan dimulai dengan cara membuat program pertama kamu. Nah, sebelumnya kamu perlu tahu dulu, interface VB yang akan kamu hadapi.

Ok, sekarang kita akan mulai. Sebagai catatan, semua gambar dalam tutorial ini diambil dari Visual basic versi 6.0. Namun demikian, ndak perlu khawatir, karena versi lainnya tidak jauh berbeda kok.

Saat kamu memulai program Visual basic, maka hal pertama yang akan mau lihat adalah layar ini:

 

Di sini, kamu harus memilih jenis program yang akan kamu bikin. Sebagai awalnya, kita akan membuat sebuah program sederhana, untuk itu pilihlah Standar EXE, dan klik tombol Open. (Kalau gambar di atas bukan gambar pertama yang kamu lihat, pilihlah File à New Project dari menu Visual basic seperti pada gambar di bawah ini).

Setelah kamu mengklik tombol open, kamu akan melihat layar utama tempat kamu akan menghabiskan sebagian besar waktu kamu dalam membuat program Visual Basic ini. Dalam proses Belajar VB ini, kamu akan banyak bertemu dengannya.

Page 59: Belajar HTML Gratis

 

Ok, berikutnya kita akan melanjutkan proses belajar VB ini dengan melihat lebih lanjut proses membuat program sederhana kamu yang pertama.