Monitoring aplikasi dengan Sentry.io dan di integrasikan dengan Slack

Dalam membuat sebuah aplikasi yang kompleks dan dengan dikerjakan secara bersama-sama oleh tim. Tentu membuat pekerjaan kita menjadi lebih ringan. Namun, bukan berarti menjadi lebih mudah. Benar bukan?

Nah, pada tulisan kali ini saya tidak membahas bagaimana cara membuat aplikasi lebih mudah, namun yang kita bahas adalah membuat kinerja kita menjadi maksimal. Banyak cara yang bisa dilakukan untuk memaksimalkan kinerja kita untuk membuat aplikasi yang berkualitas. Salah satunya yaitu melakukan Functional Testing, Unit Testing, Monitoring App, dan lain sebagainya.

Dari sekian banyaknya pembahasan untuk membuat aplikasi yang berkualitas, disini saya akan memberikan tutorial cara pemasangan Sentry pada aplikasi kita agar dapat di monitoring secara berkala dan memberikan laporan bug secara realtime.

Baiklah, berikut langkah-langkah yang harus kalian ikuti untuk pemasangan sentry.io.


1. Membuat akun sentry.io

Buatlah akun sentry.io terlebih dahulu untuk memulai pemasangan ke aplikasi kita. Sentry.io ada versi gratis dan juga berbayar. Nah, kalian tidak perlu khawatir untuk ditagih dalam 30 hari kemudian atau yang lebih dikenal dengan versi trial. Karena, sentry.io ada versi free (gratis) hanya saja untuk fitur-fitur tertentu kita harus upgrade account. Silahkan lakukan pendaftaran akun pada link berikut disini.

2. Membuat project baru

Buatlah project baru untuk kalian install di aplikasi web yang ingin di monitoring. Tekan tombol di pojok kanan dan pilih Project seperti gambar berikut.

Setelah itu kalian akan diminta untuk memilih salah satu framework yang dipakai. Dalam kasus ini saya memilih Laravel sebagai framework yang dipakai. Saya sesuaikan dengan framework yang digunakan dalam pembuatan aplikasi web. Selanjutnya, pada langkah kedua berilah nama project yang akan digunakan.

3. Instalasi sentry.io ke project laravel app

Pada tahap ini kalian diminta untuk memasang konfigurasi sentry.io kedalam aplikasi kalian dengan menggunakan Framework Laravel. Perlu diperhatikan untuk melakukan konfigurasi ini harus di sesuaikan dengan versi laravel yang digunakan. Untuk dokumentasi lengkapnya bisa kalian baca disini.
Atau anda bisa mengikuti langkah-langkah konfigurasi seperti berikut ini :

Laravel 5.x
Install package sentry/sentry-laravel :

$ composer require sentry/sentry-laravel

Jika anda menggunakan Laravel versi 5.4 atau dibawahnya. Anda harus menambahkan kode dibawah ini pada file config/app.php (Untuk Laravel versi 5.5+ kode dibawah ini akan di discovered secara otomatis).

'providers' => array(
    // ...
    Sentry\SentryLaravel\SentryLaravelServiceProvider::class,
)

'aliases' => array(
    // ...
    'Sentry' => Sentry\SentryLaravel\SentryFacade::class,
)

Tulislah kode untuk sentry reporting pada App/Exceptions/Handler.php :

public function report(Exception $exception)
{
    if (app()->bound('sentry') && $this->shouldReport($exception)) {
        app('sentry')->captureException($exception);
    }

    parent::report($exception);
}

Buatlah konfigurasi file dengan perintah di terminal seperti berikut (config/sentry.php) :

$ php artisan vendor:publish --provider="Sentry\SentryLaravel\SentryLaravelServiceProvider"

Tambahkan Sentry DSN pada file .env :

SENTRY_LARAVEL_DSN=https://a7dda7c9bef343a5b16148ce73cadd0b@sentry.io/xxxx501

Apabila anda menggunakan versi yang lain untuk Laravel Framework anda bisa membaca detailnya disini.

4. Integrasi dengan slack

Untuk memonitoring aplikasi kita di workspace, khususnya slack yang sering kita gunakan dalam bekerja bersama tim, ini merupakan hal sangat membantu kinerja kita. Nah, untuk mengaktifkan integrasi dengan slack adalah anda masuk ke menu Setting - Alert, lalu dibagian bawah anda akan disuguhkan tampilan board Inactive Integrations. Pilihlah slack untuk mengaktifkan integrasi slack dengan sentry.

Setelah itu anda akan di arahkan ke form ini :

• Webhook URL anda bisa mendapatkannya melalui link disini. Saya tidak akan menjelaskan bagaimana caranya membuat webhook karena pemabahasannya terlalu panjang. Bila ada pertanyaan silahkan ajukan di kolom komentar.
• Bot Name silahkan di sesuaikan dengan yang anda inginkan.
• Icon URL bersifat opsional, gunanya untuk menampilkan profile photo di slack nanti ketika memberikan notifikasi.
• Destionation itu adalah alamat yang ingin di tuju. Apabila ingin di mention ke tim bisa menggunakan #nama_group atau di mention ke personal menggunakan @nama_user.

Nah. Pada tahap integrasi dengan slack telah selesai. Anda bisa melakukan test dengan menekan tombol Test Plugin.

Pemasangan sentry.io telah selesai dan yayy..... Selamat mengerjakan aplikasi tanpa khawatir bug tersembunyi. Silahkan makan snack dan ngopi sepuasnya.... Jangan lupa komen dan share artikel ini. thank you guys.....

Send Message without saving phone number use Whatsapp Application

Maybe from us often get job assignment to write a message to any number through Whatsapp Application. However, the application requires us to save the number first. complicated isn't? Well, from that problem I finally made a simple application that I named Ochat Whatsapp.

This application can be used for those of you who want to send messages through the Whatsapp Application without having to save the number.

Here's a screenshot of the app :

I made this app open source. So, please if you want to develop better. Here's the application download link :

Automatic Testing Laravel Project with Codeception

I have written about how to perform automated testing with Codeception. Well, you can read through the following link here.

Check Internet During Splashscreen WebView Tutorial - Android Studio

Hallo pembaca setia oimtrust?

Bagi kalian yang baru belajar membuat aplikasi android. Mungkin tutorial ini bermanfaat buat kalian semua. oimtrust harap sih begitu, hehe. Nah, pembahasan kali ini adalah membuat aplikasi webview sederhana dengan memperiksa apabila tidak ada koneksi internet.

Nah, kapan kita menggunakan webview? itu tergantung dari aplikasi yang nantinya akan kita buat. Contoh-nya webview itu seperti apa sih? Yah apa yaaa... ketika kalian buka aplikasi, terus aplikasi itu me-load dari browser, misalkan telegram ketika ada link yang kita buka. itu kurang lebih menggunakan webview. dan masih banyak lagi contoh-contoh yang lain.

