Categories

Manufacturers

  • Join Our Community
  • Follow us
  • Join Our Community

Membuat Website dengan CodeIgniter Part 1

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 :

  1. Anda paham CodeIgniter Basic, paham logika penggunaannya secara dasar. Jika belum, silakan baca seri ‘Simple Tutorial CodeIgniter’ di web ini.
  2. 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). File ini disimpan pada folder application/views/.

<?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.




HomeHome

Cart  

(empty)

Special Price

All special price