100% menganggap dokumen ini bermanfaat (1 suara)

165 tayangan

Tutorial Codeigniter

Diunggah oleh

Maya Nasution

Hak Cipta

Format Tersedia

Unduh sebagai DOC, PDF, TXT atau baca online di Scribd

100% menganggap dokumen ini bermanfaat (1 suara)

165 tayangan

Tutorial Codeigniter

Diunggah oleh

Maya Nasution

Hak Cipta

Format Tersedia

Unduh sebagai DOC, PDF, TXT atau baca online di Scribd

Anda di halaman 1/ 53

Tutorial Codeigniter #1: Pengenalan Codeigniter untuk Pemula

PHP memiliki banyak framework, saking banyaknya kadang kita dibuat galau untuk memilih
framework.
Milih framework saja masih bingung…

…apalagi milih jodoh .

Serius!
Banyak yang masih galau memilih framework. Bahkan menghabiskan waktunya untuk
mencari perbandingan antar framework.
Daripada mebanding-bandingkan, sebaiknya kita mulai belajar salah satu framework.
Agar nanti kita bisa menyimpulkan sendiri, mana framework yang disukai dan cocok untuk
kita gunakan.
Kalau tidak cocok… ya tinggal cari dan pelajari framework yang lain.
Sia-sia donk, sudah susah belajar tapi tidak cocok.
Menurut saya:
Tidak ada yang namanya sia-sia dalam belajar. Karena kita akan mendapatkan ilmu dan
pengalaman.
Kalaupun ilmunya belum bisa diamalkan, setidaknya kita bisa mengajari orang lain.
Oke, lanjut…
Ngomong-ngomong, apa itu framework?

Framework dalam bahasa indonesia artinya kerangka kerja. Kerangka kerja untuk
membuat sesuatu (web).

Perumpamaannya mungkin bisa seperti itu.

Dengan menggunakan framework, pembuatan web akan lebih cepat dibandingkan PHP
Native. Karena kita tidak perlu membuat semuanya dari nol.
Framework sudah menyediakan fungsi, library, dan peralatan lainnya yang kita butuhkan.
Salah satu framework yang cukup populer di Indonesia adalah Codeigniter.

Apa itu Codeigniter?

Codeigniter merupakan sebuah framework PHP yang menggunakan pola desain (design
pattern) MVC (Model View Controller)1.
CodeIgniter dirilis pertama kali pada 28 Februari 2006. Versi stabil terakhir—saat tulisan ini
dibuat—adalah versi 3.1.9.
Website Codeigniter
Sedangkan Codeigniter 4 masih dalam tahap pengembangan. CI 4 adalah generasi penerus
dari CI 3 yang konsepnya lebih modern 2.
Codeigniter cocok digunakan untuk membuat aplikasi web seperti:
 Portal Berita;
 Sistem Informasi;
 Web Startup;
 Profile Company;
 eComerce;
 Blog;
 dan sebagainya.

Kelebihan Codeigniter
Ada beberapa kelebihan CodeIgniter (CI) dibandingkan dengan Framework PHP lain, 3
 Performa cepat: Codeigniter merupakan framework yang paling cepat dibanding
framework yang lain. Karena tidak menggunakan template engine dan ORM yang
dapat memperlambat proses.
 Konfigurasi yang minim (nearly zero configuration): tentu saja untuk
menyesuaikan dengan database dan keleluasaan routing tetap diizinkan melakukan
konfigurasi dengan mengubah beberapa file konfigurasi
seperti database.php atau autoload.php, namun untuk menggunakan codeigniter
dengan setting standard, anda hanya perlu mengubah sedikit saja pada file di folder
config.
 Memiliki banyak komunitas: Komunitas CI di indonesia cukup ramai, tutorialnya
pun mudah dicari.
 Dokumentasi yang lengkap: Codeigniter disertai dengan user_guideyang berisi
dokumentasi yang lengkap.
 Mudah dipelajari pemula: Bagi pemula, CI sangat mudah dipelajari. Karena CI
tidak terlalu bergantung pada tool tambahan seperti composer, ORM, Template
Engine, dll.

Contoh Website yang dikembangkan dengan Codeigniter

Salah satu website indonesia yang masih menggunakan CI hingga saat ini
adalah projects.co.id.

Membuat Project Codeigniter

Langkah-langkah yang harus dilakukan untuk membuat project CI:
1. Download Codeigniter;
2. Ekstrak CI ke htdocs.
Silahkan buka website Codeigniter untuk mendownload.
Kita akan mendapatkan sebuah file zip CodeIgniter-3.1.9.zip, ekstrak file tersebut ke
dalam c:\xampp\htdocs (XAMPP) atau /var/www/html (di Linux).

Setelah itu, ubah nama CodeIgniter-3.1.9 menjadi tokobuah.

Kenapa namanya tokobuah?

Karena pada project ini, kita akan membuat sebuah website yang menjual buah.
Sekarang coba buka: http://localhost/tokobuah/

Selamat Codeigniter sudah berhasil diinstal.

Selanjutnya, silahkan buka dengan teks editor. Lalu coba untuk mengenali struktur
direktorinya.
Saya membukanya dengan teks editor VS Code:

Mengenal Struktur Direktori Codeigniter

Ini adalah struktur direktori Codeigniter:

Tedapat dua direktori penting di dalam CI: application dan system. Selain itu terdapat juga
direktori user_guide dan beberapa file. Berikut ini penjelasannya:
1. application berisi semua kode aplikasi. Di dalam direktori inilah kita akan menulis
semua kode aplikasi kita.
2. system berisi kode-kode inti dari Codeiniter. Jangan mengubah apapun di dalam
direktori ini. Jika kita ingin upgrade versi, kita cukup me-replace direktori ini dengan
yang baru.
3. tests berisi kode untuk melakukan unit testing.
4. user_guide berisi dokumentasi codeigniter. Kita bisa menghapus direktori ini saat web
sudah jadi.
5. .editor_config berisi konfigurasi untuk teks editor.
6. .gitignore berisi daftar file dan folder yang akan diabaikan oleh Git.
7. comspoer.json adalah file yang berisi keterangan project dan keterangan library yang
digunakan. File ini dibutuhkan oleh composer.
8. contributing.md adalah file yang berisi penjelasan cara berkontribusi di proyek CI.
Kita bisa menghapus file ini, apabila web sudah jadi.
9. license.txt adalah file yang berisi keterangan lisensi dari CI.
10. readme.rst sama seperti file contributing.md file ini berisi penjelasan dan informasi
tentang project CI. Kita juga bisa menghapus file ini saat web sudah selesai.
11. index.php adalah file utama dari CI. File yang akan dibuka pertamakali saat kita
mengakses web.
Selanjutnya silahkan buka direktori application dan perhatikan direktori yang ada di sana.
 cache berisi cache dari aplikasi.
 config berisi konfigurasi aplikasi.
o autoload.php tempat kita mendefinisikan autoload;
o config.php konfigurasi aplikasi;
o constants.php berisi konstanta;
o database.php konfigurasi database aplikasi;
o doctypes.php berisi definisi untuk doctype HTML;
o foreign_chars.php berisi karakter dan simbol;
o hooks.php berisi konfigurasi hooks;
o index.html untuk mencegah direct access;
o memcached.php untuk berisi konfigurasi untuk memcached;
o migration.php konfigurasi untuk migrasi;
o mimes.php berisi definisi tipe file;
o profiler.php konfigurasi untuk profiler;
o routers.php tempat kita menulis route aplikasi;
o smileys.php berisi kode untuk emoji;
o user_agents.php berisi definisi untuk user agents.
 controller berisi kode untuk controller.
 core berisi kode untuk custom core.
 helpers berisi fungsi-fungsi helper.
 hooks berisi kode untuk script hook.
 language berisi string untuk bahasa, apabila web mendukung multibahasa.
 libraries berisi library.
 logs berisi logs dari aplikasi.
 models berisi kode untuk model.
 thrid_party berisi library dari pihak ketiga.
 views berisi kode untuk view.
 index.html file html untuk mencegah direct access.

