Express adalah framework web paling lama dan paling banyak dipakai di ekosistem Node.js, sehingga hampir setiap masalah yang kita temui sudah punya jawaban di dokumentasi atau diskusi yang tersebar di internet. Pada Chapter ini kita akan membangun aplikasi Express pertama dari nol: membuat instance aplikasi, mendaftarkan rute GET dan POST, membaca JSON body, lalu mengirim respons dalam berbagai bentuk. Semua contoh tetap memakai pola uji yang sudah kita kenal — port ephemeral, fetch, lalu close() — supaya setiap keluaran bisa diverifikasi.

Menginstal Express #

Di proyek sungguhan, Express ditambahkan sebagai dependency dengan perintah berikut:

bash
npm install express

Lingkungan Course ini sudah memiliki Express di node_modules repositori, sehingga perintah di atas tidak perlu dijalankan ulang. Kita dapat memastikan versi yang terpasang lewat import JSON — fitur yang sudah kita pelajari pada Section Modules dan Packages:

js
import versi from 'express/package.json' with { type: 'json' };

console.log(`Express yang terpasang: versi ${versi.version}`);

Output yang Dihasilkan:

text
Express yang terpasang: versi 5.3.0

Aplikasi Express Pertama #

Sebuah aplikasi Express dimulai dari satu instance app yang dibuat lewat express(). Instance tersebut menampung daftar rute, dan pada akhirnya diubah menjadi server HTTP sungguhan melalui app.listen(). Berkas berikut mendaftarkan dua rute GET: satu rute tetap dan satu rute berparameter.

js
import express from 'express';

const host = '127.0.0.1';
const app = express();

app.get('/', (req, res) => {
  res.json({ pesan: 'Selamat datang di aplikasi Express pertama kita' });
});

app.get('/halo/:nama', (req, res) => {
  res.json({ pesan: `Halo, ${req.params.nama}` });
});

const server = app.listen(0, host, async () => {
  const base = `http://${host}:${server.address().port}`;
  const r1 = await fetch(`${base}/`);
  console.log('GET /     :', r1.status, await r1.text());
  const r2 = await fetch(`${base}/halo/Budi`);
  console.log('GET /halo :', r2.status, await r2.text());
  server.close();
  server.closeAllConnections();
});

Output yang Dihasilkan:

text
GET /     : 200 {"pesan":"Selamat datang di aplikasi Express pertama kita"}
GET /halo : 200 {"pesan":"Halo, Budi"}

Mari kita bedah baris-baris pentingnya:

  1. Baris 4 (const app = express()): function express() membuat instance aplikasi. Instance inilah pusat konfigurasi — rute, middleware, dan pengaturan engine semuanya didaftarkan ke app.
  2. Baris 6-8 (app.get('/', ...)): rute pertama memasangkan method GET dengan path /. Handler menerima (req, res); di dalamnya kita cukup memanggil res.json() dan Express mengurus status code 200, header content-type, serta serialization.
  3. Baris 10-12 (app.get('/halo/:nama', ...)): segmen path yang diawali titik dua adalah route parameter. Nilai segmen tersebut tersedia di req.params.nama — bandingkan betapa singkatnya dengan penguraian manual memakai new URL() pada chapter sebelumnya.
  4. Baris 14 (app.listen(0, host, ...)): method ini membungkus http.createServer milik Node.js dan langsung memanggil listen. Nilai baliknya adalah objek http.Server asli, sehingga server.address().port dan server.close() bekerja persis seperti pada server module http.

Mengirim dan Menerima JSON #

API modern bertukar data dalam bentuk JSON di kedua arah. Untuk arah masuk, Express perlu dibekali middleware express.json() yang bertugas mengumpulkan body permintaan lalu mengubahnya menjadi object JavaScript di req.body. Untuk arah keluar, res.json() sudah cukup. Berkas berikut menerapkan keduanya pada API daftar tugas sederhana.

js
import express from 'express';

const host = '127.0.0.1';
const app = express();
app.use(express.json());

const tugas = [];

app.get('/tugas', (req, res) => {
  res.json({ jumlah: tugas.length, tugas });
});

app.post('/tugas', (req, res) => {
  const { judul, selesai } = req.body;
  tugas.push({ id: tugas.length + 1, judul, selesai: selesai ?? false });
  res.status(201).json({ pesan: 'Tugas dibuat', tugas: tugas.at(-1) });
});

app.get('/tentang', (req, res) => {
  res.send('<h1>Aplikasi Tugas</h1><p>Latihan Express.</p>');
});

const server = app.listen(0, host, async () => {
  const base = `http://${host}:${server.address().port}`;
  const r1 = await fetch(`${base}/tugas`);
  console.log('GET /tugas  :', r1.status, await r1.text());
  const r2 = await fetch(`${base}/tugas`, {
    method: 'POST',
    headers: { 'content-type': 'application/json' },
    body: JSON.stringify({ judul: 'Belajar Express', selesai: false }),
  });
  console.log('POST /tugas :', r2.status, await r2.text());
  const r3 = await fetch(`${base}/tugas`);
  console.log('GET ulang   :', r3.status, await r3.text());
  const r4 = await fetch(`${base}/tentang`);
  console.log('GET /tentang:', r4.status, r4.headers.get('content-type'));
  server.close();
  server.closeAllConnections();
});

Output yang Dihasilkan:

text
GET /tugas  : 200 {"jumlah":0,"tugas":[]}
POST /tugas : 201 {"pesan":"Tugas dibuat","tugas":{"id":1,"judul":"Belajar Express","selesai":false}}
GET ulang   : 200 {"jumlah":1,"tugas":[{"id":1,"judul":"Belajar Express","selesai":false}]}
GET /tentang: 200 text/html; charset=utf-8

Tiga hal baru terjadi pada berkas di atas:

  1. Baris 5 (app.use(express.json())): middleware body parser didaftarkan sebelum semua rute. Tanpa baris ini, req.body pada handler POST bernilai undefined. Kata kunci app.use akan kita bedah tuntas pada Chapter Middleware pada Express.
  2. Baris 13-17 (app.post(...)): handler POST membaca req.body yang sudah berupa object, lalu mengirim status 201 (Created) memakai res.status(201).json(...) — status code diatur sebelum pengiriman body.
  3. Baris 19-21 (res.send dengan string HTML): method res.send serba bisa. Saat menerima string, Express mengirim string tersebut dengan header text/html; saat menerima object atau array, Express otomatis berperilaku seperti res.json.

res.json atau res.send #

Kedua method tersebut sering dipakai bergantian, jadi kita rangkum perbedaannya:

MethodPerilakuHeader content-type
res.json(data)Selalu melakukan serialization JSON, termasuk untuk nullapplication/json; charset=utf-8
res.send(teks)Mengirim string apa adanyatext/html; charset=utf-8
res.send(objek)Mengubah object menjadi JSON secara otomatisapplication/json; charset=utf-8

Untuk API yang selalu bertukar JSON, res.json() adalah pilihan yang lebih tegas: niat kode terbaca jelas dan header selalu konsisten. Method res.send lebih cocok untuk respons berbasis teks atau HTML seperti halaman sederhana /tentang di atas.

Dengan instance aplikasi, rute, dan JSON body di tangan, kita sudah bisa membangun API kecil. Tapi rute pada contoh di atas masih sedikit — aplikasi nyata butuh parameter dinamis, query string, prefix per modul, dan urutan pencocokan yang jelas. Semua itu adalah pekerjaan Chapter Routing pada Express.

Referensi #