PHP FORUM: Agustus 2012

Rabu, 29 Agustus 2012

JQuery

Setelah belajar PHP tentu butuh tampilan yang interaktif, dan bagus. Untuk itu dibutuhkan interaksi dengan javascript. Untuk apa? Agar aplikasi kita lebih halus dan lebih profesional. Karena jika cuman mengandalkan PHP maka kita akan kesulitan memunculkan alert, dialog yang bagus, grafik yang menawan dan lain sebagainya. Javascript sangat berguna untuk mengatur dalam pemrograman disisi client. Misalnya untuk menghitung 4+3 tidak usah data tersebut dikirim ke server dulu lalu hasilnya dibalikin ke Client. Dalam client sendiri sudah bisa menghitungnya secara langsung, yaitu dengan menggunakan javascript. Nah sekarang sudah ada function-function javascript yang tinggal pakai dan mempunyai hasil yang hebat, yaitu Jquery.

Berikut pengertian Jquery menurut Wikipedia jQuery adalah pustaka JavaScript kecil bersumber terbuka yang menekankan pada interaksi antara JavaScript dan HTML. Pustaka ini dirilis pada Januari 2006 di BarCamp NYC oleh John Resig dan berlisensi ganda di bawah MIT dan GPL. Microsoft dan Nokia telah mengumumkan akan mengemas jQuery di platform mereka [1]. Microsoft awalnya mengadopsinya dalam Visual Studio [2] untuk digunakan dalam ASP.NET AJAX dan ASP.NET MVC Framework, sedangkan Nokia akan mengintegrasikannya dalam kerangka Web Run-Time mereka.

Jquery sekarang sudah sangat popular, jika tidak menguasainya tentu programmer web php akan ketinggalan kereta perubahan zaman. Jquery menyediakan fungsi menampilkan gambar slide, menu accordion, tabulasi cantik, grafik yang menawan dan lain sebagainya. Pokoknya cakep deh.

Untuk mempelajari Jquery bisa langsung kunjungi situsnya yaitu http://jquery.com atau browsing di mbah google. Literaturnya cukup banyak dan banyak forum yang membahasnya salah satu nya adalah koder.web.id, berikut petikan Jquery dari situs tersebut

JQuery adalah sebuah framework/library JavaScript yang dapat membantu kita mempermudah dan mempercepat pengolahan DOM pada halaman web.
Dengan jQuery kita dapat membuat web lebih menarik dan interaktif dengan mudah. jQuery sudah mengautomasi pekerjaan-pekerjaan yang umum dan mempersimple code yang kompleks. Library ini sangat kecil dan mempunyai banyak pluggin yang dapat mempermudah kita.
Adapun fitur-fitur yang ditawarkan oleh jQuery adalah

Mempermudah akses dan manipulasi ke bagian page tertentu. jQuery menawarkan sebuah selector yang robust dan efesien untuk mengambil bagian tertentu pada dokumen yang selanjutnya bisa dimanipulasi.
Mempermudah perubahan tampilan dokumen. jQuery dapat mengubah tampilan CSS dengan mudah.
Merespon interaksi user dengan webpage. jQuery mempunyai cara yang sangat-sangat elegan untuk memasukkan sebuah even ke dalam salah satu bagian dari webpage.
Menambah animasi. Kita dapat memberi animasi pada webpage kita dengan jQuery
Mempermudah AJAX.

Baiklah mari kita mulai dengan installasi jQuery. pada tutorial ini akan dibagi menjadi lima bagian yaitu instalasi, manipulasi, event, animasi dan ajax. pada artikel ini akan di bahas mengenai instalasi dan manipulasi.

Instalasi jQuery

Pertama-tama download dulu jQuery dari websitenya http://jquery.com/. Ada dua pilihan download. Production dan development, perbedaannya adalah production digunakan di realsite sedangkan development untuk masa developmen. Versi production sudah di kompresi sehingga kode nya sudah tidak bisa dibaca lagi dan ukurannya jauh lebih kecil. Versi developmen berguna jika kita mau mendebug jQuery.

Setelah mendownload maka load-lah jquery melalui tag script (perhatikan baris ke-6). sesuaikan attribut srcnya dengan path jquery anda.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First JQuery</title>
<script type="text/javascript" src="jquery.js"></script>
</head>

jQuery Selector

