Advertisement

Membuat Proyek Express.js Baru? Begini Cara Simpel & Cepatnya!

 

 Halo, para calon developer Express.js! Jika kamu sampai di artikel ini, berarti kamu tertarik untuk membuat proyek baru dengan Express.js, entah untuk belajar, membangun API, atau bahkan mengembangkan aplikasi besar.

Nah, tenang! Aku bakal pandu kamu langkah demi langkah untuk membuat proyek Express.js baru dengan cara yang mudah, cepat, dan tidak bikin pusing kepala. Yuk, kita mulai!

1. Apa Itu Express.js?

Buat yang masih baru di dunia backend development, Express.js adalah framework minimalis untuk Node.js yang membuat pengembangan aplikasi web dan API jadi lebih mudah.

Kalau Node.js itu seperti mobil balap tanpa fitur tambahan, maka Express.js adalah bodykit, spoiler, dan turbocharger-nya—membantu performa tetap cepat tapi lebih nyaman digunakan!

Keunggulan Express.js:

  •   Mudah dipelajari – Minimalis dan simpel.
  •   Cepat – Menggunakan arsitektur non-blocking I/O dari Node.js.
  •   Banyak middleware – Bisa pakai plugin buat autentikasi, logging, dsb.
  •   Dukungan komunitas besar – Banyak dokumentasi dan tutorial!

2. Persiapan Awal Sebelum Memulai

Sebelum kita mulai ngoding, pastikan kamu sudah punya:

 Node.js – Bisa dicek dengan perintah:

node -v

Kalau belum terinstall, silakan download dari nodejs.org.

 NPM (Node Package Manager) – Biasanya sudah ada saat install Node.js. Cek dengan:

npm -v

 Text Editor – Bebas pakai apa saja! Bisa VS Code, WebStorm, atau Notepad++ (tapi kalau pakai Notepad biasa, siap-siap pusing ).

3. Membuat Proyek Express.js Baru

Langkah 1: Buat Folder Proyek

Pertama, buat folder proyek di komputer kamu dan masuk ke dalamnya:

mkdir my-express-app
cd my-express-app

Langkah 2: Inisialisasi Proyek Node.js

Sekarang kita inisialisasi proyek dengan perintah berikut:

npm init -y

Perintah ini akan membuat file package.json yang berisi informasi proyek kita.

4. Instalasi Express.js

Setelah inisialisasi, sekarang saatnya menginstall Express.js ke proyek kita:

npm install express

Tunggu sebentar, dan Express akan terinstall dengan cepat. Setelah itu, kita siap mulai ngoding!

5. Membuat Server Express Pertama

Sekarang kita buat file utama proyek kita, misalnya server.js, dan buka dengan text editor. Tambahkan kode berikut:

const express = require("express");
const app = express();
const PORT = 3000;

// Rute dasar
app.get("/", (req, res) => {
    res.send("Halo, dunia! Express.js siap berjalan ");
});

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

Penjelasan kode di atas:

  •   Import Express → Kita memanggil require("express") untuk menggunakan framework.
  •   Buat aplikasi Expressconst app = express(); membuat instance aplikasi.
  •   Definisi rute dasar → Ketika user mengakses http://localhost:3000/, dia akan melihat teks "Halo, dunia!".
  •   Menjalankan serverapp.listen(PORT) memastikan server berjalan di port yang kita tentukan.

6. Menjalankan Server Express.js

Sekarang mari jalankan server kita! Ketik di terminal:

node server.js

Jika sukses, kamu akan melihat output seperti ini:

Server berjalan di http://localhost:3000

Buka browser dan kunjungi **http://localhost:3000/**—selamat, proyek Express.js pertamamu sudah berjalan!

7. Menambahkan Middleware dan Routes

Express punya fitur middleware yang sangat berguna untuk menangani request sebelum sampai ke response. Kita bisa tambahkan middleware bawaan seperti express.json() atau middleware pihak ketiga seperti cors dan helmet.

Coba tambahkan middleware logging sederhana di server.js:

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

Dan tambahkan rute baru:

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

Sekarang jalankan server lagi, coba akses http://localhost:3000/about, dan lihat log di terminal!

8. Menjalankan Server dengan Nodemon (Opsional, Tapi Wajib Coba!)

Supaya kita gak perlu restart server setiap kali edit kode, kita bisa pakai nodemon:

npm install -g nodemon

Lalu jalankan server dengan:

nodemon server.js

Sekarang setiap kali kamu edit kode, server akan restart otomatis—lebih nyaman, kan?

9. Menyusun Struktur Proyek Express.js yang Lebih Rapi

Seiring bertambahnya fitur, lebih baik kita pisahkan kode ke dalam folder routes, controllers, dan middleware. Contoh struktur yang lebih rapi:

my-express-app/
│── server.js
│── package.json
│── routes/
│   ├── index.js
│   ├── users.js
│── controllers/
│   ├── userController.js
│── middleware/
│   ├── authMiddleware.js

Misalnya, kita bisa buat file routes/users.js seperti ini:

const express = require("express");
const router = express.Router();

router.get("/", (req, res) => {
    res.send("Daftar pengguna");
});

module.exports = router;

Lalu di server.js, tinggal import rutenya:

const userRoutes = require("./routes/users");
app.use("/users", userRoutes);

Dengan struktur ini, proyek Express kamu lebih rapi dan mudah dikembangkan!

10. Kesimpulan

Membuat proyek baru dengan Express.js ternyata gampang banget, kan?  Dalam waktu singkat, kita sudah:

  •   Membuat proyek Express.js baru
  •   Menjalankan server
  •   Menambahkan rute dan middleware
  •   Menggunakan nodemon untuk restart otomatis
  •   Menyusun struktur proyek yang lebih rapi

Sekarang tinggal lanjut eksplorasi lebih dalam, seperti menghubungkan dengan database, membuat API, atau bahkan membangun aplikasi full-stack!

Post a Comment

0 Comments