CI 1
Codeigniter merupakan sebuah framework PHP yang menggunakan
pola desain (design pattern)
https://codeigniter.com/download
Instalasi CI
1.
Ekstrak file CodeIgniter-3.1.9.zip
di htdocs
2.
Rename menjadi ciku
3.
Buka http://localhost/ciku
4.
Muncul tulisan “Welcome to
CodeIgniter!”
5.
Instalasi selesai.
Membuat Teks
1.
Buka
application/views/welcome_message.php. Lalu ubah teks pada baris 70.
2.
Muncul script berikut ini:
<div id="container">
<h1>Welcome to
CodeIgniter!</h1>
<div
id="body">
3.
Ganti “<h1>Welcome to
CodeIgniter!</h1>” menjadi
<h1>Belajar CI Pertama kali!</h1>
4.
Reload di browser.
MVC
MVC (Model, View, Controller) adalah sebuah pola desain
(design pattern) arsitektur pengembangan aplikasi.
1.
Buka application/config/routes.php
2.
Perhatikan:
http://localhost/ciku/
hasilnya akan sama dengan http://localhost/ciku/index.php/welcome/index
3.
Buka
application/controllers/welcome.php
4.
Perhatikan script ini di
baris 20:
public function index()
{
$this->load->view('welcome_message');
}
5.
Tambahkan script route berikut
ini:
public function profil()
{
//
fungsi untuk me-load view profil.php
$this->load->view('profil');
}
public function kontak()
{
//
fungsi untuk me-load view kontak.php
$this->load->view('kontak');
}
6.
Tambahkan file about.php di
application/views
7.
Tambahkan file contact.php
di application/views
8.
Buka
http://localhost/ciku/index.php/welcome/profil/
atau
http://localhost/ciku/index.php/welcome/kontak/
9.
Jika muncul error 404 Page
Not Found
10.
Buka application/config/routes.php
11.
Muncul teks berikut ini:
$route['default_controller'] =
"welcome";
$route['404_override'] = '';
12.
Tambahkan script berikut
ini:
$route['about'] = 'welcome/profil';
$route['contact'] = 'welcome/kontak';
13.
Reload lagi http://localhost/ciku/index.php/welcome/contact
BOOTSTRAP
1.
Download template SB-Admin https://startbootstrap.com/template-overviews/sb-admin/
(Bootstrap 4)
2.
Buka application/config/config.php
3.
Lihat script baris 25
$config['base_url'] = '';
4.
Ubah menjadi
$config['base_url'] = 'http://localhost/ciku/';
5.
Buka config/autoload.php
6.
Cari tulisan $autoload['helper']
7.
Ubah menjadi $autoload['helper']
= array(‘url’);
8.
Buka config/constants.php
9.
Tambahkan script ini di
bagian akhir
define('SITE_NAME', 'Ciku');
10.
Ekstrak file SB-Admin di
folder masing-masing (drive D)
11.
Copy folder berikut ini ke
htdocs/ciku:
css
js
vendor
12.
Folder vendor ubah menjadi assets
13.
Buka application/views
14.
Buatlah folder admin
15.
Di folder admin, buatlah file
tampil.php (kosongkan dulu)
16.
Buka index.html di folder
SB-Admin
17.
Copy semua script dari index.html
18.
Paste di tampil.php
19.
Simpan
20.
Buka application/controllers
21.
Buat folder admin
22.
Buatlah controller dengan
nama Tampil.php dalam folder admin tersebut
23.
Ketik script berikut ini:
<?php
class Tampil extends CI_Controller {
public function __construct()
{
parent::__construct();
}
public function index()
{
//
load view admin/tampil.php
$this->load->view("admin/tampil");
}
}
24.
Buka config/routes.php
25.
Tambahkan script ini:
$route['admin'] = 'admin/tampil';
26.
Buka http://localhost/ciku/index.php/admin/
27.
Tampilannya masih acak-acakan
28.
Buka views/admin/tampil.php
29.
Lihat script ini:
<title>SB Admin - Dashboard</title>
<!-- Custom fonts for this
template-->
<link
href="vendor/fontawesome-free/css/all.min.css"
rel="stylesheet" type="text/css">
<!-- Page level plugin
CSS-->
<link
href="vendor/datatables/dataTables.bootstrap4.css"
rel="stylesheet">
<!-- Custom styles for this
template-->
<link
href="css/sb-admin.css" rel="stylesheet">
30.
Ubah menjadi:
<title>SB Admin - Dashboard</title>
<!-- Bootstrap core CSS-->
<link href="<?php echo
base_url('assets/bootstrap/css/bootstrap.min.css') ?>"
rel="stylesheet">
<!-- Custom fonts for this template-->
<link href="<?php echo
base_url('assets/fontawesome-free/css/all.min.css') ?>"
rel="stylesheet" type="text/css">
<!-- Page level plugin CSS-->
<link href="<?php echo
base_url('assets/datatables/dataTables.bootstrap4.css') ?>"
rel="stylesheet">
<!-- Custom styles for this template-->
<link href="<?php echo base_url('css/sb-admin.css')
?>" rel="stylesheet">
31.
Lihat script ini:
<!-- Bootstrap core JavaScript-->
<script src="vendor/jquery/jquery.min.js"></script>
<script
src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Core plugin JavaScript-->
<script
src="vendor/jquery-easing/jquery.easing.min.js"></script>
<!-- Page level plugin JavaScript-->
<script
src="vendor/chart.js/Chart.min.js"></script>
<script
src="vendor/datatables/jquery.dataTables.js"></script>
<script
src="vendor/datatables/dataTables.bootstrap4.js"></script>
<!-- Custom scripts for all pages-->
<script src="js/sb-admin.min.js"></script>
<!-- Demo scripts for this page-->
<script src="js/demo/datatables-demo.js"></script>
<script src="js/demo/chart-area-demo.js"></script>
32.
Ubah menjadi:
<!-- Bootstrap core JavaScript-->
<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>
<!-- Core plugin JavaScript-->
<script src="<?php echo
base_url('assets/jquery-easing/jquery.easing.min.js')
?>"></script>
<!-- Page level plugin JavaScript-->
<script src="<?php echo
base_url('assets/chart.js/Chart.min.js') ?>"></script>
<script src="<?php echo
base_url('assets/datatables/jquery.dataTables.js')
?>"></script>
<script src="<?php echo base_url('assets/datatables/dataTables.bootstrap4.js')
?>"></script>
<!-- Custom scripts for all pages-->
<script src="<?php echo base_url('js/sb-admin.min.js')
?>"></script>
<!-- Demo scripts for this page-->
<script src="<?php echo base_url('js/demo/datatables-demo.js')
?>"></script>
<script src="<?php echo base_url('js/demo/chart-area-demo.js')
?>"></script>
34. Hasilnya seperti ini:
35.
Bersambung…
**
Referensi:
Bitcoin Offers:
Free Bitcoin, Double Bitcoin, Bitcoin Investment, Bitcoin Trading
"Bitcoin and Forex are high risk business. We must join them smartly."
No comments:
Post a Comment