Kamis, 15 Desember 2011

Membuat Login pada framework CodeIgneter

Konsep dasar dari Login adalah mencocokkan username dan password yang dimasukkan oleh user dengan daftar username+password yang tersimpan dalam database. Dengan alasan keamanan, biasanya password disimpan dalam database dengan menggunakan fungsi MD5. MD5 adalah salah satu fungsi hash (satu arah) yang cukup terkenal dalam kriptografi, biasa digunakan untuk autentifikasi user. Sedangkan Logout memiliki konsep dasar yang cukup sederhana, yaitu dengan men-destroy session dari user yang login tersebut.

Step 1 : Konfigurasi CI

Buka file config.php yang berada dalam folder system-application-config-config.php
Ubah base url, sesuaikan dengan lokasi dimana folder CI berada (tempat ekstrak-an).
Contoh: Folder CI berada dalam folder www/ci maka ubah baris $config['base_url']="http://example.com/";
dengan
$config['base_url'] = "http://localhost/ci/";

Setting database.
Buka file database.php yang berada dalam folder yang sama dengan config.php. Ubah hostname, username, password, dan nama database. Sesuaikan dengan pengaturan mysql.
Contoh :
$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "";
$db['default']['database'] = "db_tutorial";


Step 2 : Siapkan Database

1.Buat database dengan nama db_tutorial (via phpmyadmin)
2.Siapkan tabel dengan nama tb_user misalkan ada 3 field: userid, isername, dan userpass.
3.Insertkan beberapa sample data untuk user yang akan login. misalkan username: june
INGAT : ketika memasukkan password, pilih fungsi MD5.
4.Maka hasil dari insert sample data (dengan password dikenai fungsi MD5) adalah misalnya username : june, userpass nya jadi :11501255f17710952e79563ddc0904ad


Step 3 : Membuat Form Login (view)
Ketikkan script berikut,


(Simpan dengan nama login_view.php, dalam folder system-application-views)


Step 4 : Membuat Controller Pemrosesan Login + Logout

class Login extends Controller {
function login() {
parent::Controller();
$this->load->helper('url');
$this->load->helper('form');
$this->load->library('form_validation');
$this->load->library('session');
}

function index() {
$this->load->view('login_view');
}
//login process
function proseslogin() {
$username = $this->input->post('username');
$password = $this->input->post('password');
$passwordx = md5($password);
$q = $this->db->query("SELECT * FROM tb_user WHERE username='$username' AND userpass='$passwordx'");

if ($q->num_rows() == 1) {
$nama = $q->row()->username;
$this->session->set_userdata('username',$nama);
$data['welcome'] = "Welcome $nama";
$this->load->view('welcome_view', $data);
}
else {
// query error
$data['error']='!! Wrong Username or Password !!';
$this->load->view('login_view', $data);
}
}
//logout process
function logout() {
$this->session->sess_destroy();
$data['logout'] = 'You have been logged out.';
$this->load->view('login_view', $data);
}
}
?>

(Simpan dengan nama login.php dalam folder system-application-controllers)


Step 5 : Membuat tampilan sukses login (view)
Ketikan script berikut,

Login with CI


(Simpan dengan nama welcome_view.php dalam folder system-application-views)


Step 6 : Testing Code
1.Buka browser, pergi ke http://localhost/namaFolderCI/login
2.Akan muncul tampilan seperti dibawah,

Login with CI

Username
Password

3.Masukkan username+password yang benar, yaitu yang ada didatabase (username : june, password : june)
4.Maka anda akan diarahkan menuju halaman sukses login, yaitu halaman welcome seperti dibawah,


5.Klik logout untuk keluar dari halaman welcome.
6.Sekarang masukkan username+password salah (misal username : admin, password : admin)
7.Maka akan ditampilkan warning seperti gambar dibawah.

Rabu, 14 Desember 2011

M V C (Model View Controller)

Model View Controller atau MVC adalah sebuah metode untuk membuat sebuah aplikasi dengan memisahkan data (Model) dari tampilan (View) dan cara bagaimana memprosesnya (Controller). Dalam implementasinya kebanyakan framework dalam aplikasi website adalah berbasis arsitektur MVC. MVC memisahkan pengembangan aplikasi berdasarkan komponen utama yang membangun sebuah aplikasi seperti manipulasi data, antar muka pengguna, dan bagian yang menjadi kontrol dalam sebuah aplikasi web.

Aplikasi apapun, bagian dalam kode yang sering mengalami perubahan adalah bagian user interface. User interface adalah bagian yang paling terlihat oleh user dan bagaimana ia berinteraksi dengan aplikasi, membuatnya menjadi titik focus pengubahan berdasar kemudahan penggunaan. Business logic yang rumit pada user interface membuat pengubahan pada user interface menjadi lebih kompleks dan mudah terjadi kesalahan.

