Coba bayangkan kamu harus membangun jembatan dari nol — setiap baut, setiap kabel, setiap tiang harus kamu pasang sendiri. Melelahkan, kan? Itulah rasanya membangun web server Node.js hanya dengan modul http native. Lalu datanglah Express.js tutorial yang mengubah semua itu: alih-alih membangun dari nol, kamu tinggal merakit komponen yang sudah siap pakai. Di artikel ini, kamu akan belajar routing Express.js dari awal — mulai dari setup, mendefinisikan rute, hingga handle request dan response seperti developer profesional. Kalau kamu sedang belajar Express Node.js, ini adalah titik balik yang kamu tunggu-tunggu. 🚀
Express.js adalah web framework minimalis untuk Node.js yang menyediakan serangkaian fitur kuat untuk membangun aplikasi web dan API. Dengan Express, kamu bisa mendefinisikan route, mengatur middleware, dan mengelola HTTP request/response dengan kode yang jauh lebih ringkas dibanding modul http bawaan Node.js.
🛠️ Setup Express.js: Dari Nol ke Siap Jalan
Sebelum bisa menikmati kemudahan Express, kamu perlu melakukan setup awal. Kabar baiknya: prosesnya cepat banget. Anggap saja ini seperti menyeduh kopi instan — dalam hitungan menit, semuanya siap dinikmati.
Buka terminal, buat folder baru, lalu jalankan perintah berikut untuk menginisialisasi proyek Node.js:
# Buat folder proyek mkdir belajar-express cd belajar-express # Inisialisasi npm (tekan Enter untuk semua pertanyaan) npm init -y
Satu baris perintah, dan Express langsung masuk ke proyekmu:
npm install express
app.js dan tulis server pertamamuBuat file app.js di folder yang sama, lalu isi dengan kode berikut:
// Import Express const express = require('express'); const app = express(); // Route pertama kita app.get('/', (req, res) => { res.send('Halo dunia, saya pakai Express.js! 🚀'); }); // Jalankan server di port 3000 app.listen(3000, () => { console.log('Server berjalan di http://localhost:3000'); });
Kembali ke terminal, jalankan perintah berikut lalu buka browser di http://localhost:3000:
node app.js
Install nodemon agar server otomatis restart setiap kali kamu save perubahan kode: npm install -g nodemon, lalu jalankan dengan nodemon app.js. Hidup jadi jauh lebih nyaman! 😎
🗺️ Routing Express.js: Navigasi yang Cerdas
Bayangkan aplikasi web kamu seperti sebuah gedung kantor besar. Setiap divisi ada di lantai dan ruangan yang berbeda. Routing adalah sistem direktori gedung itu — yang menentukan siapa pergi ke mana berdasarkan alamat yang dituju. Di Express.js, routing berarti menghubungkan URL tertentu dengan fungsi handler yang tepat.
| Metode | Fungsi | Contoh URL | Dipakai Untuk |
|---|---|---|---|
GET |
Ambil data | /users | Menampilkan halaman/data |
POST |
Kirim data baru | /users | Form login, registrasi |
PUT |
Update data (penuh) | /users/:id | Edit profil pengguna |
PATCH |
Update sebagian data | /users/:id | Ganti foto profil saja |
DELETE |
Hapus data | /users/:id | Hapus akun pengguna |
Mari kita praktikkan. Berikut contoh routing Express.js yang mencakup berbagai skenario umum:
const express = require('express'); const app = express(); // Middleware untuk membaca JSON dari request body app.use(express.json()); // 1. Route statis — halaman beranda app.get('/', (req, res) => { res.send('<h1>Selamat datang di aplikasi Express!</h1>'); }); // 2. Route dengan parameter dinamis — ambil user berdasarkan ID app.get('/users/:id', (req, res) => { const userId = req.params.id; res.json({ pesan: `Menampilkan data user #${userId}` }); }); // 3. Route POST — terima data baru app.post('/users', (req, res) => { const dataBaru = req.body; res.status(201).json({ pesan: 'User berhasil dibuat!', data: dataBaru }); }); // 4. Route dengan query parameter app.get('/cari', (req, res) => { const keyword = req.query.q; res.json({ pencarian: keyword }); }); app.listen(3000);
Perhatikan perbedaan req.params, req.query, dan req.body. params = bagian dari URL (e.g. /users/42). query = parameter setelah ? (e.g. /cari?q=express). body = data yang dikirim lewat POST/PUT/PATCH. Memahami ketiganya adalah kunci menguasai routing Express.js!
📬 Handle Request & Response dengan Express
Di Express, setiap route mendapatkan dua objek sakti: request (req) dan response (res). Kalau routing adalah sistem direktori gedung, maka req adalah surat yang masuk berisi semua info pengirim, dan res adalah amplop balasan yang kamu siapkan untuk dikirim kembali.
// 1. Kirim teks/HTML biasa app.get('/hello', (req, res) => { res.send('Halo dari Express!'); }); // 2. Kirim response JSON (paling umum untuk API) app.get('/api/info', (req, res) => { res.json({ nama: 'Express App', versi: '1.0.0', status: 'aktif' }); }); // 3. Kirim dengan status code HTTP kustom app.get('/not-found', (req, res) => { res.status(404).json({ error: 'Halaman tidak ditemukan' }); }); // 4. Redirect ke URL lain app.get('/lama', (req, res) => { res.redirect('/baru'); }); // 5. Set header kustom app.get('/custom-header', (req, res) => { res.set('X-Powered-By', 'Express Kece'); res.json({ pesan: 'Header kustom sudah dikirim!' }); });
Express.js diunduh lebih dari 35 juta kali per minggu di npm! Framework ini dipakai oleh perusahaan raksasa seperti IBM, Uber, dan Accenture. Meskipun sangat minimalis, Express tetap menjadi tulang punggung web framework populer lain seperti NestJS dan Feathers.
🧩 Middleware: Pintu Cerdas di Tengah Perjalanan
Salah satu kekuatan terbesar Express adalah middleware. Bayangkan ini seperti pos pemeriksaan di jalan tol: setiap request yang masuk akan melewati beberapa pos sebelum sampai ke tujuan akhirnya. Di setiap pos, kamu bisa melakukan pemeriksaan, modifikasi, atau bahkan menghentikan perjalanan request tersebut.
// Middleware global — dijalankan untuk SEMUA request app.use((req, res, next) => { console.log(`[${new Date().toISOString()}] ${req.method} ${req.url}`); next(); // ⬅️ WAJIB dipanggil agar request lanjut ke route berikutnya }); // Middleware autentikasi sederhana const cekToken = (req, res, next) => { const token = req.headers['authorization']; if (!token) { return res.status(401).json({ error: 'Akses ditolak! Token tidak ada.' }); } next(); }; // Gunakan middleware hanya untuk route tertentu app.get('/dashboard', cekToken, (req, res) => { res.json({ pesan: 'Selamat datang di dashboard!' }); });
Jangan lupa memanggil next() di dalam middleware! Kalau kamu lupa, request akan "nyangkut" dan browser akan terus loading tanpa dapat respons. Ini adalah kesalahan klasik yang sering dilakukan pemula saat belajar Express Node.js.
Saat aplikasimu makin besar, semua route dalam satu file app.js akan terasa sesak. Gunakan Express Router (express.Router()) untuk memecah route ke file terpisah berdasarkan fitur. Ini adalah praktik terbaik yang dipakai developer Express.js profesional!
Artikel ini adalah bagian dari seri lengkap 16 artikel belajar Node.js dari dasar hingga mahir. Kunjungi halaman utama seri untuk melihat semua topik.
🗺️ Lihat Semua 16 Artikel →
No comments:
Post a Comment