Ketika membuat aplikasi satu halaman kita harus menggunakan beberapa jenis framework untuk melakukan beberapa pekerjaan bagi kita, sehingga kita bisa fokus pada fungsi yang sebenarnya. AngularJS cocok untuk hal ini, karena fitur seperti injeksi ketergantungan dinamis dan data bi-directional sudah didukung olehnya. Kadang-kadang kita juga memerlukan beberapa jenis server. Jika Anda telah memilih PHP maka Laravel mungkin pilihan terbaik Anda, karena mudah untuk bekerja dengannya dan cukup kuat.


Perkenalan

Dalam tutorial ini Anda akan membuat sistem manajemen pelanggan / transaksi sederhana dengan kemampuan untuk menambah dan menghapus keduanya. Ini mungkin bukan jenis hal yang sering anda buat, tapi itu bisa menunjukkan bagaimana menggunakan fitur dari kedua framework itu.

Sebelum kita mulai Anda harus men-setup database MySQL yang akan kita gunakan (Laravel mendukung lebih banyak dari itu, tetapi ini masih yang paling populer). Anda tidak perlu server web karena kita akan menggunakan built-in php (tapi tolong diingat, bahwa solusi ini hanya untuk developmen dan tidak boleh digunakan dalam produksi – PHP tidak memiliki banyak fitur yang diperlukan untuk app Anda untuk bekerja dengan baik di depan umum). Untuk itu, kita akan membutuhkan setidaknya PHP versi 5.4.0.


Persiapan

Hal pertama yang harus kita lakukan adalah menginstal Laravel. Proses lengkap dijelaskan di Website Laravel itu. Setelah itu, Anda harus memiliki direktori proyek Anda yang dibuat dengan semua file Laravel di sana. Arahkan ke direktori tersebut dalam baris perintah dan jalankan perintah ini:

php artisan serve

Jika semua berjalan Lancar, Anda akan melihat bahwa server development dimulai pada locahost:8000. Buka browser Anda dan arahkan kesana, Anda akan melihat halaman selamat datang Laravel ini:

first_run

Sekarang kita bisa memproses aplikasi yang sebenarnya.


Migrasi dan Model

Model di laravel adalah seperti di kebanyakan framework MVC lainnya. Ia menggunakan Eloquent ORM untuk mempermudah pekerjaan kamu – kamu mungkin tidak perlu menulis query sql lagi (kecuali kamu menginginkan sesuatu yang belum didukung oleh Eloquent ORM). Menggunakan migrasi kemu bisa mengubah struktur basisdata dengan kemampuan untuk mengembalikan perubahan jika suatu kesalahan terjadi. Kamu bisa membaca tentang migrasi lebih lanjut di dokumentasi laravel.

Di aplikasi kita ini, kita akan menggunakan 2 model :

  • Custormer – Yang akan menangani data pelanggan
  • Transaction – yang akan menangani informasi transaksi

Mari mulai dengan membuat migrasi untuk mereka. Jika kamu belum melakukannya, matikan server yang kita jalankan sebelumnya (Ctrl + C).

Pelanggan

Pertama, jalankan perintah ini:

php artisan migrate:make create_customers_table

Ini akan membuat file migrasi dengan struktur dasar untukmu. Sekarang arahkan ke app/database/migrations. Disana seharusnya ada sebuah file yang namanya diawali dengan timestamp dan diakhiri dengan “create_customers_table“. Laravel otomatis membuat struktur dasar ini untukmu. Method up() dipanggil ketika migrasi diterapkan, dan method down() dipanggil ketika migrasi di roll back (dibatalkan).

Pertama panggil method Schema::create(). Ini akan memerlukan dua argumen – nama schema dan fungsi callback:

Schema::create('customers', function ($table) {

Callback dieksekusi ketika tabel dibuat. Objek tabel dilewatkan sebagai variabel $table dan kita memanipulasi strukturnya menggunakan objek ini. Mari kita tambahkan field id auto-increment:

   $table->increments('id');

Selanjutnya disini ada 3 field string untuk nama depan pelanggan, nama belakang pelanggan dan email:

   $table->string('first_name');
   $table->string('last_name');
   $table->string('email')->unique();

Kita membuat field email unik dengan memanggil method unique() padanya.

Method terakhir adalah untuk timestamps:

$table->timestamps();
});

