Alura > Cursos de Programação > Cursos de Node.JS > Conteúdos de Node.JS > Primeiras aulas do curso NodeJS: adicionando CI ao projeto e deploy no Google Cloud

NodeJS: adicionando CI ao projeto e deploy no Google Cloud

Padronizando o projeto - Apresentação

[00:00:00] Boas-vindas, o meu nome é Mateus Hernandes e eu vou te acompanhar durante esse curso sobre Deploy com o Node.js. Esse curso é para quem tem interesse em aprender a trabalhar com o seu projeto e criar um ambiente de produção, durante esse curso nós vamos aprender como adicionar padrões e como de fato padronizar nosso código, utilizando algumas ferramentas como ESLint e um padrão de código chamado Standard.js.

[00:00:21] E, na sequência, nós vamos melhorar a qualidade do nosso projeto, inclusive a performance e a confidência que nós temos com o nosso projeto, utilizando testes unitários, além de conhecer outros tipos de testes para a nossa aplicação. Para criar esse teste, vamos trabalhar com framework para Node.js e para Javascript um geral, chamado Jest.

[00:00:38] Na sequência nós vamos aprender a documentar nosso API para que outras pessoas possam aprender a utilizá-la através do Postman e para que a nossa aplicação consiga ser acessível de toda a internet, nós vamos trabalhar em criar um servidor de produção do zero, utilizando as tecnologias do Google Cloud, como Compute Engine para arquear nossa instância da máquina, o Cloud SQL para poder criar o nosso banco de dados.

[00:01:01] Em seguida nós vamos gerenciar os processos em todos os nossos serviços dentro do nosso servidor utilizando o PM2, que é um gerenciador de serviços para Node.js. Para um bom acompanhamento desse curso você vai precisar saber sobre Node.js, MySQL e Linux.

[00:01:15] Com esse curso você vai conseguir adicionar uma qualidade maior para o seu projeto, vai conseguir gerenciar melhor o seu projeto, além de criar um servidor do zero colocando ele em produção. Nós temos bastante conteúdo para estudar, vamos começar o curso.

Padronizando o projeto - Conhecendo o projeto

[00:00:00] Temos um pet shop que se chama Gatito que agora está indo para o mundo digital e para começar essa migração do nosso mundo físico para o mundo digital, nós vamos começar a trabalhar com projetos, com uma API que gerencia os fornecedores do nosso pet shop. Ou seja, gerencia as empresas que fornecem os produtos, os brinquedos, ração, veterinário, para podermos trabalhar dentro do nosso pet shop.

[00:00:20] Então nós vamos abrir a página do GitHub do nosso projeto, com a página do nosso projeto aberta no lado esquerdo nós podemos ver qual o brand, ou seja, qual o ramo do Git que estamos trabalhando, e um pouco mais para baixo conseguimos ver os arquivos do nosso projeto, inclusive o nome do último commit que alterou ele.

[00:00:37] No caso nós temos a pasta de api, a pasta de “config”, os arquivos .gitignore, package-lock-json e package.json, porém todos esses códigos só está no GitHub, só está na internet, não está no nosso computador. Então, como conseguimos copiar esse código? Já que estamos trabalhando com Git, aqui no canto direito nós temo um botão verde chamado code, nós clicamos nele e ele dá para nós três fórmulas para podermos copiar.

[00:01:00] Ou seja, clonar esse código para a nossa máquina, nós vamos clicar no botão do meio, que é o SSH, vamos selecionar esse texto e copiar, posso selecionar com “Ctrl+ C” ou clicar nesse botão à direita que ele vai copiar para nós. Em seguida nós vamos voltar para o nosso editor, nós vamos abrir o nosso editor, nosso terminal para poder clonar, no caso aqui estamos usando o Visual Studio, mas você pode usar qualquer editor com qualquer terminal que vai funcionar.

[00:01:25] Basta você ter o Git instalado. Com o Visual Studio aberto nós vamos abrir o terminal, “Ctrl + Shift + Apóstrofe”, esse é o atalho que tenho aqui. Nós damos o “Ctrl + L” para limpar o terminal e em seguida nós expandimos para ficar em tela cheia, assim facilita a nossa leitura. Para copiar e realmente clonar o nosso repositório com a URL que nós temos, nós vamos executar o comando git clone, colamos agora a nossa URL.

[00:01:54] No final do comando nós vamos colocar o nome da pasta que queremos que esse código seja colocado, no caso nós vamos chamar de pet shop. Damos um “Enter” e ele vai clonar o código que está lá no GitHub para dentro do nosso projeto e depois que executamos o comando, ele mostra agora algumas mensagem para nós, mostra que está clonando dentro da pasta petshop, etc, e depois ele dá um resolve no final e não mostra mais nada.

[00:02:17] Só mostra uma mensagem escrito que está feito, como conseguimos visualizar os arquivos que estão dentro da pasta do nosso projeto? Já que estamos com o Visual Studio, podemos clicar no x no canto para fechar o painel e na aba lateral esquerda nós vamos clicar em explorer e ai já vai estar aí com a pasta do petshop carregada. Se para você não aparecer a pasta do petshop, você clica com o botão direito.

[00:02:41] Vai até em adicionar pasta para a área de trabalho ou clicar no botão azul em abrir pasta, nós vamos navegar até a pasta do nosso projeto e depois clicar em adicionar. Ele já vai carregar para você da mesma forma que está fazendo aqui. Como nós conseguimos agora analisar o nosso projeto? Nós temos a pasta api, tem outras pastas de arquivos dentro, tudo com uma extensão .js.

[00:03:01] Ou seja, nós sabemos que é um código em Javascript e um pouco mais para baixo nós temos o package.json. Nós sabemos que o package.json é um arquivo representando o gerenciador de pacote chamado npm. Dentro dele nós temos todas as configurações que o nosso projeto pode ter, ou seja, o nome do nosso projeto, no caso api-petshop, a versão, descrição, arquivo principal, comandos e um pouco mais para baixo nós temos as dependências.

[00:03:28] Ou seja, os pacotes que o nosso projeto tem instalado para ele poder funcionar, para nós podermos usar ele. Como conseguimos instalar essas dependências dentro da nossa máquina? Vamos abrir o terminal, vamos voltar para ele, “Ctrl + Shift + Apóstrofe”, e com o terminal aberto nós vamos navegar dentro da pasta do nosso projeto e para isso nós temos o comando cd, então vamos dar um cd petshop.

[00:03:54] Dentro da pasta petshop, para instalar agora as dependências que estão dentro desse arquivo, vamos dividir aqui a tela para podermos ver o arquivo enquanto nós instalamos. Nós temos as dependências body-parser, config, express, etc., para nós podermos instalar essas dependências nós vamos executar o comando npm install. Nós damos um “Enter” e ele vai ler todas as dependências que temos declaradas aqui.

[00:04:17] Vai instalar para nós dentro da nossa máquina, esse comando pode demorar um pouco, então nós vamos guardar. Agora que o npm acabou de executar, nós podemos ver algumas mensagens de notificação aqui avisando que não tem discrição, que não tem o campo de repositório, mas tudo bem. Ele já foi instalado, então nós já temos uma parte do nosso projeto concluído, podemos fechar o terminal.

[00:04:40] Mas se pararmos para prestar atenção nesse arquivo de package.json, dentro das dependências nós temos um pacote chamado mysql12, ou seja, dentro do nosso projeto nós precisamos usar o MySQL. Mas quais são as configurações do MySQL? Qual é o banco de dados, a senha, quais são as tabelas que nós precisamos?

[00:04:56] Nós temos uma pasta chamada config e sabemos que config é uma abreviação para configurações, então vamos abrir essa pasta e tem um arquivo default.json. Se nós abrirmos esse arquivo, dentro dele nós temos algumas configurações pertinentes ao projeto em si, ou seja, o funcionamento do próprio projeto. Nós temos uma seção de MySQL e dentro dessa propriedade nós temos um objeto com uma parte de banco de dados chamado petshop.

[00:05:20] Agora nós já sabemos qual é o nome do banco de dados, nós sabemos também qual é o usuário padrão, a senha, o host e um pouco mais para baixo nós temos a parte do api mostrando qual é a porta que nós estamos executando. O que nós precisamos fazer agora para poder utilizar o nosso projeto com o MySQL?

[00:05:38] Nós temos que criar o banco de dados, em seguida nós temos que instalar tabelas do nosso projeto. Dentro da pasta api, nós temos uma outra pasta de banco de dados e dentro dela nós podemos navegar e ver o que nós temos. Nós temos um script index.js, um outro script criar tabelas. Se nós abrirmos esse script, nós podemos ver primeiro que ele chama o modelo de tabela, ou seja, primeiro ele pega configurações em código da nossa tabela.

[00:06:02] E depois executa um comando chamado sync, ou seja, sync é bem parecido com aquela palavra sincronizar, ele vai sincronizar as tabelas que nós temos no nosso código com as tabelas do MySQL. Então primeiro nós temos que criar o banco de dados, para isso nós vamos abrir o terminal, vamos expandir o terminal aqui, fechar o navegador de arquivos já que não vamos utilizar agora.

[00:06:23] Para trabalhar com o MySQL dentro do terminal, nós vamos executar o mysql-u, nós passamos o nosso usuário que no caso é root, nós vamos dar um “Enter”. Aqui nós não precisamos passar nenhuma senha, ou seja, dentro da nossa máquina nós não estamos utilizando nenhuma senha, então não precisava nem passar e nem colocar aquela senha na configuração do nosso projeto, nós vamos precisar remover daqui a pouco. [00:06:46] Com o MySQL aberto nós precisamos fazer antes de começar a criar as tabelas é criar o banco de dados que vai armazenar essas tabelas, então nós vamos executar mysql> create database e agora colocamos o nome do nosso banco de dados, seguindo no nosso arquivo de configuração, o nome é petshop. Damos um “Enter” e ele deu um query ok aqui e falou que uma linha foi afetada, ou seja, se deu ok está funcionando.

[00:07:13] Como é que conseguimos saber se realmente criou o nosso banco de dados? Vamos executar um comando chamado show databases, ou seja, mostrar banco de dados. Ele vai mostrar pra nós uma mini tabela aqui no terminal, mostrando quais são os banco de dados instalados, tem um information_schema, MySQL, etc, e por penúltimo nós temos o nosso petshop.

[00:07:34] Beleza, nós já temos o petshop criado e precisamos agora pegar essas tabelas em código e realmente persistir no nosso banco. Então vamos dar um exit; aqui, ele saiu do MySQL, até mostrou a mensagem bye aqui no final. Nós vamos apertar o “Ctrl + L” para limpar o terminal e o que vamos fazer agora é executar aquele script de criar as tabelas, só que lembra que a nossa senha não é necessária?

[00:08:01] Então nós vamos apagar esse campo de senha do arquivo default.json, nós podemos salvar. Dentro do terminal nós conseguimos agora executar aquele script para poder criar as tabelas dentro do nosso banco de dados, assim conseguimos gerenciar os dados realmente para o nosso api, nós vamos aplicar node e vamos dar um espaço e colocar o caminho para o script ou nome do script que nós vamos executar, vamos dar um cd. \petshop\.

[00:08:28] Agora sim, nós vamos dar um node./api/banco-de-dados/criartabelas.js, nós executamos esse arquivo e ele vai mostrar para nós duas instruções SQL e depois vai mostrar uma mensagem falando que a tabela foi criada com sucesso. Primeiro ele fala que a primeira instrução no caso que ele está mostrando para nós, é crie uma tabela que se não existe chamada fornecedores e aqui ele passa entre parênteses todas as colunas e configurações que essa tabela vai ter.

[00:09:00] E no final ele dá um SHOW INDEX FROM ‘fornecedores’, ou seja, ele tenta criar a tabela caso ela não exista e depois de tentar criar ele faz um comando SHOW INDEX para ter certeza de que a tabela existe e mostra para nós uma mensagem que traduz certo. Nós já temos as dependências instaladas, já temos a nossa tabela configurada e o que precisamos fazer agora é realmente executar o nosso projeto.

[00:09:23] Para isso, nós vamos executar o comando node .\api\index\.js, nós damos um “Enter” e podemos expandir o nosso terminal para facilitar a nossa leitura. Depois de executar o comando ele mostrou para nós que a API está funcionando, o que podemos fazer com API funcionando? Como conseguimos testar ela? Nós temos que testar os caminhos que essa API vai ter.

[00:09:48] Então vamos abrir o Postman que é um utilitário onde conseguimos fazer várias aquisições completas ou até mais simples para qualquer tipo de API ou serviço na internet. Você pode utilizar o Cury ou qualquer outro aplicativo para ler e fazer aquisições, o que importa é que nós consigamos fazer aquisições para saber se API está funcionando.

[00:10:06] Com o Postman aberto, vamos clicar no mais no meio da tela para criar uma nova aba, nós fechamos aquela aba do notepad e dentro da nova aba nós temos que fazer uma aquisição para saber que nossa API está funcionando. Nós sabemos que API está funcionando na nossa máquina, em um local, então vamos digitar como endereço localhost, esse endereço local host sempre direciona para a nossa máquina.

[00:10:29] Em seguida nós temos a configuração da porta, ou seja, qual que é a porta que estamos utilizando, como nós vimos lá no arquivo de configuração, a nossa porta é a porta localhost:3000/ e temos que colocar o caminho do API que nós queremos acessar. Com o método GET mesmo e no canto direito nós clicamos no botão azul para enviar a requisição.

[00:10:50] Mas um pouco mais para baixo, ele mostra para nós o HTLM com mensagem de erro, ou seja, falando que deu um erro para acessar a API. Mas se ele mostrou a mensagem de erro, quer dizer que ele conseguiu acessar a nossa aplicação. Então de volta no Visual Studio, não está mostrando nada no terminal, o que temos que fazer é navegar e descobrir uma rota que exista e funcione dentro da nossa aplicação.

[00:11:12] Nós vamos abrir o navegador de arquivos, dentro da pasta api temos a pasta rotas e dentro dela a pasta fornecedores com arquivo index.js, nós vamos abrir esse arquivo. Dentro dele nós temos a declaração de roteador, com express, tabela, etc, e temos o roteador.get indicando que temos uma rota com método GET na raiz da URL.

[00:11:35] Por último, só temos que consultar o arquivo principal da API para saber se tem algum apelido na URL antes dessa barra, então vamos voltar para o index.js. Um pouco mais para baixo vamos navegando no arquivo e temos declaração de const roteador que navega até a pasta de fornecedores e depois ele aplica em /api/fornecedores. Nós vamos copiar esse trecho, voltamos para o Postman, vamos colar na URL e damos um “Enter” para enviar a requisição.

[00:12:05] Agora na resposta nós tivemos dois colchetes de resposta, esses dois colchetes nós sabemos que é uma resposta em JSON, ou seja, se temos os dois colchetes em JSON, nós temos uma lista vazia, indicando que não tem nada cadastrado dentro do nosso API.

[00:12:29] Se nós voltarmos para o terminal agora, nós podemos ver que tem uma outra mensagem e dessa vez uma mensagem do MySQL indicando que ele executou um comando select dentro da nossa tabela de fornecedores requisitando todos os dados que estão lá.

[00:12:33] Ou seja, agora nós conseguimos copiar nossa API para a máquina, nós restauramos as dependências, inclusive configuramos o MySQL e agora nós conseguimos executar e fazer uma requisição para a nossa API.

Padronizando o projeto - Guias de estilo

[00:00:00] Agora que já temos o nosso projeto clonado e dentro da nossa máquina, nós conseguimos acessar o projeto, ler o código e ver como é que ele está funcionando, então vamos abrir o Visual Studio, nós vamos abrir o arquivo principal da API, que é o index.js. Ele está dentro da pasta API, dentro do nosso projeto, quando nós abrimos ele, nós podemos ver que a primeira linha que temos é a express, que abriu a tag que usamos.

[00:00:22] O framework que estamos utilizando para poder criar um API HTTP com node.js. Em seguida tem uma variável chamada app, onde estanciamos o express e vamos configurando toda a API, com seus plugins, tem nossos midors, etc. Aqui nós conseguimos ver com mais clareza como que o nosso código é escrito, então nós podemos ver que toda a linha termina sem o ponto e vírgula.

[00:00:46] Nós temos o primeiro midor aqui para verificar o formato da requisição, ele usa a sintaxe de função de air function, ou seja, o nosso código é escrito de uma forma muito específica e se quisermos agora criar um novo midor, como vamos fazer isso? Temos o app.use chamado bodyparser, nós vamos pular duas linhas e chamamos o app.use dentro como primeiro parâmetro nós vamos passar uma função.

[00:01:11] Como podemos escrever essa função? Temos a sintaxe de air function, mas também podemos ter a sintaxe de function () {}, e se nós quisermos colocar um ponto e vírgula? Podemos colocar. E nas outras linhas? Nós também podemos colocar o ponto e vírgula, mas isso tudo são pequenas decisões que nós tomamos que são pequenas coisas que, querendo ou não, vamos acabar debatendo com outras pessoas.

[00:01:38] Então se estamos na empresa, dentro do escritório, trabalhando com outras pessoas, nós vamos começar a escrever um código e falamos: vamos colocar um ponto e vírgula? Nós vamos usar function? Como vamos escrever as nossas requisições, nossos condicionais, etc? Então como podemos pegar e automatizar isso e definir de uma vez por todas as regras do nosso código? Usando o ESLint.

[00:01:59] Primeiro vamos abrir o nosso terminal, vamos expandir, em seguida instalar esse pacote ESLint executando npm install - - save-dev eslint, ele vai instalar o ESLint no nosso projeto e com esse parâmetro que passamos como save-dev, o que ele significa? O save-dev basicamente vai pegar a nossa biblioteca que estamos instalando, no caso o ESLint, vai salvar dentro do nosso projeto como dependência de desenvolvimento.

[00:02:30] Mas o que é uma dependência de desenvolvimento? Nós já não temos as dependências? Vamos olhar o nosso package.json. Dentro dele agora temos o dependencies, são as dependências do projeto como vimos antes, body-parser, config, express, mysql, etc, e em seguida temos agora o devDependenciers, ou seja, as dependências do desenvolvimento.

[00:02:52] Com isso o npm sabe que esses pacotes aqui só são úteis quando a nossa aplicação vai ser executada em qualquer lugar, em desenvolvimento, em staging ou em produção, mas nós temos essas dependências do desenvolvimento que só são utilizadas quando estamos desenvolvendo, quando estamos programando.

[00:03:11] Então quando estivermos trabalhando em um ambiente de produção não vamos precisar instalar esse pacote de ESLint, porque não vamos utilizar dentro de produção. Já temos ESLint e agora vamos descobrir como ele funciona.

[00:03:22] Como que nós conseguimos executar o comando do ESLint? Vamos passar .\node_modules\.bin\eslint e aí vamos passar um - - help. Nós damos um “Enter” e com isso o ESLint mostrou para nós uma mensagem enorme aqui com vários parâmetros que podemos passar a executar.

[00:03:44] Mas como estamos ainda começando a usar o ESLint no nosso projeto, temos que inicializar o nosso projeto, ou seja, vamos executar o mesmo comando. Nós colocamos a seta para cima e ao invés de passar um - - help, vamos passar um - -init, de inicializar. O que esse comando faz? Ele vai executar uma série de comandos, uma série de perguntas do ESLint para nós para saber como o nosso código vai ser formatado, como ele vai funcionar.

[00:04:11] Então a primeira pergunta é, como você gostaria de utilizar o ESLint? Para verificar a sintaxe, para verificar a sintaxe e encontrar problemas, verificar sintaxe e encontrar problemas e deixar obrigatório uma série de regras, um guia de estilo de regras. Vamos selecionar a última opção e a próxima pergunta é qual é o tipo de módulo que nós estamos utilizando, se é import com export ou require com exports. Nós estamos utilizando essa do meio que é o commonJS.

[00:04:38] Nós damos um “Enter” e em seguida ele pergunta para nós qual é o framework que estamos utilizando no nosso projeto, no caso tem react, tem o view.js, mas como não estamos utilizando nenhum deles nós vamos para a última opção, none of this. Em seguida ele quer saber se o nosso projeto tem TypeScript, nós não temos, então vamos selecionar a opção de no, e, na sequência, vai perguntar para nós onde que nosso código é executado.

[00:05:01] No browser, ou seja, no navegador ou no Node. Do lado esquerdo ele tem um ícone de check verde que ele indica o que tá ativado ou não está ativado, por padrão ele seleciona o browser e desativa o Node. Nós vamos apertar o “I” para ele inverter, então ele vai ativar o node e vai desativar o browser, que é onde nós estamos executando o nosso código.

[00:05:22] E como nós decidimos que queremos seguir várias regras de um guia de estilo, na penúltima pergunta ele pergunta para nós qual que é o nosso guia de estilo que queremos utilizar no projeto. Nós podemos escolher um guide popular, pode responder algumas perguntas para o próprio ESLint e assim descobrimos quais são as regras que vão aplicar ou podemos deixar que o ESLint leia nosso código Java Script para entender quais são as regras que queremos.

[00:05:49] Vamos usar um guia de estilo popular e ele nos dá três opções, tem o Airbnb, o standard e o Google. Vamos colocar a seta para baixo e nós vamos usar o standard. Por último, ele pergunta qual é o formato de arquivo que queremos, vamos usar o JSON. Ele vai verificar as dependências que vai precisar para o nosso projeto, que vão precisar ser instaladas e por último ele vai perguntar se queremos que ele já instale essas dependências.

[00:06:13] Vamos clicar que sim, estamos utilizando o standard como nosso guia de estilo padrão. O standard já vem com várias regras definidas dentro do seu pacote e assim conseguimos utilizá-lo diretamente com o ESLint. Se você quiser, pode acessar standardjs.com que é o site oficial com todas as dicas, como instalar, como ele funciona, integração com qualquer editor e etc.

[00:06:37] Vamos voltar para o nosso Visual Studio onde ele já terminou de instalar os pacotes, nós podemos ver aqui primeiro que ele instalou o ESLint e um alguns plugins e algumas configurações. Vamos limpar o terminal, dar um “Ctrl + J” para minimizar e vamos verificar esse arquivo de configuração que foi criado, então vamos abrir o navegador de arquivos e nós temos aqui o .eslintrc.json.

[00:06:59] Ao abrir esse arquivo nós podemos ver que primeiro ele tem a propriedade de env no ambiente, nós temos o commonJS ativado, es2021, ou seja quais são as futures da linguagem que estamos utilizando. node como true, ou seja, indicando que estamos executando o nosso código dentro do node e por último ele fala que estamos estendendo o nosso guia de estilo chamado standard e tem mais algumas opções do parser e algumas regras do ESLint.

[00:07:26] Como o ESLint funciona no nosso código? Temos o nosso index.js da API, nós podemos ver que ele não tem ponto e vírgula, tem alguns que nós acabamos de colocar, vamos colocar até mais ponto e vírgula. Um pouco mais para baixo podemos ver que a indentação, ou seja, o espaço entre o começo da linha e o nosso código está com quatro espaços, então tem quatro espaços aqui para cada indentação.

