-->

Membuat Project Pertama dengan Highchart menggunakan CodeIgniter

Isi objek dalam sebuah website tak hanya melulu berisi teks, dan gambar biasa saja. Ada kalanya kita memerlukan sebuah chart atau diagram untuk menyajikan sebuah data yang begitu banyak agar mudah untuk dibaca. Dalam artikel ini saya akan sedikit mengulas tahap-tahap awal yang harus kita lakukan agar dapat menyajikan sebuah diagram batang pada website. Pastikan Anda sudah menginstal CodeIgniter atau bagi yang belum menginstal CodeIgniter dapat membaca artikel sebelumnya mengenai Mengenal dan Instalasi CodeIgniter.

Dalam pembuatan apliaksi grafik cart dengan codeigniter dan highcharts, folder dinamakan sesuai dengan nama aplikasi yang akan dibuat, berikut struktur folder CI :



Di dalam folder intidashboard terdapat folder bernama assets, folder ini berisi file-file yang mendukung pembuatan dari grafik cart dimana isi dari folder tersebut adalah file highcharts, javascript, jQuery dll, berikut isi dari folder assets:



Setelah semua tersiapkan kita akan melakukan configurasi, hal-hal yang perlu kita konfigurasi adalah sebagai berikut:
Pertama, lakukan konfigurasi pada file autoload.php yang terdapat pada folder intidashboard/application/autoload.php.
Lakukan konfigurasi seperti berikut
$autoload['libraries'] = array(); 
Menjadi,
$autoload['libraries'] = array('database');
Konfigurasi tersebut bertujuan untuk meload databse, karena dalam pembuatan aplikasi ini menggunakan konsep MVC.
$autoload['helper'] = array();
Menjadi,
$autoload['helper'] = array('url');
Konfigurasi tersebut bertujuan untuk meload URL .
Kedua, lakukan konfigurasi pada file config.php yang terdapat pada folder intidashboard/application/config.php
Lakukan konfigurasi seperti berikut
$config['base_url']  = '';
Menjadi,
$config['base_url']  = 'http://localhost/intidashboard/';
base_url merupakan url paling dasar untuk mengakses web atau aplikasi.
Ketiga, lakukan konfigurasi pada file database.php yang terdapat pada folder intidashborad/application/database.php
Lakukan konfigurasi seperti berikut:



Konfigurasi tersebuat bertujuan untuk melakukan koneksi ke database. Database yang kita gunakan disini adalah Oracle.
Penjelasan :
1.  Adalah tahap konfigurasi, isikan semua sesuai dengan kebutuhan.
2.  Adalah settingan default dari CI. 

Keempat, lakukan konfigurasi pada file routers.php yang terdapat pada folder
intidashboard/application/routers.php
Lakukan konfigurasi seperti berikut
$route['default_controller'] = "welcome";
Menjadi,
$route['default_controller'] = "dashboard";

Setelah selesai melakukan konfigurasi, kita lakukan codding.
Pertama membuat controller, berikut controller pada folder intidashboard:



Controller merupakan code logic yang menghubungkan antara model dan view, seperti yang telah dijelaskan pada konsep MVC di atas.
Penjelasan :
1.  Adalah nama dari controller yang kita gunakan, dimana dalam setiap penamaan baik untuk penamaan controller, model dan maupun view harus di awali dengan huruf besar.
2.  Adalah proses memanggilan model, disini nama model yang digunakan adalah M_dashboard, pada tahap ke dua ini penjelasan dari printah syntax itu sendiri adalah me-load model dan memberikan parameter dengan menambahkan $get dan $get_v dengan memanggil function yang di buat pada model yaitu function get_all dan memasukan nama table dari database yang akan di gunakan. 
3.  Tahap ketiga adalah memberikan parameter dengan variable [‘parsing’] dan [‘parsing_1’] dimana parsing ini akan diberikan nilai dari $get dan $get_v.
4.  Tahap ini adalah untuk me-load atau memanggil view disini view yang digunakan adalah v_dashboard serta terdapat $data itu bertujuan untuk memanggil variable yang akan di eksekusi pada v_dashboard.

Kedua membuat Model, berikut model pada folder intidashboard:



Model merupakan code struktur data. Model berisi fungsi di dalam pengolahan database.
Penjelasan 
1.  Adalah penamaan dari model yang akan dibuat dan digunakan.
2.  Adalah penamaan function yang akan di panggil pada controller.
3.  Tahap  ini  adalah  printah  untuk  meload  database  yang  sudah  di  konfigurasi  sebelumnya serta mengembalikan nilai dengan printah result alas an karena kita menggunakan OOP
4.  Adalah penamaan function kedua yang diberikan nilai $db, $field
5.  Tahap  ini  adalah  printah  untuk  melakukan  pemilihan  tabel  dan  field  yang  akan  di  pilih atau digunakan.


Ketiga membuat View, berikut View dari folder intidashboard:




View  merupakan  code  untuk  menampilkan  tampilan  suta  program.  Di  dalam  view  ini  kita melakukan  pemanggilan  file-file  yang  ada  pada  folder  assets  untuk  menambahkan  tampilan grafik dari highchart dan jQuery.
Penjelasan :
1.  Adalah melakukan pemanggilan atau mengambil file jquery yang akan digunakan pada tampilan view.
1.  Adalah nama dari data yang akan melakukan pemanggilan dan yang akan menapilkan semua isi dari data yang dipanggil.
2.  Penamaan dari data yang akan ditampilkan.
3.  Adalah printah untuk memanggil atau mengabil data dari parsing yang terdapat pada controller yang telah di beri nilai sebelumnya dan memanggil field NILAI yang terdapat pada colom table yang digunakan atau di tampilkan
4.  Sama dengan tahap ke 2
5.  Sama dengan tahap ke 3
  

0 Response to "Membuat Project Pertama dengan Highchart menggunakan CodeIgniter"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel