Membuat Website dengan CodeIgniter #1
Ditulis pada 11 Dec 2008 dalam kategori Seri Tutorial Website, dibaca 4737 kali dan ditanggapi 47 kali
Setelah berpikir lama untuk mencari ide tulisan untuk web ini, akhirnya saya putuskan untuk menulis seri tutorial membuat website dengan codeigniter. Tutorial ini saya tujukan bagi pemula codeigniter yang mungkin kebingungan untuk merangkai formula CI untuk membuat sebuah web utuh. Memang CI mudah dipahami, tapi terkadang sulit untuk diaplikasikan secara menyeluruh, seperti yang saya alami dulu sewaktu pertama kali membuat web dengan CI. Saya berharap dengan dibuatnya tutorial ini, teman-teman yang kesulitan tidak menyerah di tengah jalan hanya karena kebingungan.
Sebelum saya mulai, ada beberapa requirement yang harus Anda kuasai agar dapat memahami tutorial ini, antara lain :
- Anda paham CodeIgniter Basic, paham logika penggunaannya secara dasar. Jika belum, silakan baca seri 'Simple Tutorial CodeIgniter' di web ini.
- Anda paham mysql beserta query nya.
Prepare for Localhost!
Persiapkan server localhost Anda (saya anggap Anda sudah paham caranya). Pindahkan folder CodeIgniter lengkap di root webserver Anda, silakan ganti nama folder sesuka Anda, Atur file confignya. Diantaranya yang perlu diatur adalah sbb:
config.php (system/application/config/)
$config['base_url'] = "http://localhost/namaWeb/"; //ganti dengan nama folder web Anda
database.php (system/application/config/)
$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root"; //ganti dengan username db anda
$db['default']['password'] = ""; //ganti dengan password db anda
$db['default']['database'] = "namaDb"; // ganti dengan nama database yang anda gunakan untuk web anda (harus sudah ada, buat kosongan dulu)
autoload.php (system/application/config/)
$autoload['helper'] = array('url'); //diperlukan untuk fungsi base_url()
route.php (system/application/config/)
$route['default_controller'] = "web"; //controller default (akan kita buat nanti)
Persiapan Template
Hal berikutnya yang perlu kita siapkan adalah template (desain web). Anda dapat membuat template sendiri atau mencari free template di internet (contoh : styleshout.com). Setelah mendapatkan yang cocok, definisikan/tentukan pembagian area di template Anda (biasanya file utama bernama index.html) . Saya contohkan disini adalah header, content, dan footer.
<!-- header starts here -->
<html>
<head>
<title><?= $title ?></title>
</head>
<body>
<!-- header ends here -->
<!-- content starts here -->
<div id='content'>
<?= $content ?>
</div>
<!-- content ends here -->
<!-- footer starts here -->
<div id='footer'>
Website Footer
</div>
</body>
</html>
<!-- footer ends here -->
Masing masing bagian dipisah menjadi satu file tersendiri dengan nama masing masing header.php, content.php, dan footer.php. File-file ini disimpan dalam folder views. Nantinya, file-file ini masih kita edit untuk keperluan lebih lanjut.
Membuat Controller Utama
Rencananya, controller utama ini kita gunakan untuk ditampilkan di halaman awal, yang secara default akan diload (pada route.php) jika ada orang yang membuka alamat web kita.
<?php if (!defined('BASEPATH')) exit('No direct script access allowed'); class Web extends Controller {
function Web()
{
parent::Controller();
}
function index()
{
$data['title']="Welcome to My Website"; // data untuk variabel $title
$data['content']="Ini halaman Content Awal"; // data untuk variabel $content
$this->load->view('main',$data); // load main.php (kita buat nanti) dengan beban data
}
}
Selanjutnya kita buat main.php (untuk tampilan halaman awal).
<?php if (!defined('BASEPATH')) exit('No direct script access allowed'); $this->load->view('header');
$this->load->view('content');
$this->load->view('footer');
Variabel title dan content akan diparsingkan ke view main.php. Pada main.php, terdapat load view tiga kali, dimana header berisi variabel title, dan content berisi variabel content. Hmm...sampai disini dulu, oke? Anda dapat tes web anda dengan address : http://localhost/namaWeb.
{to be continued}
What the others say?
Sampai saat ini ditanggapi 47 kali
mantab sangat,,tutorna kk...
btw, itu bikin posting teratas ama archive..d modelna gimana kk..
bahas donk...d blog na..
klo bisa skalian validasi angka d komentar ini..hehe..
plizzz.....
tengkyu b4
hihi...
klo bisa sich,,source code web ni d kirim k imel saya,,,
lg ngebet2'y blajar CI....
@opiq...
Thanks sebelumnya. Sabar ya,, nanti kita akan nyampe situ koq,, pelan-pelan ok?
Hmm, mantab bgt boss. Aku ambil semua artikel CI-nya yach. Thanks...
thanks...silakan...
nuhun pisan ya a' tutorialna...
ga bisa uyyyy!!!!
boleh dunk link donlot nya buat tiap tutorial
klo boleh langganan minta kirim ke atoey_rambo@yahoo.com
salam
@atoeyz...tolong jelaskan dimana ga bisanya ya,, so bila ada kesalahan biar dibetulin, jadi ga menyesatkan. Untuk langganan tutorial sementara saya belum bisa memenuhinya. Maaf. Thanks.
mantap,
newbie CI nih,,
tutorialnya bagus2,keren..
salam kenal.
Mkasih ya..
Sama2...lam kenal jg
makasih....for ilmunya...
mas.... kok ga jelas ya....??? di simpan di folder apa dengan name apa filnya
ex:
1. <?php if (!defined('BASEPATH')) exit('No direct script access allowed');
2. class Web extends Controller {
3. function Web()
4. {
5. parent::Controller();
6. }
7. function index()
8. {
9. $data['title']="Welcome to My Website"; // data untuk variabel $title
10. $data['content']="Ini halaman Content Awal"; // data untuk variabel $content
11. $this->load->view('main',$data); // load main.php (kita buat nanti) dengan beban data
12. }
13. }
di simpen dengan nama apa dan folder mana ya ???
Hahahaha....Derby Romero.....
Disimpan di Controller mas....
Silahkan baca
<a > Disini</a>
disini mksdnya...
http://rtahara.blogspot.com/2008/03/code-igniter-folder-structure.html
wahhh ini yang saya cari matur suwun sanget dari kemaren saya ga nemu2 je... dah bingung pake CakePHP terlalu berat thanks for tutorialnya.. kalo boleh bisa lanjutannya?
kak ajarin donk tntang CI
butuh banget...
gimana cara nya kita bisa makai CI?
tutorial ada?
nah ini dia nih yang dicari2x
saya mo nanya nih, di tutorial diatas ada tag pembuka untuk php <?php.
nah untuk tag penutupnya kok tidak ada ya??
apa di Codeigniter memang begitu???
@rio : sy pernah nanya ke master CI, katanya untuk penggunaan tag tutup PHP tidak diperlukan apabila halaman tersebut berisi kode PHP penuh...
Mas anggy, password untuk zip yg di pptik waktu itu apa sih ?
yg chating..
Thanks...
akhirnya nemuin juga web tutorial yang enak dibaca bwat newbie CI kaya saya ini.. pengen belajar CI nih.. kebiasan bikin web manual, bongkar pasang koding orang. koding jadi kaya spagetti...
oiya mo tanya neh.. web ini bikin pake CI juga apa manual?
Coz saya juga pernah bikin web pake templates ini.
thanx buat artikel2nya.. keep a good work.. izin sedot tutorial nya..
web ini pake CI kok...
keren mas webnya.. jadi pengen bikin nih.. oiya.. untuk artikel-artikel yang ada tulisan read more itu aplikasinya apa? saya pernah pake aplikasi tiny mice cuma ga ada tools untuk read more nya.. bisa dibantu gak? masih bingung nih soalya..
mas mau tanya, utk controller utama disimpan sbg web.php trus dimasukkin folder controllers ta? trus ngaksesnya localhost/nama_web atau harus pake localhost/nama_web/index.php/web (seperti d user guidenya CI) ? aq bingung mas..
mohn bantuannya yach..
@ satwika :kalo setting pada config.php Anda (default controller) diset sebagai "web", maka localhost/nama_web akan otomatis menuju ke localhost/nama_web/index.php/web
mas Anggy, saya boleh minta source web ini ga?? tolong kirim ke email donk andie.mulya.i@gmail.com
Mau tanya nh Mas Anggy... Klo cari free template di internet (contoh : styleshout.com) Setelah saya tentukan pembagian area di template, trs saya bagi ke header, content, dan footer di view.
Memang tulisannya keluar, tp gambar nya ga ada yg keluar (alias blank)..
Mau tanya--> tolong gimana nampilin gambarnya, spy bisa keluar?? Makasih bgt
Secara umum sebenarnya sama saja, antara menggunakan CI atau tidak. Kesalahan yang biasa terjadi adalah penulisan path (pada CSS)...pastikan itu benar. Tempatkan file .css di luar system, misal di folder "style"...dan gambar2 di luar system jg, misal di "images"...maka pada atribut CSS, misal background, kita tuliskan
background:#FFF url('../images/header.jpg');
good luck..
kok gag bisa yh mz???
huhuuu..apa yg salah???
Ga bisanya gimana??Bisa dipost?
itu tampilan akhirnya masi berupa tampilan biasa yg tulisannya "welcome to code igniter" yah???
trus buad templatenyah emang harus dpisah2 gt y mz, antara head, body, mah footernyah?? klo download yg gratisan gmn?? trus buad nyimpen img template dmn yh mz??
mohon bantuannyah...
mas kl maw buat tampilan dengan template tu harus dipisah2 kan ya antara head, body, ma footer.,kl ga dipisahkan bisa ga???
Kk, klo saya ga saya include semuanya langsung pada main.php tapi saya copy seluruh coding pada free template termasuk pemanggilan CSS. Jadinya tampilannya full. Tapi enak ikutin tutorial ini setelah lihat appnew. Terima kasih banget mas. Saya jadi mulai mengerti CI. Keep posting!! (Asik masih ada 4 tutorial lagi)
@derby : disimpan di direktori controllers dengan nama web.php
@wika :
Ia nih mas Anggy. Dulu pertama kali belajar PHP aku juga dipisah".. tapi seiring jalan tak biasakan ga dipisah sehingga mudah terlihat di dreamweaver (maklum pakai dreamweaver) jadi editing terasa lebih mudah, terutama soal visualisasi tampilan seperti perubahan warna dsb.
Tar klo dah selesain Tutorial, dibagi" donk.. biar bisa belajar bareng
. (Termasuk ane deh..)
mas anggy,, sy udh lama bgt nyri g nemu2.. skrg br nemu web kaka.. wah, blh dong.. mohon d bntu yah..
mas anggy,, blh ni sy d bantu.. CI nya.. sy sngt pemula...
Pada dasarnya, dipisah atau tidak itu tergantung selera masing masing...tetapi kalo boleh saya sarankan, mending dipisah aja...menghemat kerja anda...
numpang copy tutorialnya ganz... mangstab..
Do you wanna say a few words?
berbagai ekspresi saat belajar CI
calam om anggie