[00:07:52] E nós não estamos utilizando ponto e vírgula em alguns lugares e em alguns lugares nós estamos, vamos salvar e o que vamos fazer agora é abrir o terminal e vamos ver se o ESLint está funcionando. Vamos dar um .\node.modules\.bin\eslint . para ele verificar dentro do nosso repositório, dentro da nossa pasta agora, apertamos um enter e ele vai ler todo o nosso código e ele vai mostrar os erros que ele encontrar.

[00:08:21] Ele carregou vários erros aqui, nós podemos ver no final do terminal que ele está dizendo que 315 problemas foram encontrados. Navegando um pouco mais para cima, podemos ver que tem uma lista enorme de erros que apareceu e nós podemos ver que em primeiro ele mostra o arquivo que nós estamos acessando, ou seja, o caminho do arquivo, em seguida linha por linha ele vai mostrando os erros.

[00:08:43] Onde primeiro ele mostra para nós o número da linha, o número da coluna, o tipo de mensagem que é, se é um erro ou se é um alerta, ele mostra uma outra mensagem em inglês, no caso ele está dizendo aqui que esperava uma endentação de dois espaços, mas encontrou uma de quatro espaços, e no final tem uma tag identificando qual que é a regra que foi quebrada, que não foi obedecida.

[00:09:06] Então sabemos que no arquivo fornecedor.js era para ter uma indentação de dois espaços, mas ele encontrou uma indentação de quatro espaços. Como são vários erros, são muitos erros que nós temos que resolver, como que podemos agora resolver todos os erros de uma vez sem ter que ficar mexendo arquivo por arquivo, senão isso vai virar uma dor de cabeça maior ainda.

[00:09:27] Para resolver todos esses erros, vamos executar o mesmo comando e dar um - -fix no final. Vamos dar um enter e ele vai verificar nosso código, vai ver os erros que aconteceram e vai tentar arrumar para nós os erros mais simples possíveis sem quebrar o nosso código. Porém tem alguns erros que o ESLint não consegue resolver porque são alguns erros que podem acabar quebrando o nosso código de verdade, se ele mexer o nosso código pode parar de funcionar.

[00:09:49] No caso, tem um erro no arquivo serializador.js na linha 42 onde ele não consegue alterar, ou seja, é uma alteração que temos que fazer na mão, mas ficar executando esse .\node.modules\.bin\eslint . toda hora é uma coisa cansativa, é um caminho que temos que ficar repetindo toda hora, para facilitar esse caminho todo, nós vamos criar um comando do próprio npm.

[00:10:11] Então vamos abrir o package.json, navegando um pouco mais para cima nós temos um campo scripts que conseguimos colocar comandos do próprio npm. Então vamos apagar esse comando de teste e vamos criar um comando chamado lint. O que ele vai fazer? Ele vai executar o .\node.modules\.bin\eslint . e agora para resolver os erros do nosso código colocamos uma vírgula e duplicamos essa mesma linha.

[00:10:42] Vamos trocar o nome do comando para lint:fix e depois do ponto passamos o parâmetro - -fix, que ele identifica o nosso código. Já temos os scripts e como conseguimos executar os scripts do npm? Nós voltamos para o terminal, ao invés de executar todo aquele caminho do .\node.modules\.bin\eslint ., nós só executamos npm run lint.

[00:11:06] Ou seja, depois do run nós colocamos o nome do script que criamos e ele vai mostrar para nós os erros que ele está achando, ou seja, os erros que o ESLint achou. No caso temos aqui o mesmo erro do serializador.js, nós vamos voltar e acessar esse arquivo. Vamos minimizar o terminal, damos um “Ctrl + P”, vamos navegar até serializador.js e vamos navegar agora com o arquivo aberto até a linha 42.

