Di pelajaran sebelumnya, kita sudah sepakat bahwa menumpuk semua kode di satu file adalah ide yang buruk. Sekarang, saatnya kita belajar cara “merapikan lemari” atau menyusun struktur folder proyek kita agar terlihat profesional dan mudah dikelola.

Bagian 1: Struktur Folder yang Akan Kita Bangun

Ada banyak cara untuk menyusun sebuah proyek, tetapi kita akan menggunakan salah satu struktur yang paling umum dan terbukti efektif untuk aplikasi Express.js. Tujuannya adalah agar proyek kita terlihat seperti ini:

project-express/
├── node_modules/
├── src/
│   ├── controllers/
│   │   └── student.controller.js
│   ├── routes/
│   │   └── student.route.js
│   └── index.js
├── .gitignore
└── package.json

Jangan khawatir jika terlihat banyak, kita akan membahas fungsi setiap bagiannya.

Bagian 2: Penjelasan Fungsi Setiap Folder dan File

Mari kita bedah fungsi dari setiap “laci” atau folder yang akan kita buat.

• src/ (Source)

  • Fungsi: Ini adalah folder utama yang akan berisi seluruh kode sumber (source code) yang kita tulis. Memisahkan kode kita ke dalam folder src membantu menjaga direktori utama proyek tetap bersih, hanya berisi file-file konfigurasi.

• src/routes/

  • Fungsi: Folder ini khusus untuk menampung file-file yang mendefinisikan route atau endpoint API kita. Setiap file di sini akan bertindak seperti “papan penunjuk jalan” yang memberi tahu Express, “Jika ada permintaan ke URL ini, panggil fungsi yang itu.”

• src/controllers/

  • Fungsi: Folder ini adalah tempat kita meletakkan “otak” atau logika inti dari setiap route. Jika routes adalah penunjuk jalannya, maka controllers adalah tujuannya. Fungsi-fungsi di dalam controller-lah yang akan memproses permintaan, berinteraksi dengan data, dan menyiapkan respons.

• src/index.js

  • Fungsi: Ini akan menjadi titik masuk utama aplikasi kita. Tugasnya sekarang menjadi lebih sederhana: melakukan konfigurasi awal, memuat middleware, dan menghubungkan router dari folder routes ke aplikasi Express utama.

• File lainnya:

  • node_modules/: Folder yang otomatis dibuat oleh npm untuk menyimpan semua library eksternal yang kita instal.
  • package.json: “Kartu identitas” proyek kita, berisi nama proyek, versi, dan daftar library yang digunakan.
  • .gitignore: File khusus untuk memberitahu Git (alat untuk version control) file atau folder mana yang harus diabaikan (misalnya, node_modules). Kita akan membahas ini lebih lanjut di topik publikasi.

Bagian 3: Praktik: Membuat Struktur Folder

Sekarang, ayo kita terapkan struktur ini ke proyek kita.

1. Buka Proyek: Buka kembali folder project-express di VSCode.
2. Buat Folder src: Di panel explorer VSCode, buat sebuah folder baru di level utama (sejajar dengan node_modules) dan beri nama src.
3. Buat Sub-folder: Klik pada folder src, lalu buat dua folder baru di dalamnya:
   • controllers
   • routes
4. Pindahkan File index.js: Klik dan seret (drag and drop) file index.js yang ada di direktori utama ke dalam folder src.

Selesai! Proyekmu sekarang sudah memiliki struktur folder yang jauh lebih rapi. Di pelajaran selanjutnya, kita akan mulai memindahkan kode dari index.js ke dalam file-file di folder routes dan controllers.