Quickstarters
Bagaimana Cara Membangun Aplikasi CRUD dengan Node.js?

33min
Ikhtisar
Dalam panduan ini, Anda akan belajar bagaimana mengembangkan aplikasi CRUD (buat, baca, perbarui, hapus) yang lengkap menggunakan Node.js. 
Kami akan memanfaatkan Back4app sebagai layanan backend kami untuk menyederhanakan manajemen data. Panduan ini akan memandu Anda melalui konfigurasi proyek Back4app, merancang model data dinamis, dan menerapkan operasi CRUD menggunakan Node.js.
Pertama, Anda akan mengatur proyek Back4app yang bernama Basic-CRUD-App-Node yang menyediakan solusi penyimpanan data non-relasional yang kuat. 
Anda kemudian akan merancang skema data Anda dengan mendefinisikan koleksi dan bidang baik secara manual atau dengan memanfaatkan Agen AI Back4app.
Selanjutnya, Anda akan mengelola backend Anda melalui Aplikasi Admin Back4app—antarmuka yang ramah pengguna, seret dan lepas untuk manipulasi data. 
Akhirnya, Anda akan mengintegrasikan aplikasi Node.js Anda dengan Back4app menggunakan Parse JavaScript SDK (atau REST/GraphQL API sesuai kebutuhan) sambil memastikan kontrol akses yang aman.
Pada akhir tutorial ini, Anda akan membangun aplikasi Node.js yang siap produksi yang mampu melakukan operasi CRUD penting bersama dengan otentikasi pengguna dan keamanan data.
Apa yang Akan Anda Pelajari
Cara membuat aplikasi CRUD berbasis Node.js dengan backend low-code yang efektif.
Strategi untuk merancang backend yang dapat diskalakan dan menghubungkannya dengan aplikasi Node.js Anda.
Cara memanfaatkan Aplikasi Admin Back4app untuk operasi buat, baca, perbarui, dan hapus yang lebih efisien.
Teknik penyebaran, termasuk kontainerisasi Docker, untuk meluncurkan aplikasi Node.js Anda dengan efisien.
﻿
Prasyarat
Sebelum memulai, pastikan Anda memiliki:
Akun Back4app dengan proyek yang baru dikonfigurasi.
Butuh bantuan? Kunjungi Memulai dengan Back4app.
Pengaturan pengembangan Node.js.
Gunakan editor kode seperti Visual Studio Code dan pastikan Node.js (v14 atau lebih baru) terinstal.
Pengetahuan dasar tentang Node.js, pemrograman asinkron, dan REST API.
Rujuk ke dokumentasi Node.js jika diperlukan.
﻿
Langkah 1 – Menyiapkan Proyek Anda
Membuat Proyek Back4app Baru
Masuk ke akun Back4app Anda.
Klik tombol “Aplikasi Baru” dari dasbor Anda.
Beri nama proyek Anda: Basic-CRUD-App-Node dan ikuti petunjuk di layar untuk menyelesaikan pengaturan.
Buat Proyek Baru
﻿
Setelah dibuat, proyek Anda akan muncul di dasbor Anda, siap untuk konfigurasi backend.
﻿
Langkah 2 – Membuat Skema Data Anda
Mendefinisikan Struktur Data Anda
Untuk aplikasi CRUD ini, Anda akan membuat beberapa koleksi di proyek Back4app Anda. Di bawah ini adalah contoh koleksi kunci dan bidang yang diperlukan untuk fungsionalitas CRUD dasar.
1. Koleksi Item
Koleksi ini menyimpan rincian tentang setiap item.
Bidang
Tipe
Deskripsi
_id
ObjectId
Pengidentifikasi unik yang dihasilkan secara otomatis.
judul
String
Nama item tersebut.
deskripsi
String
Gambaran singkat tentang item tersebut.
dibuatPada
Tanggal
Stempel waktu yang menandai kapan item ditambahkan.
diperbaruiPada
Tanggal
Stempel waktu menandai pembaruan terakhir.
2. Koleksi Pengguna
Koleksi ini menangani kredensial pengguna dan data otentikasi.
Bidang
Tipe
Deskripsi
_id
ObjectId
Pengidentifikasi unik yang dihasilkan secara otomatis.
nama pengguna
String
Nama unik untuk pengguna.
email
String
Alamat email unik pengguna.
hashKataSandi
String
Kata sandi yang di-hash untuk otentikasi yang aman.
dibuatPada
Tanggal
Stempel waktu ketika akun dibuat.
diperbaruiPada
Tanggal
Stempel waktu ketika akun diperbarui.
Anda dapat membuat koleksi dan bidang ini secara manual melalui dasbor Back4app.
Buat Kelas Baru
﻿
Anda dapat menambahkan kolom dengan memilih jenis data, memberi nama bidang, mengatur nilai default, dan menandainya sebagai wajib.
Buat Kolom
﻿
Memanfaatkan AI Agent Back4app untuk Generasi Skema
AI Agent Back4app menyederhanakan pengaturan skema dengan secara otomatis menghasilkan model data Anda berdasarkan deskripsi Anda. Ini mempercepat konfigurasi dan memastikan struktur data Anda mendukung semua operasi CRUD.
Cara Menggunakan AI Agent:
Buka AI Agent:
Akses AI Agent dari pengaturan proyek Back4app Anda.
Gambarkan Skema Data Anda:
Jelaskan koleksi dan bidang yang Anda butuhkan.
Tinjau dan Terapkan:
AI Agent akan menyarankan skema. Tinjau proposal dan terapkan perubahan.
Contoh Prompt
Text
Create the following collections in my Back4app project:

1) Collection: Items
- Fields:
  - _id: ObjectId (auto-generated)
  - title: String
  - description: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)

2) Collection: Users
- Fields:
  - _id: ObjectId (auto-generated)
  - username: String (unique)
  - email: String (unique)
  - passwordHash: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)
Create the following collections in my Back4app project:

1) Collection: Items
- Fields:
  - _id: ObjectId (auto-generated)
  - title: String
  - description: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)

2) Collection: Users
- Fields:
  - _id: ObjectId (auto-generated)
  - username: String (unique)
  - email: String (unique)
  - passwordHash: String
  - createdAt: Date (auto-generated)
  - updatedAt: Date (auto-updated)
﻿
Metode ini memastikan model data yang konsisten dan dioptimalkan.
﻿
Langkah 3 – Mengaktifkan Aplikasi Admin & Melakukan Operasi CRUD
Ikhtisar Aplikasi Admin
Aplikasi Admin Back4app menyediakan antarmuka tanpa kode untuk mengelola data backend Anda. Desain drag-and-drop-nya membuatnya sederhana untuk menjalankan tugas CRUD seperti menambahkan, melihat, memperbarui, dan menghapus catatan.
Mengaktifkan Aplikasi Admin
Pergi ke bagian “Lainnya” di dasbor Back4app Anda.
Pilih “Aplikasi Admin” dan klik “Aktifkan Aplikasi Admin.”
Konfigurasikan kredensial admin Anda dengan mengatur akun admin awal Anda. Proses ini juga akan membuat peran (misalnya, B4aAdminUser) dan kelas sistem.
Aktifkan Aplikasi Admin
﻿
Setelah diaktifkan, masuk ke Aplikasi Admin untuk mengelola data Anda.
Dasbor Aplikasi Admin
﻿
Mengelola Operasi CRUD dengan Aplikasi Admin
Di dalam Aplikasi Admin Anda dapat:
Masukkan Rekaman: Gunakan tombol “Tambahkan Rekaman” dalam sebuah koleksi (misalnya, Item) untuk membuat entri baru.
Tinjau dan Edit Rekaman: Klik pada rekaman mana pun untuk memeriksa detailnya atau memperbarui bidangnya.
Hapus Rekaman: Hapus entri yang tidak lagi diperlukan.
Antarmuka yang ramah pengguna ini menyederhanakan manajemen data secara signifikan.
﻿
Langkah 4 – Menghubungkan Aplikasi Node.js Anda dengan Back4app
Dengan backend Anda sudah disiapkan, saatnya untuk menghubungkan aplikasi Node.js Anda ke Back4app.
Opsi A: Menggunakan Parse JavaScript SDK
Instal SDK JavaScript Parse:
Jalankan perintah berikut di direktori proyek Anda:
Bash
npm install parse
npm install parse
﻿
Inisialisasi Parse di Aplikasi Node.js Anda:
Buat file konfigurasi (misalnya, parseConfig.js):
JS
// parseConfig.js
const Parse = require('parse/node');
Parse.initialize('YOUR_APPLICATION_ID', 'YOUR_JAVASCRIPT_KEY');
Parse.serverURL = 'https://parseapi.back4app.com';
module.exports = Parse;
// parseConfig.js
const Parse = require('parse/node');
Parse.initialize('YOUR_APPLICATION_ID', 'YOUR_JAVASCRIPT_KEY');
Parse.serverURL = 'https://parseapi.back4app.com';
module.exports = Parse;
﻿
﻿
Text