Sekarang, marilah kita buat aplikasi webview sederhana. Untuk langkah-langkah pertama membuat aplikasi android oimtrust rasa teman-teman sudah bisa. Apabila belum bisa teman-teman bisa membaca tutorial dari blog lain atau dari dokumentasinya langsung disini.

Apabila telah memulai membuat aplikasi android (Default: aplikasi teman-teman sudah tersedia MainActivity.java dan activity_main.xml) buatlah activity baru dengan nama WebsiteActivity.java (Ingat!! pilihlah Empty Activity).

Allright, kita memulai project baru dengan nama aplikasi bebas dengan keinginan kalian sendiri. Apabila kalian telah membuat project baru. Pada file activity_main.xml ubahlah seperti ini :



Pada activity_main.xml ini kita gunakan untuk memberitahukan kepada user bahwa aplikasi ini membutuhkan koneksi internet. Maka, diperlukan sebuah view yang menunjukkan kepada user menggunakan ProgressBar.

Selanjutnya pada file activity_website.xml (Aktiviti ini muncul otomatis ketika kalian membuat aktiviti WebsiteActivity.java) silahkan kalian tulis seperti ini :



Nah, pada file activity_website.xml ini digunakan untuk menampilkan link url website yang kita masukkan kedalam webview. Lalu, apakah sampai sini sudah selesai? Oh tentu belum. Selanjutnya kita akan menggunakan logic di java untuk mengeksekusi aplikasi ini.

Next, bukalah file MainActivity.java dan tulislah kode program seperti ini : (Ingat, sesuaikan dengan aplikasi yang kalian tulis. Dipahami jangan di COPAS). Sip..



Pada file MainActivity.java ini kita membuat sebuah handling error ketika ada tidaknya koneksi internet. Apabila ada koneksi internet maka akan membuka website yang dituju, dan apabila tidak ada koneksi internet maka akan memberikan peringatan kepada user bahwa aplikasi ini tidak akan berjalan seperti yang diharapkan.

Nah, ketika teman-teman menulis kode ini pasti akan mengalami error ketika memanggil data dari drawable. Silahkan download gambar icon berikut disini untuk mengatasi error tersebut. Selanjutnya, handling error ini tidak akan berjalan apabila kita belum memberikan hak akses atau permission. Pada file manifests/AndroidManifest.xml berilah permission seperti berikut ini :



Next again, bukalah pada file WebsiteActivity.java dan tulislah kode seperti berikut ini:



Nah, pada file WebsiteActivity.java kita memanggil url yang ingin ditampilkan. Dalam kasus yang oimtrust tulis menggunakan alamat http://www.oimtrust.net/ silahkan sesuai dengan url yang ingin kalian jalankan.

Silahkan kalian jalankan aplikasinya, dan semoga berhasil. Hasil akhirnya nanti seperti gambar dibawah ini :

Apabila tidak terkoneksi dengan internet :

Dan apabila terkoneksi dengan internet maka akan muncul seperti ini :

Source code bisa teman-teman download disini :

Developer pemula itu....???? DevNotes#1

Free Download Aplikasi Sederhana CRUD Dengan Menggunakan PHP OOP

Hallo pembaca setia Oimtrust??

Ups... kok oimtrust?? Yups, sebelumnya kan Otrust jadi sekarang pake nama asli aja. panggil aja oim atau saya sendiri akan memanggil oimtrust. Saya?? Haha.... ah udahlah nggak usah di bahas.

Sudah lama oimtrust nggak nulis nih. Kalian pada kangen yah? Apa, nggak?? Makasih dah udah jujur. Tapi nggak apa-apa oimtrust sendiri juga ikhlas menerimanya. wkwkwkw.

Sesuai dengan judul yang oimtrust tulis, karena belum sempat memposting tutorial akhirnya mau nggak mau lebih baik posting source code gratis. Nah, source code yang oimtrust bagikan kali ini adalah aplikasi CRUD sederhana. Aplikasi ini menggunakan Framework CSS Materializecss yang teman-teman bisa download disini, dan memanfaatkan icon dari Material Design Icon yang bisa di download disini. Supaya terlihat cantik validasi form-nya saya menggunakan Sweet Alert, download aja disini.

Nah, untuk menjalankan aplikasi ini ada beberapa hal yang perlu diperhatikan. Pada file app.php di direktori crud-oop-mysqli/apps/config pada variabel $baseUrl silahkan teman-teman sesuaikan dengan alamat host masing-masing. Dan karena untuk tampilannya saya menggunakan CDN (Content Delivery Network) Maka untuk pertama kali menjalankan aplikasi ini harus online.

Untuk Screenshot tampilannya seperti ini:

1. Halaman Home

2. Halaman Artikel

Untuk halaman selanjutnya silahkan jalankan di PC kalian aja ya guys. Hehee... Nah, untuk download source code cukup klik aja link disini.

Jangan lupa untuk komentar dan share blog oimtrust ke teman-teman kalian ya guys. Dan bantu oimtrust untuk memberikan kritik dan saran atau masukan judul untuk menulis tutorial/artikel selanjutnya. Trims's and happy coding.

PHP - Membuat Dynamix Selectbox Dan Inputbox dengan Ajax dan MySQL

Hallo pembaca setia Otrust?

Otrust kali ini akan membahas tentang dynamix selectbox. Sebenarnya sudah banyak sih tutorial tentang ini, namun menurut Otrust masih banyak yang kurang (Eits… Tulisan Otrust juga banyak yang kurang kok :-D). Setidaknya disini Otrust akan memberikan tutorial dynamix selectbox beserta inputbox. Nah, jadi ilustrasinya seperti gambar berikut:

Dimana ketika kita memilih selectbox1 maka secara otomatis pada textbox akan terisi data dan pada selectbox2 akan muncul pilihan data, begitu selanjutnya pada selectbox3. Tentu dalam pembuatan ini Otrust menggunakan MySQL dan AJAX. Penasaran bagaimana cara membuatnya? Simak langkah-langkah berikut ini:

1. Langkah pertama adalah menyiapkan folder dan file yang dibutuhkan. Buatlah folder dan file mengikuti struktur projek seperti berikut ini: 

2. Buatlah database beserta tabel seperti source code berikut ini menggunakan sql :

--

-- Database: `blogger`

--

CREATE DATABASE blogger;

USE blogger;

--

-- Table structure for table `tbl_class`

--

CREATE TABLE `tbl_class` (

  `id_class` int(11) NOT NULL,

  `class_name` varchar(50) NOT NULL,

  `price` int(10) NOT NULL DEFAULT '0'

) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--

-- Dumping data for table `tbl_class`

--

INSERT INTO `tbl_class` (`id_class`, `class_name`, `price`) VALUES

