Express.js adalah salah satu framework Node.js yang paling populer untuk membangun aplikasi web. Dengan menggunakan Express, kita dapat dengan mudah membuat server HTTP, mengatur routing, dan mengelola berbagai middleware untuk aplikasi yang lebih dinamis dan interaktif. Dalam artikel ini, kita akan membahas langkah demi langkah untuk memulai dengan Express.js.

Apa Itu Express.js?

Express.js adalah framework minimalis untuk Node.js yang memudahkan pengembangan aplikasi backend. Dibandingkan dengan Node.js saja, Express menawarkan struktur yang lebih teratur dan menyediakan berbagai fitur tambahan untuk mengatur alur aplikasi. Hal ini membuat Express menjadi pilihan yang sangat populer bagi developer untuk membangun RESTful API dan aplikasi full-stack.

Mengapa Menggunakan Express.js?

Beberapa alasan mengapa Express menjadi pilihan utama bagi banyak developer:

1. Cepat dan Ringan: Dibangun di atas Node.js, Express sangat cepat dan efisien.
2. Mudah Dipelajari: Express memiliki dokumentasi yang lengkap dan komunitas yang besar.
3. Mendukung Middleware: Middleware memudahkan kita untuk menangani tugas-tugas tertentu seperti autentikasi, logging, dan parsing data.
4. Kompatibel dengan Berbagai Database: Express dapat digunakan dengan MongoDB, MySQL, PostgreSQL, dan database lainnya.

Persiapan

Sebelum mulai, pastikan bahwa Node.js sudah terpasang di komputer Anda. Anda bisa memeriksanya dengan mengetikkan:

node -v
npm -v

Jika Node.js dan npm belum terpasang, Anda bisa mengunduhnya dari situs resmi Node.js .

Setelah Node.js terpasang, buat direktori baru untuk proyek Express Anda:

mkdir express-tutorial
cd express-tutorial

Langkah 1: Menginstal Express.js

Untuk memulai, kita akan membuat file package.json menggunakan perintah berikut:

npm init -y

File ini akan mengelola dependensi dan informasi proyek Anda. Selanjutnya, instal Express.js dengan perintah:

npm install express

Setelah Express berhasil diinstal, kita bisa mulai menulis kode pertama kita!

Langkah 2: Membuat Server Sederhana

Buat file baru bernama app.js dan tambahkan kode berikut:

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

app.get('/', (req, res) => {
  res.send('Hello, Express!');
});

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

Mari kita uraikan kode di atas:

• const express = require('express'); mengimpor modul Express ke dalam proyek.
• const app = express(); membuat instance aplikasi Express.
• app.get('/', (req, res) => {...}); menangani permintaan GET pada route / dan mengirim respons “Hello, Express!”.
• app.listen(port, () => {...}); membuat server dan mendengarkan permintaan pada port yang ditentukan (3000 dalam contoh ini).

Untuk menjalankan server, gunakan perintah:

node app.js

Akses http://localhost:3000 di browser Anda, dan Anda akan melihat pesan “Hello, Express!”.

Langkah 3: Menambahkan Routing

Routing adalah salah satu fitur utama dari Express. Dengan routing, kita dapat mengatur respon berbeda berdasarkan URL yang diminta oleh klien. Berikut adalah contoh menambahkan beberapa route:

app.get('/about', (req, res) => {
  res.send('Ini halaman About');
});

app.get('/contact', (req, res) => {
  res.send('Ini halaman Contact');
});

Sekarang, kita punya tiga route:

• / untuk halaman beranda.
• /about untuk halaman “About”.
• /contact untuk halaman “Contact”.

Setiap kali Anda mengakses salah satu URL ini di browser, Express akan menampilkan respons sesuai dengan route yang dikonfigurasi.

Langkah 4: Menggunakan Middleware

Middleware adalah fungsi yang mengeksekusi kode antara permintaan klien dan respons server. Middleware berguna untuk menangani autentikasi, logging, dan operasi lain yang berulang. Berikut adalah contoh sederhana menggunakan middleware:

app.use((req, res, next) => {
  console.log(`${req.method} ${req.url}`);
  next();
});

Middleware di atas mencatat setiap permintaan yang masuk dengan menampilkan metode HTTP dan URL. next() dipanggil untuk melanjutkan ke middleware berikutnya atau ke route yang sesuai.

Langkah 5: Mengatur Static Files

Express memudahkan kita untuk melayani file statis seperti gambar, CSS, dan JavaScript. Untuk melakukannya, kita bisa menggunakan middleware bawaan express.static():

app.use(express.static('public'));

Simpan file statis Anda dalam folder bernama public, dan sekarang Anda dapat mengaksesnya secara langsung melalui URL. Misalnya, jika Anda memiliki file public/style.css, Anda bisa mengaksesnya di http://localhost:3000/style.css.

Langkah 6: Menggunakan Template Engine

Untuk membuat halaman dinamis, kita bisa menggunakan template engine seperti EJS, Pug, atau Handlebars. Dalam contoh ini, kita akan menggunakan EJS.

Pertama, instal EJS:

npm install ejs

Kemudian, atur Express untuk menggunakan EJS sebagai template engine:

app.set('view engine', 'ejs');

Buat folder baru bernama views di direktori proyek Anda, lalu buat file index.ejs di dalamnya:

<!DOCTYPE html>
<html>
<head>
  <title>Halaman Utama</title>
</head>
<body>
  <h1>Selamat datang di Express!</h1>
</body>
</html>

Sekarang, ubah route beranda Anda untuk merender template ini:

app.get('/', (req, res) => {
  res.render('index');
});

Saat Anda membuka http://localhost:3000 di browser, Express akan merender template index.ejs.

Langkah 7: Membuat API Endpoint

Express sangat populer untuk membuat RESTful API. Berikut adalah contoh membuat endpoint untuk mendapatkan data pengguna:

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

app.get('/api/users', (req, res) => {
  res.json(users);
});

app.get('/api/users/:id', (req, res) => {
  const user = users.find(u => u.id === parseInt(req.params.id));
  if (!user) return res.status(404).send('User tidak ditemukan');
  res.json(user);
});

Endpoint pertama, /api/users, mengirim semua data pengguna. Endpoint kedua, /api/users/:id, mengirim data pengguna berdasarkan ID yang diberikan.

Langkah 8: Menangani Error

Untuk menangani error dalam Express, kita bisa membuat middleware khusus untuk menangkap dan menangani error:

app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).send('Terjadi kesalahan!');
});

Middleware ini akan menangkap semua error yang tidak tertangani dan mengirim pesan error ke klien.

Kesimpulan

Dalam tutorial ini, kita telah membahas dasar-dasar Express.js, mulai dari membuat server sederhana hingga menggunakan middleware, routing, template engine, dan membangun API endpoint. Express adalah framework yang kuat dan fleksibel yang memungkinkan kita membuat aplikasi backend dengan cepat dan efisien.

Jika Anda ingin memperdalam pemahaman, Anda dapat membaca lebih banyak dokumentasi atau mencoba membangun proyek kecil dengan Express. Selamat belajar dan selamat mencoba!

Itu saja artikel dari Admin, semoga bermanfaat… Terima kasih sudah mampir…