Membuat Blog dengan Node.js dan MongoDB

dani indra

Membuat Blog dengan Node.js dan MongoDB

Membangun sebuah blog menggunakan Node.js dan MongoDB adalah proyek menarik yang memungkinkan Anda mengintegrasikan teknologi backend dan database untuk membuat aplikasi web dinamis. Dalam artikel ini, kita akan membahas langkah-langkah membuat blog sederhana dengan Node.js sebagai backend dan MongoDB sebagai database.

Langkah 1: Persiapan Lingkungan

Pastikan Anda telah menginstal Node.js dan MongoDB di sistem Anda. Unduh dan instal Node.js dari situs resmi dan MongoDB dari MongoDB Download Center. Setelah instalasi selesai, pastikan Anda juga memulai server MongoDB.

Langkah 2: Inisialisasi Proyek Node.js

Buatlah folder proyek baru dan jalankan perintah npm init untuk membuat file package.json. Instal beberapa dependensi yang diperlukan, seperti Express dan Mongoose (library MongoDB untuk Node.js).

npm install express mongoose ejs

Langkah 3: Konfigurasi Express.js

Buat file app.js dan konfigurasikan Express.js untuk menangani permintaan HTTP serta menghubungkan dengan database MongoDB menggunakan Mongoose.

const express = require('express');
const mongoose = require('mongoose');

const app = express();
const PORT = process.env.PORT || 3000;

app.set('view engine', 'ejs');
app.use(express.urlencoded({ extended: true }));

mongoose.connect('mongodb://localhost:27017/blogDB', { useNewUrlParser: true, useUnifiedTopology: true });

// Definisi schema dan model MongoDB
const postSchema = new mongoose.Schema({
  title: String,
  content: String
});

const Post = mongoose.model('Post', postSchema);

// Rute untuk menampilkan semua posting blog
app.get('/', async (req, res) => {
  try {
    const posts = await Post.find();
    res.render('home', { posts });
  } catch (error) {
    console.error(error);
    res.send('Terjadi kesalahan saat mengambil data blog.');
  }
});

// Rute untuk menampilkan form penulisan posting baru
app.get('/compose', (req, res) => {
  res.render('compose');
});

// Rute untuk menangani posting baru
app.post('/compose', async (req, res) => {
  const post = new Post({
    title: req.body.title,
    content: req.body.content
  });

  try {
    await post.save();
    res.redirect('/');
  } catch (error) {
    console.error(error);
    res.send('Terjadi kesalahan saat menyimpan posting blog.');
  }
});

app.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});

Langkah 4: Membuat Tampilan Menggunakan EJS

Buat folder views di dalam proyek Anda dan tambahkan dua file EJS: home.ejs dan compose.ejs. File ini akan menentukan tampilan untuk menampilkan posting blog dan form penulisan posting baru.

views/home.ejs:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My Blog</title>
</head>
<body>
  <h1>My Blog</h1>
  <% posts.forEach(post => { %>
    <h2><%= post.title %></h2>
    <p><%= post.content %></p>
  <% }) %>
  <a href="/compose">Compose</a>
</body>
</html>

views/compose.ejs:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Compose</title>
</head>
<body>
  <h1>Compose</h1>
  <form action="/compose" method="post">
    <label for="title">Title:</label>
    <input type="text" id="title" name="title" required>
    <label for="content">Content:</label>
    <textarea id="content" name="content" required></textarea>
    <button type="submit">Publish</button>
  </form>
</body>
</html>

Langkah 5: Menjalankan Aplikasi

Jalankan aplikasi Node.js Anda dengan perintah:

node app.js

Buka browser dan akses http://localhost:3000. Anda sekarang dapat menampilkan dan menulis posting blog pada aplikasi yang baru saja Anda bangun.

Kesimpulan

Dengan mengikuti langkah-langkah di atas, Anda telah berhasil membuat aplikasi blog sederhana menggunakan Node.js dan MongoDB. Anda dapat memperluas fungsionalitasnya dengan menambahkan fitur-fitur seperti pengguna, komentar, atau kategori. Proyek ini memberikan dasar yang solid untuk memahami bagaimana mengintegrasikan Express.js dan MongoDB untuk membuat aplikasi web yang dinamis. Selamat mengembangkan blog Anda sendiri!

Leave a Comment