Course Content
Pengenalan Backend dan Library di JavaScript
Sesi ini akan memperkenalkan konsep dasar di dunia backend, mulai dari teori, cara kerja, hingga perkenalan dengan berbagai library JavaScript yang umum digunakan. Di akhir sesi, peserta akan mencoba langsung membuat server sederhana dan berinteraksi dengannya menggunakan Postman.
0/6
Mengenal Express.js
Di sesi ini, kita akan beralih dari server Node.js dasar ke framework yang lebih canggih dan mudah digunakan, yaitu Express.js. Peserta akan belajar cara membuat server, memahami berbagai metode routing untuk membuat RESTful API sederhana, dan mempraktikkannya langsung dengan studi kasus data siswa.
0/6
Struktur Proyek dan Modularisasi
Seiring aplikasi kita membesar, menyimpan semua kode dalam satu file akan membuatnya berantakan. Di sesi ini, peserta akan belajar cara menyusun proyek Express.js dengan rapi dengan memisahkan kode ke dalam file dan folder yang berbeda (modularisasi). Kita juga akan membahas penanganan error dasar dan mempelajari fitur baru di Postman
0/7
Pengenalan Supabase dan Simulasi RESTful API dengan Database
Di sesi sebelumnya, data kita akan hilang setiap kali server mati. Sekarang, kita akan menyelesaikan masalah itu dengan menghubungkan API kita ke database sungguhan menggunakan Supabase, sebuah platform Backend as a Service. Peserta akan belajar membuat akun, menghubungkan proyek, dan mempraktikkan operasi CRUD (Create, Read, Update, Delete) pada API data siswa.
0/6
Pengujian Lanjutan, Dokumentasi API (Postman dan Swagger), dan Publikasi
Di sesi final ini, kita akan menyempurnakan proyek kita. Peserta akan belajar cara melakukan pengujian API secara otomatis di Postman, membuat dokumentasi yang rapi dengan Postman dan Swagger agar mudah dipahami orang lain, dan terakhir mempublikasikan hasil karyanya ke GitHub agar bisa menjadi portofolio yang membanggakan.
0/6
Belajar Backend Pemula dengan Express.js dan Supabase

Saatnya “pindah rumah”! Di pelajaran ini, kita akan memindahkan kode-kode kita dari file index.js yang mulai ramai ke dalam “laci-laci” yang sudah kita siapkan di folder routes dan controllers.

Misi kita adalah membuat index.js menjadi sangat bersih dan ramping, hanya bertugas sebagai “manajer” yang menghubungkan semuanya.

Langkah 1: Membuat File Controller (Otak Logika)

Pertama, kita akan memindahkan logika inti (apa yang harus dilakukan saat route dipanggil) ke dalam file controller.

  1. Buat File Controller: Di dalam folder src/controllers, buat sebuah file baru bernama student.controller.js.

  2. Pindahkan Logika: Salin dan tempel kode berikut ke dalam student.controller.js.

    // Database sementara kita pindahkan ke sini
    let students = [
      { id: 1, nama: 'Andi' },
      { id: 2, nama: 'Citra' }
    ];
    
    // Fungsi untuk mendapatkan semua data siswa
    const getAllStudents = (request, response) => {
      response.json(students);
    };
    
    // Fungsi untuk menambahkan siswa baru
    const createNewStudent = (request, response) => {
      const newStudent = request.body;
      students.push(newStudent);
      response.send('Siswa baru berhasil ditambahkan!');
    };
    
    // Export fungsi-fungsi agar bisa digunakan di file lain
    module.exports = {
      getAllStudents,
      createNewStudent
    };​
    • Penjelasan: Kita membuat dua fungsi, getAllStudents dan createNewStudent. Perhatikan bahwa isi dari fungsi-fungsi ini persis sama dengan logika yang sebelumnya ada di dalam app.get() dan app.post().
    • module.exports: Ini adalah cara Node.js untuk membuat fungsi atau variabel dari satu file bisa diakses (di-import) oleh file lain.

Langkah 2: Membuat File Router (Papan Penunjuk Jalan)

Sekarang, kita buat “papan penunjuk jalannya”. File ini hanya akan mendefinisikan URL dan memberi tahu fungsi controller mana yang harus dipanggil.

  1. Buat File Router: Di dalam folder src/routes, buat sebuah file baru bernama student.route.js.

  2. Tulis Kode Router: Salin dan tempel kode berikut ke dalam student.route.js.

    const express = require('express');
    const router = express.Router();
    
    // Import fungsi controller yang sudah kita buat
    const studentController = require('../controllers/student.controller.js');
    
    // Definisikan route GET dan POST
    // Ketika ada request GET ke '/', panggil fungsi getAllStudents
    router.get('/', studentController.getAllStudents);
    
    // Ketika ada request POST ke '/', panggil fungsi createNewStudent
    router.post('/', studentController.createNewStudent);
    
    // Export router agar bisa digunakan di index.js
    module.exports = router;​
    • express.Router(): Kita membuat sebuah instance mini dari aplikasi Express yang khusus untuk menangani routing.
    • require('../controllers...'): Kita mengimpor fungsi-fungsi dari file controller. ../ berarti “naik satu level direktori”.
    • router.get('/', ...): Perhatikan, sekarang handler-nya bukan lagi fungsi anonim, melainkan fungsi yang sudah kita impor dari controller.

Langkah 3: Menghubungkan Semuanya di index.js

Inilah bagian finalnya. Kita akan membersihkan index.js dan membuatnya hanya bertugas sebagai manajer.

  1. Buka File index.js: Buka file src/index.js.

  2. Ubah Kodenya: Hapus semua kode lama dan ganti dengan kode yang jauh lebih bersih ini:

    const express = require('express');
    const app = express();
    const port = 3000;
    
    // Middleware untuk membaca body request dalam format JSON
    app.use(express.json());
    
    // Import router siswa
    const studentRouter = require('./routes/student.route.js');
    
    // Gunakan router siswa untuk path yang diawali dengan /students
    app.use('/students', studentRouter);
    
    // Jalankan server
    app.listen(port, function () {
      console.log(`Server berjalan di http://localhost:${port}`);
    });​
    • Penjelasan app.use('/students', studentRouter): Baris ini adalah kuncinya. Kita memberitahu aplikasi Express utama kita: “Untuk setiap permintaan yang alamatnya diawali dengan /students, tolong serahkan penanganannya kepada studentRouter“.

Langkah 4: Pengujian Akhir

Meskipun kita sudah memecah kode kita ke dalam tiga file berbeda, dari luar (dari sudut pandang Postman), tidak ada yang berubah.

  1. Matikan server lama jika masih berjalan (tekan Ctrl + C di terminal).

  2. Jalankan Server Baru: Karena file utama kita sekarang ada di dalam folder src, jalankan server dengan perintah:

    node src/index.js
  3. Uji di Postman:

    • Kirim GET ke http://localhost:3000/students.
    • Kirim POST ke http://localhost:3000/students dengan data JSON di body.

    Kamu akan melihat hasilnya sama persis seperti sebelumnya. Ini membuktikan bahwa proses refactor atau perapian kode kita telah berhasil! Proyekmu sekarang jauh lebih terstruktur dan siap untuk dikembangkan lebih lanjut.