Selamat datang di Codeigniter

Ketika membuka http://localhost/tokobuah/, kita akan mendapatkan tampilan Welcome to
Codeigniter.

Ini adalah tampilan awal yang akan kita lihat saat baru pertama instal CI.
Sebagai pemanasan, cobalah untuk mengubah teks Welcome to CodeIgniter!menjadi Selamat
datang di Toko Buah Petanikode.
Caranya:
Buka file application/views/welcome_message.php . Lalu ubah teks pada baris 71.

…dan sekarang coba reload kembali halaman http://localhost/tokobuah/.

Selamat
Ini adalah perubahan pertama yang kamu buat.
Penjelasan:
File welcome_message.php yang berada di dalam direktori viewsmerupakan file yang
bertanggung jawab untuk menampilkan sesuatu. Di sini kita bisa menuliskan kode untuk
template dan CSS.
File welcome_message.php di-load oleh sebuah controller
application/controllers/welcome.php dengan kode:

public function index()

{
$this->load->view('welcome_message');
}
Controller welcome adalah controller default yang digunakan. Hal ini bisa kita lihat pada
konfigurasi routers di application/config/routers.php.

Tutorial Codeigniter #2: MVC dan Routing, Konsep dasar CI yang Harus
Kamu Pahami

Pada tutorial sebelumnya, kita sudah belajar cara menginstal CI dan mengenal struktur
direktori dari CI.
Sekarang kita lanjut belajar tentang routing dan MVC.
Rencananya, kita akan membuat aplikasi online shop (olshop).
Namun, sebelum kita mulai membuat aplikasi dengan CI, ada baiknya berkenalan dulu
dengan kosep dasar CI.
Codeigniter adalah frameowrk yang menggunakan konsep MVC.
Apa itu MVC?
Mari kita bahas…

Mengenal Konsep MVC pada Codeigniter

MVC (Model, View, Controller) adalah sebuah pola desain (design pattern)arsitektur
pengembangan aplikasi yang memisahkan dan mengelompokan beberapa kode sesuai degan
fungsinya.1
MVC membagi aplikasi ke dalam tiga bagian fungsional: model, view, dan controller.
 Model adalah kode-kode untuk model bisnis dan data. biasanya berhubungan
langsung dengan database untuk memanipulasi data (insert, update, delete, search),
menangani validasi dari bagian controller, namun tidak dapat berhubungan langsung
dengan bagian view.
 View merupakan bagian yang menangani presentation logic. berisi kode-kode untuk
tampilan.
 Controller merupakan bagian yang mengatur hubungan antara bagian model dan
bagian view, controller berfungsi untuk menerima request dan data dari user
kemudian menentukan apa yang akan diproses oleh aplikasi.
Alur kerjanya seperti ini:2
1. Mulai;
2. User mengirim request ke web;
3. File yang pertama kali dieksekusi adalah index.php;
4. Lalu dari index.php, request akan diteruskan oleh routers.php;
5. routers.php akan mencari cache di server, apabila tedapat cache maka cache itu yang
akan dikirim sebagai balasan (response). Apabila tidak
ada cache barulah request diteruskan ke Controller;
6. Controller akan bertanggunag jawab untuk mengambil data dari Modeldan me-
rendernya ke dalam View dengan menggunakan library, plugin, dan helper yang ada.
7. Hasil render (view) dikirim ke pengguna dan disimpan dalam cache, apabila
fitur cache aktif;
8. Selesai.

Memahami Router pada Codeigniter

Router pada Codeigniter bertugas untuk menentukan controller dan method/fungsi yang
akan dieksekusi.
Ketika kita membuka, http://localhost/tokobuah/ maka fungsi yang akan dieksekusi adalah
fungsi index() yang berada di dalam controller welcome.
class Welcome extends CI_Controller {
public function index()
{
$this->load->view('welcome_message');
}
}

Kenapa bisa begitu?

Ini karena konfigurasi router defaultnya adalah controller welcome.
Coba saja buka pada file config/routers.php.

Fungsi index() adalah fungsi yang akan dieksekusi saat kita mengaksescontroller welcome.
Sekarang coba buka: http://localhost/tokobuah/index.php/welcome/index, maka kita akan
mendapatkan hal yang sama seperti membuka http://localhost/tokobuah/.
Membuat Beberapa Router

Sebagai latihan, coba tambahkan route /about/ dan /contact/ di

dalam Controller Welcome dengan method ini:
public function about()
{
// fungsi untuk me-load view about.php
$this->load->view('about');
}

public function contact()

{
// fungsi untuk me-load view contact.php
$this->load->view('contact');
}

Tambahkan di bawah method index().

Setelah itu tambahkan dua buah file view di dalam direktori views dengan isi sebagai berikut.
views/about.php

<h1>About Us</h1>
<p>Ini adalah halaman about</p>

views/contact.php

<h1>Contact Us</h1>
<p>Ini adalah halaman Contact</p>
Route sudah kita tambahkan.
Sekarang coba buka:
 http://localhost/tokobuah/index.php/welcome/about/
 dan http://localhost/tokobuah/index.php/welcome/contact/
Hasilnya:

Apabila kita membuka http://localhost/tokobuah/index.php/contact, maka akan

terjadi error 404 not found.

Kenapa bisa begitu?

Ini karena route yang baru saja kita buat, belum didaftarkan ke dalam routers.php.
Sekarang buka file config/routers.php, lalu tambahkan kode berikut.
$route['about'] = 'welcome/about';
$route['contact'] = 'welcome/contact';

Tambahkan di bawah kode route yang sudah ada.

Hasilnya:

Apakah kita harus menambahkan route pada routers.php di setiap pembuatan

route baru?
Jawabannya:
Tidak harus, karena CI juga mampu mendeteksi otomatis route berdasarkan nama
controller dan method yang dibuat.3

Ini formatnya:

http://example.com/[controller-class]/[controller-method]/[arguments]

Penambahan route pada routers.php dibutuhkan saat kita ingin membuat kustom route
untuk controller tertentu.

Apa Selanjutnya?
Kita sudah belajar tentang MVC dan Route. Ini memang masih dasar. Selanjutnya nanti kita
akan banyak menggunakannya.
Tutorial Codeigniter #3: Cara Menggunakan Bootstrap pada Codeigniter

Bootstrap merupakan CSS framework yang populer dalam pengembangan web.

Bahkan template Petanikode juga dibuat dengan Bootstrap.
Pada tutorial ini, kita tidak akan membahas bootstrap secara detail. Karena saya sudah
membuat tutorial bootstrap di artikel yang berbeda.
Apabila kamu belum paham bootstrap…
…tenang, ikuti saja tutorial ini sambil belajar.
Nanti juga paham sendiri, hehehe.
Lanjut…
Rencananya pada aplikasi yang akan kita buat, kita akan menggunakan template SB Admin.
Kenapa SB Admin?
Karena sederhana, gartis, menggunkan Bootstrap 4, dan mudah diimplementasikan pada
Codeigniter.

Tampilan Template SB Admin

Langkah-langkah yang harus dilakukan untuk menggunakan bootstrap (template SB Admin)

pada Codeigniter:
1. Konfigurasi Codeigniter;
2. Download SB Admin;
3. Ekstrak SB Admin;
4. Copy file assets yang dibutuhkan;
5. Membuat Template;
6. Membuat partial template;
7. Menggunakan partial pada template;
8. Selesai…
Kedengarannya mdudah, namun dalam prakteknya, kita akan mendapatkan banyak kendala
dan masalah.

Karena itu, pastikan kamu mengikuti tutorial ini dengan seksama.

1. Konfigurasi Awal Codeigniter
Sebelum memulai membuat template, silahkan lakukan konfigurasi terlebih dahulu…
Konfigurasi Base URL
Base URL berfungsi untuk menentukan alamat atau URL yang akan digunakan oleh web.
Saat mengembangkan web, kita akan menggunakan Base URL berikut:

