NodeJS #7: Apa itu Framework? – Kenalan dengan Express.js


🍭 NodeJS #7: Apa itu Framework? – Kenalan dengan Express.js

Halo, calon developer web! 👋

Di tutorial sebelumnya, kita berhasil membuat server web menggunakan modul http bawaan Node.js. Keren, kan? Tapi, kamu mungkin merasa sedikit repot karena harus menulis banyak kode untuk hal-hal sederhana. Nah, sekarang saatnya kita berkenalan dengan Express.js, sebuah framework yang akan membuat hidup kita lebih mudah! Tapi sebelumnya, kita harus paham dulu: apa itu framework?

Yuk, kita bahas! 🚀

🧐 Apa Itu Framework?

Coba bayangkan kamu ingin membuat sebuah rumah. Kalau kamu membangun dari nol, kamu harus:

  • Membuat batu bata sendiri dari tanah liat
  • Membuat semen dari campuran pasir dan kapur
  • Menebang pohon lalu merapikan kayu untuk kusen
  • Dan masih banyak lagi pekerjaan dasar lainnya

Itu butuh waktu sangat lama, kan? Nah, sekarang bayangkan kamu punya toko bangunan yang menjual batu bata jadi, semen siap pakai, kayu yang sudah dipotong rapi, bahkan pintu dan jendela yang tinggal pasang. Kamu tinggal merakitnya sesuai desain rumahmu. Lebih cepat dan mudah!

Dalam dunia pemrograman, framework adalah seperti "toko bangunan" itu. Framework menyediakan komponen-komponen siap pakai yang bisa kita gunakan untuk membuat aplikasi dengan cepat, tanpa perlu membuat semuanya dari nol.

💡 Jadi, framework = kumpulan alat dan aturan yang memudahkan kita membuat program.

🌟 Kenalan dengan Express.js

Express.js (atau sering disebut Express saja) adalah framework untuk Node.js yang khusus digunakan untuk membuat aplikasi web dan API. Express adalah framework paling populer di ekosistem Node.js. Kenapa? Karena:

  • Sederhana dan minimalis – Tidak banyak aturan ribet, mudah dipelajari.
  • Fleksibel – Bisa digunakan untuk proyek kecil sampai besar.
  • Middleware – Konsep yang memudahkan kita menambahkan fitur-fitur tambahan.
  • Komunitas besar – Banyak tutorial, dokumentasi, dan plugin siap pakai.
  • Mudah membuat routing – Jauh lebih sederhana dibanding modul http bawaan.

Banyak perusahaan besar menggunakan Express, lho! Jadi, belajar Express adalah investasi yang bagus.

🔄 Perbandingan: Tanpa Framework vs Dengan Express

Ingat kode server kita dengan modul http?

const http = require('http');

const server = http.createServer((req, res) => {
  if (req.url === '/') {
    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.write('<h1>Halo Dunia</h1>');
    res.end();
  } else if (req.url === '/profil') {
    // ...
  }
});

Sekarang lihat betapa sederhananya dengan Express:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('<h1>Halo Dunia</h1>');
});

app.get('/profil', (req, res) => {
  res.send('<h1>Ini halaman profil</h1>');
});

app.listen(3000, () => {
  console.log('Server berjalan di port 3000');
});

Lebih rapi dan mudah dibaca, kan? Kita tidak perlu lagi menulis res.writeHead() dan res.end() secara manual. Express menyediakan fungsi res.send() yang otomatis mengatur header dan mengakhiri response.

⚙️ Cara Menginstal Express.js

Sekarang kita akan memasang Express di komputer. Ikuti langkah-langkah berikut dengan saksama:

📌 Langkah 1: Buat Folder Proyek Baru

Buat folder baru untuk proyek Express pertama kita. Misalnya, beri nama belajar-express. Buka folder tersebut di terminal/command prompt.

mkdir belajar-express
cd belajar-express

📌 Langkah 2: Inisialisasi Proyek dengan npm

npm (Node Package Manager) adalah program yang akan mengelola library (paket) yang kita pasang. Jalankan perintah berikut:

npm init -y

Perintah ini akan membuat file package.json. File ini berisi informasi tentang proyek kita dan daftar paket yang kita gunakan. Opsi -y artinya kita setuju dengan semua pilihan default.

Setelah dijalankan, akan muncul file baru package.json dengan isi kira-kira seperti ini:

{
  "name": "belajar-express",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}
📝 File package.json sangat penting. Dia seperti "daftar belanja" yang mencatat semua bahan (paket) yang kita gunakan dalam proyek.

📌 Langkah 3: Instal Express

Sekarang saatnya memasang Express. Jalankan perintah:

