🛠️ Cara Membangun CMS Sederhana Sendiri dengan Node.js dan MongoDB

 

Website modern sering memerlukan sistem manajemen konten (CMS) untuk memudahkan update artikel, produk, atau halaman.
Meskipun ada CMS populer seperti WordPress atau Strapi, kadang developer ingin membuat CMS custom sendiri agar lebih fleksibel sesuai kebutuhan proyek.

Artikel ini membahas cara membangun CMS sederhana menggunakan Node.js sebagai backend dan MongoDB sebagai database, lengkap dengan CRUD dan manajemen konten.

---

🔍 Apa Itu CMS?

CMS (Content Management System) adalah sistem yang memudahkan pengguna mengelola konten tanpa harus menulis kode langsung.
Fitur dasar CMS:

• Menambah, mengedit, menghapus konten (CRUD)

• Menyimpan konten ke database

• Menampilkan konten di website secara dinamis

Dengan CMS custom, developer bisa:

• Menyesuaikan fitur sesuai kebutuhan proyek

• Mengontrol performa dan keamanan

• Integrasi API atau sistem eksternal lebih mudah

---

⚙️ Stack yang Digunakan

1. Node.js → runtime JavaScript untuk backend

2. Express.js → framework web ringan

3. MongoDB → database NoSQL untuk menyimpan konten

4. EJS / Handlebars / Pug → template engine untuk frontend

5. Mongoose → ODM untuk MongoDB, memudahkan CRUD

---

🧩 Langkah-Langkah Membangun CMS Sederhana

1. Setup Proyek Node.js

mkdir simple-cms
cd simple-cms
npm init -y
npm install express mongoose ejs body-parser

• express → web server

• mongoose → menghubungkan MongoDB

• ejs → template engine

• body-parser → parsing form data

2. Koneksi ke MongoDB

// db.js
const mongoose = require("mongoose");

mongoose.connect("mongodb://localhost:27017/simpleCMS", {
  useNewUrlParser: true,
  useUnifiedTopology: true,
})
.then(() => console.log("MongoDB connected"))
.catch(err => console.log(err));

---

3. Buat Model Konten

// models/Post.js
const mongoose = require("mongoose");

const PostSchema = new mongoose.Schema({
  title: { type: String, required: true },
  content: { type: String, required: true },
  createdAt: { type: Date, default: Date.now }
});

module.exports = mongoose.model("Post", PostSchema);

---

4. Setup Express & Routing

// app.js
const express = require("express");
const bodyParser = require("body-parser");
const Post = require("./models/Post");
require("./db");

const app = express();
app.set("view engine", "ejs");
app.use(bodyParser.urlencoded({ extended: true }));

// Halaman utama
app.get("/", async (req, res) => {
  const posts = await Post.find();
  res.render("index", { posts });
});

// Form tambah konten
app.get("/add", (req, res) => res.render("add"));

// Simpan konten baru
app.post("/add", async (req, res) => {
  const { title, content } = req.body;
  await Post.create({ title, content });
  res.redirect("/");
});

// Edit konten
app.get("/edit/:id", async (req, res) => {
  const post = await Post.findById(req.params.id);
  res.render("edit", { post });
});

app.post("/edit/:id", async (req, res) => {
  const { title, content } = req.body;
  await Post.findByIdAndUpdate(req.params.id, { title, content });
  res.redirect("/");
});

// Hapus konten
app.get("/delete/:id", async (req, res) => {
  await Post.findByIdAndDelete(req.params.id);
  res.redirect("/");
});

app.listen(3000, () => console.log("Server running on port 3000"));

---

5. Buat Template EJS Sederhana

index.ejs

<h1>Simple CMS</h1>
<a href="/add">Tambah Konten</a>
<ul>
  <% posts.forEach(post => { %>
    <li>
      <h2><%= post.title %></h2>
      <p><%= post.content %></p>
      <a href="/edit/<%= post._id %>">Edit</a>
      <a href="/delete/<%= post._id %>">Hapus</a>
    </li>
  <% }) %>
</ul>

add.ejs

<h1>Tambah Konten</h1>
<form action="/add" method="POST">
  <input type="text" name="title" placeholder="Judul" required>
  <textarea name="content" placeholder="Konten" required></textarea>
  <button type="submit">Simpan</button>
</form>

edit.ejs

<h1>Edit Konten</h1>
<form action="/edit/<%= post._id %>" method="POST">
  <input type="text" name="title" value="<%= post.title %>" required>
  <textarea name="content" required><%= post.content %></textarea>
  <button type="submit">Update</button>
</form>

---

⚡ Tips Developer untuk CMS Custom

1. Validasi Data

   • Pastikan semua input divalidasi sebelum disimpan ke database

2. Autentikasi & Authorization

   • Gunakan JWT / session untuk akses admin

3. File Upload

   • Integrasi Cloud Storage / local untuk gambar & media

4. SEO-Friendly

   • Tambahkan meta title, description, dan slug untuk setiap konten

5. Responsive Design

   • Gunakan CSS modern atau framework seperti Tailwind / Bootstrap

---

🧩 Keuntungan Membuat CMS Sendiri

• Fleksibel: fitur bisa disesuaikan

• Ringan: tidak ada bloatware seperti CMS besar

• Belajar Mendalam: pahami backend, database, routing, dan template engine

• Integrasi Mudah: API atau sistem pihak ketiga bisa langsung diterapkan

---

🧭 Kesimpulan

Membangun CMS sederhana dengan Node.js & MongoDB memungkinkan developer:

• Mengontrol sepenuhnya sistem manajemen konten

• Mengoptimalkan fitur sesuai kebutuhan proyek

• Memahami alur CRUD, routing, dan database

• Menjadi pondasi untuk CMS lebih kompleks di masa depan

🔥 Intinya: CMS custom adalah solusi tepat untuk developer yang ingin flexible, scalable, dan belajar full-stack web development.