http://localhost/tokobuah

Ini adalah alamat yang bisa kita akses dari localhost.

Saat web sudah jadi, nanti ubah alamat tersebut ke alamat domain.
Misal:

https://www.petanikode.com

Cara mengatur Base URL, silahkan buka file config/config.php. Lalu isi
bagian $config['base_url'] = ''; menjadi seperti ini:

Konfigurasi Autoload
Berikutnya kita harus meload sebuah helper ke memori secara otomatis
melalui autoload.php.
Helper adalah fungsi-fungsi Codeigniter yang akan membantu kita dalam berbagai hal,
seperti: membuat form, mengakses URL, dll.
Salah satu helper yang kita butuhkan dalam pembuatan template adalah helper url.
Helper url berisi fungsi-fungsi untuk mengakses URL
seperti base_url(), site_url(), $this->uri, dll.
Cara mengaktifkan helper url:
Pertama buka file config/autoload.php, lalu cari $autoload['helper'].
Tambahkan url, sehingga menjadi seperti ini:

Membuat Konstanta
Setelah itu, buat konstanta SITE_NAME untuk menyimpan nama web. Konstanta ini nanti
kita perlukan untuk mengambil judul web pada template.
Bila kamu belum paham tentang konstanta di PHP, silahkan baca: Apa itu Konstanta?
Lanjut…
Silahkan buka file config/constants.php, lalu tambahkan kode berikut…

/*
|--------------------------------------------------------------------------
| Constants for Site
|--------------------------------------------------------------------------
|
*/

define('SITE_NAME', 'Tokobuah');

…di bagian akhir:

2. Download dan Ekstrak SB Admin
Silahkan download SB Admin dari websitenya.

Setelah itu, kita akan mendapatkan sebuah file ZIP. Ekstrak file tersebut sehingga kita punya
file SB admin seperti ini:

Ini adalah file template yang akan kita gunakan pada proyek Codeigniter.

3. Menambahkan SB Admin di Codeigniter

Tugas kita berikutnya adalah menambahkan file SB Admin ke dalam proyek Codeigniter.
Caranya:
Kita tinggal copy/paste file dan folder yang dibutuhkan. Berikut ini folder yang harus
kita copy:
1. Folder css
2. Folder js

3. Folder vendor –rename menjadi–> assets

Untuk folder vendor, kita akan ubah namanya menjadi assets agar tidak bercampur
dengan folder vendor dari composer.
Folder vendor berisi library front-end dari pihak ketiga, seperti: Bootstrap, Font awesome
untuk ikon, chart.js, datatables, dan jquery.
Folder sass dapat juga kita copy apabila kita ingin memodifikasi dan menggunakan
sass pada project.
Namun, karena kita hanya akan memakai saja. Kita cukup copy tiga folder yang tadi.

Setelah itu, kita bisa mulai membuat template untuk tampilan admin.

4. Membuat dan Modifikasi Template

Buat sebuah direktori baru di dalam direktori views dengan nama admin. Lalu di dalamnya
berisi kode php dengan nama overview.php.

File overview.php akan menjadi template untuk halaman home admin.

Isi dari file overview.php akan kita ambil dari file index.html SB Admin.
Silahkan buka kembali template SB Admin, ambil semua kode yang ada di dalam
file index.html lalu copy ke overview.php.
Sehingga file overview.php akan terisi seperti ini:
<!DOCTYPE html>
<html lang="en">

<head>

</head>

<nav class="navbar navbar-expand navbar-dark bg-dark static-top">

<a class="navbar-brand mr-1" href="index.html">Start Bootstrap</a>

<button class="btn btn-link btn-sm text-white order-1 order-sm-0" id="sidebarToggle" href="#">

<ul class="navbar-nav ml-auto ml-md-0">
<li class="nav-item dropdown no-arrow mx-1">
<a class="nav-link dropdown-toggle" href="#" id="alertsDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-bell fa-fw"></i>
<span class="badge badge-danger">9+</span>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="alertsDropdown">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<li class="nav-item dropdown no-arrow mx-1">
<a class="nav-link dropdown-toggle" href="#" id="messagesDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-envelope fa-fw"></i>
<span class="badge badge-danger">7</span>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="messagesDropdown">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<li class="nav-item dropdown no-arrow">
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-user-circle fa-fw"></i>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="userDropdown">
<a class="dropdown-item" href="#">Settings</a>
<a class="dropdown-item" href="#">Activity Log</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" data-toggle="modal" data-
target="#logoutModal">Logout</a>
</div>
</li>
</ul>

</nav>

<ul class="sidebar navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="index.html">
<i class="fas fa-fw fa-tachometer-alt"></i>
<span>Dashboard</span>
</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="pagesDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fas fa-fw fa-folder"></i>
<span>Pages</span>
</a>
<div class="dropdown-menu" aria-labelledby="pagesDropdown">
<h6 class="dropdown-header">Login Screens:</h6>
<a class="dropdown-item" href="login.html">Login</a>
<a class="dropdown-item" href="register.html">Register</a>
<a class="dropdown-item" href="forgot-password.html">Forgot Password</a>
<div class="dropdown-divider"></div>
<h6 class="dropdown-header">Other Pages:</h6>
<a class="dropdown-item" href="404.html">404 Page</a>
<a class="dropdown-item" href="blank.html">Blank Page</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="charts.html">
<i class="fas fa-fw fa-chart-area"></i>
<span>Charts</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="tables.html">
<i class="fas fa-fw fa-table"></i>
<span>Tables</span></a>
</li>
</ul>

<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="#">Dashboard</a>
</li>
<li class="breadcrumb-item active">Overview</li>
</ol>

<div class="row">
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-primary o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-comments"></i>
</div>
<div class="mr-5">26 New Messages!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-warning o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-list"></i>
</div>
<div class="mr-5">11 New Tasks!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-success o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-shopping-cart"></i>
</div>
<div class="mr-5">123 New Orders!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-danger o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-life-ring"></i>
</div>
<div class="mr-5">13 New Tickets!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
</div>

<div class="card mb-3">
<div class="card-header">
<i class="fas fa-chart-area"></i>
Area Chart Example</div>
<div class="card-body">
<canvas id="myAreaChart" width="100%" height="30"></canvas>
</div>
<div class="card-footer small text-muted">Updated yesterday at 11:59 PM</div>
</div>

