# FETCH API

fetch - cara JavaScript di browser memanggil API kita

Kita butuh folder public yang didalamnya ada HTML, CSS, dan JavaScript...  
folder Public disebut static karena isinya tidak berubah ubah tiap request berbeda dengan API yang menghitung data. Express cukup "menyodorkan" file apa adanya.

Jangan taruh file rahasia seperti .env di public. Semua isi public bisa diakses siapa saja lewat URL. Hanya taruh HTML, CSS, JS frontend, dan aset gambar.

FETCH: cara frontend memanggil API

![](https://cdn.hashnode.com/uploads/covers/68ae52553c06feaa7bcbacb6/da7163b9-625d-4808-8e7b-c704872d3bcb.png align="center")

nah seperti itu kurang lebih...

Menanggapi error 4xx & 5xx

![](https://cdn.hashnode.com/uploads/covers/68ae52553c06feaa7bcbacb6/27f49351-2447-43ef-a2cf-5aec9b36abd9.png align="center")

Error ditangani, bukan Diam

![](https://cdn.hashnode.com/uploads/covers/68ae52553c06feaa7bcbacb6/fe9c3972-14e4-4939-a689-a76f6ed520cd.png align="center")

FROM & TABLE UI NYATA MENYAMBUNG API

sekarang gabungkan semuanya: from untuk kirim data + table untuk tampilkan. Ini wujud nyata "front end menambung backend

![](https://cdn.hashnode.com/uploads/covers/68ae52553c06feaa7bcbacb6/eb6f06de-b221-492d-91ad-47479cf0950b.png align="center")

FROM & TABLE menyambung API

![](https://cdn.hashnode.com/uploads/covers/68ae52553c06feaa7bcbacb6/d2a78db2-5dec-4558-9ab8-89eafb5758b6.png align="center")

Mungkin ini saja dari Kami kurang lebihnya mohon maaf...