Ini akan membuat dua field dalam schema:  <code>created_at</code> dan <code>updated_at</code>. Ini akan digunakan oleh Eloquent untuk menyimpan waktu ketika item dibuat dan diperbarui.

Akhirnya, kode tersebut seharusnya tampak seperti ini:


public function up() {
   Schema::create('customers', function ($table) {
      $table->increments('id');
      $table->string('first_name');
      $table->string('last_name');
      $table->string('email')->unique();
      $table->timestamps();
   });
}

Method down() lebih ringkas – ini hanya akan menghapus schema:

public function down() {
   Schema::drop('customers');
}

Transaksi

Kodenya disini akan mirip dengan kode customer sebelumnya. Pertama jalankan perintah ini:

php artisan migrate:make create_transactions_table

Sekarang arahkan ke file di dalam app/database/migrations dan bukalah file itu. Seperti sebelumnya, dimulai deri membuat schema:

Schema::create('transactions', function ($table) {

Sekarang tambahkan field id, nama transaksi, harga dan id pelanggan yang terkait dengannya:

$table->increments('id');
$table->string('name');
$table->float('amount');
$table->integer('customer_id');

dan tentu saja timestamp:

$table->timestamps();
});

Kode akhirnya akan tampak seperti ini:

public function up() {
   Schema::create('transactions', function ($table) {
      $table->increments('id');
      $table->string('name');
      $table->float('amount');
      $table->integer('customer_id');
      $table->timestamps();
   });
}

Dan sekarang method down():

public function down() {
Schema::drop('transactions');
}

Konfigurasi Database

Sekarang sebelum kamu menerapkan migrasinya kamu harus mengatur koneksi ke database. Buka file app/config/database.php dan pergilah ke baris 55. Disinilah konfigurasi data untuk MySQL (terdapat beberapa yang lain disini, contohnya kamu bisa menggunakan SQLite atau Postgres):

Setelah kamu mengisinya, kamu bisa melanjutkan. Pastikan kamu menyimpan file dan menjalankan perintah dari direktori utama aplikasi (dengan file <code>artisan</code> didalamnya):


php artisan migrate

Dan selesai. Jika tidak ada error, itu berarti tabel telah berhasil dibuat. Kamu bisa menghubungi database untuk menggunakannya, sebagai contoh, menggunakan phpMyAdmin untuk mengeceknya secara manual jika kamu memerlukannya.

Model

Di Laravel, membuat model setelah kemu mengkonfigurasi database menggunakan migrasi benar-benar cepat. Arahkan ke app/models dan hapus contoh didalamnya User.php. Sekarang buat dua file bernama Customer.php dan Transaction.php.

Mari mulai dengan Customer.php. Setiap model di Laravel telah meng-extend class Eloquent:

class Customer extends Eloquent {

Sekarang kita akan mendefinisikan hubungan antara pelanggan dan transaksi mereka. Hal ini dilakukan dengan mendefinisikan method public dalam model dengan nama properti yang ingin kita miliki di dalamnya (dalam hal ini transactions):

public function transactions() {

Sekarang didalam tubuh fungsi transactions hanya ada satu baris:

     return $this->hasMany('Transaction');
   }
}

Ini akan memberitahu Eloquent bahwa ia harus menyediakan semua transaksi dengan customer_id sebagai nama properti di tabel transactions yang mereferensi ke tabel customer.

Sekarang kita akan melakukan hal yang sama untuk transactions, tapi kita akan membalik hubungan agar pemilik transaksi bisa diakses melalui properti customer.

class Transaction extends Eloquent {
   public function customer() {
      return $this->belongsTo('Customer');
   }
}

Ini dilakukan menggunakan method $this->belongsTo() pada model.


Controller

Sekarang untuk benar-benar menggunakan model kita harus membuat kontroller untuknya. Silahkan menuju direktori app/controllers, hapus file HomeController.php – file BaseController.php penting sebagai kontroller yang akan kita extends darinya. Sekarang buatlah dua file: CustomerController.php dan TransactionController.php.

CustomerController

Kontroller ini akan menangani semua yang berhubungan dengan pelanggan - menambah, menghapus dan menampilkan daftar pelanggan. Mulailah dengan mendefinisikan classnya:

class CustomerController extends BaseController {

Kita akan menggunakan fitur Laravel bernama RESTful controllers itu. Ini membuat membuat rute lebih mudah karena kita hanya perlu menentukan basis URI dan Laravel akan menangani segala sesuatu bagi kita. Hal ini mengharuskan Anda untuk memulai nama fungsi dengan HTTP kata kerja yang sesuai dan kemudian melanjutkan dengan nama subroute (menggunakan CamelCase). Jadi misalnya, jika kita akan memiliki metode bernama getNames dan basis URI-nya /customers, maka metode ini akan dapat diakses di /customers/names .

getIndex(), postIndex(), deleteIndex() dan lain-lain. Method ini akan di route ke default route (dalam kasus ini /customers).

Sekaran mari kita buat route pertama - mendapatkan data pelanggan berdasarkan id-nya:

public function getIndex() {

Mari kita dapatkan id dari parameter query (Laravel menyediakan class Input untuk menangani ini, jadi kamu tidak perlu menggunakan $_GET, $_POST dan $_FILES):

$id = Input::get('id');

Dan cari pelanggan di database menggunakan id ini:

   return Customer::find($id);
}

Setiap method di kontroller mengembalikan nilai string atau memiliki method __toString(). Dalam kasus ini model Customer yang dikembalikan akan dikonversikan ke JSON sebelum dikirimkan.

Sekarang kembalikan semua data pelanggan (bisa diakses melalui /customers/all):

public function getAll() {
   return Customer::all();
}

Seperti yang kamu lihat, kita bisa mendapatkan semua pelanggan menggunakan method all() pada model. Sekarang, bagian yang paling panjang, menambahkan pelanggan baru:

public function postIndex() {

Pertama mari kita cek apakah semua informasi yang dibutuhkan telah disediakan. Kita bisa menggunakan method Input::has() :

if (Input::has('first_name', 'last_name', 'email')) {

Mari kita taruh semua field input di variabel $input agar tidak perlu memanggil Input::get() lagi dan lagi. Ini bisa dilakukan dengan menggunakan Input::all():

$input = Input::all();

Berikutnya kita cek jika ada input yang kosong. Jika ada, kita akan mengembalikan error HTTP 400 Bad Request dengan pesan yang lebih jelas:

if ($input['first_name'] == '' || $input['last_name'] == '' || $input['email'] == '') {
   return Response::make('You need to fill all of the input fields', 400);
}

Karena kami ingin mengembalikan kode status lainnya dari 200 bukan hanya mengembalikan pesan sebagai string, kita menggunakan Response::make(), yang mengambil data untuk dikirim sebagai parameter pertama dan status kode sebagai yang kedua. Lihatlah di docs jika Anda ingin tahu lebih banyak tentang respon.

Sekarang akhirnya kita membuat model Customer baru dan mengisinya dengan data yang disediakan:

$customer = new Customer;
$customer->first_name = $input['first_name'];
$customer->last_name = $input['last_name'];
$customer->email = $input['email'];

Setelah itu kita bisa menyimpan model yang baru saja dibuat dan memberikan respon untuk permintaan yang dibuat:

$customer->save();
 
return $customer;

Disini kita menangani kasus jika tidak semua input disediakan:

} else {
      return Response::make('You need to fill all of the input fields', 400);
   }
}

Akhirnya, kita juga membutuhkan kemampuan untuk menghapus data pelanggan. Yang satu ini sangat pendek:

public function deleteIndex() {

Kita memulainya dengan mendapatkan id pelanggan untuk menghapusnya:

$id = Input::get('id');

Selanjutnya, kita mencari dan menghapus data pelanggan:

$customer = Customer::find($id);
$customer->delete();

Setelah itu, kita merespon permintaan dengan id yang diberikan:


      return $id;
   }
}

Sekarang sebelum rute dapat diakses, kita harus menghubungkan mereka. Buka file app/routes.php, hapus semua dengan membuatnya sebagai komentar dan tambahkan baris ini di akhir file:

Route::controller('/customers', 'CustomerController');

Ini akan memberitahu Laravel untuk merute semua permintaan di /customers ke CustomerController. Sekarang Anda dapat menggunakan CURL untuk bermain dengannya. Pertama jalankan server dengan php artisan serve dan kemudian Anda dapat, misalnya, membuat pelanggan:

curl -X POST -d "first_name=Jane&last_name=Doe&email=jdoe@gmail.com<script type="text/javascript">
/* <![CDATA[ */
(function(){try{var s,a,i,j,r,c,l,b=document.getElementsByTagName("script");l=b[b.length-1].previousSibling;a=l.getAttribute('data-cfemail');if(a){s='';r=parseInt(a.substr(0,2),16);for(j=2;a.length-j;j+=2){c=parseInt(a.substr(j,2),16)^r;s+=String.fromCharCode(c);}s=document.createTextNode(s);l.parentNode.replaceChild(s,l);}}catch(e){}})();
/* ]]> */
</script>" http://localhost:8000/customers

Kemudian kamu bisa mendapatkan semua data pelanggan:

curl http://localhost:8000/customers/all

TransactionController

Ini, seperti model adalah mirip dengan CustomerController. Pertama buat class:

class TransactionController extends BaseController {

Kemudian mari definisikan method untuk mendapatkan semua transaksi dari pelanggan:

public function getIndex() {
   $id = Input::get('id');
   return User::find($id)->transactions;
}

Seperti yang Anda lihat kita menggunakan hubungan yang telah didefinisikan sebelumnya untuk mendapatkan transaksi (sekarang panggil ulang query yang telah kamu tulis untuk mendapatkan hal yang sama menggunakan php dan sql murni).

Hal berikutnya akan menambahkan transaksi:

public function postIndex() {

Seperti sebelumnya, kita mengecek semua informasi yang dibutuhkan apakah telah disediakan:

if (Input::has('name', 'amount')) {

Jika sudah, masukkan nilainya ke variabel $input:

$input = Input::all();
[\code]

Periksa jika ada nilai yang disediakan kosong dan jika memang ada kembalikan error:


if ($input['name'] == '' || $input['amount'] == '') {
   return Response::make('You need to fill all of the input fields', 400);
}

Sekarang kita buat transaksi dan isi dengan semua info yang disediakan:

$transaction = new Transaction;
$transaction->name = $input['name'];
$transaction->amount = $input['amount'];

Sekarang kita perlu menambahkannya ke pelanggan yang tepat. Mari kita menemukan mereka dengan id yang disediakan dan tambahkan $transaction ke daftar transaksi mereka:

$id = $input['customer_id'];
User::find($id)->transactions->save($transaction);

Hal ini dilakukan dengan menggunakan method transactions->save() yang disediakan oleh Laravel. Sekarang kita bisa merespon dengan transaksi yang dibuat:

return $transaction;

Dan tangani kasus dimana tidak ada atau tidak semua data telah disedikan:

   } else {
      return Response::make('You need to fill all of the input fields', 400);
   }
}

Setelah itu ada juga metode untuk menghapus transaksi dengan cara yang sama saat kita menghapus pelanggan:

    public function deleteIndex() {
      $id = Input::get('id');
      $transaction = Transaction::find($id);
      $transaction->delete();
      
      return $id;
   }
}

Dan sekarang tinggal tambahkan rute dan kamu bisa mengetes kontroller menggunkan CURL:

Route::controller('/transactions', 'TransactionController');

Kesimpulan

Baiklah, ini adalah akhir dari bagian pertama - di bagian kedua dari tutorial ini, kita akan membuat front-end menggunakan AngularJS. Jangan ragu untuk menambahkan lebih banyak fitur untuk aplikasi Anda (seperti mengedit pelanggan atau memfilter), jika Anda tidak menemukan informasi yang Anda cari, lihatlah dokumentasi Laravel.

diterjemahkan secara bebas dari : http://net.tutsplus.com/tutorials/php/building-a-customer-management-app-using-angularjs-and-laravel/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+nettuts+%28Nettuts%2B%29

Advertisements

About phpgeek programmer

pemimpi yang berharap menjadi the best programmer di zamannya

One response »

  1. Ina says:

    Adakah screen shoot- nya?
    Thanks

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s