<div class="card mb-3">
<div class="card-header">
<i class="fas fa-table"></i>
Data Table Example</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>66</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>Cedric Kelly</td>
<td>Senior Javascript Developer</td>
<td>Edinburgh</td>
<td>22</td>
<td>2012/03/29</td>
<td>$433,060</td>
</tr>
<tr>
<td>Airi Satou</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>33</td>
<td>2008/11/28</td>
<td>$162,700</td>
</tr>
<tr>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>61</td>
<td>2012/12/02</td>
<td>$372,000</td>
</tr>
<tr>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>59</td>
<td>2012/08/06</td>
<td>$137,500</td>
</tr>
<tr>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Tokyo</td>
<td>55</td>
<td>2010/10/14</td>
<td>$327,900</td>
</tr>
<tr>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>39</td>
<td>2009/09/15</td>
<td>$205,500</td>
</tr>
<tr>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>23</td>
<td>2008/12/13</td>
<td>$103,600</td>
</tr>
<tr>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>30</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>22</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>36</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>43</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>19</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>66</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>64</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>59</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>41</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>35</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>30</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>40</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>21</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sidney</td>
<td>23</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
<tr>
<td>Angelica Ramos</td>
<td>Chief Executive Officer (CEO)</td>
<td>London</td>
<td>47</td>
<td>2009/10/09</td>
<td>$1,200,000</td>
</tr>
<tr>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>42</td>
<td>2010/12/22</td>
<td>$92,575</td>
</tr>
<tr>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>Singapore</td>
<td>28</td>
<td>2010/11/14</td>
<td>$357,650</td>
</tr>
<tr>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>28</td>
<td>2011/06/07</td>
<td>$206,850</td>
</tr>
<tr>
<td>Fiona Green</td>
<td>Chief Operating Officer (COO)</td>
<td>San Francisco</td>
<td>48</td>
<td>2010/03/11</td>
<td>$850,000</td>
</tr>
<tr>
<td>Shou Itou</td>
<td>Regional Marketing</td>
<td>Tokyo</td>
<td>20</td>
<td>2011/08/14</td>
<td>$163,000</td>
</tr>
<tr>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Sidney</td>
<td>37</td>
<td>2011/06/02</td>
<td>$95,400</td>
</tr>
<tr>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>53</td>
<td>2009/10/22</td>
<td>$114,500</td>
</tr>
<tr>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>27</td>
<td>2011/05/07</td>
<td>$145,000</td>
</tr>
<tr>
<td>Gavin Cortez</td>
<td>Team Leader</td>
<td>San Francisco</td>
<td>22</td>
<td>2008/10/26</td>
<td>$235,500</td>
</tr>
<tr>
<td>Martena Mccray</td>
<td>Post-Sales support</td>
<td>Edinburgh</td>
<td>46</td>
<td>2011/03/09</td>
<td>$324,050</td>
</tr>
<tr>
<td>Unity Butler</td>
<td>Marketing Designer</td>
<td>San Francisco</td>
<td>47</td>
<td>2009/12/09</td>
<td>$85,675</td>
</tr>
<tr>
<td>Howard Hatfield</td>
<td>Office Manager</td>
<td>San Francisco</td>
<td>51</td>
<td>2008/12/16</td>
<td>$164,500</td>
</tr>
<tr>
<td>Hope Fuentes</td>
<td>Secretary</td>
<td>San Francisco</td>
<td>41</td>
<td>2010/02/12</td>
<td>$109,850</td>
</tr>
<tr>
<td>Vivian Harrell</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>62</td>
<td>2009/02/14</td>
<td>$452,500</td>
</tr>
<tr>
<td>Timothy Mooney</td>
<td>Office Manager</td>
<td>London</td>
<td>37</td>
<td>2008/12/11</td>
<td>$136,200</td>
</tr>
<tr>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>65</td>
<td>2008/09/26</td>
<td>$645,750</td>
</tr>
<tr>
<td>Olivia Liang</td>
<td>Support Engineer</td>
<td>Singapore</td>
<td>64</td>
<td>2011/02/03</td>
<td>$234,500</td>
</tr>
<tr>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>38</td>
<td>2011/05/03</td>
<td>$163,500</td>
</tr>
<tr>
<td>Sakura Yamamoto</td>
<td>Support Engineer</td>
<td>Tokyo</td>
<td>37</td>
<td>2009/08/19</td>
<td>$139,575</td>
</tr>
<tr>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>61</td>
<td>2013/08/11</td>
<td>$98,540</td>
</tr>
<tr>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>47</td>
<td>2009/07/07</td>
<td>$87,500</td>
</tr>
<tr>
<td>Serge Baldwin</td>
<td>Data Coordinator</td>
<td>Singapore</td>
<td>64</td>
<td>2012/04/09</td>
<td>$138,575</td>
</tr>
<tr>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>63</td>
<td>2010/01/04</td>
<td>$125,250</td>
</tr>
<tr>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>56</td>
<td>2012/06/01</td>
<td>$115,000</td>
</tr>
<tr>
<td>Jennifer Acosta</td>
<td>Junior Javascript Developer</td>
<td>Edinburgh</td>
<td>43</td>
<td>2013/02/01</td>
<td>$75,650</td>
</tr>
<tr>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>46</td>
<td>2011/12/06</td>
<td>$145,600</td>
</tr>
<tr>
<td>Hermione Butler</td>
<td>Regional Director</td>
<td>London</td>
<td>47</td>
<td>2011/03/21</td>
<td>$356,250</td>
</tr>
<tr>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>21</td>
<td>2009/02/27</td>
<td>$103,500</td>
</tr>
<tr>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>30</td>
<td>2010/07/14</td>
<td>$86,500</td>
</tr>
<tr>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>51</td>
<td>2008/11/13</td>
<td>$183,000</td>
</tr>
<tr>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>29</td>
<td>2011/06/27</td>
<td>$183,000</td>
</tr>
<tr>
<td>Donna Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>27</td>
<td>2011/01/25</td>
<td>$112,000</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="card-footer small text-muted">Updated yesterday at 11:59 PM</div>
</div>

</div>

<footer class="sticky-footer">
<div class="container my-auto">
<div class="copyright text-center my-auto">
<span>Copyright © Your Website 2018</span>
</div>
</div>
</footer>

</div>

</div>

<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-
labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">Select "Logout" below if you are ready to end your current
session.</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
<a class="btn btn-primary" href="login.html">Logout</a>
</div>
</div>
</div>
</div>

</body>

</html>
Setelah itu, buat sebuah controller baru dengan nama Overview.php di dalam
direktori controllers/admin.

Perhatikan nama file untuk controller, di depannya selalu diawali dengan huruf besar atau
kapital.
Isi controller Overview.php dengan kode berukut:
<?php

class Overview extends CI_Controller {

public function __construct()
{
parent::__construct();
}

public function index()

{
// load view admin/overview.php
$this->load->view("admin/overview");
}
}

Setelah itu, buat sebuah route baru untuk controller Overview.

Buka file config/routes.php, lalu tambahkan kode ini:

$route['admin'] = 'admin/overview';

Setelah itu coba buka http://localhost/tokobuah/index.php/admin/, maka kita akan

mendapatkan tampilan seperti ini:

Kenapa tampilannya berantakan?

Ini karena CSS dan Javascript belum berhasil di-load alias Not Found.
Coba saja buka view source dari halamannya.
Kalau kita klik link CSS dan Javascriptnya, maka akan Not Found.
Kenapa bisa begini?
Ini karena alamat yang diberikan pada link tersebut belum benar. Masih mengarah
ke /vendor/....
Kita harus mengubahnya agar mengarah ke /assets/..., karena tadi kita sudah mengubah
nama vendor menjadi assets.
Mari kita perbaiki…
Buka file views/overview.php lalu cari link CSS dan javascriptnya.

Setelah itu ubah link-nya dengan link yang benar. Gunakan

fungsi base_url()untuk menyisipkan link CSS dan Javascript agar konsisten.
Dari kode ini:

<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

Ubah menjadi seperti ini:

<link href="<?php echo base_url('assets/bootstrap/css/bootstrap.min.css') ?>" rel="stylesheet">

Sehingga kode lengkap untuk overview.php akan menjadi seperti ini:

<!DOCTYPE html>
<html lang="en">

<head>

</head>

<nav class="navbar navbar-expand navbar-dark bg-dark static-top">

<a class="navbar-brand mr-1" href="index.html">Start Bootstrap</a>

<button class="btn btn-link btn-sm text-white order-1 order-sm-0" id="sidebarToggle" href="#">

</nav>

<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="#">Dashboard</a>
</li>
<li class="breadcrumb-item active">Overview</li>
</ol>

</div>

<footer class="sticky-footer">
<div class="container my-auto">
<div class="copyright text-center my-auto">
<span>Copyright © Your Website 2018</span>
</div>
</div>
</footer>

</div>

</div>

Woho… keren
Apa Selanjutnya?
Tugas kita masih belum selesai.
Karena kita baru hanya menambahkan Bootstrap dan membuat template awalnya.
Selanjutnya kita akan membuat partials untuk menata template agar lebih efektif dan
mudah digunakan.

Tutorial Codeigniter #4: Teknik Membuat Template Admin yang Efektif