Perubahan pada satu bagian memiliki potensi keterkaitan dengan keseluruhan aplikasi. Pola MVC menyediakan sebuah solosi terhadap permasalahan tersebut dengan membagi aplikasi menjadi bagian–bagian tersendiri, Model, View dan Controller, memisahkan antar bagian tersebut dan membuat tata interaksi diantaranya.



3 komponen pada MVC

Bagian MVC

  1. Model, Model mewakili struktur data. Biasanya model berisi fungsi-fungsi yang membantu seseorang dalam pengelolaan basis data seperti memasukkan data ke basis data, pembaruan data dan lain-lain.
  2. View, View adalah bagian yang mengatur tampilan ke pengguna. Bisa di katakan berupa halaman web. Layer ini mengandung keseluruhan detail dari implementasi user interface. Disini, komponen grafis menyediakan representasi proses internal aplikasi dan menuntun alur interaksi user terhadap aplikasi. Tidak ada layer lain yang berinteraksi dengan user, hanya View. Penggunaan layer View memiliki beberapa kelebihan: Pertama, memudahkan pengabungan divisi desain dalam development team. Divisi desain dapat berkonsentrasi pada style, look & feel, dan sebagainya dalam aplikasi tanpa harus memperhatikan lebih pada detail yang lain. Dan juga, memiliki layer View yang terpisah memungkinkan ketersediaan multiple interface dalam aplikasi. Jika inti dari aplikasi terletak pada bagian lain (dalam Model), multiple interfaces dapat dibuat (Swing, Web, Console) secara keseluruhan memiliki tampilan yang berbeda namun mengeksekusi komponen Model sesuai fungsionalitas yang diharapkan.
  3. Controller, Controller merupakan bagian yang menjembatani model dan view. Controller berisi perintah-perintah yang berfungsi untuk memproses suatu data dan mengirimkannya ke halaman web. Layer ini menyediakan detail alur program dan transisi layer, dan juga bertanggung jawab akan penampungan events yang dibuat oleh user dari View dan melakukan update terhadap komponen Model menggunakan data yang dimasukkan oleh user. Kelebihan dalam penggunaan layer Controller secara terpisah: Pertama, dengan menggunakan komponen terpisah untuk menampung detail dari transisi layer, komponen view dapat didesain tanpa harus memperhatikan bagian lain secara berlebih. Hal ini memudahkan team pengembang multiple interface bekerja secara terpisah dari yang lain secara simultan. Interaksi antar komponen View terabstraksi dalam Controller. Kedua, dengan menggunakan layer terpisah yang melakukan update terhadap komponen Model, detail tersebut dihapus dari layer presentasi. Layer presentasi kembali pada fungsi utamanya untuk menampilkan data kepada user. Detail tentang bagaimana data dari user mengubah ketetapan aplikasi disembunyikan oleh Controller. Hal ini memisahkan dengan jelas antara presentation logic dengan business logic.Dengan menggunakan metode MVC maka aplikasi akan lebih mudah untuk dirawat dan dikembangkan. Untuk memahami metode pengembangan aplikasi menggunakan MVC diperlukan pengetahuan tentang pemrograman berorientasi objek (Object Oriented Programming).
Jenis MVC pada website
  • Server Side MVC, Server Side MVC biasa terjadi pada aplikasi web tradisional, yang tidak melibatkan client side seperti javascript, java applet, flash, dan lain-lain. Server Side MVC menyerahkan keseluruhan proses bisnis pada server, aplikasi pada sisi pengguna hanya dapat menerima. MVC jenis ini kadang-kadang disebut juga dengan nama Thin Client.
  • Mixed Client Side and Server Side MVC, pada Mixed Client Side and Server Side MVC 1 client tidak menggunakan model sebagai jembatan untuk melakukan komunikasi pada server, dibandingkan dengan Server Side MVC, arsitektur ini memiliki tingkat kompleksitas yang lebih tinggi karena lebih banyak komponen yang terlibat. Untuk selanjutnya arsitektur ini disebut, dengan Mixed MVC 1. Pada Mixed Client Side and Server Side MVC 2, client menggunakan model sebagai jembatan untuk melakukan komunikasi pada server, dibandingkan dengan arsitektur MVC yang lain, arsitektur ini memiliki tingkat kompleksitas yang paling tinggi karena lebih banyak komponen yang terlibat, sehingga membutuhkan sumber daya yang lebih besar pula. Untuk selanjutnya arsitektur ini disebut dengan Mixed MVC 2.
  • Rich Internet Application MVC, Application MVC Rich Internet Application (RIA) disebut juga dengan nama Fat Client, merupakan aplikasi web yang memiliki kemampuan dan fungsi hampir seperti aplikasi dekstop. RIA pada sisi client, memiliki mesin untuk mengambil data yang berada pada server, sehingga pada client terdapat bagian MVC sendiri dan hanya membutuhkan bagian model pada sisi server.