twitter
    join me to learn together :D

Minggu, 16 Oktober 2011

membuat blog sederhana dengan codeigniter

ok, sebelum kita praktek membuat blog sederhana ada baiknya kita membahas sedikit tentang codeigniter terlebih dahulu.

codeigniter adalah sebuah Framework yang menggunakan konsep MVC (model, view, controller), yang artinya ketika kita membuat suatu sistem, dalam pembuatannya antara tampilan(view), dan proses(disini disebut model) dibuat secara terpisah. keduanya dapat dipanggil/dikendalikan oleh controller.



mudah-mudahan penjelasan singkat tentang codeigniter ini cukup bermanfaat untuk pengenalan kita yang baru belajar mengenal codeigniter, ok... kaya'nya semua dah pada ngga sabar buat belajar membuat blog menggunakan codeigniter ya. langsung saja kita lihat dan pelajari bersama :D .


dasar:
Blog merupakan singkatan dari "web log" adalah bentuk aplikasi web yang menyerupai tulisan-tulisan (yang dimuat sebagai posting) pada sebuah halaman web umum. Tulisan-tulisan ini seringkali dimuat dalam urut terbalik (isi terbaru dahulu baru kemudian diikuti isi yang lebih lama), meskipun tidak selamanya demikian. Situs web seperti ini biasanya dapat diakses oleh semua pengguna internet sesuai dengan topik dan tujuan dari si pengguna blog tersebut.

sumber: http://id.wikipedia.org/wiki/Blog
nah, berarti yang terpenting dari blog adalah posting ya... :D , tapi dalam blog yang akan kita buat ini juga akan ditambah fitur komentar nya ya..

yang diperlukan :
-framework codeigniter (saya menggunakan codeigniter versi 2.0.2), framework ini dapat didownload di situs http://codeigniter.com/downloads/
-paket web server (saya menggunakan wamp).
-text editor (dreamweaver / notepad++ / netbean dll, tapi saya menganjurkan menggunakan notepad++).
-minuman (good day moccachino, abc mocca dll, ini penting biar ngga ngantuk :D ).

pengerjaan :
-extract codeigniter.zip nya, rename nama foldernya menjadi 'learn-ci' ,kemudian simpan di folder www(folder dalam paket webserver wamp).anda bisa check codeigniternya dengan mengakses http://localhost/learn-ci di browser, tampilan pertama akan muncul seperti halaman berikut


-buka localhost/phpmyadmin di browser anda, kemudian buat sebuah database bernama 'learn_ci' .

-buat table bernama 'posts' dengan struktur sebagai berikut.
 kemudian isi table 'posts' tersebut dengan 2 record seperti berikut :

post_id post_title post_content date_post
1 post yang petama ini isi konten post yang pertama 2011-10-10 15:19:33
2 post yang kedua ini isi konten post yang kedua 2011-10-10 15:19:59


-sekarang kita masuk ke framework codeigniternya, buka file 'database.php' di folder 'wamp\www\learn-ci\application\config'

rubah script berikut :
$db['default']['hostname'] = 'localhost';
$db['default']['username'] = '';
$db['default']['password'] = '';
$db['default']['database'] = '';
menjadi :
$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';     // username untuk connect ke database
$db['default']['password'] = '';         // password untuk connect ke database
$db['default']['database'] = 'learn_ci';// nama database
silahkan buka localhost/learn-ci dibrowser anda, jika konfigurasi database benar, maka tidak akan ada perubahan pada tampilan awal.

-buka file 'autoload.php' didalam folder 'wamp\www\learn-ci\application\config'
kemudian rubah script :
$autoload['libraries'] = array();
menjadi :
$autoload['libraries'] = array('database'); //me-load library 'database'

-buat file 'blog.php' didalam folder '/learn-ci/application/controllers/' dengan isi script sebagai berikut :
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Blog extends CI_Controller {

    public function index()
    {
        $query = $this->db->get('posts'); //query untuk mengambil data dari table posts
        $data['result']= $query->result_array(); // mengambil result $query dalam bentuk array
        $this->load->view('blog', $data); // memanggil view blog.php dan menyertakan variable $data
    }
}

/* End of file blog.php */
/* Location: ./application/controllers/blog.php */
-setelah itu buat file blog.php didalam folder 'wamp\www\learn-ci\application\views' ini adalah tampilan view dari blog kita, isi file blog.php dengan script sebagai berikut :
<html>
<head>
    <title>let's learn CI together :D</title>
</head>

<body>
<?foreach($result as $item):?>
    <h2><?=$item['post_title'];?></h2>
    <small> <?=$item['date_post']?></small><br>
    <?=$item['post_content'];?>
    <hr>
<?endforeach?>
</body>
</html>
coba buka 'http://localhost/learn-ci/index.php/blog' dibrowser anda, jika tidak ada kesalahan maka tampilannya akan seperti berikut:

ok, jika tampilannya seperti itu maka kita sudah berhasil menampilkan post-post yang sudah kita buat. tapi pertanyaannya bagaimana cara agar ketika kita mengakses url utama (dalam hal ini http://localhost/learn-ci) kita langsung mengakses halaman list blog tadi?, caranya kita buka file 'route.php' dalam folder 'www\learn-ci\application\config' kemudian rubah script
$route['default_controller'] = "welcome";
menjadi :
$route['default_controller'] = "blog"; // menjadikan controller blog.php menjadi default
 jika scriptnya benar, ketika kita membuka http://localhost/learn-ci di browser, maka akan langsung menampilkan list post yang sebelumnya ada di url http://localhost/learn-ci/index.php/blog

ok, selanjutnya kita akan membuat fitur add post.
kita rubah file blog.php dalam folder controller
tambahkan script:
    function add_post(){
        if($this->input->post('do_post')=='do post'){
            $data = $this->input->post('data'); // mengambil data dari inputan
            $data['date_post']= date('Y-m-d h:i:s'); // mendefinisikan variable waktu
            //print_r($data);exit;
            if($this->db->insert('posts',$data)){
            echo "<b>Post sudah dibuat</b>";
            }
        }
       
        $this->load->helper('form');
        $this->load->view('add_post');       
    }



kemudian buat file add_post.php didalam folder 'view'. isi scriptnya seperti dibawah ini:
<html>
<head>
    <title>create new post</title>
</head>
<body>
<h1>create new post</h1>
<?=form_open('blog/add_post');?>
title : <br>
<input type="text" name="data[post_title]"><br>

post content : <br>
<textarea name="data[post_content]"></textarea><br>

<input type="submit" value="do post" name="do_post">

<?=form_close();?>
</body>
</html>

 jika script sudah benar maka ketika kita mengisi kontent akan ada tulisan 'Post sudah dibuat'.
sekian dulu dari saya, mohon maaf karena untuk comment belum saya buat karena terlalu panjang untuk dibahas disini, semoga teman-teman menjumpai error dalam pengerjaannya :D (untuk pembelajaran), dan semoga teman-teman juga tidak puas dengan artikel saya agar mau mencari lebih banyak referensi untuk pembelajaran.

jika ada yang mau bertanya atau menambahkan saya persilahkan, karena disini saya bukan menggurui, tetapi saya mengajak untuk belajar bersama.. keep learn with me :D

9 komentar:

  1. thx gan untuk infonya..

    gue jg baru blajar CI nih,,
    kalo bisa lanjutin dengan fitur comment nya donk gan..biar lengkap..

    BalasHapus
  2. untuk fasilitas commentnya sudah saya buat artikelnya disini gan,
    http://ithobari.blogspot.com/2011/10/membuat-fasilitas-komentar-pada-blog.html

    jangan lupa komen2 lagi ya gan..
    :D

    BalasHapus
  3. aku kok ga bisa ya :(
    udah ngikutin semua step2nya, tapi kalo dijalanin gak muncul apa2 =.= halamannya kosong

    mohon bantuannya dong :(

    BalasHapus
    Balasan
    1. untuk mba evita, mba menggunakan CI versi berapa ya??

      Hapus
  4. Menggunakan CodeIgniter_2.1.3

    Ada error seperti ini . .


    A PHP Error was encountered

    Severity: Notice

    Message: Undefined variable: item

    Filename: views/blog.php

    Line Number: 8


    A PHP Error was encountered

    Severity: Notice

    Message: Undefined variable: item

    Filename: views/blog.php

    Line Number: 9


    A PHP Error was encountered

    Severity: Notice

    Message: Undefined variable: item

    Filename: views/blog.php

    Line Number: 10

    BalasHapus
  5. mas aku kok fitur add post ya gak keluar ya?
    yang keluar tampilang awal yang blog doang!

    BalasHapus