3. **Implement CRUD Operations:**  
For example, create a service to manage items:

```javascript
// itemsService.js
const Parse = require('./parseConfig');

async function fetchItems() {
const Items = Parse.Object.extend('Items');
const query = new Parse.Query(Items);
try {
 const results = await query.find();
 console.log('Fetched items:', results);
 return results;
} catch (error) {
 console.error('Error retrieving items:', error);
}
}

async function createItem(title, description) {
const Items = Parse.Object.extend('Items');
const item = new Items();
item.set('title', title);
item.set('description', description);
try {
 await item.save();
 console.log('Item successfully created.');
} catch (error) {
 console.error('Error creating item:', error);
}
}

async function updateItem(objectId, newTitle, newDescription) {
const Items = Parse.Object.extend('Items');
const query = new Parse.Query(Items);
try {
 const item = await query.get(objectId);
 item.set('title', newTitle);
 item.set('description', newDescription);
 await item.save();
 console.log('Item updated successfully.');
} catch (error) {
 console.error('Error updating item:', error);
}
}

async function deleteItem(objectId) {
const Items = Parse.Object.extend('Items');
const query = new Parse.Query(Items);
try {
 const item = await query.get(objectId);
 await item.destroy();
 console.log('Item deleted successfully.');
} catch (error) {
 console.error('Error deleting item:', error);
}
}

module.exports = {
fetchItems,
createItem,
updateItem,
deleteItem,
};

3. **Implement CRUD Operations:**  
For example, create a service to manage items:

```javascript
// itemsService.js
const Parse = require('./parseConfig');

async function fetchItems() {
const Items = Parse.Object.extend('Items');
const query = new Parse.Query(Items);
try {
 const results = await query.find();
 console.log('Fetched items:', results);
 return results;
} catch (error) {
 console.error('Error retrieving items:', error);
}
}

async function createItem(title, description) {
const Items = Parse.Object.extend('Items');
const item = new Items();
item.set('title', title);
item.set('description', description);
try {
 await item.save();
 console.log('Item successfully created.');
} catch (error) {
 console.error('Error creating item:', error);
}
}

async function updateItem(objectId, newTitle, newDescription) {
const Items = Parse.Object.extend('Items');
const query = new Parse.Query(Items);
try {
 const item = await query.get(objectId);
 item.set('title', newTitle);
 item.set('description', newDescription);
 await item.save();
 console.log('Item updated successfully.');
} catch (error) {
 console.error('Error updating item:', error);
}
}

async function deleteItem(objectId) {
const Items = Parse.Object.extend('Items');
const query = new Parse.Query(Items);
try {
 const item = await query.get(objectId);
 await item.destroy();
 console.log('Item deleted successfully.');
} catch (error) {
 console.error('Error deleting item:', error);
}
}

module.exports = {
fetchItems,
createItem,
updateItem,
deleteItem,
};
﻿
Opsi B: Menggunakan REST atau GraphQL
Jika Anda lebih suka tidak menggunakan Parse SDK, Anda dapat berinteraksi dengan Back4app melalui panggilan API REST. Misalnya, berikut adalah cara untuk mengambil item menggunakan Node.js:
JS
const https = require('https');

function fetchItemsREST() {
  const options = {
    hostname: 'parseapi.back4app.com',
    path: '/classes/Items',
    method: 'GET',
    headers: {
      'X-Parse-Application-Id': 'YOUR_APPLICATION_ID',
      'X-Parse-REST-API-Key': 'YOUR_REST_API_KEY'
    }
  };

  const req = https.request(options, res => {
    let data = '';
    res.on('data', chunk => data += chunk);
    res.on('end', () => console.log('Response:', data));
  });

  req.on('error', error => console.error('Error:', error));
  req.end();
}

fetchItemsREST();
const https = require('https');

function fetchItemsREST() {
  const options = {
    hostname: 'parseapi.back4app.com',
    path: '/classes/Items',
    method: 'GET',
    headers: {
      'X-Parse-Application-Id': 'YOUR_APPLICATION_ID',
      'X-Parse-REST-API-Key': 'YOUR_REST_API_KEY'
    }
  };

  const req = https.request(options, res => {
    let data = '';
    res.on('data', chunk => data += chunk);
    res.on('end', () => console.log('Response:', data));
  });

  req.on('error', error => console.error('Error:', error));
  req.end();
}

