ReactJS : Server & Client Routing

Pada dasarnya, ada tiga macem Routing dalam aplikasi web: Server-side ,Client-side, & kombinasi keduanya. Dalam tutorial ini saya akan bahas tentang routing di sisi klien & server pake React Router.

Sedikit info buat yang belum tau routing .

Server-side Routing

Dalam Server-side Routing semua rekues dihandel server yang akan kirim HTML sebagai respon ke browser.

Jadi misalnya dari home page: www.tiket.com kita buka www.tiket.com/pesawat, rekues dikirim ke server yg kemudian kirim respon HTML yg berisi halaman /pesawat ke browser.

Jadi ini model konvensional. Rekues -> server -> browser refresh.

Ini routing untuk web page ya. Kalo routing untuk REST API, ya nggak perlu browser refresh.

Client-side Routing

Client-side Routing mulai populer dengan adanya dukungan browser utk History API dari spesifikasi HTML5 & munculnya Single-page Application (SPA). Jadi waktu kita buka /pesawat, nggak ada rekues yg dikirim ke server. Rekues dihandel oleh kode JavaScript yang kemudian menampilkan komponen Flight di browser. Kalo kita pindah ke /train , ya yang ditampilin adalah komponen Train.

Continue reading →