Redux Sunucusu için Veritabanı

Geçen derste, uygulamamızın sunucuyla etkileşimini taklit etmemize yardımcı olacak msw'yi kurmuştuk. Ve başlangıç olarak, uygulama başlatıldığında sunucuda zaten mevcut olan verileri yüklemek istiyoruz.

Hadi ürün uygulamamızı açalım ve içindeki server.js dosyasını açalım. Burada geçen dersten kalma birkaç satır kod zaten mevcut.

Ve kendimize sormamız gereken ilk şey: veriler genellikle nerede saklanır? Evet, tabii ki veritabanında, tereddüt etmeden cevaplayacağız. Bu yüzden, hadi veri modellerimizi oluşturmamıza ve aynı zamanda gerçek bir SQL veritabanıyla çalışıyormuş gibi yapmamıza izin verecek bir başka harika araç daha kullanalım.

Bunda bize yardımcı olacak araç - @mswjs/data kütüphanesidir. Kurulum için terminale şu komutu yazın:

npm install @mswjs/data --save-dev

Şimdi server.js dosyasına ihtiyacımız olan şeyleri içe aktaralım:

import { factory, oneOf, manyOf, primaryKey } from '@mswjs/data'

Ve bizim geçici veritabanımızı oluşturalım. Bunun için factory fonksiyonunu kullanacağız. Bunu, içe aktarma satırlarından sonra ve worker'ı dışa aktarmadan önce aşağıya yapacağız:

export const db = factory({})

Peki içinde hangi verileri saklayacağız? Sunucudan ürünleri, satıcıları ve kullanıcı tepkilerini almalıyız. Yani veritabanımızda, factory'nin nesneler halinde kabul ettiği üç model oluşturmalıyız:

export const db = factory({
	product: {},
	seller: {},
	reaction: {},
})

Tıpkı gerçek bir SQL veritabanında olduğu gibi, her modelimizin bir primary key (birincil anahtar) olmalıdır. Geleneksel olarak, bu alanı id olarak atayacağız ve onu yine aynı nanoid kütüphanesi tarafından oluşturulacak:

export const db = factory({
	product: {
		id: primaryKey(nanoid),
	},
	seller: {
		id: primaryKey(nanoid),
	},
	reaction: {
		id: primaryKey(nanoid),
	},
})

Dosyanın başındaki içe aktarma satırlarına nanoid'i eklemeyi unutmayalım:

import { nanoid } from '@reduxjs/toolkit'

Bir sonraki derste modellerimizi gerekli alanlarla tamamlayacağız.

Öğrenci uygulamanızı açın. Bu dersin materyalini inceledikten sonra, uygulamanız için @mswjs/data'yi kurun.

Ardından, factory fonksiyonunu kullanarak bir db veritabanı modeli oluşturun. Derste gösterildiği gibi, verileriniz için üç nesneyi (student, teacher, vote) ona iletin.