fetchItemsREST();
﻿
Integrasikan panggilan REST ini ke dalam layanan Node.js Anda sesuai kebutuhan.
﻿
Langkah 5 – Memperkuat Keamanan Backend Anda
Mengonfigurasi Daftar Kontrol Akses (ACL)
Tingkatkan keamanan data Anda dengan mengatur ACL pada objek Anda. Misalnya, untuk membuat item hanya dapat diakses oleh penciptanya:
JS
const Parse = require('./parseConfig');

async function createPrivateItem(title, description, owner) {
  const Items = Parse.Object.extend('Items');
  const item = new Items();
  item.set('title', title);
  item.set('description', description);

  const acl = new Parse.ACL();
  acl.setReadAccess(owner, true);
  acl.setWriteAccess(owner, true);
  acl.setPublicReadAccess(false);
  acl.setPublicWriteAccess(false);
  item.setACL(acl);

  try {
    await item.save();
    console.log('Private item created successfully.');
  } catch (error) {
    console.error('Error saving private item:', error);
  }
}
const Parse = require('./parseConfig');

async function createPrivateItem(title, description, owner) {
  const Items = Parse.Object.extend('Items');
  const item = new Items();
  item.set('title', title);
  item.set('description', description);

  const acl = new Parse.ACL();
  acl.setReadAccess(owner, true);
  acl.setWriteAccess(owner, true);
  acl.setPublicReadAccess(false);
  acl.setPublicWriteAccess(false);
  item.setACL(acl);

  try {
    await item.save();
    console.log('Private item created successfully.');
  } catch (error) {
    console.error('Error saving private item:', error);
  }
}
﻿
Mengatur Izin Tingkat Kelas (CLP)
Sesuaikan CLP di dasbor Back4app Anda untuk menegakkan aturan keamanan default, memastikan bahwa hanya pengguna yang terautentikasi yang dapat berinteraksi dengan koleksi tertentu.
﻿
Langkah 6 – Mengimplementasikan Autentikasi Pengguna
Mengonfigurasi Manajemen Pengguna
Back4app memanfaatkan koleksi Pengguna bawaan Parse untuk mengelola autentikasi. Dalam aplikasi Node.js Anda, terapkan pendaftaran dan login pengguna seperti yang ditunjukkan di bawah ini:
JS
const Parse = require('./parseConfig');

async function signUp(username, password, email) {
  const user = new Parse.User();
  user.set('username', username);
  user.set('password', password);
  user.set('email', email);

  try {
    await user.signUp();
    console.log('User registered successfully!');
  } catch (error) {
    console.error('Error during sign up:', error);
  }
}

async function logIn(username, password) {
  try {
    const user = await Parse.User.logIn(username, password);
    console.log('User logged in:', user.get('username'));
  } catch (error) {
    console.error('Login error:', error);
  }
}

module.exports = { signUp, logIn };
const Parse = require('./parseConfig');

async function signUp(username, password, email) {
  const user = new Parse.User();
  user.set('username', username);
  user.set('password', password);
  user.set('email', email);

  try {
    await user.signUp();
    console.log('User registered successfully!');
  } catch (error) {
    console.error('Error during sign up:', error);
  }
}

async function logIn(username, password) {
  try {
    const user = await Parse.User.logIn(username, password);
    console.log('User logged in:', user.get('username'));
  } catch (error) {
    console.error('Login error:', error);
  }
}

module.exports = { signUp, logIn };
﻿
Pendekatan serupa dapat digunakan untuk manajemen sesi dan fitur otentikasi tambahan.
﻿
Langkah 7 – Menerapkan Aplikasi Node.js Anda
Back4app menyediakan proses penerapan yang lancar. Anda dapat menerapkan aplikasi Node.js Anda menggunakan beberapa metode, termasuk kontainerisasi Docker.
7.1 Membangun Aplikasi Anda
Kompilasi dan Paket:
Gunakan alat bangun pilihan Anda (seperti npm atau yarn) untuk menyiapkan aplikasi Anda.
Sebagai contoh, jalankan:
Bash
npm run build
npm run build
﻿
Verifikasi Bangunan Anda:
Pastikan bahwa bundel produksi Anda berisi semua modul dan file yang diperlukan.
﻿
7.2 Mengatur Tata Letak Proyek Anda
Struktur proyek Node.js yang khas mungkin terlihat seperti:
Text
Basic-CRUD-App-Node/
|-- src/
|   |-- controllers/
|   |   |-- itemsController.js
|   |   |-- authController.js
|   |-- models/
|   |   |-- item.js
|   |   |-- user.js
|   |-- routes/
|       |-- itemsRoutes.js
|       |-- authRoutes.js
|-- parseConfig.js
|-- package.json
|-- README.md
Basic-CRUD-App-Node/
|-- src/
|   |-- controllers/
|   |   |-- itemsController.js
|   |   |-- authController.js
|   |-- models/
|   |   |-- item.js
|   |   |-- user.js
|   |-- routes/
|       |-- itemsRoutes.js
|       |-- authRoutes.js
|-- parseConfig.js
|-- package.json
|-- README.md
﻿
7.3 Menggunakan Docker untuk Aplikasi Node.js Anda
Jika Anda lebih suka penerapan terkontainer, tambahkan sebuah Dockerfile ke root proyek Anda:
Dockerfile
# Use an official Node.js runtime as a parent image
FROM node:14-alpine

