Pada tutorial ini Anda akan belajar bagaimana membuat RESTful API sederhana dengan CodeIgniter 4.
Tidak hanya itu,
Saya juga akan sharing tentang apa itu RESTful API dan kenapa kita perlu membuat RESTful API.
(Step-by-Step)
Mari kita mulai.
Tonton video tutorial web berkualitas GRATIS di channel youtube saya:
Klik Disini.!
Apa itu RESTful API?
RESTful API merupakan implementasi dari API (Application Programming Interface).
REST (REpresentational State Transfer) adalah suatu arsitektur metode komunikasi yang menggunakan protocol HTTP untuk pertukaran data dan metode ini sering diterapkan dalam pengembangan aplikasi.
Mungkin terdengar rumit tapi sebenarnya tidak.
Tujuannya untuk menjadikan system dengan performa yang baik, cepat, dan mudah untuk dikembangkan terutama dalam pertukaran dan komunikasi data.
Kenapa membuat RESTful API?
Jika Anda perhatikan arsitektur tradisional komunikasi data antara client dan server terlihat seperti gambar berikut:
Dimana client mengirimkan request ke server melalui HTTP Request, dan server memberikan response melalui HTTP Response.
Response yang diberikan oleh server, biasanya berformat HTML.
Bayangkan jika Anda harus mengembangkan website Anda ke aplikasi Mobile seperti Android atau iOS.
Anda tahu aplikasi Android ataupun iOS tidak membutuhkan HTML sebagai response dari server.
Karena Android dan iOS menggunakan bahasa pemrograman yang berbeda dan tidak mengenal HTML.
Oleh sebab itu, kita perlu membuat RESTful API.
RESTful API ini akan menjadi jembatan komunikasi data antara client dan server.
Sehingga, server tidak lagi mengirimkan HTML sebagai response, melainkan hanya data.
Ya, hanya data.
Response dalam bentuk data inilah yang dapat digunakan untuk berbagai macam platform dari aplikasi yang berbeda bahasa permrograman.
Response dari API biasanya berformat JSON atau XML.
Akan tetapi, yang paling umum digunakan adalah JSON.
Dalam tutorial kali ini, kita akan membuat RESTful API dengan response data dalam format JSON.
Perhatikan gambar berikut untuk lebih memahami arsitektur dari RESTful API:
Dimana client dapat dari berbagai macam platform, seperti aplikasi web, desktop, ataupun mobile app.
Keren bukan?
Ok, mari kita mulai membuat RESTful API.
Step #1. Design EndPoint RESTful API
Ini penting!
Sebelum membuat RESTful API, ada baiknya di kita definisikan dulu EndPoint dari RESTful API yang akan dibuat.
EndPoint merupakan routes dari API yang akan kita buat.
RESTful API menggunakan HTTP verbs.
HTTP verbs yang umum digunakan adalah GET, POST, PUT, dan DELETE.
GET untuk mendapatkan data dari server atau lebih dikenal dengan istilah READ, POST untuk meng-CREATE new data, PUT untuk UPDATE data, dan DELETE untuk menghapus data.
Atau lebih dikenal dengan istilah CRUD (Create-Read-Update-Delete).
Pada tutorial kali ini, saya akan sharing bagaimana membuat RESTful API sederhana untuk mengambil data dari server (GET), membuat data baru ke server (POST), mengupdate data ke server (PUT), dan menghapus data ke server (DELETE) dari suatu table di database yaitu table product.
Berikut rancangan dari RESTful API yang akan kita buat:
Step #2. Buat Database dan Table
Buat sebuah database baru dengan MySQL, Anda dapat menggunakan tools seperti SQLyog, PHPMyAdmin atau sejenisnya.
Disini saya membuat database dengan nama restful_db.
Jika Anda membuat database dengan nama yang sama itu lebih baik.
Untuk membuat database dengan MySQL, dapat dilakukan dengan mengeksekusi query berikut:
CREATE DATABASE restful_db;
Perintah SQL diatas akan membuat sebuah database dengan nama restful_db.
Selanjutnya, buat sebuah table di dalam database restful_db.
Disini saya membuat sebuah table dengan nama product.
Jika Anda membuat table dengan nama yang sama itu lebih baik.
Untuk membuat table product, dapat dilakukan dengan mengeksekusi perintah SQL berikut:
CREATE TABLE product( product_id INT(11) PRIMARY KEY AUTO_INCREMENT, product_name VARCHAR(200), product_price DOUBLE )ENGINE=INNODB;
Selanjutnya, insert beberapa data kedalam table product dengan mengeksekusi query berikut:
INSERT INTO product(product_name,product_price) VALUES ('Product 1','2000'), ('Product 2','5000'), ('Product 3','4000'), ('Product 4','6000'), ('Product 5','7000');
Perintah SQL diatas akan menginput 5 data kedalam table product.
Step #3. Instalasi CodeIgniter 4
Download file Codeigniter 4 pada link berikut:
Kemudian extract di web server Anda.
Jika Anda menggunakan WAMPSERVER, extract di folder:
C:\wamp64\www
Jika Anda menggunakan XAMPP, extract di folder:
C:\xampp\htdocs
Pada tutorial ini, saya menggunakan XAMPP.
Kemudian rename (ganti nama) menjadi “restfulapi” seperti gambar berikut:
Kemudian open project restful api dengan code editor, disini saya menggunakan Visual Studio Code.
Step #4. Membuat koneksi ke database
Buka file “Database.php” yang terdapat pada folder “app/Config”, kemudian temukan kode berikut:
public $default = [ 'DSN' => '', 'hostname' => 'localhost', 'username' => '', 'password' => '', 'database' => '', 'DBDriver' => 'MySQLi', 'DBPrefix' => '', 'pConnect' => false, 'DBDebug' => (ENVIRONMENT !== 'production'), 'cacheOn' => false, 'cacheDir' => '', 'charset' => 'utf8', 'DBCollat' => 'utf8_general_ci', 'swapPre' => '', 'encrypt' => false, 'compress' => false, 'strictOn' => false, 'failover' => [], 'port' => 3306, ];
Kemudian ubah menjadi seperti berikut:
public $default = [ 'DSN' => '', 'hostname' => 'localhost', 'username' => 'root', 'password' => '', 'database' => 'restful_db', 'DBDriver' => 'MySQLi', 'DBPrefix' => '', 'pConnect' => false, 'DBDebug' => (ENVIRONMENT !== 'production'), 'cacheOn' => false, 'cacheDir' => '', 'charset' => 'utf8', 'DBCollat' => 'utf8_general_ci', 'swapPre' => '', 'encrypt' => false, 'compress' => false, 'strictOn' => false, 'failover' => [], 'port' => 3306, ];
Selanjutnya, Ini penting!
Agar Anda memiliki interface yang baik untuk menangani error, temukan file env pada root project, kemudian rename (ganti nama) menjadi .env dan open file tersebut.
Kemudian temukan kode berikut:
# CI_ENVIRONMENT = production
Kemudian ubah menjadi seperti berikut:
CI_ENVIRONMENT = development
Itu artinya Anda masuk ke mode development, mode ini akan membantu Anda mempermudah melacak error saat Anda membangun project.
Step #5. Membuat file Model
Buat sebuah file model bernama “ProductModel.php” pada folder “app/Models”, kemudian ketikan kode berikut:
<?php namespace App\Models; use CodeIgniter\Model; class ProductModel extends Model { protected $table = 'product'; protected $primaryKey = 'product_id'; protected $allowedFields = ['product_name','product_price']; }
Step #6. Membuat file Controller
Buat sebuah file controller bernama “Products.php” pada folder “app/Controllers”, kemudian ketikan kode berikut:
<?php namespace App\Controllers; use CodeIgniter\RESTful\ResourceController; use CodeIgniter\API\ResponseTrait; use App\Models\ProductModel; class Products extends ResourceController { use ResponseTrait; // get all product public function index() { $model = new ProductModel(); $data = $model->findAll(); return $this->respond($data, 200); } // get single product public function show($id = null) { $model = new ProductModel(); $data = $model->getWhere(['product_id' => $id])->getResult(); if($data){ return $this->respond($data); }else{ return $this->failNotFound('No Data Found with id '.$id); } } // create a product public function create() { $model = new ProductModel(); $data = [ 'product_name' => $this->request->getPost('product_name'), 'product_price' => $this->request->getPost('product_price') ]; $data = json_decode(file_get_contents("php://input")); //$data = $this->request->getPost(); $model->insert($data); $response = [ 'status' => 201, 'error' => null, 'messages' => [ 'success' => 'Data Saved' ] ]; return $this->respondCreated($data, 201); } // update product public function update($id = null) { $model = new ProductModel(); $json = $this->request->getJSON(); if($json){ $data = [ 'product_name' => $json->product_name, 'product_price' => $json->product_price ]; }else{ $input = $this->request->getRawInput(); $data = [ 'product_name' => $input['product_name'], 'product_price' => $input['product_price'] ]; } // Insert to Database $model->update($id, $data); $response = [ 'status' => 200, 'error' => null, 'messages' => [ 'success' => 'Data Updated' ] ]; return $this->respond($response); } // delete product public function delete($id = null) { $model = new ProductModel(); $data = $model->find($id); if($data){ $model->delete($id); $response = [ 'status' => 200, 'error' => null, 'messages' => [ 'success' => 'Data Deleted' ] ]; return $this->respondDeleted($response); }else{ return $this->failNotFound('No Data Found with id '.$id); } } }
CodeIgniter 4 telah memberikan kemudahan bagi web developer dalam membuat RESTful API.
Dapat dilihat pada controller Products.php diatas, dengan hanya mengextends ResourceController kita telah dapat membuat RESTful API.
Tidak hanya itu,
Kita juga bisa dengan mudah membuat response dengan menggunakan API ResponseTrait.
Step #7. Konfigurasi Routes.php
Langkah terakhir yang tidak kalah pentingnya yaitu melakukan sedikit konfigurasi pada file Routes.php yang terdapat pada folder “app/Config”.
Buka file “Routes.php” pada folder “app/Config”, kemudian temukan kode berikut:
$routes->get('/', 'Home::index');
Kemudian, ganti menjadi berikut:
$routes->resource('products');
Konfigurasi tersebut memungkinkan kita mengakses EndPoint berikut:
Step #8. Aktifkan CORS (Cross-Origin Resources Sharing)
Ini penting!
Agar resources dapat diakses di luar domain, kita perlu mengaktifkan CORS.
Untuk menaktifkan CORS, buat file bernama “Cors.php” pada folder “app/Filters”.
Kemudian ketikan kode berikut:
<?php namespace App\Filters; use CodeIgniter\HTTP\RequestInterface; use CodeIgniter\HTTP\ResponseInterface; use CodeIgniter\Filters\FilterInterface; Class Cors implements FilterInterface { public function before(RequestInterface $request, $arguments = null) { header('Access-Control-Allow-Origin: *'); header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method, Authorization"); header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE"); $method = $_SERVER['REQUEST_METHOD']; if ($method == "OPTIONS") { die(); } } public function after(RequestInterface $request, ResponseInterface $response, $arguments = null) { // Do something here } }
Selanjutnya buka file “Filters.php” yang terdapat pada folder “app/Config”.
Kemudian temukan kode berikut:
public $aliases = [ 'csrf' => \CodeIgniter\Filters\CSRF::class, 'toolbar' => \CodeIgniter\Filters\DebugToolbar::class, 'honeypot' => \CodeIgniter\Filters\Honeypot::class, ];
Kemudian tambahkan cors filter seperti berikut:
public $aliases = [ 'csrf' => \CodeIgniter\Filters\CSRF::class, 'toolbar' => \CodeIgniter\Filters\DebugToolbar::class, 'honeypot' => \CodeIgniter\Filters\Honeypot::class, 'cors' => \App\Filters\Cors::class, ];
Selanjutnya definisikan "cors" pada public globals seperti berikut:
public $globals = [ 'before' => [ 'cors' //'honeypot' // 'csrf', ], 'after' => [ 'toolbar', //'honeypot' ], ];
Step #9. Testing
Untuk menguji coba API yang telah kita buat, ada banyak tools yang dapat digunakan.
Pada tutorial ini, saya menggunakan POSTMAN.
Saya juga menyarankan Anda untuk menggunakan POSTMAN.
Anda dapat mendownload POSTMAN di website resminya:
Download dan Install POSTMAN di komputer Anda kemudian open.
Jalankan project dengan mengetikkan perintah berikut pada Terminal / Command Prompt:
php spark serve
Seperti gambar berikut:
1. Get All Product (GET)
Kembali ke POSTMAN, dan ketikan URL berikut pada kolom URL Postman:
http://localhost:8080/products
Pilih method GET, kemudian klik tombol Send, maka Akan terlihat hasilnya seperti gambar berikut:
Pada gambar diatas dapat dilihat bahwa EndPoint untuk GET semua data product berjalan dengan baik.
2. Get Single Product (GET)
Ketikan URL berikut pada kolom URL untuk mendapatkan single product:
http://localhost:8080/products/12
Pilih dengan method GET, kemudian klik tombol Send, maka Akan terlihat hasilnya seperti gambar berikut:
Pada gambar diatas dapat dilihat bahwa EndPoint untuk GET single product berjalan dengan baik.
Perhatian: Anda mungkin tidak memiliki product dengan id=12, harap disesuaikan dengan data yang Anda miliki!
3. Create New Product (POST)
Ketikan URL berikut pada kolom URL untuk meng-create new product:
http://localhost:8080/products
Pilih method POST => Body => form-urlencoded => Masukan KEY dan VALUE => klik Send.
Seperti gambar berikut:
Jika Anda mendapatkan response dengan status 201 seperti gambar diatas, maka data berhasil tersimpan di database.
4. Update Product (PUT)
Ketikan URL berikut pada kolom URL untuk meng-update product:
http://localhost:8080/products/12
Pilih method PUT => Body => form-urlencoded => Masukan KEY dan VALUE => klik Send.
Seperti gambar berikut:
Jika Anda mendapatkan response dengan status 200 seperti gambar diatas, maka data berhasil terupdate di database sesuai dengan id product yang di update.
5. Delete Product (DELETE)
Ketikan URL berikut pada kolom URL untuk meng-hapus product:
http://localhost:8080/products/13
Pilih method DELETE, kemudian klik Send.
Seperti gambar berikut:
Jika Anda mendapatkan response dengan status 200 seperti gambar diatas, maka data berhasil terhapus di database.
Related: Tutorial Mengakses API Menggunakan Vue JS dan Axios
Kesimpulan:
Pembahasan kali ini adalah tentang bagaimana membuat RESTful API dengan CodeIgniter 4.
RESTful API merupakan implementasi dari API (Application Programming Interface).
RESTful API merupakan metode yang memisahkan antara backend dan frontend yang memungkinkan pertukaran data ke berbagai macam client dari bahasa pemrograman yang berbeda.
Jadi tunggu apalagi, Let’s coding!
Komentar (11)
agazlees, 22 August 2020 10:34 - Reply
Mungkin anda terlupa '$arguments = null' pada fail Cors.php.
Zeldianto Eka Putra, 18 September 2020 18:28 - Reply
Mantap bg... Akhirnya tutorial yang ditunggu2..
Sepdiyan Ika Putra, 02 November 2020 19:57 - Reply
masss cara untuk view nya gmana mohon bantuannya
fridu suhendra, 08 March 2021 16:38 - Reply
mas fikri,untuk buat rest clientya dengna ci 4 gmn mas?
M Fikri, 29 March 2021 13:32 - Reply
Ini untuk clientnya: https://mfikri.com/artikel/crud-vue-axios
ihsan, 05 May 2021 07:06 - Reply
gimana caranya menambahan auth/user dan password ketika user mengakses api/restfull?
M Fikri, 09 September 2021 09:00 - Reply
Ini tutorialnya mas: https://mfikri.com/artikel/codeigniter-login-register-jwt
Joko Budiyanto, 08 September 2021 23:01 - Reply
Saya coba dan berhasil di local. setelah di deploy di hosting. tidak bisa diakses. config database, baseurl sudah di sesuaikan tp tetap tidak berhasil. itu bagaimana yah?
M Fikri, 09 September 2021 09:02 - Reply
CodeIgniter 4 berbeda cara deploy-nya dengan CodeIgniter 3. Saya tidak bisa jelaskan secara detail di sini, ada baiknya saya sarankan untuk googling!
Muhammad Amir Nugraha, 16 October 2021 12:10 - Reply
Pemrisi, saya menemukan kesalahan berikut : Interface 'CodeigniterFiltersFilterInterface' not found . Untuk memperbaikinya bagaimana?
M Fikri, 18 October 2021 11:52 - Reply
Coba tonton video tutorial-nya untuk lebih jelasnya!