[00:11:30] Nós temos um if e dentro desse if nós estamos utilizando essa função hasOwnProperty, mas é uma função que o próprio ESLint está falando para não acessar essa função diretamente e no final ele mostra qual que é a regra que está bloqueando essa função. Por que não podemos usar essa função diretamente? Porque essa função, se estamos utilizando de um dado que vem de fora do API, pode ser uma vulnerabilidade onde as pessoas podem criar funções falsas no Javascript.

[00:11:56] Como conseguimos trocar isso aqui e continuar mantendo nosso código funcionando? Nós vamos apagar tudo que está dentro da condicional, colocamos um Reflect.has e para esse método vamos passar como primeiro parâmetro o objeto, no caso variável dados, e como segundo parâmetro a chave ou o nome da propriedade que queremos verificar, que é o campo. Então o Reflect vai verificar se nossa variável dados possui o campo que estamos passando.

[00:12:21] Ele vai retornar um verdadeiro ou falso e ele vai prosseguir com a condicional da melhor forma possível, assim o nosso código está mais seguro e ele também está obedecendo o ESLint. Vamos voltar para o terminal e descobrir como está funcionando agora? Nós damos um “Ctrl + J”, vamos limpar com “Ctrl + L” e vamos executar npm run lint, vamos dar um “Enter”.

[00:12:41] Ele vai rodar o ESLint e ele encontrou alguns erros de espaço, mas ele não encontrou mais aquele erro que nós vimos do Rasonproperty e isso acontece porque nós já resolvemos esse erro, mas esses outros erros de espaçamento, o que aconteceu? O vs.code, por padrão ele já tem algumas regras dele mesmo que ele decide como formatar o nosso código, no caso como salvamos o nosso arquivo, o vs.code formatou e agora temos que resolver.

[00:13:08] Nós já temos o nosso comando do fix, então vamos executar npm run lint:fix, damos um “Enter” e ele vai ler o nosso código, pegar as regras e executar e ajustar, não mostrou nada na resposta. Então vamos executar o lint novamente.

[00:13:26] executamos o lint, esperamos o resultado e não temos nada no resultado, indicando que ele conseguiu ler o nosso código, ele executou de acordo com todas as regras que nós definimos e não encontrou mais nenhum erro dentro do nosso código.

[00:13:38] Com isso conseguimos padronizar o nosso código, nós não precisamos ficar discutindo com a pessoa do nosso lado se usamos ponto e vírgula, se usa sintaxe x ou y. Agora nós já temos essa parte toda automatizada, toda padronizada dentro do nosso código.

[00:13:50] Agora só para nós finalizarmos, vamos voltar para o arquivo principal do API, para o index.js, na linha 14 vamos remover essa função aqui que criamos para poder testar o nosso ESLint. Nós apagamos essa linha, vamos salvar e agora vamos verificar se o nosso código está funcionando, está de acordo com as nossas regras.

[00:14:08] Nós executamos o nosso comando do npm run lint, ele vai rodar o lint para nós, verificar as regras, não retornou nada, ou seja, o nosso código está muito bem formatado, está direito com as regras que definimos, agora executamos API com node .\api\index.js, damos um “Enter” e ele vai mostrar a mensagem que o API está funcionando.

[00:14:33] Vamos testar no Postman só para confirmar, então enviamos uma requisição e conseguimos listar e com isso nossa API está funcionando e está muito bem formatada.

Sobre o curso NodeJS: adicionando CI ao projeto e deploy no Google Cloud

O curso NodeJS: adicionando CI ao projeto e deploy no Google Cloud possui 145 minutos de vídeos, em um total de 36 atividades. Gostou? Conheça nossos outros cursos de Node.JS em Programação, ou leia nossos artigos de Programação.

Matricule-se e comece a estudar com a gente hoje! Conheça outros tópicos abordados durante o curso:

Aprenda Node.JS acessando integralmente esse e outros cursos, comece hoje!

Plus

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$85
à vista R$1.020
Matricule-se

Pro

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$120
à vista R$1.440
Matricule-se
Conheça os Planos para Empresas

Acesso completo
durante 1 ano

Estude 24h/dia
onde e quando quiser

Novos cursos
todas as semanas