Merancang Website Dengan CodeIgniter

code_igniterOK hari ini kembali ke my hobby, mengotak atik sesuatu di komputer di luar kegiatan rutin dan topik riset. Hari ini saya ingin menuliskan apa yang saya pelajari pagi ini yaitu tentang merancang web menggunakan CodeIgniter Framework. CodeIgniter (CI) adalah aplikasi web framework open source Model–view–controller (MVC). Dengan menggunakan CodeIgniter pengembangan website dapat dengan cepat dilakukan dibandingkan semua code diprogram dari awal. Jika anda belum paham tentang MVC dapat merujuk pada keterangan pada link berikut.

Ini merupakan tutorial dasar sekali dalam membuat website menggunakan CodeIgniter. Ok kita mulai dengan menginstal CodeIgntiter pada server lokal atau localhost di komputer sendiri. Untuk membuat localhost kali ini saya menginstal software Xampp control panel. Anda dapat mendownloadnya secara gratis di internet atau bisa di download dari page download yang ada di blog saya ini. Setelah anda menginstal Xampp selanjutnya anda download CodeIgniter (cek linknya di halaman download blog ini).

Sekarang kita masuk pada tahap menginstal CodeIgniter

1. Buat folder website anda di dalam folder htdocs xampp, nama folde akan digunakan untuk memanggil web anda di browser. Contoh dalam tutorian ini saya membuat folder dengan nama framework

2. Ekstrak CodeIgniter yang sudah anda download tadi dan kopikan isinya semua (file dan folder) kedalam folder framework yang sudah kita buat.

3. Untuk menginstal CI sangat gampang cukup dengan melakukan beberapa setingan.

Buka file config.php dalam folder application/config/config.php dan edit menggunakan notepad. Set URL kira-kira seperti ini

$config[‘base_url’] = ‘localhost/framework’;

4. Konfigurasi file database application/config/database.php dan masukan setingan data base anda. Pastikan anda sudah membuat data base pada http://localhost/phpmyadmin, dalam tutorial ini saya membuat database dengan nama frameworkdb. Sehingga konfigurasi database.php akan seperti berikut

$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "";
$db['default']['database'] = "frameworkdb";
$db['default']['dbdriver'] = "mysql";
$db['default']['dbprefix'] = "";
$db['default']['pconnect'] = TRUE;
$db['default']['db_debug'] = FALSE;
$db['default']['cache_on'] = FALSE;
$db['default']['cachedir'] = "";
$db['default']['char_set'] = "utf8";
$db['default']['dbcollat'] = "utf8_general_ci";
$db['default']['swap_pre'] = "";
$db['default']['autoinit'] = TRUE;
$db['default']['stricton'] = FALSE;

5. Selanjutnya buat sebuah file blog.php dan simpan dalam folder application/controllers/, file ini berfungsi untuk mengontrol tampilan web anda nantinya, sebagian contoh ketik dalam notepad (pastikan tulisan Blog diawali dengan huruf besar)

<?php
class Blog extends CI_Controller {

public function index()
{
echo ‘Hello, Assalamualaikum!’;
}
}
?>

6. Ketik http://localhost/framework/index.php/blog di browser anda maka akan tampil halam berikut

install2

7. Tapi tampilan blog anda belum berada di halam utama, untuk membuat blog tampil sebagai halaman utama rubah setingan dalam file routes.php di application/config/routes.php

$route[‘default_controller’] = “welcome“;     rubah kata welcome menjadi blog $route[‘default_controller’] = “blog”;

Sekarang jika anda ketik di browser http://localhost/frameworkotomatis halam blog akan tampil di depan.

8. Sekarang kita lanjutkan ke view. View adalah untuk menyederhakan halaman web, atau untuk membagi halam web jadi beberapa bagian seperti header, footer, sidebar dan sebagainya.  Atau lebih jauh ini akan menjadi pengatur tampilan theme blog yang akan dibuat. Lankah berikut hanya menunjukan cara membuat file view. Buat file blogview.php dan simpan di folder application/views/   sebagai contoh

<html>
<head>
<title>My Blog</title>
</head>
<body>
<h1>Selamat datang di blog saya !</h1>
</body>
</html>

9. Untuk menampilkan halaman blogview harus dipanggil dari halaman blog.php, Modifikasi code pada blog.php tadi menjadi

<?php
class Blog extends CI_Controller {

function index()
{
$this->load->view(‘blogview’);
}
}
?>

Klik di browser http://localhost/framework, dan anda akan lihat tampilan berikut

install3

Perbedaan kali ini adalah informasi yang di tampilkan tidak lagi di blog.php tapi sudah dari blogview.php, Sekarang blog.php menjadi kontrol untuk web

Sementara sampai di sini dulu sudah lapar, hampir lupa makan siang..pada tutorial berikutnya akan kita bahas cara membuat dynamic content.

Semoga bermanfaat

By Yohandri

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

%d bloggers like this: