Tutorial Express.js Restful API #3 : Menampilkan Data dari Database


Fika Ridaul Maulayya
Full-Stack Web Developer, Content Creator and CO-Founder Santri Koding. I share everything i know with Articles, Screencasts and E-Books at SantriKoding.com

Halo teman-teman semuanya, di artikel sebelumnya kita sudah belajar bagaimana cara melakukan konfigurasi dan membuat database yang akan digunakan di dalam project Express.js, maka sekarang di artikel kali ini kita akan belajar bagaimana cara menampilkan data dari database menggunakan Rest API di Express.js.

Sebelum itu, silahkan download aplikasi yang bernama Postman terlebih dahulu. aplikasi tersebut yang nanti akan digunakan untuk melakukan API testing dari setiap Rest API yang kita buat di dalam Express.js.

DOWNLOAD POSTMAN : https://www.postman.com/downloads/

Langkah 1 - Membuat Konfigurasi Router

Sekarang kita lanjutkan untuk membuat router di dalam project Express.js, router inilah yang nantinya kita akses sebagai Rest API di dalam project Express.js.

Silahkan buat folder baru dengan nama routes di dalam project Express.js, setelah itu di dalam folder routes tersebut silahkan buat file baru dengan nama posts.js dan masukkan kode berikut ini di dalamnya.

const express = require('express');
const router = express.Router();

//import database
const connection = require('../config/database');

/**
 * INDEX POSTS
 */
router.get('/', function (req, res) {
    //query
    connection.query('SELECT * FROM posts ORDER BY id desc', function (err, rows) {
        if (err) {
            return res.status(500).json({
                status: false,
                message: 'Internal Server Error',
            })
        } else {
            return res.status(200).json({
                status: true,
                message: 'List Data Posts',
                data: rows
            })
        }
    });
});

module.exports = router;

Di atas, pertama kita import konfigurasi database yang sudah pernah kita buat sebelumnya.

//import database
var connection = require('../config/database');

Kemudian, kita definisikan 1 route baru dengan method GET, yang isinya adalah query ke dalam table posts.

connection.query('SELECT * FROM posts ORDER BY id desc', function (err, rows) {
	
	//...
	
}

Di dalam block query di atas, kita membuat sebuah kondisi untuk memastikan apakah proses dari query tersebut berhasil atau tidak.

Jika dari query di atas terdaapat kesalahan, maka kita akan mengembalikan sebuah response JSON dengan status code 500, kurang lebih seperti berikut ini :

return res.status(500).json({
    status: false,
    message: 'Internal Server Error',
})

Tapi, jika dari proses query di atas berhasi, maka kita akan melakukan return ke dalam format JSON dengan status code 200, dan kita ambil data dari hasil query tersebut.

return res.status(200).json({
    status: true,
    message: 'List Data Posts',
    data: rows	// <-- data posts
})

Langkah 2 - Import Router di Index.js

Sekarang kita akan import konfigurasi router di atas di dalam file index.js agar router tersebut dapat digunakan. Silahkan buka file index.js, kemudian ubah semua kode-nya menjadi seperti berikut ini :

const express = require('express')
const app = express()
const port = 3000

//import route posts
const postsRouter = require('./routes/posts');
app.use('/api/posts', postsRouter); // use route posts di Express

app.listen(port, () => {
  console.log(`app running at http://localhost:${port}`)
})

Dari perubahan kode di atas, pertama kita melakukan import file router yang sudah kita buat sebelumnya.

//import route posts
const postsRouter = require('./routes/posts');

Setelah itu, kita gunakan keyword use untuk melakukan assign konfigurasi router tersebur di dalam project Express.js kita.

app.use('/api/posts', postsRouter); // use route posts di Express

Di atas, kita set prefix URL-nya adalah /api/posts, dan parameter kedua berupa file router yang telah di import sebelumnya.

Langkah 3 - Uji Coba Rest API Menampilkan Data

Sekarang kita akan lakukan uji coba Rest API untuk menampilkan data posts dari database. Silahkan buka aplikasi Postman dan masukkan URL berkut ini http://localhost:3000/api/posts dan untuk method-nya adalah GET. Setelah itu silahkan klik Send. Jika berhasil maka kita akan mendapatkan hasil kurang lebih seperti berikut ini :

Di atas, kita telah berhasil melakukan proses uji coba menampilkan data posts dari database. Karena belum memiliki data apapun di dalam database, maka kita hanya mendapatkan array kosong.

{
    "status": true,
    "message": "List Data Posts",
    "data": []
}

Sampai disini pembahasan bagaimana cara menampilkan data dari database menggunakan Rest API di Express.js. Di artikel selanjutnya kita akan belajar bagaimana cara melakukan proses insert data ke dalam database menggunakan Rest API di Express.js.

Terima Kasih



Fika Ridaul Maulayya
Full-Stack Web Developer, Content Creator and CO-Founder Santri Koding. I share everything i know with Articles, Screencasts and E-Books at SantriKoding.com

Suka dengan tulisan di SantriKoding? Kamu bisa memberikan dukungan dengan berdonasi atau bagikan konten ini di sosial media. Terima kasih atas dukungan Anda!

KEBIJAKAN KOMENTAR

Saat memberikan komenatar silahkan memberikan informasi lengkap tentang error, seperti: screenshot, link kode, dll. Baca aturan komentar kami

KOMENTAR