Banco de dados para o servidor no Redux

Na última aula, instalamos o MSW, que nos ajudará a simular a operação da nossa aplicação com o servidor. E para começar gostaríamos de carregar, ao iniciar a aplicação, os dados já existentes no servidor.

Vamos abrir nossa aplicação de produtos, e nela o arquivo server.js. Aqui já temos algumas linhas de código da última aula.

E a primeira pergunta que devemos nos fazer: onde os dados geralmente são armazenados? Sim, claro, em um banco de dados, responderemos sem hesitar. Portanto, vamos usar outra ferramenta incrível, que nos permitirá modelar nossos dados, e também fazer com que pareça que estamos trabalhando com um banco de dados SQL real.

A ferramenta que nos ajudará nisso - é a biblioteca @mswjs/data. Para instalá-la, digite no terminal o seguinte comando:

terminalnpm install @mswjs/data --save-dev

Agora vamos importar no arquivo server.js as coisas que precisamos:

api/server.jsimport { factory, oneOf, manyOf, primaryKey } from '@mswjs/data'

E vamos criar nosso banco de dados improvisado. Para isso, usaremos a função factory. Faremos isso abaixo, após as linhas de importação e antes da exportação do worker:

api/server.jsexport const db = factory({})

E quais dados vamos armazenar nele? Do servidor, devemos receber produtos, vendedores e reações dos usuários. Portanto, em nosso banco de dados, devemos criar três modelos, que o factory aceita na forma de objetos:

api/server.jsexport const db = factory({
  product: {},
  seller: {},
  reaction: {},
})

Como em um banco de dados SQL real, cada um de nossos modelos deve ter uma primary key. Tradicionalmente, vamos designar o campo id para isso, e vamos gerá-lo com a mesma biblioteca nanoid:

api/server.jsexport const db = factory({
  product: {
    id: primaryKey(nanoid),
  },
  seller: {
    id: primaryKey(nanoid),
  },
  reaction: {
    id: primaryKey(nanoid),
  },
})

Vamos lembrar de adicionar o nanoid nas linhas de importação no início do arquivo:

api/server.jsimport { nanoid } from '@reduxjs/toolkit'

Na próxima lição, vamos complementar nossos modelos com os campos necessários.