npm install express

Tunggu beberapa saat sampai proses instalasi selesai. Setelah selesai, kamu akan melihat:

  • Folder baru bernama node_modules – ini tempat semua kode library disimpan.
  • File baru package-lock.json – file yang mencatat versi persis dari setiap library.
  • Di package.json akan muncul bagian baru "dependencies" yang berisi "express": "^4.18.2" (versi bisa berbeda).

Artinya, Express sudah terpasang dan siap digunakan! 🎉

⚠️ Jangan pernah mengedit atau menghapus folder node_modules secara manual! Isinya bisa ribuan file. Kalau ingin membersihkan, cukup hapus folder itu dan jalankan npm install lagi untuk mengunduh ulang semua dependensi.

🧪 Membuat Server Sederhana dengan Express

Sekarang kita buat file JavaScript untuk menjalankan server Express pertama kita.

  1. Buat file baru bernama app.js di folder belajar-express.
  2. Ketik kode berikut:
// Import express
const express = require('express');

// Buat aplikasi express
const app = express();

// Buat route untuk halaman utama
app.get('/', (req, res) => {
  res.send('<h1>Halo dari Express!</h1><p>Ini server pertamaku dengan Express.js</p>');
});

// Buat route untuk halaman /profil
app.get('/profil', (req, res) => {
  res.send({
    nama: 'Budi',
    umur: 12,
    hobi: ['membaca', 'coding', 'bermain bola']
  });
});

// Tentukan port
const port = 3000;

// Jalankan server
app.listen(port, () => {
  console.log(`Server Express berjalan di http://localhost:${port}`);
});

Sekarang jalankan server dengan perintah:

node app.js

Buka browser dan akses http://localhost:3000. Kamu akan melihat halaman HTML sederhana. Coba juga akses http://localhost:3000/profil. Lihat, browser menampilkan data JSON! (Karena kita mengirim object JavaScript, Express otomatis mengubahnya ke JSON).

Keren, kan? Dengan Express, membuat route dan mengirim response jadi sangat mudah.

🧩 Penjelasan Kode

  • const express = require('express'); – Mengimpor modul Express.
  • const app = express(); – Membuat aplikasi Express. Variabel app ini adalah "inti" dari server kita.
  • app.get(path, handler) – Membuat route untuk method GET. path adalah URL (misal '/' atau '/profil'). handler adalah fungsi yang akan dipanggil ketika route diakses. Fungsi ini menerima req (request) dan res (response).
  • res.send(data) – Mengirim response. Bisa berupa string (HTML), object, array, dll.
  • app.listen(port, callback) – Menjalankan server di port tertentu.

📦 Apa Itu node_modules dan package.json?

Mungkin kamu bertanya-tanya, kenapa ada banyak folder dan file setelah instalasi? Mari kita jelaskan:

Nama Kegunaan
node_modules Tempat menyimpan semua library yang kita pasang (dan library yang dibutuhkan oleh library tersebut). Biasanya sangat besar dan tidak perlu di-upload ke Git.
package.json File konfigurasi proyek. Mencantumkan nama proyek, versi, dan daftar dependensi (library yang kita pakai).
package-lock.json Mencatat versi persis setiap library (termasuk library turunannya). Memastikan semua orang yang mengembangkan proyek ini menggunakan versi yang sama.
📌 Jika suatu saat folder node_modules terhapus, kita bisa mengembalikannya dengan perintah npm install. npm akan membaca package.json dan mengunduh semua dependensi lagi.

🎯 Latihan Mandiri

  1. Buat route baru /about yang menampilkan halaman "Tentang Saya" dengan HTML sederhana.
  2. Buat route /data yang mengirim object JavaScript berisi daftar teman-temanmu (nama, umur, kelas).
  3. Coba ganti port menjadi 8080, lalu akses. Apa yang terjadi?

🎉 Penutup

Selamat! Kamu sekarang sudah mengenal framework Express.js, menginstalnya, dan membuat server pertama dengan Express. Jauh lebih mudah dan rapi dibanding menggunakan modul http bawaan, kan?

Di tutorial berikutnya (NodeJS #8) kita akan belajar lebih dalam tentang routing di Express dan cara membuat halaman-halaman yang lebih kompleks. Pastikan kamu sudah menguasai instalasi dan cara menjalankan server Express ini, ya!

Kalau ada kendala saat instalasi atau menjalankan server, jangan ragu tanya di kolom komentar. Sampai jumpa di seri selanjutnya! 👋😊


Ditulis dengan ❤️ untuk para pemula yang ingin menjadi programmer handal.

Lebih baru Lebih lama

نموذج الاتصال