Pada tutorial sebelumnya, kita sudah berhasil menambahkan Bootstrap pada proyek CI.
Namun, masih ada yang kurang…
Template masih dibuat dalam satu file saja. Ini nanti akan bermasalah ketika kita membuat
halaman baru.
Permsalahannya:
Kita akan menulis kode yang sama berulang-ulang dalam file template yang berbeda.
Bagaimana nanti kalau ada perubahan?
Misal, perubahan link pada navbar.
Maka kita harus mengubah semua file template yang kita buat satu per satu.
Tentu ini kurang efektif, karena kita akan menghabiskan banyak waktu dan tentaga untuk
mengubahnya.
Salah satu solusi dari permasalahan ini yaitu dengan menggunakan partials.
Dengan partials kita akan membagi template menjadi bagian-bagian kecil yang dapat
digunakan kembali.
Jika kamu pernah belajar Laravel, kamu mungkin pernah mendengar fungsi yield yang
memungkinkan kita untuk mengimpor bagian template yang lain. Fungsi yield di Laravel
sering digunakan untuk membuat layout.1
Lalu di Codeigniter, apakah ada fungsi yield?
Tidak, di Codeigniter tidak ada fungsi yield. Namun, kita bisa menggunakan fungsi $this-
>load->view() sebagai penggantinya. Karena fungsinya hampir sama dengan yield, yaitu
untuk me-load sebuah view.2
Fungsi $this->load->view() ini, nanti akan kita gunakan untuk me-load partials ke dalam
template.
Tapi sebelum itu, kita harus membuat dulu partial-nya.
Membuat Partial Template
Partial merupakan teknik untuk membagi template menjadi bagian-bagian kecil agar mudah
digunakan.

Sebenarnya teknik ini pertama saya dengar saat membuat template Hugo…
…dan rencananya akan saya coba juga terapkan untuk template aplikasi Codeigniter.
Sekarang coba buka file index.html pada SB Admin dan perhatikan, apa saja partial yang bisa
kita buat dari sana?

Berdasarkan gambar di atas, berikut ini partial yang bisa kita buat:
 head.php untuk meinyimpan isi dari tag <head>;
 navbar.php untuk menyimpan kode navbar;
 sidebar.php untuk menyimpan kode menu bagian samping (sidebar);
 breadcrumb.php untuk menyimpan kode link breadcrumb;
 scrolltop.php untuk menyimpan kode tombol scrolltop;
 footer.php untuk menyimpan kode footer;
 modal.php untuk menyimpan kode modal;
 js.php untuk meload javascript.
Mari kita buat satu per satu…
Tapi sebelum itu, silahkan buat dulu direktori baru bernama _partials di dalam
views/admin/.

Apakah nama direktorinya harus _partials?

Tidak harus, karena ada juga membarikan nama includes atau _includes.
Nama _partials menurut saya lebih jelas dan menggambarkan isinya.
Kenapa ada garis bawah (underscore) di depannya?
Ini untuk memudahkan dalam membedakan view dan partial. View akan kita load dari
Controller, sedangkan partial akan kita load dari view.
Biasanya dalam penulisan kode (OOP), sesuatu yang bersifat private dan lokal kadang ditulis
dengan garis bawah di depannya.
Oke, lanjut…
Berikutnya kita akan membuat semua partial yang telah kita tentukan di atas.
Partial head.php
Partial ini berisi kode-kode untuk tag <head>. Kita bisa copy dari
file views/admin/overview.php mulai dari tag <head> sampai penutupnya </head>.
Sehinggak kode untuk partial head.php akan menjadi seperti ini:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">

<title><?php echo SITE_NAME .": ". ucfirst($this->uri->segment(1)) ." - ". ucfirst($this->uri-

>segment(2)) ?></title>

Perhatikan kode pada tag <title>, di sana kita menggunakan sebuah

konstanta SITE_NAME untuk menambil nama web.
Konstanta ini sudah kita buat pada tutorial sebelumnya.
Berikutnya perhatikan di bagian:
ucfirst($this->uri->segment(1)) ." - ". ucfirst($this->uri->segment(2))
Ini akan menjadi judul yang akan tampil di browser. Fungsi ucfirst() untuk membuat huruf
besar di awal kata. Lalu judulnya kita ambil dari segment URL.
Sehingga nanti pada browser akan tampil seperti ini:

Partial navbar.php
Partial ini hanya berisi kode untuk menu navbar. Berikut ini isi kode dari partial navbar.php:
<nav class="navbar navbar-expand navbar-dark bg-success static-top">

<button class="btn btn-link btn-sm text-white order-1 order-sm-0" id="sidebarToggle" href="#">

<li class="nav-item dropdown no-arrow mx-1">

<a class="nav-link dropdown-toggle" href="#" id="messagesDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<i class="fas fa-envelope fa-fw"></i>
<span class="badge badge-danger">7</span>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="messagesDropdown">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>

<li class="nav-item dropdown no-arrow">

<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<i class="fas fa-user-circle fa-fw"></i> Admin
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="userDropdown">
<a class="dropdown-item" href="#">Settings</a>
<a class="dropdown-item" href="#">Activity Log</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" data-toggle="modal" data-
target="#logoutModal">Logout</a>
</div>
</li>
</ul>

</nav>

Pada kode navbar, kita menggunakan konstanta SITE_NAME untuk menampilkan nama web di
navbar.
Lalu kita menggunakan class bg-success untuk mengubah warnanya menjadi hijau. Supaya

selaras dengan brand aplikasinya .

Ini tampilannya:

Partial sidebar.php
Partial ini berisi kode untuk menampilkan menu bagian samping (sidebar). Berikut ini isi
kode sidebar.php:

<ul class="sidebar navbar-nav">
<li class="nav-item <?php echo $this->uri->segment(2) == '' ? 'active': '' ?>">
<a class="nav-link" href="<?php echo site_url('admin') ?>">
<i class="fas fa-fw fa-tachometer-alt"></i>
<span>Overview</span>
</a>
</li>
<li class="nav-item dropdown <?php echo $this->uri->segment(2) == 'products' ? 'active': '' ?>">
<a class="nav-link dropdown-toggle" href="#" id="pagesDropdown" role="button" data-
toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<i class="fas fa-fw fa-boxes"></i>
<span>Products</span>
</a>
<div class="dropdown-menu" aria-labelledby="pagesDropdown">
<a class="dropdown-item" href="<?php echo site_url('admin/products/add') ?>">New
Product</a>
<a class="dropdown-item" href="<?php echo site_url('admin/products') ?>">List Product</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="fas fa-fw fa-users"></i>
<span>Users</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">
<i class="fas fa-fw fa-cog"></i>
<span>Settings</span></a>
</li>
</ul>

Pada kode di atas, kita menggunakan segment URI untuk mengecek apakah menu itu sedang
dibuka atau tidak.
Jika menu sedang dibuka, maka tambahkan class active.
Misalnya ini:
<?php echo $this->uri->segment(2) == 'products' ? 'active': '' ?>

Kode ini akan mengecek, apakah halaman /admin/products sedang dibuka atau tidak.
Oya, halaman untuk menu products, users, dan settings belum kita buat. Insya’allah di
tutorial berikutnya akan kita buat.
Partial breadcrumb.php
Partial ini berisi kode untuk menampilkan breadcrumb. Breadcrumbs adalah sebuah link
navigasi yang menampilkan link halaman sebelumnya dari halaman tempat kita berada.
Berikut ini kode untuk parital breadcrumb.php:

<ol class="breadcrumb">
<?php foreach ($this->uri->segments as $segment): ?>
<?php
$url = substr($this->uri->uri_string, 0, strpos($this->uri->uri_string, $segment))
. $segment;
$is_active = $url == $this->uri->uri_string;
?>

<li class="breadcrumb-item <?php echo $is_active ? 'active': '' ?>">

<?php if($is_active): ?>
<?php echo ucfirst($segment) ?>
<?php else: ?>
<a href="<?php echo site_url($url) ?>"><?php echo ucfirst($segment) ?></a>
<?php endif; ?>
</li>
<?php endforeach; ?>
</ol>

Partial scrolltop.php
Partial ini berisi kode untuk tombol scrolltop. Berikut ini isinya:

