Routing di Backend & Frontend: Apa Bedanya?
Routing adalah konsep fundamental dalam pengembangan aplikasi web modern. Baik di backend maupun frontend, routing berperan penting dalam menentukan bagaimana aplikasi merespons permintaan pengguna. Namun, meskipun namanya sama, fungsi dan cara kerjanya memiliki perbedaan yang cukup signifikan.
Artikel ini akan membahas pengertian routing, perbedaan routing di backend dan frontend, serta contoh implementasinya agar mudah dipahami.
Apa Itu Routing?
Routing adalah proses menentukan ke mana sebuah request diarahkan berdasarkan URL atau path tertentu.
Contoh sederhana:
Saat pengguna membuka
https://website.com/loginSistem akan menentukan halaman atau logika apa yang harus dijalankan
Routing bertindak sebagai penjembatan antara URL dan aksi yang dilakukan aplikasi.
Routing di Backend
Pengertian
Routing di backend berfungsi untuk menangani request dari client (browser, mobile app, API consumer) dan menentukan logika server yang dijalankan.
Biasanya routing backend akan:
Menerima HTTP request (GET, POST, PUT, DELETE)
Memproses data
Mengakses database
Mengembalikan response (HTML, JSON, XML)
Contoh Routing Backend
Laravel (PHP)
Route::get('/users', [UserController::class, 'index']);
Artinya:
Ketika user mengakses
/usersBackend menjalankan fungsi
index()padaUserController
Express.js (Node.js)
Ciri Routing Backend
Berjalan di server
Fokus pada logika bisnis
Mengelola database & autentikasi
Menghasilkan data atau halaman
Routing di Frontend
Pengertian
Routing di frontend digunakan untuk mengatur navigasi antar halaman di sisi client tanpa melakukan reload halaman penuh.
Frontend routing umumnya digunakan pada Single Page Application (SPA) seperti:
React
Vue
Angular
Contoh Routing Frontend
React Router
<Route path="/login" element={<Login />} />
Artinya:
Saat URL berubah ke
/loginKomponen
<Login />akan ditampilkan
Vue Router
{ path: '/login', component: Login }
Ciri Routing Frontend
Berjalan di browser (client-side)
Tidak reload halaman
Hanya mengganti tampilan UI
Lebih cepat dan interaktif
Bagaimana Backend & Frontend Routing Bekerja Bersama?
Pada aplikasi modern:
Frontend routing menangani navigasi UI
Backend routing menangani data dan logika
Contoh alur:
User membuka
/dashboardFrontend router menampilkan halaman Dashboard
Dashboard memanggil API
/api/statsBackend router memproses dan mengirim data
Dengan pembagian ini:
Frontend fokus pada tampilan & UX
Backend fokus pada data & keamanan
Kapan Harus Menggunakan Keduanya?
✔ Gunakan Backend Routing saja jika:
Website statis atau server-side rendering
Aplikasi sederhana
✔ Gunakan Backend + Frontend Routing jika:
Aplikasi SPA
Dashboard admin
Aplikasi web modern & interaktif
Routing di backend dan frontend memiliki peran yang berbeda namun saling melengkapi:
Backend routing mengatur logika dan data
Frontend routing mengatur navigasi dan tampilan
Memahami perbedaan ini akan membantu kamu membangun aplikasi web yang lebih terstruktur, cepat, dan scalable.