Selector adalah fungsi utama pada jQuery. semua fungsi lainnya di jQuery dapat diakses melalui selector. Penggunaan paling dasarnya adalah mempassingkan sebuah ekspressi (biasanya ekspressi css) yang kemudian selanjutnya jQuery akan mencari elemen yang cocok. pada intinya ini adalah fungsi untuk memilih elemen-elemen pad halaman web.

fungsi selector adalah $(‘ekspressi’). untuk penggunaan $() yang aman sebaiknya dilakukan setelah semua page DOM selesai terbaca semua. jadi webpagenya sudah lengkap baru script di eksekusi. kita dapat melakukannya dengan pada fungsi $(document).ready().

Adapun parameter yang bisa digunakan pada jquery adalah Id element, class element dan element itu sendiri. Selector juga bisa mengenali hirarki sebagai parameter inputnya dan bisa memfilternya langsung dari ekspressi.

*CATATAN : demo menggunakan layanan jsbin. anda bisa mengubah script html dan javascriptnya langsung, dengan mendouble click. pilih tab output untuk melihat hasilnya

contoh 1. mengubah semua div yang mempunyai p
demo : http://jsbin.com/ofaku

 (silakan di utak-atik demonya)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<base href="http://docs.jquery.com" /> 
<!-- Disini kita mengeload library Jquery --> 
<script src="http://code.jquery.com/jquery-1.3.js"></script> 
 
<script> 
$(document).ready(function(){ 
   // memangil semua div yang berisi p lalu ubah bordernya 
   $("div > p").css("border", "1px solid gray"); 
}); 
</script> 
</head> 
<body> 
<p>Ini adalah paragraf pertama</p>  
<div><p>Ini adalah paragraf kedua didalam div </p></div>  
 
<p>Ini adalah paragraf Ketiga</p> 
 
</body> 
</html>

contoh 2. Memasukkan tag html kedalam elemen
Demo : http://jsbin.com/ijopu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<base href="http://docs.jquery.com" /> 
<!-- Disini kita mengeload library Jquery --> 
<script src="http://code.jquery.com/jquery-1.3.js"></script> 
 
<script> 
$(document).ready(function(){ 
    //memasukkan html kedalam elemen
    $("<div><p>Saya adalah Paragraf Tabmahan</p></div>").appendTo("body") 
   // memangil semua div yang berisi p lalu ubah bordernya 
   $("div > p").css("border", "1px solid gray"); 
 
}); 
</script> 
</head> 
<body> 
<p>Ini adalah paragraf pertama</p>  
<div><p>Ini adalah paragraf kedua didalam div </p></div>  
 
<p>Ini adalah paragraf Ketiga</p> 
 
</body> 
</html>

Uji Coba
dari contoh diatas. coba kita buka halaman
lalu masukkan tambahkan kode ini satu persatu. lihat effect yang terjadi lalu pelajari fokuslah pada parameter yang ada pada fungsi $(PARAMETER) bukan fungsi diibelakangnya karena itu akan di jelaskan setelah ini.

//contoh selector menggunakan nama tag
$("div").css("border","3px solid red");
$("p").css("border","3px solid blue");
//contoh selector menggunakan nama object/element
$("#id_pertama").css("color","red");
//contoh selector menggunakan nama Kelas object
$(".merah").css("color","red");

*untuk dapat melihat perubahan script di coba satu-satu jangan langsung semua

jQuery Manipulation

Jquery Manipulation maksudnya penggunaan jquery untuk memanipulasi struktur dokumen. ada 7 kategori manipulasi yang disupport oleh jquery yaitu