<a class="scroll-to-top rounded" href="#page-top">
<i class="fas fa-angle-up"></i>
</a>

Partial footer.php
Partial ini berisi kode untuk bagian footer, berikut ini isi kode untuk partial footer.php:

<footer class="sticky-footer">
<div class="container my-auto">
<div class="copyright text-center my-auto">
<span>Copyright © <?php echo SITE_NAME ." ". Date('Y') ?></span>
</div>
</div>
</footer>

Pada kode partial footer.php, kita menggunakan konstanta SITE_NAME untuk menampilkan
nama website. Lalu menggunakan fungsi Date('Y') untuk menampilkan tahun saat ini.
Partial modal.php
Partial ini berisi kode-kode untuk modal. Berikut ini isinya:

<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-
labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">Select "Logout" below if you are ready to end your current
session.</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
<a class="btn btn-primary" href="login.html">Logout</a>
</div>
</div>
</div>
</div>
Kita juga nanti bisa tambahkan beberapa modal di sini.
Partial js.php
Partial ini berisi kode-kode untuk me-load Javascript. Berikut ini kode untuk js.php:

<script src="<?php echo base_url('assets/jquery/jquery.min.js') ?>"></script>
<script src="<?php echo base_url('assets/bootstrap/js/bootstrap.bundle.min.js') ?>"></script>

Kita juga nanti bisa tambahkan beberapa kode javascript di sini.

Menggunakan Partials pada Template
Kita sudah membuat semua partial yang dibutuhkan:

Langkah berikutnya, kita harus menggunakannya dalam template.

Silahkan ubah isi views/admin/overview.php menjadi seperti ini:
<!DOCTYPE html>
<html lang="en">
<head>
<?php $this->load->view("admin/_partials/head.php") ?>
</head>
<body id="page-top">

<?php $this->load->view("admin/_partials/navbar.php") ?>

<?php $this->load->view("admin/_partials/sidebar.php") ?>

<?php //$this->load->view("admin/_partials/breadcrumb.php") ?>

<div class="row">
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-primary o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-comments"></i>
</div>
<div class="mr-5">26 New Messages!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-warning o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-list"></i>
</div>
<div class="mr-5">11 New Tasks!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-success o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-shopping-cart"></i>
</div>
<div class="mr-5">123 New Orders!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
<div class="col-xl-3 col-sm-6 mb-3">
<div class="card text-white bg-danger o-hidden h-100">
<div class="card-body">
<div class="card-body-icon">
<i class="fas fa-fw fa-life-ring"></i>
</div>
<div class="mr-5">13 New Tickets!</div>
</div>
<a class="card-footer text-white clearfix small z-1" href="#">
<span class="float-left">View Details</span>
<span class="float-right">
<i class="fas fa-angle-right"></i>
</span>
</a>
</div>
</div>
</div>

<div class="card mb-3">
<div class="card-header">
<i class="fas fa-chart-area"></i>
Visitor Stats</div>
<div class="card-body">
<canvas id="myAreaChart" width="100%" height="30"></canvas>
</div>
<div class="card-footer small text-muted">Updated yesterday at 11:59
PM</div>
</div>

</div>

<?php $this->load->view("admin/_partials/footer.php") ?>

</div>

</div>

<?php $this->load->view("admin/_partials/scrolltop.php") ?>

<?php $this->load->view("admin/_partials/modal.php") ?>
<?php $this->load->view("admin/_partials/js.php") ?>

</body>
</html>

Pada kode template tersebut, kita me-load partial dengan fungsi $this->load->view().
Maka hasilnya akan seperti ini:

Mantap…
[Download Source Code Tutorial ini: tutorial-4.zip]
Apa Selanjutnya?
Sepertinya masalah template sudah selesai. Kamu juga bisa mengembangkannya sesuai
kreasi sendiri.
Silahkan pelajari Bootstrap untuk mengetahui class-class CSS yang dapat digunakan.
Berikutnya kita bisa mulai membuat fitur baru, seperti:
 fitur CRUD Produk.
 fitur upload file.
 fitur login untuk admin.
 dll.
Tutorial Codeigniter #5: Cara Membuat Fitur CRUD yang Benar!

Pada tutorial sebelumnya, kita sudah belajar bagaimana cara membuat template admin yang benar dan
efisien.
Kita juga sudah membahas tentang Controller dan routing pada Codeigniter.
Nah! yang belum…
Pembahasan tentang database dan model.
Oke, judulnya ini cukup clickbait: “Cara Membuat Fitur CRUD di Codeigniter yang Benar!”
Mengapa saya bilang demikian?
Karena, beberapa tutorial Codeigniter yang pernah saya ikuti tidak mengajari praktek terbaik (best
practice) dalam ngoding CI.
Bukan berarti mereka salah…
…dan mengklaim cara pada tutorial ini yang paling benar.
Semua cara dan solusi, benar.
Hanya saja, jika kita menulis kode sembarangan, akibatnya bisa rugi.
Saya pernah mengerjakan project menggunakan Codeigniter, lalu kode-kode yang saya tulis sangat
berantakan dan kotor.
Hasilnya:
Project gagal, karena saya tidak mau mengembangkannya lagi.
Ribet!
Saya lebih memilih ngoding ulang dari awal daripada mengembangkan kode tersebut.
Seperti itulah rasanya menulis kode yang buruk dan kotor.
Namun, dari hasil pengulangan tersebut. Saya belajar banyak hal.
Seperti, bagaimana sebaiknya cara menerima data dari form. Apakah langsung di simpan ke database,
atauhkah divalidasi dulu.
Ternyata yang benar adalah:
Data harus divalidasi dulu.
Jika tidak divalidasi, bisa jadi nanti akan banyak bugs dan rentan dengan serangan XSS.

Tambah kerjaan lagi…

Belajar dari pengalaman, saya tidak ingin kamu bernasib sama seperti saya yang gagal menyelesaikan
project.
Maka saya membuat tutorial ini…
Jika ada solusi yang lebih baik lagi, silahkan diusulkan di komentar!
Oke, kita masuk ke tutorial.
Pada tutorial ini, kita akan mengerjakan banyak hal. Mulai dari membuat database, menyiapkan
library, membuat model, sampai membuat CRUD.
CRUD (Create, Read, Update Delete) adalah fitur dasar yang harus kita buat saat bekerja dengan
database.
Berikut ini daftar pekerjaannya…
TODO:
 Membuat Database;
 Konfigurasi Codeigntier
 Membuat Model untuk Tabel;
 Membuat Controller;
 Membuat View;
 Membuat Form Add;
 Membuat Form Edit;
 Membuat Fitur Hapus Data;
Membuat Database untuk Codeigniter
Silahkan buka PHPMyadmin, kemudian buatlah database baru dengan nama tokobuah.

Setelah itu, buat tabel products dengan 5 kolom. Tabel ini nanti akan menyimpan data produk.

Kolom yang dibutuhkan:

