Bangun aplikasi dengan Node.js dan PouchDB – Beragampengetahuan

Sementara database tradisional seperti MySQL atau PostgreSQL telah menjadi pilihan yang lebih disukai untuk menyimpan data dalam aplikasi sisi server, mereka mungkin tidak memadai untuk aplikasi yang memerlukan fungsionalitas offline terlebih dahulu atau sinkronisasi waktu nyata antara server dan klien.

Namun, membuat aplikasi Node.js dengan PouchDB memungkinkan Anda membangun aplikasi web dan seluler yang efisien, dapat diskalakan, dan andal yang bekerja dengan mulus baik online maupun offline. Pada artikel ini, Anda akan membuat API toko buku sederhana dengan fungsionalitas CRUD (buat, baca, perbarui, hapus) menggunakan Node.js, Express.js, dan PouchDB.

Lompat ke depan:

Apa itu PouchDB?

PouchDB adalah perpustakaan database JavaScript sumber terbuka yang dirancang untuk membuat aplikasi web pertama offline yang efisien dan dapat diskalakan. Dengan PouchDB, Anda dapat membangun aplikasi dengan mulus di berbagai platform, termasuk browser, server Node.js, dan perangkat seluler.

Saat aplikasi yang menggunakan PouchDB sedang offline, aplikasi tersebut menyimpan data secara lokal. Ketika aplikasi sedang online, itu menyinkronkan data dengan CouchDB dan server lain yang kompatibel, menjaga agar data pengguna tetap diperbarui dan disinkronkan.

PouchDB menyediakan basis data tertanam ringan yang dapat dengan mudah diintegrasikan ke dalam aplikasi, memungkinkan pengguna untuk bekerja secara offline dan menyinkronkan data saat koneksi jaringan tersedia. Ini mendukung beberapa backend penyimpanan, termasuk IndexedDB, LevelDB, dan SQLite, dan menyediakan API yang fleksibel untuk membuat kueri dan memanipulasi data.

Menyiapkan lingkungan pengembangan

Untuk menyiapkan lingkungan pengembangan Anda, buat direktori proyek dan cd Masukkan dengan menjalankan:

mkdir pouchdb-tutorial && cd pouchdb-tutorial

Selanjutnya, buat a package.json File dengan semua defaultnya dengan menjalankan:

npm init -y

Lalu, instal Express.js Dengan menjalankan perintah berikut:

npm install express

Setelah itu, instal PouchDB dengan menjalankan perintah berikut:

npm install pouchdb

Terakhir, buat a index.js file dan tambahkan blok kode berikut ke file Anda untuk membuat server Express dasar:

// index.js
const express = require("express");
const app = express();
const port = 3000;

app.use(express.json());
app.use(express.urlencoded({ extended: true }));

app.listen(port, () => console.log(`Example app listening on port ${port}!`));

Blok kode di atas membuat server Express sederhana yang berjalan di port 3000.

Buat database PouchDB

PouchDB bukan database mandiri; sebaliknya, ini adalah lapisan abstraksi di atas database lain. Secara default, saat Anda menggunakan PouchDB di browser, ia hadir dengan IndexedDB sebagai adaptor. Di Node.js, ini disertakan dengan LevelDB.

Untuk membuat database PouchDB, buat a config folder di root proyek dan a db.js file di Anda config map.Selanjutnya, tambahkan blok kode berikut ke file db.js dokumen:

// config/db.js
const pouchDB = require("pouchdb");

// Create a new database instance
const db = new pouchDB("books");

// Export the database instance
module.exports = db;

Blok kode di atas membuat dan mengekspor database PouchDB "books" menggunakan pouchDB Konstruktor. Secara default, adaptor untuk database ini adalah LevelDB.Selanjutnya, impor instance database ke file index.js dokumen. seperti ini:

// index.js
const db = require("./config/db");

Kemudian, tambahkan blok kode berikut ke file index.js file untuk mendapatkan informasi tentang database PouchDB:

// index.js
// Get database info
db.info().then((info) => console.log(info));

Blok kode di atas mencatat informasi tentang database ke konsol, seperti yang ditunjukkan pada gambar di bawah ini:

Menerapkan titik akhir CRUD

Sekarang, mari terapkan titik akhir CRUD.Membuat routes folder di root proyek dan buat file book.js file dalam folder.Selanjutnya, tambahkan blok kode berikut ke file book.js File yang mengimplementasikan perutean ekspres:

// book.js
const express = require("express");
const router = express.Router();

PouchDB menyediakan dua cara untuk menyimpan data ke database: post Dan put.Ketika Anda menyimpan data ke database menggunakan putAnda harus menentukan dan _id Properti.Namun, PouchDB secara otomatis menghasilkan a _id Gunakan atribut saat menyimpan data postDokumentasi PouchDB merekomendasikan penggunaan put Melampaui postJadi tutorial ini akan mencakup put metode.

menghasilkan unik _id Untuk setiap atribut dokumen, Anda akan menggunakan paket npm, uuid.berlari npm install uuid Di bawah perintah untuk menginstal paket.Selanjutnya, di Anda book.js berkas, seperti ini:

// book.js
const { v4: uuidv4 } = require('uuid');

Terakhir, impor instance database PouchDB Anda ke book.js dokumen:

// book.js
const db = require("../config/db");

Tambahkan buku baru ke database Anda