(1, 'Standard', 250000),

(2, 'Mewah', 400000),

(3, 'Super Mewah', 500000),

(4, 'Medium', 300000),

(5, 'VIP', 600000);

--

-- Table structure for table `tbl_renter`

--

CREATE TABLE `tbl_renter` (

  `id_renter` int(11) NOT NULL,

  `fullname` varchar(75) NOT NULL,

  `id_room` int(10) NOT NULL

) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--

-- Dumping data for table `tbl_renter`

--

INSERT INTO `tbl_renter` (`id_renter`, `fullname`, `id_room`) VALUES

(1, 'Faris Jourdy', 4),

(2, 'Fathur Rohim', 4),

(3, 'Faisal Amri', 3),

(4, 'Faris Jourdy', 3),

(5, 'Fanani', 2),

(6, 'Ivan', 1);

--

-- Table structure for table `tbl_rooms`

--

CREATE TABLE `tbl_rooms` (

  `id_room` int(10) NOT NULL,

  `room_name` varchar(50) NOT NULL,

  `id_class` int(11) NOT NULL

) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--

-- Dumping data for table `tbl_rooms`

--

INSERT INTO `tbl_rooms` (`id_room`, `room_name`, `id_class`) VALUES

(1, 'Kamar 1', 1),

(2, 'Kamar 2', 2),

(3, 'Kamar 3', 2),

(4, 'Kamar 4', 3);

--

-- Indexes for dumped tables

--

--

-- Indexes for table `tbl_class`

--

ALTER TABLE `tbl_class`

  ADD PRIMARY KEY (`id_class`);

--

-- Indexes for table `tbl_renter`

--

ALTER TABLE `tbl_renter`

  ADD PRIMARY KEY (`id_renter`),

  ADD KEY `id_room` (`id_room`);

--

-- Indexes for table `tbl_rooms`

--

ALTER TABLE `tbl_rooms`

  ADD PRIMARY KEY (`id_room`),

  ADD KEY `id_class` (`id_class`);

--

-- AUTO_INCREMENT for dumped tables

--

--

-- AUTO_INCREMENT for table `tbl_class`

--

ALTER TABLE `tbl_class`

  MODIFY `id_class` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=6;

--

-- AUTO_INCREMENT for table `tbl_renter`

--

ALTER TABLE `tbl_renter`

  MODIFY `id_renter` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=7;

--

-- AUTO_INCREMENT for table `tbl_rooms`

--

ALTER TABLE `tbl_rooms`

  MODIFY `id_room` int(10) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=5;

3. Lalu pada file database.php aturlah source code-nya seperti ini:

<?php 
 /**
 * Database Class
 */
 class Database
 {
 private $hostname = "localhost";
 private $dbname = "blogger";
 private $username = "root";
 private $password = "";
 public $conn;


function dbConnection()
 {
 $this->conn = null;
 try {
 $this->conn = new PDO("mysql:host=" . $this->hostname . ";dbname=" . $this->dbname, $this->username, $this->password);
 $this->conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
 } catch (PDOException $exception) {
 echo "Connection error: " . $exception->getMessage();
 }
 return $this->conn; 
 }
 }
 ?>

4. Setelah itu pada file class.dynamix.php tulislah kode seperti berikut ini:

<?php 
 require_once 'database.php';


/**
 * Dynamix Class
 */
 class DYNAMIX
 {
 private $conn;
 function __construct()
 {
 $database = new Database();
 $db = $database->dbConnection();
 $this->conn = $db;
 }


public function runQuery($sql)
 {
 $stmt = $this->conn->prepare($sql);
 return $stmt;
 }
 }
 ?>

5. Apabila telah selesai kita atur untuk koneksi database seperti langkah-langkah sebelumnya. Maka, sekarang kita akan mengatur tampilannya. Pada header.blade.php aturlah source code seperti berikut ini:

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title>Biodata</title>


<!-- Bootstrap CSS -->
 <link rel="stylesheet" href="asset/css/bootstrap.min.css">
 <link rel="stylesheet" href="asset/css/bootstrap-theme.min.css">


<!-- Jquery JS -->
 <script src="asset/js/jquery.js"></script>
 
 <!-- Bootstrap JS -->
 <script src="asset/js/bootstrap.min.js"></script>


<!-- Dynamix JS -->
 <script type="text/javascript">
 $(document).ready(function(argument) {
 //untuk dynamix room
 $('#id_class').change(function() {
 var id = $(this).val();
 var dataString = 'id=' + id;


$.ajax
 ({
 type : "POST",
 url : "dynamix-room.php",
 data : dataString,
 dataType: 'JSON',
 cache : false,
 success : function(responses)
 {
 //untuk mengisi data kelas
 $('#price').val(responses.price)


//untuk isi selectbox room
 $('#id_room').find('option').remove();
 $('#id_room').append('<option selected="selected">--Pilih Kamar--</option>');
 $.each(responses.room_name, function(key, val){
 $('#id_room').append('<option value="'+ val.id_room +'">'+ val.room_name +'</option>');
 });
 }
 });
 });


$("#id_room").change(function()
 {
 var id = $(this).val();
 var dataString = 'id_room=' + id;


$.ajax
 ({
 type : "POST",
 url : "dynamix-renter.php",
 data : dataString,
 cache : false,
 success : function(html)
 {
 $('#id_renter').html(html);
 }
 });
 });
 })
 </script>


</head>
<body>

Lalu perhatikan kode tersebut. Terdapat Dynamix JS dimana perintah tersebut adalah memanggil setiap ID dari field yang ada di form yang akan di eksekusi. Nah, pada perintah untuk memunculkan data dari id_class tersebut menggunakan JSON. Dikarenakan data outputnya nanti ada 2, yaitu muncul di textbox dan di selectbox2. Selanjutnya pada file dynamix-room.php tulislah kode seperti ini:

<?php 
 require_once 'app/model/class.dynamix.php';


$dynamix = new DYNAMIX();


if ($_POST['id']) {
 $iclass = $_POST['id'];
 $stmt = $dynamix->runQuery("SELECT * FROM tbl_rooms WHERE id_room=:id");
 $stmt->execute(array(':id' => $iclass));
 $dataRoom = [];


while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
 $room = [];
 $room['id_room'] = $row['id_room'];
 $room['room_name'] = $row['room_name'];


$dataRoom[] = $room;
 }


$stmt = $dynamix->runQuery("SELECT cls.price FROM tbl_class AS cls WHERE id_class=:id");
 $stmt->execute(array(':id' => $iclass));


$getPrice = [];


$row = $stmt->fetch(PDO::FETCH_ASSOC);
 $getPrice = $row['price'];


$returnData = [
 'price' => $getPrice,
 'room_name' => $dataRoom
 ];
 echo json_encode($returnData);
 }
 ?>