Perubahan Content. Kita dapat merubah kontent dari sebuah object dengan dua fungsi yaitu html dan text. bedanya jika menggunakan text maka semua tag-tag html akan dituliskan sebagai mana mestinya. contoh (demo http://jsbin.com/ifoho) :
1 2 3 4

$("p").click(function () { var htmlStr = $(this).html(); $(this).text(htmlStr); });
Insert kedalam object. Setelah kita memilih sebuah object, kita dapat memasukkan tab html atau object kedalamnya. ada dua jenis insert yaitu append dan prepend. append menambahkan objek baru setelah value dari object tersebut, sedangkan prepend didepannya. contoh
1 2 3 4

$("p").append("<strong>Hello</strong>"); $("span").appendTo("#conto"); // Objek dengan ID conto akan dimasukkan kedalam span $("p").prepend("<b>Hello </b>"); $("span").prependTo("#conto");

Insert dikeluar object. Object yang akan ada tambahkan akan ada diluar masing-masing tag yang dipilih. contoh

$("p").before("<strong>Hello</strong>");
$("p").after("<strong>Hello</strong>");
$("span").insertAfter("#conto");
$("span").beforeAfter("#conto");

Insert kesekitar object.

Mereplace object. Kita dapat mengganti isi dari object dengan syntax ini. contoh

 $("button").click(function () {
      $(this).replaceWith("<div>" + $(this).text() + "</div>");
    });
 
</div>

Menghapus object. kita dapat menhapus object tertentu. contoh

 $("button").click(function () {
      $("p").empty();
    });
 
   $("button").click(function () {
      $("p").remove();
    });
</div>

Mengopi object. Mengopi object ke tempat lain . contoh
1 2

$("b").clone().prependTo("p"); </div>

Senin, 27 Agustus 2012

Array dalam PHP

Array adalah kumpulan List

variabel dalam PHP tidak usah didefinisikan, namun bisa langsung ditulis
array ada 1 dimensi ada juga 2 dimensi
contoh array 1 dimensi
$a[1]="aku";
$a[2]="kamu";

contoh array 2 dimensi
$b[1][1]="Anu";

Berikut kutipan array dari http://www.w3schools.com

What is an Array?

A variable is a storage area holding a number or text. The problem is, a variable will hold only one value.

An array is a special variable, which can store multiple values in one single variable.

If you have a list of items (a list of car names, for example), storing the cars in single variables could look like this:

$cars1="Saab";
$cars2="Volvo";
$cars3="BMW";
However, what if you want to loop through the cars and find a specific one? And what if you had not 3 cars, but 300?

The best solution here is to use an array!

An array can hold all your variable values under a single name. And you can access the values by referring to the array name.

Each element in the array has its own index so that it can be easily accessed.

In PHP, there are three kind of arrays:

Numeric array - An array with a numeric index
Associative array - An array where each ID key is associated with a value
Multidimensional array - An array containing one or more arrays
Numeric Arrays

A numeric array stores each array element with a numeric index.

There are two methods to create a numeric array.

1. In the following example the index are automatically assigned (the index starts at 0):

$cars=array("Saab","Volvo","BMW","Toyota");
2. In the following example we assign the index manually:

$cars[0]="Saab";
$cars[1]="Volvo";
$cars[2]="BMW";
$cars[3]="Toyota";
Example

In the following example you access the variable values by referring to the array name and index:

$cars[0]="Saab";
$cars[1]="Volvo";
$cars[2]="BMW";
$cars[3]="Toyota";
echo $cars[0] . " and " . $cars[1] . " are Swedish cars.";
?>
The code above will output:

Saab and Volvo are Swedish cars.

Associative Arrays

An associative array, each ID key is associated with a value.

When storing data about specific named values, a numerical array is not always the best way to do it.

With associative arrays we can use the values as keys and assign values to them.

Example 1

In this example we use an array to assign ages to the different persons:

$ages = array("Peter"=>32, "Quagmire"=>30, "Joe"=>34);
Example 2

This example is the same as example 1, but shows a different way of creating the array:

$ages['Peter'] = "32";
$ages['Quagmire'] = "30";
$ages['Joe'] = "34";
The ID keys can be used in a script:

$ages['Peter'] = "32";
$ages['Quagmire'] = "30";
$ages['Joe'] = "34";

echo "Peter is " . $ages['Peter'] . " years old.";
?>
The code above will output:

Peter is 32 years old.

Multidimensional Arrays

In a multidimensional array, each element in the main array can also be an array. And each element in the sub-array can be an array, and so on.

Example

In this example we create a multidimensional array, with automatically assigned ID keys:

$families = array
(
"Griffin"=>array
(
"Peter",
"Lois",
"Megan"
),
"Quagmire"=>array
(
"Glenn"
),
"Brown"=>array
(
"Cleveland",
"Loretta",
"Junior"
)
);
The array above would look like this if written to the output:

Array
(
[Griffin] => Array
(
[0] => Peter
[1] => Lois
[2] => Megan
)
[Quagmire] => Array
(
[0] => Glenn
)
[Brown] => Array
(
[0] => Cleveland
[1] => Loretta
[2] => Junior
)
)
Example 2

Lets try displaying a single value from the array above:

echo "Is " . $families['Griffin'][2] .
" a part of the Griffin family?";
The code above will output:

Is Megan a part of the Griffin family?

Salam PHP

Jumat, 24 Agustus 2012

Mengapa PHP?

Pertanyaan yang timbul adalah mengapa menggunakan PHP tidak menggunakan bahasa pemorgraman lain untuk membuat web, berikut kelebihan PHP dikutip dari wikipedia.org

Beberapa kelebihan PHP dari bahasa pemrograman web, antara lain:
1. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak melakukan sebuah kompilasi dalam penggunaanya
2. Web Server yang mendukung PHP dapat ditemukan dimana - mana dari mulai apache, IIS, Lighttpd, hingga Xitami dengan konfigurasi yang relatif mudah.
3. Dalam sisi pengembangan lebih mudah, karena banyaknya milis - milis dan developer yang siap membantu dalam pengembangan.
4. Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling mudah karena memiliki referensi yang banyak.
5. PHP adalah bahasa open source yang dapat digunakan di berbagai mesin (Linux, Unix, Macintosh, Windows) dan dapat dijalankan secara runtime melalui console serta juga dapat menjalankan perintah-perintah system.

Tambahan lagi
6. PHP mendukung Object Oriented Programming (OOP)
7. Menggunakan PHP kita tidak dikenakan charge alias free
8. Sudah dipakai lebih dari 20juta website, situs-situs terkenal yang menggunakan php adalah facebook, wordpress dan lain sebagainya
9. Mendukung web service, library .net dan CLI (Command Line Interface)

Pertama Belajar PHP

Untuk belajar php, kita bisa menggunakan editor file text, sperti notapad, editplus dan lain sebagainya. Coba kita belajar yang paling dasar dulu, munculkan hello world

1. bikin file baru dengan notepad
2. ketikan
echo "hello world";
?>

3. Save as dengan nama latihan.php (perhatikan save as typenya pilih all files kalau menggunakan notepad). Menyimpannya didirektori root web server, kalau menggunakan xampp di folder htdocs
4. Jalankan web server, misal xampp. Buka Internet Explorer, lalu ketikan http://localhost/latihan.php pada address bar, lalu enter
5. Kita sudah bisa melihat hasilnya

Untuk panduan belajar PHP selengkapnya Anda bisa browsing ke blog yang lain atau beli buku PHP

Hubungan PHP dengan Javascript dan HTML?

Apa sih hubungan HTML, Javascript dengan PHP

semua bahasa pemrograman web, namun untuk belajar PHP sebaiknya Anda belajar yang namanya HTML dan Javascript.

HTML dan javascript adalah bahasa pemrograman client side. Opo toh maksude, inyong ora mudeng client side..

Maksudnya html dan javascript dikenali oleh browser komputer Anda, misal Anda menggunakan Internet Explorer, maka Anda dapat menulis sintax html lewat notepad lalu save dengan extention html lalu buka pake Internet Explorer, jalankan..

Browser hanya mengenali sintax Html, CSS dan Javascript atau VBscript(khusus IE)

sintax tersebut dibaca oleh browser lalu ditampilkan dalam bentuk Web

Lalu apa gunanya PHP?

PHP ditaruh diserver, lalu oleh web server diproses dan hasilnya diterjemahkan menjadi HTML, CSS dan Javascript lalu dikirim via Internet ke Komputer Anda, browser Anda menangkapnya lewat url, sudah dalam bentuk HTML, CSS atau Javascript dan langsung bisa dibaca dan dapat langsung Anda lihat. Jadi yang dikirim via Internet itu HTML, CSS dan Javascriptnya hasil dari web server.

Kalo belum paham... begini bagannya

Kamis, 23 Agustus 2012

Instalasi PHP

bagi para pemula mungkin masih ada yang bingung dan mulai dari mana saya belajar php, bagaimana cara menginstallnya
Untuk menginstall Php yang dibutuhkan adalah
1. web server, bisa apache, xitami atau IIS
2. Modul Php
3. Database server, yang paling banyak digunakan adalah Mysql

Lalu bagaimana menyambungkan webserver, modul php dan databasenya? kalo dulu memang susah krn harus menyambungkan satu persatu atau harus dikonfigurasi.

Namun sekarang sudah banyak paket installer yang membundle 3 jenis tersebut, yaitu web server, php dan mysql server
contoh paket yang sudah terkenal adalah phptriad dan xampp

disini dibahas instalasi dengan menggunakan xampp.
1. download xampp
2. Install Xampp, misal ditaruh di C:
3. Jalankan Xampp, lewat start menu atau manual ke explorer lalu ke C:\xampp\xampp.exe

Sampeyan bisa langsung mengetesnya, apakah instalasi berhasil apa nggak, dengan masuk internet explorer, pada address ketikan http://localhost
jika yang muncul adalah tampilan xampp, maka instalasi anda berhasil, jika tidak muncul apa-apa malah muncul the page cannot display maka instalasi belum berhasil, coba lagi instalasinya

Dimanakah menulis program phpnya? tenang, sabar dulu om. Anda dapat menuliskan program php di folder C:\xampp\htdocs
disitu kita bisa buat folder dulu lalu diisi dengan file php. Untuk menulis kode program php kita bisa menggunakan editor file text seperti notepad, editplus, notepadplus dan lain sebagainya, lalu simpan di folder C:\xampp\htdocs\namafolderyangandainginkan\

gak perlu dikompile yah? gak perlu dikompile kalo php, sampeyan bisa langsung melihat hasilnya di browser, misalnya tadi kita menulis dan mengesave file dengan nama latian.php difolder C:\xampp\htdocs\coba maka kita bisa memanggilnya dibrowser dengan mengetikan
http://localhost/coba/latian.php

Rabu, 22 Agustus 2012

Aplikasi Web vs Aplikasi Desktop

Sebelum membahas aplikasi web vs aplikasi desktop kita harus tau apakah sih aplikasi web dan apakah sih aplikasi desktop?

Aplikasi Desktop adalah aplikasi yang harus diinstall di suatu device komputer. Aplikasi Desktop biasanya hanya jalan disuatu platform misalnya aplikasi dekstop windows tidak bisa dijalankan di linux. Aplikasi yang diinstall di android tidak bisa dijalankan diwindows. Kelebihan aplikasi desktop atau aplikasi client adalah lebih user friendly, lebih mudah untuk akses device / perangkat keras device, relatid lebih secure. Aplikasi Desktop juga bisa bersifat online, contoh aplikasi forex seperti metatrader merupakan aplikasi desktop yang langsung terhubung ke server forex di dunia maya. Kekurangan aplikasi desktop/client tidak bisa dibuka disemua device

Aplikasi Web adalah aplikasi yang dibuka via browser. Kelebihan aplikasi web bisa dibuka dari device computer apapun termasuk smartphone, blackberry, ipad, android phone bahkan handphone yang jadul tapi sudah bisa internet dan mempunyai web browser.
kekuranganya tidak bisa langsung akses ke device hardware maupun sistem client.
Aplikasi web bisa dijalankan dilokal dengan cara membuka browser dan memanggilnya dengan alamat http://localhost atau dijaringan lokal dengan memanggil http://ipserver atau lebih umum dipasang di internet.

Salam PHP

PHP adalah bahasa pemorgraman web yang paling banyak digunakan, keunggulan PHP adalah mudah dipelajari, menggunakan bahasa C, sudah mendukung Object Oriented Programming, Library .net, akses command, XML, JSON, Web Service.

Programmer Desktop (VB, Delphi, Foxpro) sangat dianjurkan untuk bisa menguasai juga pemrograman Web, loh kenapa? bukannya VB atau Delphi sudah bisa membuat aplikasi apapun termasuk web? Betul, namun brangkat dari aplikasi Desktop tentu beda dengan berangkat langsung dari aplikasi web. Untuk ber akrobat secara coding tentu lebih mudah dengan bahasa pemrograman web seperti PHP

PHP singkatan dari Hypertext Preprocessor. Loh kenapa kok disingkat jadi PHP bukannya PHP singkatan dari Personal Home Page??? he he tapi yang bener PHP adalah singkatan dari Hypertext Preprocessor besutan Zend, kok ga nyambung antara singkatan dengan kepanjangannya? Kalo biar nyambung mbacanya dari tengah.

Ini merupakan blog PHP kita, temen2 boleh berkomentar bebas tanpa dipungut biaya alias gratis.. dan berkonsultasi dengan programmer PHP tapi klo ada yang tidak bisa dijawab oleh moderator temen lain yang lebih ahli mohon ngasih wejangannya di blog ini

Salam PHP

Hadi Kusyanto