Existem diversas formas de facilitar a criação de API’s. Neste artigo, vamos desenvolver uma API com Express e Prisma.
[adrotate banner=”4″]
O Prisma é um ORM (Object-Relational Mapping) que ajuda os desenvolvedores a criar aplicações mais rapidamente e cometer menos erros com um kit de ferramentas de banco de dados opensource, como PostgreSQL e MySQL. Além disso, o Prisma também suporta as seguintes linguagens: Javascript e Typescript.
Pré-requisitos
É necessário ter o nodejs instalado em sua máquina, ou ter um ambiente de desenvolvimento com o node instalado, como o Docker.
Também é recomendo ter o Typescript instalado de forma global na sua máquina. Assim, você pode utilizar o comando “npm install -g typescript”.
Desenvolvimento do projeto
Para iniciarmos o nosso projeto de API com Express & Prisma, iremos criar um diretório chamado “tcl-lab” (ou um nome de sua preferência). Para facilitar a nossa vida, iremos abrir essa pasta diretamente no Visual Studio Code.
Com o vscode aberto, iremos abrir o terminal integrado usando as teclas “ctrl + j”. Em seguida, iremos inserir o seguinte comando para iniciarmos um projeto nodejs.
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-1.jpg)
A flag “-y” serve para que todas as perguntas que seriam feitas durante a criação do projeto sejam puladas.
Após isso, iremos instalar algumas bibliotecas de terceiros como dependência de desenvolvimento, sendo elas: o Prisma, o Typescript e o ts-node-dev (que serve para rodar o Typescript em ambiente de desenvolvimento).
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-2.jpg)
Typescript
O nosso próximo passo será inicializar o Typescript, com o comando abaixo:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-3.jpg)
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-4.jpg)
Caso alguém esteja enfrentando o problema supracitado, basta abrir o terminal/powershell com permissões de administrador e instalar o Typescript globalmente através do comando.
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-5.jpg)
Isso irá criar um arquivo “tsconfig.json” na raiz do projeto.
Neste momento, iremos deixar esse arquivo com as seguintes configurações:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-6.jpg)
Prontinho, configuramos o Typescript!
Prisma
Em seguida, iremos rodar o comando abaixo para inicializar o Prisma, e logo iremos configurá-lo.
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-7.jpg)
Isso irá criar uma pasta chama Prisma com o arquivo “schema.prisma” dentro dela. Esse é o arquivo mais importante para o Prisma funcionar.
Além disso, será criado um arquivo .env na raiz do projeto. Dessa forma, iremos acessar esse arquivo e alterar a variável de ambiente “DATABASE_URL” com os dados do nosso banco de dados.
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-8.jpg)
Caso esteja usando outro banco de dados, você pode seguir as instruções da documentação do Prisma, basta clicar aqui.
Schema
Agora, iremos criar o schema. Isto é, nada mais, nada menos do que o ponto central do Prisma. É por aqui que tudo funciona (ou deixa de funcionar rs). Você pode ler mais sobre os schemas clicando aqui.
Brincadeiras à parte, vamos lá! Acessando arquivo “schema.prisma” abaixo de “datasource”, iremos criar a seguinte estrutura:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-9.jpg)
OBS: para que o arquivo schema.json fique formato e bonito, é necessário instalar as seguintes extensões no vscode:
- Prisma: https://marketplace.visualstudio.com/items?itemName=Prisma.prisma
- Prisma – Insider: https://marketplace.visualstudio.com/items?itemName=Prisma.prisma-insider
Vamos contextualizar o que o fizemos no código acima, quando usamos a seguinte sintaxe:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-10.jpg)
Isso significa que estamos criando um modelo do nosso banco de dados e, ao mesmo tempo, uma entidade do nosso modelo, para que possamos usar as queries de busca do Prisma.
Sintaxes
Em nosso modelo “Student”, temos as seguintes colunas:
- ID (que é um uuid);
- As colunas Nome e Email (que recebem uma string);
- Coluna de endereços (que recebe um array de endereços).
Ou seja, estamos fazendo um pequeno relacionamento de um para muitos, sendo que, um estudante pode ter vários endereços, mas um endereço só pode pertencer a um estudante.
E, por último, a sintaxe “@@map(”students”) indica que o nome da tabela no banco de dados será students.
Já no nosso modelo de Address, temos todas as colunas referentes a um endereço (com rua, número, cidade e CEP). Além disso, temos ainda a coluna student_id, que será a nossa chave estrangeira com o ID do aluno pertencente.
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-11.jpg)
A sintaxe acima indica que estamos criando uma coluna que será uma chave estrangeira e sua referência.
Com nossos modelos criados, iremos mapear o nosso modelo para um esquema de banco de dados usando a CLI do Prisma, segue o comando abaixo:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-12.jpg)
Após esse comando, o banco de dados será criado e as migrations serão executadas. Dessa forma, serão criadas as tabelas que inserimos em nosso schema. Caso seja necessário adicionar novas tabelas posteriormente, basta adicionar os modelos no schema e rodar o comando acima novamente.
Prisma Client
Em seguida, iremos instalar o Prisma client:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-13.jpg)
Ao rodar o comando install, automaticamente será chamada a função Prisma generate. Ela é capaz de ler seu esquema Prisma e gerar uma versão do Prisma client que é adaptada aos seus modelos.
Para finalizar a configuração do Prisma, iremos criar uma pasta “src” na raiz do projeto. E dentro desta pasta, iremos criar uma pasta chamada “database” e criar um arquivo “index.ts”. Então, nesse arquivo, iremos escrever o seguinte:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-14.jpg)
Assim, finalizamos a configuração do Prisma client, onde estamos exportando uma instância do nosso esquema do Prisma para que possamos criar as queries posteriormente.
Configuração do Express
Feito isso, iremos instalar o Express e configurar o nosso servidor, seguem os comandos para instalação:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-15.jpg)
Com o nosso framework instalado, vamos criar um arquivo chamado “server.ts” na pasta “src”. Dessa forma, iremos adicionar o seguinte código neste arquivo:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-16.jpg)
Prontinho!
Funcionalidade do server
Agora, para testarmos a funcionalidade do nosso server, iremos acessar o arquivo “package.json” e adicionar um script, segue o modelo abaixo:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-17.jpg)
Esse script tem as seguintes funcionalidades:
- transpile-only: irá apenas transcrever o código de Typescript para Javascript, sem realizar as checagens de código que são feitas normalmente;
- respawn: irá analisar o código, e a cada salvamento (ctrl + s) ele irá reiniciar o servidor;
- ignore-watch node_modules: irá ignorar quaisquer mudanças na pasta node_modules, assim torna a inicialização do servidor mais rápida;
- src/server.ts: irá iniciar o servidor.
Certo, agora iremos testar se o nosso servidor está funcionando, segue o comando:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-18.jpg)
O terminal deverá mostrar algo parecido com a a imagem:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-19.jpg)
Criação de rotas
Com o nosso servidor rodando, vamos criar nossas rotas. Então, dentro da pasta “src”, iremos criar uma pasta chamada “routes”. Dentro dessa, pasta iremos criar um arquivo chamado “index.ts”.
Dentro desse arquivo, vamos escrever o seguinte código:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-20.jpg)
No código acima, criamos um roteador, que é basicamente o nosso gerenciador e criador de rotas. Como exemplo, usamos a sintaxe:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-21.jpg)
Isso significa que estamos criando uma rota com o método post. Em seguida, recuperamos os dados do corpo da requisição. Assim, com esses dados capturados, usamos o método do Prisma “findUnique” para realizar uma busca em nosso banco. Para, assim, saber se o estudante já está cadastrado na nossa aplicação.
Neste momento, verificamos se o estudante já existe. Caso positivo, retornamos um erro 400(bad request), com a mensagem “Estudante já cadastrado”. Caso negativo, seguimos com a criação do estudante com o método “create” do Prisma.
Assim, passamos os dados e, no final, retornamos o status 201 (created) sem nenhuma mensagem.
Para testarmos esse código, iremos fazer com que o nosso servidor utilize esse roteador para que as rotas estejam acessíveis. No arquivo “server.ts”, iremos deixar o arquivo assim:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-22.jpg)
Insomnia
Iremos utilizar o Insomnia para realizar as requisições. Separei aqui um vídeo que mostra a criação de uma collection e uma requisição: https://www.youtube.com/watch?v=lo0lrd7v80g&feature=emb_title.
No body, iremos adicionar o seguinte:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-23.jpg)
Depois, basta clicar em “SEND” e analisar o retorno.
Como nesse caso não retornamos o estudante, iremos ver os dados inseridos no banco de dados. Porém, com o próprio Prisma.
Assim, iremos abrir um novo terminal no vscode e digitar o seguinte comando:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-24.jpg)
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-25.jpg)
Então, uma nova guia será aberta no seu navegador com o Prisma studio. Nessa guia, conseguimos visualizar o estudante criado:
![](https://luby.com.br/wp-content/uploads/2022/06/api-com-express-e-prisma-26.jpg)
Conclusão
Finalizamos a nossa API com Express e Prisma. Com isso, podemos visualizar como o Prisma é um ORM de fácil configuração e utilização. Ou seja, ele torna todas as queries fáceis de serem escritas e de fácil integração com outros frameworks (não só com o Express, mas também com o NestJS).
Para saber mais sobre todas as funções do Prisma você pode ler a documentação do projeto clicando aqui.
Repositório do projeto criado: https://github.com/paulozy/express-prisma-api
Autor: Paulo De Abreu Santana.
[adrotate banner=”5″]