Lalu selanjutnya adalah ketika kita memilih selectbox2 maka pada selectbox3 akan muncul data untuk dipilih. Tulislah source code pada file dynamix-renter.php seperti ini:

<?php 
 require_once 'app/model/class.dynamix.php';


$dynamix = new DYNAMIX();


if ($_POST['id_room']) {
 $iroom = $_POST['id_room'];
 $stmt = $dynamix->runQuery("SELECT * FROM tbl_renter WHERE id_room=:iroom");
 $stmt->execute(array(':iroom' => $iroom));
 ?>


<option selected="selected">--Pilih Pemesan--</option>
 <?php
 while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) { ?>
 <option value="<?php echo $row['id_renter']; ?>"><?php echo $row['fullname']; ?></option>
 <?php
 }
 }
 ?>

6. Untuk perintah ajax telah selesai kita buat pada file header.blade.php. Selanjutnya pada file index.blade.php tulislah kode seperti berikut ini:

<div class="container">
 <div class="row">
 <div class="col-lg-12">
 <h1 class="page-header"></h1>
 <h1 class="page-header">Dynamix</h1>
 <ol class="breadcrumb">
 <li class="active">Home</li>
 </ol>
 </div>
 </div>


<div class="row">
 <div class="col-md-12">
 <div class="col-lg-12">
 <!-- Data is here -->
 <form method="post" role="form" action="" name="paymentForm">
 <div class="col-md-4">
 <div class="control-group form-group">
 <div class="controls">
 <label>Jenis Kelas:</label>
 <select name="id_class" id="id_class" class="form-control">
 <option selected="selected">--Pilih Kelas--</option>
 <?php echo $iclass; ?>
 </select>
 </div>
 </div>


<div class="control-group form-group">
 <div class="controls">
 <label>Harga:</label>
 <div class="input-group">
 <span class="input-group-addon">Rp.</span>
 <input type="number" name="price" id="price" class="form-control" required readonly="readonly">
 </div>
 </div>
 </div>


<div class="control-group form-group">
 <div class="controls">
 <label>Nama Kamar:</label>
 <select id="id_room" name="id_room" class="form-control">
 <option selected="selected">--Pilih Kamar--</option>
 </select>
 </div>
 </div>


<div class="control-group form-group">
 <div class="controls">
 <label>Nama Pemesan:</label>
 <select id="id_renter" name="id_renter" class="form-control">
 <option selected="selected">--Pilih Pemesan--</option>
 </select>
 </div>
 </div>
 </div>
 </form>
 </div>
 </div>
 </div>
</div>


<br>

7. Pada bagian menunya jangan lupa, file menu.blade.php tulislah seperti berikut:

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
 <div class="container">
 <div class="navbar-header">
 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navcollapse">
 <span class="sr-only">Toggle navigation</span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 </button>
 <a href="index.php" class="navbar-brand">Dynamix</a>
 </div>
 <div class="collapse navbar-collapse" id="navcollapse">
 <ul class="nav navbar-nav navbar-right">
 <li><a href="#">Link Tutorial</a></li>
 <li><a href="https://www.facebook.com/otrusttutorial/" target="blank">Facebook</a></li>
 </ul>
 </div>
 </div>
</nav>

Dan pada footer.blade.php tulislah seperti ini:

<!-- Footer -->
 <div class="container">
 <div class="row">
 <div class="col-lg-12">
 <div class="navbar-fixed-bottom">
 <p>Copyright &copy; otrust.blogspot.com 2017</p>
 </div>
 </div> 
 </div>
 </div>
</body>
</html>

8. Sesi terakhir adalah pada file index.php. Tulislah source code seperti ini:

<?php 
 require_once 'app/model/class.dynamix.php';


$dynamix = new DYNAMIX();


$iclass = '';
 $stmt = $dynamix->runQuery("SELECT * FROM tbl_class");
 $stmt->execute();


while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
 $iclass .= "<option value='".$row['id_class']."'>".$row['class_name']."</option>";
 }


include 'app/view/header.blade.php';
 include 'app/view/menu.blade.php';
 include 'app/view/index.blade.php';
 include 'app/view/footer.blade.php';
 ?>

Tadaaa.... telah selesai guys. Eitz... ada yang lupa nih. Pada folder asset teman-teman harus mendownload file bootstrap dan jquery lalu folder css, fonts, dan js pindahkan ke folder asset. Untuk mendownload file bootstrap disini dan untuk jquery disini. Dan pada file .htaccess tulislah kode seperti ini:

Deny From All

Lalu jalankan, nanti hasilnya seperti ini:

Happy coding guys! dan selamat mengerjakan. Apabila masih kebingungan jangan sungkan-sungkan untuk bertanya di kolom komentar. Terima kasih. :-)

PHP - Membuat Pagination dengan PHP MySQL Menggunakan PDO Berbasis OOP

Hallo pembaca setia Otrust!!

Kita telah belajar membuat CRUD di tutorial sebelumnya. Di tutorial yang Otrust buat adalah melakukan insert data dan ditampilkan didalam tabel. Namun, ada beberapa yang perlu kaliah ketahui, yaitu ketika data mulai banyak maka otomatis data yang ditampilkan di tabel tersebut akan ke bawah hingga batas terakhir data yang ada. Nah, kendalanya adalah ketika kita membuat website seperti itu, website kita tidaklah efisien. Lalu, bagaimana cara mengatasinya? Tentu kita harus membuat page perhalaman atau kita sebut istilahnya dengan pagination.

Nah, dari masalah tersebut Otrust telah selesai nih menulis tutorial pagination. Silahkan disimak dibawah ini yah guys.

1. Seperti halnya di tutorial sebelumnya, kita membuat struktur folder dan file-nya seperti berikut ini: 

Tidak jauh berbeda dengan tutorial sebelumnya, pada file .htaccess silahkan ditulis “Deny from all” tanpa tanda petik. Dan pada folder asset silahkan mendownload framework css dari Bootstrap disini dan file javascript dari jquery disini.

2. Buatlah database dan tabelnya seperti berikut ini:

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";

CREATE DATABASE blogger;