# Set the working directory
WORKDIR /usr/src/app

# Copy package files and install dependencies
COPY package*.json ./
RUN npm install

# Copy the rest of the application code
COPY . .

# Expose the application port (adjust if necessary)
EXPOSE 3000

# Start the Node.js application
CMD ["npm", "start"]
# Use an official Node.js runtime as a parent image
FROM node:14-alpine

# Set the working directory
WORKDIR /usr/src/app

# Copy package files and install dependencies
COPY package*.json ./
RUN npm install

# Copy the rest of the application code
COPY . .

# Expose the application port (adjust if necessary)
EXPOSE 3000

# Start the Node.js application
CMD ["npm", "start"]
﻿
7.4 Penerapan melalui Penerapan Web Back4app
Hubungkan Repositori GitHub Anda:
Host kode sumber Node.js Anda di GitHub.
Konfigurasi Pengaturan Penerapan:
Di dasbor Back4app Anda, pilih opsi Penerapan Web, tautkan repositori Anda (misalnya, Basic-CRUD-App-Node), dan pilih cabang yang diinginkan.
Atur Perintah Build dan Output:
Tentukan perintah build Anda (misalnya, npm run build) dan tentukan folder output.
Terapkan Aplikasi Anda:
Klik Terapkan dan pantau log hingga aplikasi Anda aktif.
﻿
Langkah 8 – Menyelesaikan dan Peningkatan di Masa Depan
Selamat! Anda sekarang telah membangun aplikasi CRUD Node.js yang terintegrasi dengan Back4app. 
Anda telah mengonfigurasi proyek yang disebut Basic-CRUD-App-Node, mendirikan koleksi untuk Item dan Pengguna, dan mengelola backend Anda dengan Aplikasi Admin Back4app. 
Selanjutnya, Anda menghubungkan aplikasi Node.js Anda melalui Parse JavaScript SDK (atau REST/GraphQL) dan menerapkan langkah-langkah keamanan yang kuat.
Langkah Selanjutnya:
Tingkatkan Aplikasi Anda:
Pertimbangkan untuk menambahkan fitur seperti penyaringan lanjutan, tampilan rinci, atau pembaruan waktu nyata.
Perluas Kemampuan Backend:
Jelajahi fungsi cloud, integrasi API pihak ketiga, atau kontrol akses berbasis peran.
Perdalam Keahlian Anda:
Lihat dokumentasi Back4app dan tutorial tambahan untuk lebih menyempurnakan aplikasi Anda.
Selamat coding dan semoga sukses dalam perjalanan Anda dengan aplikasi CRUD Node.js Anda!
Bidang	Tipe	Deskripsi
_id	ObjectId	Pengidentifikasi unik yang dihasilkan secara otomatis.
judul	String	Nama item tersebut.
deskripsi	String	Gambaran singkat tentang item tersebut.
dibuatPada	Tanggal	Stempel waktu yang menandai kapan item ditambahkan.
diperbaruiPada	Tanggal	Stempel waktu menandai pembaruan terakhir.
Bidang	Tipe	Deskripsi
_id	ObjectId	Pengidentifikasi unik yang dihasilkan secara otomatis.
nama pengguna	String	Nama unik untuk pengguna.
email	String	Alamat email unik pengguna.
hashKataSandi	String	Kata sandi yang di-hash untuk otentikasi yang aman.
dibuatPada	Tanggal	Stempel waktu ketika akun dibuat.
diperbaruiPada	Tanggal	Stempel waktu ketika akun diperbarui.
Diperbarui 19 Feb 2025
Apakah halaman ini membantu Anda?
SEBELUMNYA
Cara Membuat Aplikasi CRUD dengan jQuery?
BERIKUTNYA
Bagaimana Cara Mengembangkan Aplikasi CRUD dengan TypeScript?