Implementasikan penambahan logika baru book dokumen ke basis data Anda, tambahkan blok kode berikut ke book.js dokumen:

// book.js
// POST /books/new
router.post("/books/new", async (req, res) => {
  const { title, author, genre, year } = req.body;
  // Generating _id
  const _id = uuidv4();

  const book = {
    _id,
    title,
    author,
    genre,
    year,
  };

  // Saving to DB
  db.put(book)
    .then((response) => {
      res.status(201).send(response);
    })
    .catch((error) => {
      res.status(500).json({ error: error.message });
    });
});

Blok kode di atas mengimplementasikan a POST Penangan rute pertama, Anda mulai dengan req.body Tujuan.Kemudian, Anda menghasilkan yang unik _id dengan menyebut uuidv4 Metode yang Anda impor sebelumnya.Selanjutnya, Anda menyimpan properti yang diperlukan dan _id dalam sebuah objek.Akhirnya, menggunakan asinkron PouchDB put metode, Anda menyimpan book objek dalam database dan mengirim respons ke server.

Mengambil buku dari database

Menerapkan logika untuk mendapatkan semua book dokumen dalam database, tambahkan blok kode berikut ke file book.js dokumen:

// book.js
// GET /books
router.get("/books", async (req, res) => {
  try {
    const books = await db.allDocs({ include_docs: true });
    const response = books.rows.map((book) => book.doc);

    res.status(200).send(response);
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

Blok kode di atas mengimplementasikan a GET Route Handler Pertama, Anda mengambil semua dokumen dari database menggunakan PouchDB allDocs({include_docs: true}) metode.Dokumen yang dikembalikan berisi banyak data bersarang; dengan mengakses rows atribut dan memetakannya untuk mengekstrak doc per atribut dan Anda akan mendapatkan respons yang lebih mudah dibaca untuk dikirim kembali ke server.

Terapkan logika untuk mendapatkan a book Berdasarkan dokumentasi yang diberikan _id Di database Anda, tambahkan blok kode berikut ke file book.js dokumen:

// book.js
// GET /books/:id
router.get("/books/:id", async (req, res) => {
  try {
    const { id } = req.params;
    const book = await db.get(id);
    res.status(200).send(book);
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

Blok kode di atas mengimplementasikan a GET Handler rute pertama, Anda mengekstrak id properti dari req.params Tujuan.Kemudian, menggunakan ekstrak id sebagai argumen get metode, Anda diambil book file dengan yang sesuai _id dan mengirimkannya kembali ke server sebagai tanggapan.

Perbarui buku yang ada di database

Terapkan logika pengeditan book Berdasarkan dokumentasi yang diberikan _id Di database Anda, tambahkan blok kode berikut ke file book.js dokumen:

// book.js
// PUT /books/:id
router.put("/books/:id", async (req, res) => {
  try {
    const { id } = req.params;
    const { title, author, genre, year } = req.body;

    db.get(id).then(async (doc) => {
      const response = await db.put({
        _id: id,
        _rev: doc._rev,
        title,
        author,
        genre,
        year,
      });
      res.status(201).send(response);
    });
  } catch (error) {
    console.log(error);
    res.status(500).json({ error: error.message });
  }
});

Blok kode di atas mengimplementasikan a PUT Handler rute pertama, Anda mengekstrak id properti dari req.params Tujuan.Selanjutnya, Anda mulai dengan req.body Tujuan.Kemudian, menggunakan ekstrak id sebagai argumen get metode, Anda diambil book file dengan yang sesuai _id dan ganti properti lama dengan yang diekstraksi.

Perhatikan bahwa a _rev Atribut diteruskan bersama dengan atribut yang diekstrak ke put metode.ini _rev Properti memastikan bahwa proses sinkronisasi terjadi dengan benar dengan mencegah konflik yang mungkin terjadi saat aplikasi dibawa online.

Hapus buku dari database

Sekarang, terapkan logika hapus book Berdasarkan dokumentasi yang diberikan _id Di database Anda, tambahkan kode berikut ke file book.js dokumen.

// book.js
// DELETE /books/:id
router.delete("/books/:id", async (req, res) => {
  try {
    const id = req.params.id;
    const doc = await db.get(id);
    const response = await db.remove(doc);
    res.status(200).send(response);
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

Blok kode di atas mengimplementasikan a DELETE Handler rute pertama, Anda mengekstrak id properti dari req.params Tujuan.Kemudian, menggunakan ekstrak id sebagai argumen get metode, Anda diambil book file dengan yang sesuai _id dan berikan sebagai parameter ke PouchDB remove metode, secara efektif menghapusnya dari database.

Dengan menambahkan blok kode berikut ke file book.js dokumen:

// book.js
module.exports = router;

Kemudian, impor perute Ekspres Anda ke index.js file dan gunakan sebagai middleware:

// index.js
app.use(bookRouter);

Akhirnya, Anda dapat memulai aplikasi Anda dengan menjalankan:

node index.js

Kesimpulannya

Pada artikel ini, Anda membuat Node.js API fungsional menggunakan Express.js menggunakan PouchDB sebagai database. Sebagai aplikasi sisi server yang menggunakan PouchDB, Anda menggunakan LevelDB sebagai adaptor basis data. Anda dapat mempelajari lebih lanjut tentang PouchDB di dokumentasi resmi PouchDB.