API Pokemon com NestJS

Neste exemplo trataremos de como conectar e trazer os resultados da API do pokemon com o framework JavaScript NestJS.

Em caso de dúvidas o NestJS acesse https://nestjs.com/

Ferramentas Utilizadas

Tempo de desenvolvimento (30 minutos).

Sistema Operacional MacOS Catalina 10.15, pode ser feito no Linux e Windows que suporte as versões abaixo.

Visual Studio Code https://code.visualstudio.com/

NodeJs Versão 12.06 (https://nodejs.org/en/) + NPM 6.0.4

NestJS versão 6.3.0 (https://www.npmjs.com/package/@nestjs/cli/v/6.3.0)

Git

TypeScript npm install -g typescript

Link do Projeto (Linque)

Baixando o projeto no terminal entre na pasta desejada e faça o clone do projeto.

git clone https://github.com/andersonluizpereira/nestjsprojects.git

Estrutura do projeto

Vamos entender alguns pontos do projeto como main.ts, sim é desenvolvimento de typescript com nodejs ok!. Rs. Vamos entender.

A parte do NestFactory, bootstrap vou pedir pot gentileza para você ler a documentação ok!

AppModule trata de algumas configurações principais como acesso a base de dados, serviço etc.

Compression serve para melhor a compressão no retorno do JSON, ele faz como zip diminui o tamanho dos dados, o appOptions coloquei porque eu quis. Brincadeira serve para habilitarmos o cors, caso alguém queira usar o crud que a vamos desenvolver. Listen (porta)nem se fala né, é por lá que a sua aplicação vai rodar, depois vou fazer um role onde ele pega a porta disponível no SO.

O setupSwagger serve para disponibilizar o Swagger da documentação.

No arquivo app.module, contém principais configurações como acesso banco de dados, serviços internos, externos, configurações.

Agora vamos criar o módulo pokemon (nest generate module pokemon), depois vou explicar o swagger. Depois vamos partir para a aplicação do pokemon.

Após a execução nest generated, crie as pastas de acordo com a estrutura da foto acima. Agora vamos ao setup swagger.

Na parte do Logger e INestApplication,vou pedir para você ler a documentação, mas vou simplificar, Logger vai escrever no console as informações de log. InestApp… vai servir para expor a sua api do swagger.

Na parte do swaggerEndpoint é o endereço onde vamos acessar a aplicação como http://localhost:3000/api/v2/api-docs. Mesmo assim no readme.md, eu estou explicando dentro dele algumas informações. Depois vou inserir a collection da aplicação. Na parte do options, onde fica DocumentBuilder, onde vamos construir o título da aplicação no setTitle, setDescription con 'API Base' responsável pela descrição do swagger. Na tag setVersion, indica no número da versão das alterações da API Swagger. Podemos inserir segurança na API com usuário e senha. E por final buid, onde é construído o swagger.

No const document é onde é feito a construção da api do Swagger.

Agora vamos ao acesso da API do Pokemon, após a contrução das pastas de acordo com a foto abaixo.

Crie um arquivo pokemon.service.ts, dentro da pasta service.

Temos alguns decorator`s com @ Alguma coisa rs, como @ Injectable, que serve para criar a injeção de depedência para se ter acesso a alguma informações como persistência e acesso a dados externos como serviço

Foi criado uma classe com o nome de PokemonService, que vai expor essa url, foi criado um constructor para ser feito a injeção de acesso a serviços externos, com a função de HttpService, que foi colocado dentro do constructor como readonly com acesso a leitura.

Foi criado uma url para busca a base de api do pokemon, foi criado uma função como o nome de GetBaseApiPokemon retornando com o httpService com get mais a url, para retornar com o Json.

Dentro da pasta controller crie um arquivo pokemon.controller.ts de acordo com a imagem, mais as configurações.

Caso você tenha rodado antes com npm run start:dev, agora vai estar rolando uma série de erros rs normal, vamos corrigir, vamos nos concentrar em criar a controller.

Vai aparecer algumas anotações com @ Controller ('v2/pokemon'), onde dispobilizamos como endereço http://localhost:3000/v2/pokemons, depois vamos melhorar a convenção disso, depois vem o @ APIUUseTags é recurso dentro do swagger (título onde identificamos o recurso a ser trabalhado).

O @ Get('/pomekon') é a função (recursos de busca ou inserção)a ser chamada http://localhost:3000/v2/pokemons, o @ APIResponse tem o status code onde retornamos qual queremos, rs lembra o Java e C# né, description descrição da API o type é o objeto de retorno, agora vem o pulo do gato.

Criei uma função assíncrona com o nome de baseap, onde aguardamos a resposta dentro de uma variável com o await buscando lá do service lembra que está injetado no construtor, depois encapsulamos dentro de um Result para o retorno de Json, isso eu aprendi no curso (https://app.balta.io/) do Andre Baltieri, onde temos o retorno do new Result(null, true, response.data, null), primeiro campo message a mensagem é nula, sucess é true, response é o retorno da api e o null é o error. Mesma coisa na parte de errors.

Depois faça essa mágica quicktype https://pokeapi.co/api/v2/pokemon -o src/pokemon/dto/PokemonDto.ts e crie uma classe PokeDto.ts

Agora vamos ao arquivo pokemon.module.ts, finalmente acabar.

Para funcionar todo esse role faça os imports do Module, HttpModule para a API funcionar, o cacheModule serve cachear as controller e importe o PokemonService e o PokemonsController de acordo com a imagem e rode npm run start:dev.

Agora abra a url http://localhost:3000/api/v2/api-docs/

E faça o teste com o famoso curl -X GET “http://localhost:3000/v2/pokemons/pokemon" -H “accept: application/json”

Depois fazer alguns ajustes para persistir em base de dados MongoDB, fazer upload de imagem e segurança na aplicação healhcheck e acesso a api de endereços e Facebook.

Caso queira acompanhar em um vídeo.

Eu agradeço Renato Groffe e Milton Câmara.