CREATE TABLE `biodata` (
`id_bio` int(11) NOT NULL,
`nama` varchar(50) NOT NULL,
`phone` varchar(14) NOT NULL,
`alamat` varchar(100) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

INSERT INTO `biodata` (`id_bio`, `nama`, `phone`, `alamat`) VALUES
(1, 'Otrust', '097878787', 'Bengkulu'),
(2, 'Tutorial', '0878667675888', 'Malang'),
(5, 'Otrust Tutorial', '089787788', 'Kangean'),
(6, 'Otrust Tutorial', '089787788', 'Malang'),
(7, 'Otrust Tutorial', '089787788', 'Malang'),
(8, 'Otrust Tutorial', '089787788', 'Malang'),
(9, 'Otrust Tutorial', '089787788', 'Malang'),
(10, 'Otrust Tutorial', '089787788', 'Malang'),
(11, 'Otrust Tutorial', '089787788', 'Malang'),
(12, 'Otrust Tutorial', '089787788', 'Malang'),
(13, 'Otrust Tutorial', '089787788', 'Malang'),
(14, 'Otrust Tutorial', '089787788', 'Malang'),
(15, 'Otrust Tutorial', '089787788', 'Malang'),
(16, 'Otrust Tutorial', '089787788', 'Malang'),
(17, 'Otrust Tutorial', '089787788', 'Malang'),
(18, 'Otrust Tutorial', '089787788', 'Malang'),
(19, 'Otrust Tutorial', '089787788', 'Malang'),
(20, 'Otrust Tutorial', '089787788', 'Malang'),
(21, 'Otrust Tutorial', '089787788', 'Malang'),
(22, 'Otrust Tutorial', '089787788', 'Malang'),
(23, 'Otrust Tutorial', '089787788', 'Malang'),
(24, 'Otrust Tutorial', '089787788', 'Malang'),
(25, 'Otrust Tutorial', '089787788', 'Malang');

ALTER TABLE `biodata`
ADD PRIMARY KEY (`id_bio`);

ALTER TABLE `biodata`
MODIFY `id_bio` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=26;

3. Selanjutnya pada file database.php tulislah kode seperti berikut ini:

<?php 
 /**
 * Database Class
 */
 class Database
 {
  private $hostname  = "localhost";
  private $dbname  = "blogger";
  private $username = "root";
  private $password = "";
  public $conn;

  function dbConnection()
  {
   $this->conn  = null;
         try {
          $this->conn = new PDO("mysql:host=" . $this->hostname . ";dbname=" . $this->dbname, $this->username, $this->password);
          $this->conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
         } catch (PDOException $exception) {
          echo "Connection error: " . $exception->getMessage();
         }
         return $this->conn; 
  }
 }
?>

4. Pada file class.pagination.php tulislah kode seperti berikut:

<?php 
 require_once 'database.php';
 $db  = new Database();
 $conn  = $db->dbConnection();
 $start    = 0;
 $page_counter  = 0;
 $per_page  = 5;
 $next   = $page_counter + 1;
 $previous  = $page_counter - 1;
 if (isset($_GET['start'])) {
  $start    = $_GET['start'];
  $page_counter = $_GET['start'];
  $start   = $start * $per_page;
  $next    = $page_counter + 1;
  $previous  = $page_counter - 1;
 }

 $sql = "SELECT * FROM biodata LIMIT $start, $per_page";
 $query = $conn->prepare($sql);
 $query->execute();
 $result = null;
 if ($query->rowCount() == 0) {
 }
 else {
  while ($row = $query->fetch(PDO::FETCH_ASSOC)) {
   $result[] = "<td>".$row['nama']."</td><td>".$row['phone']."</td><td>".$row['alamat']."</td>";
  }
 }
 $count_query = "SELECT * FROM biodata";
 $query    = $conn->prepare($count_query);
 $query->execute();
 $count    = $num_rows = $query->rowCount();
 $paginations = ceil($count / $per_page);
 ?>

5. Sekarang kita berfokus pada folder view yang mana tugasnya adalah sebagai tempat file-file yang menampilkan interface dari website kita. Pada file header.blade.php tulislah kode berikut:

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <title>Biodata</title>
 <!-- Bootstrap CSS -->
 <link rel="stylesheet" href="asset/css/bootstrap.min.css">
 <link rel="stylesheet" href="asset/css/bootstrap-theme.min.css">
 <!-- Jquery JS -->
 <script src="asset/js/jquery.js"></script> 
 <!-- Bootstrap JS -->
 <script src="asset/js/bootstrap.min.js"></script>
</head>
<body>

Kode pada file menu.blade.php seperti ini:

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
 <div class="container">
  <div class="navbar-header">
   <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navcollapse">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
   </button>
   <a href="index.php" class="navbar-brand">Biodata</a>
  </div>
  <div class="collapse navbar-collapse" id="navcollapse">
   <ul class="nav navbar-nav navbar-right">
    <li><a href="https://otrust.blogspot.co.id/2017/01/php-membuat-pagination-dengan-php-mysql.html">Link Tutorial</a></li>
    <li><a href="https://www.facebook.com/otrusttutorial/" target="blank">Facebook</a></li>
   </ul>
  </div>
 </div>
</nav>

Pada file index.blade.php seperti ini:

<div class="container">
 <div class="row">
  <div class="col-lg-12">
   <h1 class="page-header"></h1>
   <h1 class="page-header">Biodata</h1>
   <ol class="breadcrumb">
    <li class="active">Home</li>
   </ol>
  </div>
 </div>

 <div class="row">
  <div class="col-md-12">
   <div class="page-header"></div>
   <div class="col-lg-12">
    <div class="table-responsive">
     <table id="data" class="table table-striped table-bordered table-hover">
      <thead>
       <tr bgcolor="#607D8B">
        <th>No.</th>
        <th>Nama</th>
        <th>Telepon</th>
        <th>Alamat</th>
       </tr>
      </thead>
      <tbody>
       <?php $no = 1; ?>
       <tr>
        <?php for ($i=0; $i < count($result); $i++) { 
         echo "<td>".$no++."</td>";
         echo $result[$i]."</tr>";
        } 
        ?>
       </tr>
      </tbody>
     </table>
    </div>

    <nav aria-label="...">
     <ul class="pagination pagination-lg">
      <?php 
       if ($page_counter == 0) {
        echo "<li><a href=?start='0' class='active'>0</a></li>";
        for ($j=1; $j < $paginations; $j++) { 
         echo "<li><a href=?start=$j>".$j."</a></li>";
        }
       }
       else{
        echo "<li><a href=?start=$previous>Previous</a></li>";
        for ($j=0; $j < $paginations; $j++) { 
         if ($j == $page_counter) {
          echo "<li><a href=?start=$j class='active'>".$j."</a></li>";
         }
         else {
          echo "<li><a href=?start=$j>".$j."</a></li>";
         }
        }
        if ($j != $page_counter + 1) {
         echo "<li><a href=?start=$next>Next</a></li>";
        }
       }
       ?>
     </ul>
    </nav>
   </div>
  </div>
 </div>
</div>

<br>

Dan terakhir pada file footer.blade.php seperti berikut ini:

<!-- Footer -->
 <footer>
  <div class="row">
   <div class="col-lg-12">
    <p>Copyright &copy; otrust.blogspot.com 2017</p>
   </div>
  </div>
 </footer>
</body>
</html>

6. Terakhir buatlah perintah source code pada file index.php seperti berikut ini lalu jalankan:

<?php
 //Menampilkan pagination
 require_once 'app/model/class.pagination.php';

 //Menampilkan view 
 include 'app/view/header.blade.php';
 include 'app/view/menu.blade.php';
 include 'app/view/index.blade.php';
 include 'app/view/footer.blade.php';
 ?>

Ketika dijalankan nanti hasilnya akan seperti ini: 

Selamat mencoba dan Happy Codiiiiinggg!!! 😀 Jangan lupa like and share on facebook.

PHP - CRUD Berbasis OOP Menggunakan PDO dan Bootstrap Versi 2

Hallo pembaca setia Otrust!!

Selamat Tahun Baru 2017 guys? Semoga hari ini baik-baik saja dan sehat selalu. Melanjutkan tutorial yang saya tulis kemarin. Ini adalah tutorial versi ke-dua dari Otrust. Sebenarnya sama sih dengan yang kemarin bedanya kita akan melakukan perintah CRUD dengan penambahan file berupa foto. Jadi hanya sedikit yang berbeda.

Baiklah, mari kita kembali ke laptop dan ikutilah langkah-langkah dibawah ini:

1. Buatlah folder dan file seperti gambar berikut (Folder Database tidak perlu dibuat): 

Nah, silahkan perhatikan dari gambar tersebut:

• Folder induk (crud-image-pdo-oop) memiliki 3 folder (folder database hanya digunakan sebagai tempat backup database bila perlu) yaitu, app, asset dan photo.
• Folder app memiliki 2 folder(model dan view) dan 1 file .htaccess. Didalam folder model digunakan untuk melakukan perintah connection database dan execution of crud. Yang mana connection terletak pada file database.php dan execution of crud dimiliki file class.profile.php. Sedangkan folder view ditempati file-file yang mana Otrust beri index .blade (Mengikuti aturan dari laravel) untuk mengindikasikan bahwa file-file ini hubungannya hanya sebatas tampilan front-end nya saja. Dan file .htaccess digunakan sebagai perintah hak akses-nya. Untuk memahami tentang .htaccess bisa dibaca disini. Untuk file .htaccess silahkan tulis source berikut ini:

Deny From All

         Gunanya adalah untuk mencegah seseorang yang ingin mengakses file yang ada di folder app.

• Didalam folder asset terdapat 3 folder. Sebenarnya folder tersebut tidak perlu dibuat, karena kita akan mengambil-nya dari website officialnya bootstrap. Untuk framework css bootstrap silahkan download disini. Lalu folder css, font dan js silahkan di copy dan paste didalam folder asset. Selanjutnya download file jquery disini. Dan letakkan didalam folder js lalu rename nama file menjadi jquery sehingga nanti hasilnya jquery.js.
• Folder photo digunakan sebagai tempat penyimpanan file-file berupa foto yang akan kita upload.

Nah, demikian penjelasan dari folder tersebut. Apabila ada pertanyaan silahkan ajukan dikolom komentar, terima kasih.

2. Dalam tahap ini kita akan menyiapkan databasenya, silahkan buat databasenya dengan source code berikut ini:

3. Pada file database.php tulislah kode seperti berikut ini:

Source code didalam file database.php digunakan untuk melakukan koneksi database. Otrust yakin teman-teman paham tentang ini 😊.

4. Selanjutnya kita akan membuat eksekusi perintah CRUD, tepatnya pada file class.profile.php. berikut source code-nya:


5. Mengkoneksikan database dan perintah CRUD telah kita buat. Sekarang perhatikan pada folder view, kita akan membuat tampilan website dengan memanfaatkan bootstrap. Pertama kita akan menulis source code pada file header.blade.php:


kode menu.blade.php disini:


kode index.blade.php disini:


kode footer.blade.php disini:


6. Langkah-langkah nomor 5 telah kita tulis selanjutnya pada file index.php kita tulis seperti berikut ini:


Perhatikan pada source code tersebut, terdapat perintah untuk menghapus (delete) data. Jadi disini kita sudah membuat eksekusi untuk menghapus data. Selanjutnya nanti kita akan membuat perintah Insert dan Update.

7. Selanjutnya kita akan membuat form untuk menambahkan data. Tulislah source code pada file profile-add.blade.php:


Lalu tulislah source code berikut didalam file profile-add.php:


Apabila selesai coba jalankan dan lakukan insert data. Semoga berhasil 😀

Perhatian: Untuk melakukan penyimpanan data dengan file, cantumkan enctype="multipart/form-data" pada form. Perhatikan pada source code tampilan yang Otrust buat

8. Proses insert data selesai kita buat, selanjutnya kita akan membuat eksekusi perintah untuk Update data. Tulislah source code berikut pada file profile-edit.blade.php:


Lalu pada file profile-edit.php tulislah kode berikut:


Langkah-langkah CRUD pada tutorial ini telah selesai kita buat dan jalankan pada browser kalian. Apabila berhasil tampilannya akan menjadi seperti ini: 

Sekian tutorial dari Otrust, apabila ingin source code-nya cukup like fanspage facebook Otrust Tutorial disini. Lalu share postingan ini di facebook kalian. Otrust akan mengirimkan link source code ke inbox kalian. Apabila dalam waktu 24 jam belum dikirim silahkan inbox Otrust Tutorial yaah. Namanya juga manusia, pasti lupa atau mungkin Otrust belum cek pemberitahuan 😂.

Maaf guys! Selain promosi fanspage, alasan Otrust tidak mencamtumkan link secara langsung adalah supaya teman-teman mau membaca. Tidak hanya copas dan atau Cuma download-download saja. Terima Kasih dan Happy Coding😇.

Jadilah Pemula Yang Bijak

Hallo pembaca setia Otrust!!

Kali ini Otrust akan membahas mengenai seorang Newbie atau Pemula dalam dunia IT. Belakangan ini, Otrust seringkali melihat pertanyaan di grup FB dan grup yang lain-lain (Tapi kebanyakan dari FB sih kasusnya) dari seorang newbie. Pertanyaanya lumayan baguslah, bagus untuk di BULLY. Wooowwww….

“Kok bisa yah? Emang apa sih mas pertanyaanya?”

Yah, pertanyaanya sih banyak lah. Banyak pertanyaan untuk kebanyakan pemula. Namun, sebenarnya pertanyaan itu cukup mudah dijawab oleh Mbah Google. Eitz, jangan berprasangka buruk dulu, ini hanya untuk kebanyakan pemula. Bukan semua pemula. Otrust juga pernah kok jadi pemula. Hehe…😅 (“Nggak lucu mas”).

“Lalu, pertanyaan seperti apa sih mas yang menyebabkan pem-bully-an?”

Yah itu tadi yang Otrust kasih tahu sebelumnya, “Pertanyaan sederhana yang mudah dijawab oleh Mbah Google”. Harusnya, sebagai seorang pemula kalau mau Tanya-tanya di sebuah grup, sebaiknya dibaca dulu aturan-aturan(rules) di grup seperti apa. Namun, tanpa ada aturan se-enggaknya sudah harus memahami diri sendiri untuk belajar MENCARI dengan inisiatif melalui Mesin Pencari. Karena pertanyaan yang tidak berkualitas malah menjerumuskan diri sendiri ke lubang sumur pembully-an. Wakaka…. 😈

Sebagai seorang yang mengaku dirinya NEWBIE atau PEMULA cobalah untuk belajar mandiri jangan Manja (Manusia Janc**’i) – sensor broo. Jadilah seorang newbie yang bijak, mau belajar sendiri mencari ilmu dan sungguh-sungguh mencari ilmu. Yah memang benar bertanya di grup atau sebuah forum, namun disebuah forum pastinya memiliki aturan dalam mengajukan pertanyaan-pertanyaan dan pastinya pertanyaan itu adalah pertanyaan yang berkualitas yang tidak menjadi sampah dalam beranda sebuah forum.

Kalau anda merasa sebagai pemula, cobalah bertanya pada Mbah Google dengan keyword yang anda maksud. Apabila anda bingung keyword apa yang akan anda tulis belajarlah memahami Bahasa Manusia yang sering kita dengar dengan 5W-1H (Who, Why, When, What, Where - How) –Kayaknya sih gitu 😆. Lalu cobalah terus mencari dengan sungguh-sungguh dan pastinya akan ketemu suatu permasalahan yang anda maksud.

Jangan karena anda seorang pemula terus dengan seenaknya bertanya tanpa usaha. Justru usaha itu lebih penting, baru ketika mentok anda bertanya. Dari usaha anda yang mencapai batas (mentok) itulah yang akan menentukan pola pikir anda untuk menemukan titik permasalahan yang mengakibatkan anda mulai bertanya dengan pertanyaan yang professional dan bijak, tentunya pertanyaan berkualitas.

Nah, dari pembahasan diatas apakah masih belum jelas? Apabila belum silahkan komentar dikolom komentar yang disediakan. Asseh… 😃. Kalau memang ingin belajar mulailah mencari situs-situs kursus yang memang ingin dibutuhkan. Nah, daripada Otrust disini Cuma OMDO mendingan sedikit Otrust bantuin nyari, disimak dibawah ini yaah:

1. http://www.duniailkom.com/ adalah situs belajar membuat website berbahasa Indonesia, lengkap beserta ebook-nya. Beli broo, nggak gratis.
2. http://www.okedroid.com/ merupakan situs yang menyajikan tutorial seputar android dan java dengan berbahasa Indonesia.

Nah, diatas adalah salah satu website penyedia tutorial berbahasa Indonesia, sebenarnya masih banyak Cuma kalau ada yang berkenan silahkan menambahkan di kolom komentar (Alamaak, komentar lagi. wkwkwk).

Selanjutnya, pengen yang lebih lengkap namun menggunakan bahasa inggris, simak dibawah ini:

1. http://www.w3schools.com/ merupakan situs yang up-to-date tentang pemrogaman web, kalian akan diajarkan mulai dari akar hingga pucuk pohon (Sumpah deh).
2. Bosen sama situs hanya fokus ke satu permasalahan pemrogaman? http://tutorialspoint.com/ jawabannya, tidak hanya menyajikan pemrogaman web saja. Tetapi, juga pemrogaman yang lain seperti java, android, c++ dan lain sebagainya.

Diatas adalah website penyedia tutorial, lalu kalian butuh kursus-nya? https://www.udacity.com/ dan https://www.udemy.com/ adalah salah satu situs website penyedia kursus online. Ada yang gratis dan ada juga yang berbayar. Masalah kualitas jangan khawatir, kualitas terjamin (Om Mantab Om) – Otrust kale 😏.

“Mas? Kenapa semuanya harus bahasa inggris paling banyak? Bahasa Indonesia sedikit. Saya kan nggak paham bahasa inggris, Cuma bisa sedikit-sedikit”

Heloooooooo!!!! Mau pake alasan apalagi vrooh? Kan udah ada https://translate.google.com/. Tinggal kamu ketik aja tuh apa yang kamu pelajari. Beres kan? Gitu aja kok repot.

Kalau memang seorang pemula, bukan berarti malas-malasan karena kebanyakan tutorial berbahasa inggris. Karena, pada dasarnya selain Bahasa Inggris itu penting, justru dengan begitu bisa melatih kalian untuk berbahasa inggris. Karena semakin kalian belajar ke jenjang yang lebih tinggi Bahasa Inggris tetap dipakai – Namanya juga bahasa Internasional vroh.

“Mas? Saya sudah membuat aplikasi dan mengalami error. Tanya di grup nggak dijawab-jawab. Sudah ada yang menjawab tetapi masih belum nemu permasalahannya. Gimana dong? Ada solusi nggak?”

Tenang, kan masih ada Mbah Google toh? Hehe. Ups, jangan hanya mengandalkan harapan dari satu atau dua grup kalau memang belum menemukan jawaban. Masih ada forum yang menyediakan berbagai permasalahan seputar pemrogaman atau apapun yang berhubungan dengan IT, sebut saja http://stackoverflow.com/ sebagai website terbesar dan terindah (CMIWIW) yang siap menjawab pertanyaan anda sebagai pemula, dan tidak hanya pemula melainkan bagi seorang senior developer juga sih. Selain itu juga ada https://www.sitepoint.com/community/ sebagai situs komunitas yang siap membantu keluhan kamu. Tentunya masih banyak situs-situs yang menjawab permasalahan bagi seorang pemula.

Ingat nasehat Otrust!! Jadilah Pemula Yang Bijak, belajarlah dari permasalahan yang kamu hadapi, cobalah selesaikan permasalahanmu hingga mencapai puncak dimana kamu tidak sanggup menyelesaikannya. Barulah bertanya setelah kamu berusaha. Jangan bertanya tanpa adanya usaha (Khusus di forum sih). Jangan karena Pemula kamu jadikan alasan Tidak Tahu Apa-Apa tetapi jadikan alasan Mencari Apa-Apa. Ingat, di dunia ini tidak ada permasalahan yang tidak bisa dihadapi, semua pasti bisa. Jangan takut dengan permasalahan yang ada dalam dunia pemrogaman, permasalahan itu dihadapi bukan dihindari. Okeey!!!

Itu saja sih kata-kata dari Otrust, kalau ada masukan, kritik dan saran…. Monggo komentar di kolom yang telah disediakan dibawah. Wkwkwk…😇

Happy coding 😇

PHP - CRUD Berbasis OOP Menggunakan PDO dan Bootstrap Versi 1

Hallo pembaca setia Otrust!!

Sekarang lagi ramai-ramainya Om Telolet Om, hehe…. Ups. Tapi, sekarang yang Otrust bahas bukan Om Telolet Om. Tapi, Om PDO Om, Om OOP Om, Om Bootstrap Om. Wkwkwk. Udah… udah…. Sekarang kita kembali ke topik.

Sekarang ini perusahaan selalu melampirkan pengumuman lowongan kerja bagi seorang developer untuk memahami OOP. Bahkan, begitu pentingnya OOP menuntut kita untuk terus belajar dan belajar (Namanya juga dunia teknologi ya harus update:-D). Lalu, OOP itu apa sih? OOP (Object Oriented Progamming) adalah suatu metode pemrogaman yang berorientasi kepada object. Tujuan dari OOP diciptakan adalah untuk mempermudah pengembangan progam dengan cara mengikuti model yang telah ada dikehidupan sehari-hari (Sumber: fatihamaliah.wordpress.com).

Nah, itu adalah cuplikan tentang OOP. Namun, kali ini Otrust bukan bermaksud menjelaskan lebih detail apa itu OOP, PDO, dan Bootstrap. Namun, Otrust akan memberikan tutorial CRUD (Create, Read, Update, Delete) dengan menggunakan PDO dan Bootrstrap berbasis OOP.

1. Buatlah struktur folder dan file php seperti pada gambar berikut ini:

Untuk folder database tidak perlu dibuat juga tidak apa-apa karena tidak kita gunakan. Sekarang silahkan kalian perhatikan pada folder app dimana didalam folder tersebut memiliki 2 Folder dan 1 File .htaccess. Folder yang pertama yaitu model yang memiliki 2 file: class.bio.php dan database.php sedangkan pada view memiliki 6 file php yang mana didalam folder view itu hanya desain tampilan saja yang akan muncul ketika web kita jalankan di browser.

Pada file .htaccess silahkan kalian tulis ‘Deny from all’ tanpa tanda petik. Gunanya dari perintah ini adalah supaya file-file php yang ada didalam folder app tidak bisa diakses dari browser.

2. Download framework css bootstrap di website resminya disini. Otrust sendiri menggunakan bootstrap versi 3.3.7 lalu copy dan paste di folder asset seperti gambar berikut ini:

3. Lalu pada folder induk (crud-pdo-oop) tepatnya pada file index.php buatlah sorce code seperti berikut ini:

lalu coba jalankan. Nah, jangan kaget apabila belum ada tampilan yang diharapkan yah :-D. Karena itu Cuma memanggil aja. Selanjutnya kita akan membuat tampilan dari website kita.

Bukalah folder view dan ikutilah perintah dibawah ini:

4. Tulislah source code pada file header.php seperti ini:


5. Berikut source code pada file menu.php:


6. Aturlah file index.php (Ingat!! Didalam folder view bukan folder induk) seperti berikut ini:


7. Pada file terakhir yaitu footer.php buatlah seperti ini:

Selanjutnya silahkan jalankan aplikasinya sehingga tampilannya seperti ini: 

Apabila muncul keterangan error:

           “Notice: Undefined variable: result in C:\xampp\htdocs\blogger\crud-pdo-oop\app\view\index.php on line”

Abaikan saja. Karena data pada tabel belum kita buat. Sampai sini fokus kita pada folder view.

8. Selanjutnya kita akan membuat eksekusi perintah CRUD. Sebelum itu silahkan buat database terlebih dahulu. Silahkan membuat melalui localhost/phpyadmin dengan nama database blog_bio dan buatlah tabel seperti berikut ini:

9. Selesai kita buat database, selanjutnya pada folder model aturlah source code pada file database.php seperti berikut ini:

pada file database.php tersebut kita membuat Class Database yang mana itu nanti akan kita panggil untuk melakukan eksekusi CRUD.

10. Selanjutnya kita akan membuat perintah INSERT, UPDATE, dan DELETE. Aturlah source code pada file class.bio.php seperti berikut ini:

perhatikan pada method __construct(), kita memanggil Class Database yang sebelumnya telah kita buat dan kita panggil disini untuk melakukan eksekusi INSERT, UPDATE, DELETE. Dan pada method runQuery() kita gunakan untuk menjalankan perintah SQL yang nanti akan kita gunakan. Dan method terakhir yaitu redirect() ini hanya digunakan untuk memanggil url yang dituju. Method-method yang lain saya kira kalian sudah paham semua apabila belum silahkan Tanya-tanya dikolom komentar yah.. :-D (Peace).

11. Selanjutnya kita kembali lagi ke folder induk tepatnya  pada file index.php berilah perintah source code dibawah ini tepatnya diatas source code sebelumnya (So, kode untuk menampilkan view terletak dibawah yah. Jangan lupa):

Apabila ada datanya maka tampilannya akan seperti berikut ini: 

12. Kembali lagi ke folder view tepatnya pada file bio-add.blade.php aturlah source code seperti berikut ini:

lalu pada folder induk, file bio-add.php aturlah source code seperti berikut ini:

Proses insert data sudah selesai dan coba jalankan. Seharusnya proses insert data berhasil apabila kalian mengalami error silahkan googling atau tanyakan ke kolom komentar. Otrust siap membantu. J

13. Selanjutnya kita akan membuat form tampilan untuk editing. Bukalah kembali folder view dan pada file bio-edit.blade.php aturlah source code seperti berikut ini:

Apabila telah selesai kalian tulis source code diatas maka pada file bio-edit.php aturlah seperti ini:

Aplikasi selesai kita buat. Dan untuk proses delete juga telah kita buat sebelumnya pada file index.php pada folder induk. Silahkan teman-teman jalankan, In Syaa Allah 100% berhasil J.

 “Mas? Minta dong source codenya. Saya download buat belajar.”

Nah, sengaja tidak Otrust cantumkan download source codenya disini. Otrust hanya ingin teman-teman membaca dan memahami dulu tutorial yang Otrust tulis disini. Apabila butuh source code-nya silahkan LIKE Fanspage Facebook Otrust disamping kanan blog. Lalu share tutorial ini. Otrust akan kirim link download ke inbox facebook teman-teman. Apabila dalam waktu 24 jam silahkan kirim pesan ke saya di facebook, siapa tau saya lupa. :-D.

“Ribet amat sih mas? Pelit deh…” 

Kalau Otrust pelit buat apa dunk nulis tutorialnya? :-D. wkwkwk…. Sempatkan Membaca dan Memahami supaya melatih kodingan kalian dan tidak asal Copas. Okey guys… Apabila ada masukan ataupun kritikan silahkan tulis di kolom komentar. Selanjutnya Otrust akan bikin tutorial tentang insert Image melanjutkan tutorial ini, ditunggu aja yaa J

Happy Coding. J.