1. product_id (Primary Key) bertipe string dengan panjang 64;
2. name bertipe string dengan panjang 255.
3. price bertipe integer.
4. image bertipe string dengan panjang 255.
5. description bertipe TEXT.
…dan jangan lupa jadikan kolom product_id sebagai primary key.
Terakhir, klik Save untuk menyimpan.
Sehingga kita sekarang punya tabel products dengan struktur seperti ini:
Kode SQL-nya:
CREATE TABLE `products` (
`product_id` varchar(64) NOT NULL,
`name` varchar(255) NOT NULL,
`price` int(11) NOT NULL,
`image` varchar(255) NOT NULL DEFAULT 'default.jpg',
`description` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Satu pekerjaan sudah selesai…

TODO:
 Membuat Database;
 Konfigurasi Codeigntier
 Membuat Model untuk Tabel;
 Membuat Controller;
 Membuat View;
 Membuat Form Add;
 Membuat Form Edit;
 Membuat Fitur Hapus Data;
Berikutnya kita akan melakukan konfigurasi pada Codeigniter agar dapat terhubung dengan
database.
Konfigurasi Codeigniter
Silahkan buka config/database.php, kemudian isi seperti ini:
$db['default'] = array(
'dsn' => '',
'hostname' => 'localhost',
'username' => 'dian',
'password' => 'kopi',
'database' => 'tokobuah',
'dbdriver' => 'mysqli',
'dbprefix' => '',
'pconnect' => FALSE,
'db_debug' => (ENVIRONMENT !== 'production'),
'cache_on' => FALSE,
'cachedir' => '',
'char_set' => 'utf8',
'dbcollat' => 'utf8_general_ci',
'swap_pre' => '',
'encrypt' => FALSE,
'compress' => FALSE,
'stricton' => FALSE,
'failover' => array(),
'save_queries' => TRUE
);

Perhatikan pada item berikut:

'hostname' => 'localhost',
'username' => 'dian',
'password' => 'kopi',
'database' => 'tokobuah',

Silahkan ubah sesuai dengan konfigurasi server mysql pada komputermu.

Pada komputer saya, username MySQL-nya adalah dian dan password-nya kopi.
Jika kamu menggunakan XAMPP, password-nya biasanya tidak ada dan user yang digunakan
adalah root.
Gunakan ini untuk XAMPP:
'hostname' => 'localhost',
'username' => 'root',
'password' => '',
'database' => 'tokobuah',

Berikutnya, silahkan buka config/autoload.php.

Kemudian cari $autoload['libraries'] dan tambahkan database dan sessiondi sana.
$autoload['libraries'] = array('database', 'session');

Ini artinya, kita akan me-load library database dan session secara otomatis.
Apa fungsinya?
 Library database akan menyediakan fungsi-fungsi untuk operasi database. Kita butuh ini,
karena kita akan menggunakan database dalam aplikasi;
 Library session menyediakan fungsi-fungsi untuk mengakses variabel $_SESSION. Kita
butuh ini untuk menampilkan flash message dan membuat login.
Dengan demikian konfigurasi selesai…

TODO:
 Membuat Database;
 Konfigurasi Codeigntier
 Membuat Model untuk Tabel;
 Membuat Controller;
 Membuat View;
 Membuat Form Add;
 Membuat Form Edit;
 Membuat Fitur Hapus Data;
Jika ada yang ingin kita konfigurasi lagi atau mau tambah library lagi, nanti kita bisa ubah
konfigurasinya.
Untuk saat ini, kita cukup butuh konfigurasi database dan autoload librarysaja.
Berikutnya, kita akan mulai menulis kode untuk model.

Membuat Model untuk Tabel

Model merupakan class atau kode yang berhubungan dengan data.
Di dalam model, kita akan membuat pemodelan data dari database. Sehingga kita akan lebih mudah
mengaksesnya.
Biasanya satu tabel, dibuatkan satu modelnya.
Silahkan buat file baru di dalam direktori application/model/ dengan nama Product_model.php.
Perhatikan, namanya harus diawali dengan huruf kapital.
Pada contoh di atas, P adalah huruf kapital.
Lalu untuk akhiran _model ini bersifat opsional. 1
Saya sengaja membuat akhiran ini untuk memudahkan dalam membedakan class Controller dengan
class Model.
Nanti kita juga akan membuat class Controller yang bernama Products.php, karena itu kita
sebaiknya menggunakan akhiran _model pada class Model.
Setelah membuat file, lalu apa lagi?
Selanjutnya kita akan mulai menulis kode untuk Product_model.php.
Silahkan ketik kode berikut…
<?php defined('BASEPATH') OR exit('No direct script access allowed');

class Product_model extends CI_Model

{
private $_table = "products";

public $product_id;
public $name;
public $price;
public $image = "default.jpg";
public $description;

public function rules()

{
return [
['field' => 'name',
'label' => 'Name',
'rules' => 'required'],

['field' => 'price',

'label' => 'Price',
'rules' => 'numeric'],

['field' => 'description',

'label' => 'Description',
'rules' => 'required']
];
}

public function getAll()

{
return $this->db->get($this->_table)->result();
}

public function getById($id)

{
return $this->db->get_where($this->_table, ["product_id" => $id])->row();
}

public function save()

{
$post = $this->input->post();
$this->product_id = uniqid();
$this->name = $post["name"];
$this->price = $post["price"];
$this->description = $post["description"];
$this->db->insert($this->_table, $this);
}
public function update()
{
$post = $this->input->post();
$this->product_id = $post["id"];
$this->name = $post["name"];
$this->price = $post["price"];
$this->description = $post["description"];
$this->db->update($this->_table, $this, array('product_id' => $post['id']));
}
public function delete($id)
{
return $this->db->delete($this->_table, array("product_id" => $id));
}
}

Sudah selesai ngetiknya?

Baik, sekarang giliran saya menjelaskan:
Kode di atas memang belum bisa kita coba, karena ini hanya pemodelan data saja.
Nanti kita akan gunakan fungsi-fungsi atau method yang ada di dalam kode ini pada
class Controller.
Pertama silahkan perhtaikan bagian ini:
private $_table = "products"; //nama tabel

// nama kolom di tabel, harus sama huruf besar dan huruf kecilnya!
public $product_id;
public $name;
public $price;
public $image = "default.jpg";
public $description;

Ini adalah properti atau variabel yang kita butuhkan dalam model Product.
Pada properti $_tabel kita memberikan modifier private, karena properti ini hanya akan digunakan
pada class ini saja.
Jika kamu pernah belajar OOP, pasti paham.
Lalu pada properti $image, kita langsung mengisi nilainya dengan "default.jpg".
Ini nanti akan menjadi nilai default-nya, sebenarnya kita bisa saja tidak isi demikian.
Karena di tabel sudah kita berikan nilai default-nya.
Selanjutnya silahkan perhatikan method rules():
public function rules()
{
return [
['field' => 'name',
'label' => 'Name',
'rules' => 'required'],

['field' => 'price',

'label' => 'Price',
'rules' => 'numeric'],

['field' => 'description',

'label' => 'Description',
'rules' => 'required']
];
}

Method ini akan mengembalikan sebuah array yang berisi rules.

Rules ini nanti kita butuhkan untuk validasi input.
Pada Rules di atas, kita memberikan aturan untuk wajib mengisi (required)field name, price,
dan description.
Berikutnya, silahkan perhatikan method get() dan getAll(). Kedua method ini akan kita gunakan
untuk mengambil data dari database.

Berikutnya perhatikan method save():

Method ini akan kita gunakan untuk menyimpan data ke tabel product.
Kita mengambil input yang dikirim dari form menggunakan $this->input->post().
Mengapa ini ditulis di model?
Biasanya orang menuliskannya pada Controller. Namun, biar Controller lebih fokus mengatur
hubungan Model dengan View, maka sebaiknya ini kita tulis di Model.
Karena nanti pada Controller, kita tinggal validasi saja inputannya.
Untuk method berikutnya hampir sama.
Method update() untuk update data dan delete() untuk menghapus data.
Pada method update(), kita mengisi $this->product_id dengan id yang didapatkan
dari form ($post['id']). Karena ini untuk update.
Sedangkan pada method save(), kita mengisinya dengan fungsi uniqid(). Karena kita akan membuat
baru.
Fungsi ini nantinya akan menghasilkan karakter unik.

Anda mungkin juga menyukai

Mari Belajar Pemrograman Berorientasi Objek menggunakan Visual C# 6.0
Dari Everand
Mari Belajar Pemrograman Berorientasi Objek menggunakan Visual C# 6.0
Risal
4/5 (16)
Tutorial Codeigniter
Belum ada peringkat
Tutorial Codeigniter
13 halaman
Tutorial Codeigniter Part 1
Belum ada peringkat
Tutorial Codeigniter Part 1
21 halaman
Praktek Web II - Pertemuan 1 Revisi
Belum ada peringkat
Praktek Web II - Pertemuan 1 Revisi
28 halaman
6 Webtek
Belum ada peringkat
6 Webtek
5 halaman
Membangun Aplikasi SMS Codeigniter PPC2012
Belum ada peringkat
Membangun Aplikasi SMS Codeigniter PPC2012
66 halaman
Modul Ci3
Belum ada peringkat
Modul Ci3
54 halaman
Membuat Aplikasi Siakad Dengan Codeigniter 3
100% (1)
Membuat Aplikasi Siakad Dengan Codeigniter 3
17 halaman
RekWeb CI Modul 1
Belum ada peringkat
RekWeb CI Modul 1
16 halaman
Konsep Dasar CI4
Belum ada peringkat
Konsep Dasar CI4
8 halaman
Bag 2 Lanjutan 5-6 Pimplementasi Dan Pembuatan Web Dengan Framework CI
Belum ada peringkat
Bag 2 Lanjutan 5-6 Pimplementasi Dan Pembuatan Web Dengan Framework CI
53 halaman
Tutorial Codeigniter
100% (5)
Tutorial Codeigniter
63 halaman
Tool Tool Yang Di Perlukan Didalam Membangun Sistem Informasi
Belum ada peringkat
Tool Tool Yang Di Perlukan Didalam Membangun Sistem Informasi
12 halaman
Pemrograman Web II - Pertemuan 11
Belum ada peringkat
Pemrograman Web II - Pertemuan 11
33 halaman
Pengenalan CI
Belum ada peringkat
Pengenalan CI
8 halaman
Modul Belajar Codeigniter
Belum ada peringkat
Modul Belajar Codeigniter
29 halaman
Codeigniter Merupakan Salah Satu Framework Terbaik Yang Ada Saat Ini
Belum ada peringkat
Codeigniter Merupakan Salah Satu Framework Terbaik Yang Ada Saat Ini
21 halaman
Modul 1 PAW
Belum ada peringkat
Modul 1 PAW
5 halaman
8523 - File - 02-05. Pertemuan 2-5 - Codeigniter
Belum ada peringkat
8523 - File - 02-05. Pertemuan 2-5 - Codeigniter
41 halaman
Installasi Codeigniter 2. Mengerjakan Contoh1 Menampilkan Biodata
Belum ada peringkat
Installasi Codeigniter 2. Mengerjakan Contoh1 Menampilkan Biodata
9 halaman
Membangun Web Berbasis PHP Dengan Framework Codeigniter
100% (1)
Membangun Web Berbasis PHP Dengan Framework Codeigniter
15 halaman
Modul 5
Belum ada peringkat
Modul 5
6 halaman
MODULPRAKTIKUM Web 2 Cetak by Dedih
Belum ada peringkat
MODULPRAKTIKUM Web 2 Cetak by Dedih
107 halaman
CRUD Menggunakan Codeigniter
Belum ada peringkat
CRUD Menggunakan Codeigniter
34 halaman
Webprograming II
Belum ada peringkat
Webprograming II
80 halaman
Ci
Belum ada peringkat
Ci
24 halaman
Tutorial Codeigniter Untuk Pemula
100% (1)
Tutorial Codeigniter Untuk Pemula
63 halaman
Makalah Code Igniter
0% (2)
Makalah Code Igniter
14 halaman
Sering Kita Mendengar Tentang MVC Framework PHP Tetapi Kurang Mengerti Belum Arti Dari
Belum ada peringkat
Sering Kita Mendengar Tentang MVC Framework PHP Tetapi Kurang Mengerti Belum Arti Dari
10 halaman
Nadiya Zulfa Fauziyah (19573013) SI-2B (PPT Mengenai CodeIgniter)
100% (1)
Nadiya Zulfa Fauziyah (19573013) SI-2B (PPT Mengenai CodeIgniter)
18 halaman
Tutorial Codeigniter 1-.............
100% (1)
Tutorial Codeigniter 1-.............
172 halaman
Modul CI
Belum ada peringkat
Modul CI
24 halaman
Pengenalan Codeigniter 2
Belum ada peringkat
Pengenalan Codeigniter 2
2 halaman
Framework CodeIgniter
Belum ada peringkat
Framework CodeIgniter
4 halaman
Konsep MVC Serta Konfigurasi Awal Codeigniter
Belum ada peringkat
Konsep MVC Serta Konfigurasi Awal Codeigniter
6 halaman
Modul Praktikum Pemrograman Internet3 PDF
Belum ada peringkat
Modul Praktikum Pemrograman Internet3 PDF
14 halaman
Manual Book Website Informasi
Belum ada peringkat
Manual Book Website Informasi
14 halaman
PRAKTIKUM. Rekayasa Web. Modul 1_ Introduction CodeIgniter. Laboratorium Teknik Informatika Universitas Pasundan
Belum ada peringkat
PRAKTIKUM. Rekayasa Web. Modul 1_ Introduction CodeIgniter. Laboratorium Teknik Informatika Universitas Pasundan
16 halaman
Bab 2
Belum ada peringkat
Bab 2
22 halaman
Thomas Cahyo Utomo 18330033 Praktikum Pengembangan Web 2
Belum ada peringkat
Thomas Cahyo Utomo 18330033 Praktikum Pengembangan Web 2
18 halaman
makalah CI
Belum ada peringkat
makalah CI
12 halaman
Rangkuman CodeIgniter
Belum ada peringkat
Rangkuman CodeIgniter
4 halaman
Pemrograman Basis Data
Belum ada peringkat
Pemrograman Basis Data
30 halaman
Model View Controller (MVC)
Belum ada peringkat
Model View Controller (MVC)
48 halaman
MVC Framework
100% (1)
MVC Framework
21 halaman
E Book Web Programing
Belum ada peringkat
E Book Web Programing
9 halaman
1. Pengenalan Codeigniter
Belum ada peringkat
1. Pengenalan Codeigniter
2 halaman
Modul SimdawaApp Pertemuan1
Belum ada peringkat
Modul SimdawaApp Pertemuan1
13 halaman
Codeigniter 3
100% (1)
Codeigniter 3
42 halaman
CodeIgniter 2.0 - 1. Konsep Dasar MVC Dan Routing
Belum ada peringkat
CodeIgniter 2.0 - 1. Konsep Dasar MVC Dan Routing
12 halaman
Code Igniter
Belum ada peringkat
Code Igniter
40 halaman
Modul CI - 01
Belum ada peringkat
Modul CI - 01
6 halaman
Konsep Codeigniter Pada MVC
Belum ada peringkat
Konsep Codeigniter Pada MVC
12 halaman
Modul Pemrograman Web 2 v.0.2
Belum ada peringkat
Modul Pemrograman Web 2 v.0.2
29 halaman
Pemrograman Python untuk Pemula: Pemrograman
Dari Everand
Pemrograman Python untuk Pemula: Pemrograman
JUD
5/5 (10)
Membuat Aplikasi Bisnis Menggunakan Visual Studio Lightswitch 2013
Dari Everand
Membuat Aplikasi Bisnis Menggunakan Visual Studio Lightswitch 2013
Risal
3.5/5 (7)
Pendekatan sederhana untuk SEO: Bagaimana memahami dasar-dasar optimasi mesin pencari dengan cara yang sederhana dan praktis melalui jalur penemuan non-spesialis untuk semua orang
Dari Everand
Pendekatan sederhana untuk SEO: Bagaimana memahami dasar-dasar optimasi mesin pencari dengan cara yang sederhana dan praktis melalui jalur penemuan non-spesialis untuk semua orang
Stefano Calicchio
Belum ada peringkat
Active Directory: Berbasis Linux Samba 4
Dari Everand
Active Directory: Berbasis Linux Samba 4
Fajar Mukharom
Belum ada peringkat
Virtualisasi Server Berbasis Proxmox VE
Dari Everand
Virtualisasi Server Berbasis Proxmox VE
Fajar Mukharom
5/5 (1)
Manajemen Hosting Berbasis WHM/cPanel
Dari Everand
Manajemen Hosting Berbasis WHM/cPanel
Fajar Mukharom
3.5/5 (6)