База даных для сервера ў Redux

На мінулым заняцці мы ўстанавілі msw, які нам дапаможа сымiтаваць работу нашага прыкладання з серверам. І для пачатку мы б хацелі падгружаць пры запусце прыкладання ўжо якія ёсць на серверы даныя.

Давайте адчынём наша прыкладанне з прадуктамі, а ў ім файл server.js. Тут у нас ужо ёсць пара строчак кода з мінулага заняцця.

І першае, што мы павінны спытаць у сябе: дзе звычайна захоўваюцца даныя? Так, вядома ў базе даных, адкажам мы не задумваючыся. Таму давайте выкарастаем яшчэ адзін круты інструмент, які дазволіць нам стварыць мадэль нашых даных, а таксама зрабіць так, як быццам мы працуем з сапраўднай SQL-базай.

Інструмент, які нам у гэтым дапаможа - гэта бібліятэка @mswjs/data. Каб яе ўстанавіць, убейце ў тэрмінале наступную каманду:

npm install @mswjs/data --save-dev

Цяпер імпартуем у файле server.js патрэбныя нам рэчы:

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

І створым нашу імправізаваную базу даных. Для гэтага мы выкарастаем функцыю factory. Зробім мы гэта ніжэй пасля строчак з імпартам і перад экспартам воркера:

export const db = factory({})

А якія даныя мы будзем у ёй захоўваць? З сервера мы павінны атрымліваць прадукты, прадаўцоў і рэакцыі карыстальнікаў. Значыць у нашай базе даных мы павінны стварыць тры мадэлькі, якія прымае factory у выглядзе аб'ектаў:

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

Як і ў сапраўднай SQL базе даных кожная наша мадэлька павінна мець primary key. Традыцыйна, мы назначым такім полем id, генераваць які мы будзем усё той жа nanoid бібліятэкай:

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

Не забудзем дадаць nanoid у строчках імпарту ў пачатку файла:

import { nanoid } from '@reduxjs/toolkit'

На наступным уроке мы дапоўнім нашы мадэлі неабходнымі палямі.

Адчынiце ваша прыкладанне са студэнтамі. Азнаёміўшыся з матэрыялам гэтага ўрока, усталюйце @mswjs/data для вашага прыкладання.

Далей стварыце мадэль базы даных db пры дапамозе функцыі factory. Перадайце ёй тры аб'екты (student, teacher, vote) для вашых даных, падобна таму як паказана ў уроку.