Mock APIs dengan Mockoon

Architecture

5 Jun 20233 min

Bicara tentang Microservices mungkin terpikirkan sesuatu yang disebut Agile dimana kita dapat mengerjakan task secara paralel atau bersamaan tanpa harus menunggu yang lain. Dalam pengembangan biasanya memisahkan antara backend dan frontend, akan terhubung dengan APIs. Backend dan Frontend dapat bekerja secara serentak tanpa harus menunggu satu sama lain dengan cara membuat API Spec. Framework frontend seperti React tidak memiliki akses server sehingga kita perlu menggunakan Mock API server.

Mockoon adalah salah satu yang akan kita bahas karena "No remote deployment, no account required, free and open-source".

Install Mockoon

Saya akan menggunakan GUI, kita bisa meng-installnya di Mockoon. Karena saya menggunakan Snap sehingga hanya perlu memasukkan perintah

$ sudo snap install mockoon

Mock API Request

Kita hanya perlu klik new environment dan mengetikkan nama. Data akan tersimpan pada default folder Mockoon.

  • Windows: c:/Users/xxx/AppData/Roaming/mockoon/storage
  • Linux: ~/.config/mockoon/storage
  • Snap: ~/snap/mockoon/26/.config/mockoon/storage
  • Mac: ~/Library/Application Support/mockoon/storage
Mockoon

Selanjutnya menambah HTTP Route baru mengisikan path nya dan mulai menulis response di body nya dalam bentuk JSON. Kita bisa mengganti HTTP Status untuk simulasi ketika ada error dan sebagainya. Penggunaan yang sederhana bisa kita pelajari dalam 5 menit. Getting Started. Di sini kita akan melihat fitur menarik.

Setting up Rules

Ayo kita simulasikan Login dengan username dan password, jika benar akan mengembalikan HTTP Status 200 dan jika salah maka nilai berkurang.

username: root
password: 123

Kita buat HTTP Route baru dengan url /auth/login. Status di isi dengan 200 - OK dan body sederana menampilkan pesan sukses.

Mockoon

Setelah itu klik tombol tambah berwarna biru di sebelah Response 1 (200). Pada response selanjutnya kita isikan HTTP Status 401 - Unauthorized dengan body menampilkan username atau password salah.

Mockoon

Kita masuk ke tab Rules [2] lalu menuliskan Rules:

username not equals root
and
password not equals 123

yang artinya tampilkan response 401 - unauthorized ketika username bukan root dan password bukan 123.

Saya akan menggunakan extention vscode: Rest Client.

# Testing dengan username dan password yang benar

POST http://localhost:3001/auth/login HTTP/1.1
Content-Type: application/json
Accept: application/json

{
  "username": "root",
  "password": "123"
}

# Response yang didapat

HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 94
Date: Wed, 07 Jun 2023 16:40:25 GMT
Connection: close


{
  "success": true,
  "message": "Login Successful",
  "data": {
    "username": "Root",
  }
}


# Testing 401

POST http://localhost:3001/auth/login HTTP/1.1
Content-Type: application/json
Accept: application/json

{
  "username": "salah",
  "password": "salah"
}

# Response yang didapat

HTTP/1.1 401 Unauthorized
Content-Type: application/json
Content-Length: 69
Date: Wed, 07 Jun 2023 17:00:09 GMT
Connection: close

{
  "success": false,
  "message": "Username or Password is wrong",
}

Conclusion

Mockoon salah satu Mock API yang mudah digunakan, kita tidak lagi membutuhkan API langsung dari Backend ketika sedang Develop. Kita hanya perlu membuat Mock sesuai dengan API Spec yang telah ditentukan di awal. Backend dan Frontend dapat bekerja secara bersama, dengan seperti ini proses pengembangan akan lebih cepat.

Mockoon

~ Ann