Hifadhidata ya Seva kwenye Redux

Katika somo lililopita tuliweka msw, ambayo itatusaidia kuiga utendakazi wa programu yetu na seva. Na kwa kuanza tungependa kupakia tayari data iliyopo kwenye seva wakati wa kuzindua programu.

Wacha tufungue programu yetu ya bidhaa, na ndani yake faili server.js. Hapa tayari tuna na mistari michache ya kodi kutoka somo lililopita.

Na jambo la kwanza ambalo tunapaswa kujiuliza: data kwa kawaida huhifadhiwa wapi? Ndio, bila shaka kwenye hifadhidata, tutajibu bila kusita. Kwa hivyo wacha tutumie chombo kingine kizuri, ambacho kitaturuhusu kuunda muundo wa data yetu, na pia kufanya kana kwamba tuna fanya kazi na hifadhidata halisi ya SQL.

Chombo kitakachotusaidia katika hili - ni maktaba ya @mswjs/data. Ili kuiweka, weka kwenye terminali amri ifuatayo:

npm install @mswjs/data --save-dev

Sasa ingiza kwenye faili server.js vitu tunavyohitaji:

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

Na tuunde hifadhidata yetu ya kuigiza. Kwa kufanya hivyo tutatumia kitendaji factory. Tutafanya hivyo chini ya mistari ya kuingiza na kabla ya kutoa mfanyakazi:

export const db = factory({})

Na data gani tutahifadhi ndani yake? Kutoka kwa seva tunapaswa kupata bidhaa, wauzaji na majibu ya watumiaji. Hivyo basi kwenye hifadhidata yetu tunapaswa kuunda mifumo mitatu, ambayo factory inakubali kwa mfumo wa vitu:

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

Kama ilivyo kwenye hifadhidata halisi ya SQL kila muundo wetu lazima uwe na primary key. Kwa mila, tutateua uga wa id kuwa huo, ambayo tutaunda kwa maktaba ile ile ya nanoid:

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

Usisahau kuongeza nanoid kwenye mistari ya kuingiza mwanzoni mwa faili:

import { nanoid } from '@reduxjs/toolkit'

Katika somo linalofuata tutajaza miundo yetu kwa sehemu muhimu.

Fungua programu yako ya wanafunzi. Baada ya kujifunza na nyenzo za somo hili, weka @mswjs/data kwa programu yako.

Ifuatayo unda muundo wa hifadhidata db kwa msaada wa kitendaji factory. Pita kwa hiyo vitu vitatu (student, teacher, vote) kwa data yako, kama ilivyoonyeshwa katika somo.