Next JS ile Canlı Kurgu: Veritabanı Sihirbazlığı ve CRUD Operasyonları

Next JS, modern web uygulamaları geliştirmek için kullanılan popüler bir JavaScript framework'üdür. Bu yazıda, Next JS kullanarak nasıl dinamik içerik yönetimi yapabileceğimizi ve veritabanı bağlantısı kurarak CRUD işlemlerini nasıl gerçekleştirebileceğimizi ele alacağız.

İlk adım olarak, Next JS projesi oluşturduktan sonra veritabanı bağlantısı için gerekli olan bilgileri environment dosyasına eklememiz gerekiyor. Örneğin, MongoDB kullanacaksak veritabanı URL'sini buraya tanımlamamız gerekecek.


import mongoose from 'mongoose';

const dbConnect = async () => {
  if (mongoose.connection.readyState >= 1) {
    return;
  }

  return mongoose.connect(process.env.MONGODB_URI, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
  });
};

export default dbConnect;

Veritabanı bağlantısını sağladıktan sonra, Next JS'in getServerSideProps veya getStaticProps gibi özelliklerini kullanarak verileri dinamik olarak çekebilir ve sayfalarınızı güncelleyebilirsiniz.


export const getServerSideProps: GetServerSideProps = async () => {
  await dbConnect();

  const data = await YourModel.find({});

  return { props: { data } };
};

CRUD işlemleri içinse gerekli endpoint'leri oluşturarak veritabanına yeni veri ekleyebilir, mevcut verileri güncelleyebilir, silebilir veya okuyabilirsiniz. Bu sayede Next JS kullanarak güçlü bir içerik yönetim sistemi oluşturabilirsiniz.

Next JS ile Canlı Kurgu: Veritabanı Sihirbazlığı ve CRUD Operasyonları

Next JS ile Dinamik İçerik Yönetimi: Veritabanı Bağlantısı ve CRUD İşlemleri

İlgili Yazılar