PORTFÓLIO BACK-END JAVASCRIPT: como fazer | Hipsters: Portfólio Dev

[Música] E aí galera aqui é o Fabrício Carraro program Manager na lura e bem-vindos e bem-vindas a mais um episódio da websérie portfólio Dev onde a gente cria um projetinho do zero até o final até publicação que é um projetinho que você Talvez possa usar para criar o seu próprio portfólio no github talvez até apresentar em uma entrevista de emprego e para me acompanhar a aqui no Projetinho desse mês eu tenho aqui a Juliana amazi que ela é instrutora aqui na alura tudo bem Juliana tudo bem Fabrício tudo ótimo Então conta pra gente exatamente o

que é o projeto que a gente vai desenvolver aqui nesse Episódio Então hoje o que eu trouxe pra gente a desenvolver é um projeto que de backend com o JavaScript que ele vai fazer uma integração com uma outra api que é uma API de filmes Então pensa assim você tem um serviço por exemplo de Indicação de filmes ou de catálogo e pediram pra gente trazer sinopses dos filmes então ah qual sobre o que que é esse filme normalmente a gente traz traz essas informações de apis de terceiros O que que a gente vai fazer aqui

é justamente isso nós temos uma API de terceiros que é um diretório de filmes a gente vai acessar essa api vamos trazer as informações de sinopse dos filmes que a gente vai querer buscar de repente e a gente vai usar um curso para traduzir Esses essas sinopses para português né porque se a nossa plataforma é aqui para Brasil tal português não adianta trazer a sinops em inglês né então para isso a gente vai utilizar um serviço de tradução que ele é feito com aprendizado de máquina então é um é uma ferramenta desenvolvida em machine learning

US uma biblioteca em Python e ela a gente consegue fazer ela rodar localmente porque que que acontece essas ferramentas elas Eh T todo uma questão de chave de ter que pagar porque né É É complicado de você colocar essas ferramentas no ar elas consomem muito recursos mas aqui com essa a gente consegue rodar ela localmente e utilizando o recurso de machine learning elas ela vai fazer as traduções das nossas sinopses então para isso a gente vai precisar do JavaScript né Eu tô aqui usando o vsc a gente vai usar o Express que é o Framework

eh http para subsid gerenciar rotas mais famosão Do JavaScript aquele que a gente usa para tudo e eu também vou usar o docker o docker eu vou utilizar justamente pra gente rodar essa ferramenta de de tradução localmente então se você ainda não tem o docker instalado dá uma pausinha aqui a gente tem eh conteúdos artigos da lura instal te ensinando né ajudando a instalar no passo a passo docker em todos os sistemas operacionais mais usados porque a gente vai precisar dele e ele também Vai ser super útil na sua vida aí quando você for inclusive

mandar por exemplo um teste de vaga é interessante colocar no docker mas isso a gente pode falar mais tarde eu vou até perguntar aproveitar jo explicando para quem nunca mexeu com docker o que que é exatamente ele o docker ele é uma ferramenta de conteinerização ou seja e com o docker nós conseguimos transformar e o nosso computador digamos assim em vários computadores Compartimentados por que que nós utilizamos isso porque cada projeto eh cada a biblioteca que a gente utiliza cada código que a gente trabalha pode ter eh ferramentas diferentes pode rodar em linguagens diferentes usar

bancos de dados diferentes eh versões diferentes de interpretadores e todas esses pequenos detalhes quando a gente não tem uma ferramenta que separe esses ambientes fica muito complicado de gerenciar e o docker ele serve Justamente para isso ele facilita essa compartimentalização digamos assim que a gente pode ter ambientes dentro do nosso computador e também quando a gente publica né a as nossas aplicações no ar também elas podem estar dentro de um contêiner e também facilita para quem vai pegar o nosso código e executar porque se eu pego o código que alguém me mandou o código tá

Java versão x Ela utiliza essa essa essa ferramenta não preciso me preocupar em ter nada disso Instalado eu só eh rodo né executo esse contêiner né esse essa caixinha onde tá tudo lá dentro e não preciso me preocupar com mais nada as versões estão ali as ferramentas estão ali a minha aplicação tá ali basicamente isso perfeito Então acho que você pode começar já Ju Beleza então Eh eu vou começar Então por enquanto o a minha pasta ela não tem nada ela só tem o ridm eh onde eu coloquei ali as informações mais básicas do projeto

eu vou começar Então indo no terminal e fazendo o primeiro passo já tô na pasta aqui do onde a gente vai codar primeiro passo de qualquer projeto que utilize node né eu vou usar o npm você pode usar outro gerenciador por exemplo o yarn se quiser npm init Men Y pra gente iniciar um projeto e criar um arquivo package P Jon lá no nosso na nossa pasta então o pack de p json tá criado aqui o arquivo manifesto né do nosso do nosso projeto eu vou aproveitar que a gente tá aqui no Terminal e eu

vou já instalar o Express pra gente já sair usando então npm install Express ele já deve instalar pra gente agora a gente pode já criar um servidor simples para pegar as nossas codes né pegar as nossas nossos plots de filme dentro do pack Jason eu já vou colocar um script pra gente começar a rodar já esse servidor Eu Vou Chamar esse script de start mesmo que é um dos scripts básicos e de qualquer projeto Eu Vou Passar como comando node e ifen o watch já falo sobre ele e eu vou passar server.js esse arquivo não

existe ainda mas eu vou criar ele agora em seguida o node para executar esse arquivo server que eu vou criar que vai est aqui na raiz do projeto e o ifen ifen Watch é pra gente subir esse servidor eh no modo watch ou seja qualquer atualização qualquer arquivo que eu modifique que eu salve o servidor já vai ser atualizado Imediatamente né automaticamente a gente não precisa nem de uma biblioteca externa para fazer isso como a gente precisava antes das versões da versão 18 do node e não precisa nem ficar derrubando subindo o servidor à mão

muito importante eu estou usando o node na versão 20 então se você tiver utilizando qualquer versão que seja inferior a versão 18 Eu recomendo você atualizar mas se você não quiser atualizar e essa esse watch ele não vai Funcionar Tá vai precisar usar uma ferramenta externa certo eu acho que por enquanto é só isso agora eu vou na raiz do projeto vou criar server.js e aqui a gente começa lá a trabalhar com Express o nosso querido Framework então eu vou já passar aqui Import Express from Express Express aqui entre aspas né ponto e vírgula eu

vou declarar também aqui uma const que eu vou chamar de p igual 3000 pra gente rodar a nossa aplicação na porta 3000 né Como ela é uma const Global tô declarando aqui porte com letra maiúscula vou criar também uma const App dessa vez com letra minúscula normal para iniciar uma Instância do Express então com shp igual Express fecha parênteses ponto e vírgula aqui a gente vai iniciar uma Instância de Express e passar todos os métodos dele para dentro dessa const app e agora eu posso chamar app. Listen que é aqui um evento de ouvir de

ouvir coisas né ouvir eventos Que acontecem no nosso servidor primeiro parâmetro ao número da porta que esse servidor vai escutar que a gente vai passar a nossa Constant port né 3000 e segundo é o callback ele não precisa receber nenhum parâmetro Então abre e fecha parênteses Nossa Arrow function abre e fecha Chaves vou passar aqui um console P log só para avisar lá no terminal a mensagem servidor escutando então agora se a gente executar o nosso script Start vou deixar aqui uma linha Extra como sempre eu vou voltar no terminal limpar o terminal e passar

o comando npm start o nosso script Opa Ah ele deu um erro porque eu tô usando aqui a sintaxe de expor expor e tem um detalhe importante né no node quando a gente quer utilizar essa sintaxe para fazer importação exportação de módulos a gente tem que passar dentro do package json uma instrução uma propriedade a mais que é Type Module pode colocar em qualquer lugar eu normalmente eu coloco depois do m Mas como é um objeto não vai fazer diferença e como eu fiz uma mudança no pack de Jason né Eh não adianta eu tentar

esperar o servidor reiniciar que isso não vai acontecer então eu quebro aqui o processo comtrol C npm start de novo Agora sim servidor escutando ele avisa que eh o modo watch aqui é experimental Mas tudo bem servidor está escutando Ok só que né nosso servidor tá de pé ele Não tem nada ele não tem uma rota não tem nada para mostrar pra gente então vamos fazer o seguinte vamos criar uma rota pra gente começar a trabalhar dentro eh então da nossa pasta eu vou abrir uma pasta dentro da raiz eu vou chamar de src né

sorce Onde fica o nosso código fonte dentro de sorce eu vou abrir uma pasta HS Roots né eu falo HS que fica mais fácil onde vão ficar as nossas rotas eh eu vou abrir um index PJS mesmo vamos Declarar aqui uma rota simples pra gente começar então aqui sim eu posso dar Import agora que eu já declarei lá no package Jason Import Express from Express ponto e vírgula eh vou criar aqui uma const rootes const houts igual aqui a const houts eh eu vou fazer aqui uma uma expressão de função e ela vai receber como

parâmetro app por enquanto a gente ainda não sabe o que é esse App mas a gente já vai descobrir então app abre e Fecha Chaves né passei aqui o merrow function eu vou passar dois métodos aqui para dentro app. houts houts vai receber um parâmetro só que é uma string Contendo a nossa rota por enquanto eu vou passar só a rota barra a rota principal pra gente fazer um teste ponto get e agora a gente já sabe que é uma rota que vai receber né uma requisição do tipo get E aí o get recebe um

callback uma função callback dentro dela então passar aqui parâmetros os Parâmetros vão ser hack e res né o padrão aqui para requisição e resposta então requisição e resposta Arrow function só tem uma linha Então já vou declarar aqui rest P status vou passar dentro de status 200 o de ok que é o que eu espero que aconteça ponto send então ponto send ele vai mandar só alguma coisa é simples né uma string no caso então vou passar aqui rota Inicial ponto e vírgula lá no final vou passar mais um método aqui Para dentro da nossa

função que é app.use que é um middleware do Express então que que eu vou passar com middleware eu vou passar express.js para ele abre e fecha parênteses para ele parcar né tudo que ele vai receber de Jason para string string para Jason beleza ponto e vrgula e aqui eu vou exportar né Export def a nossa HS pra gente conseguir usar ela lá no nosso é no nosso server né aqui normalmente eu faço eu crio uma um outro arquivo para Separar a parte da aplicação da parte do servidor mas como a gente aqui tá meio no

corre né tempo um pouco limitado eu vou fazer tudo dentro do arquivo server mesmo tá Uhum Então importei Express agora eu vou Import HS from secc barh não pode esquecer do pon JS no final porque às vezes o aut complete ele dá uma rasteira na gente ele não coloca e eu vou iniciar aqui né o nosso R passando app então a gente já sabe agora o que que é esse app que Eu declarei lá é o app onde tá onde estão né todos os métodos do Express que a gente instanci aqui então executei a função

que a gente exportou lá em H eu acho que agora tá tudo funcionando Deixa eu voltar no terminal para ver se não tem nenhum problema ele falhou Hum vamos ver modle op não encontrando um módulo aqui vamos ver HS from src HS deixa eu ver aqui ah é porque não é HS PJS né Olha eu falei que O que o autocomplete às vezes dava uma dava uma enrolada e eu lhe ele me enganou e eu fui atrás é src HS index.js tá vendo ele sempre tem que dar uma olhada deixa eu ver agora se voltou

eu vou quebrar aqui e v dar de novo para ver se tá tudo OK não não tá tudo ok app HS is not a function hum Agora sim fiquei confusa vamos lá vamos voltar src HS index JS Tá certo exportei Def HS HS recebe app app HS Eita deixa eu dar uma olhada aqui Ah porque Ah tá tá tá ok é que não é H isso aqui é h é app. H passando uma rota porque eu tô passando uma rota só né não é HS agora Servidor escutando tudo bem passou nervoso aqui vamos lá eu

vou agora eu vou fazer isso no navegador mesmo porque é uma rota get Tá então não tem necessidade da gente e usar outro gerenciador Então como a gente tá na no 3000 eu vou no navegador mesmo em local host local host 2 p 3000 rota base rota Inicial perfeito agora Sim tá tudo funcionando temos um site temos temos um site temos um servidor por trás desse site ainda rodando Então beleza Eh agora principal que a gente tem que fazer como que a gente pega as nossas nossas plots né nossas sinopses eu deixei aberto já para

o site da api que a gente vai utilizar que é a Open MOV Database muito serviço usa Open Movie Database E então você vê ela em muito Teste ele é uma API gratuita eh só que o que que acontece você precisa fazer eh uma inscrição para conseguir uma chave de api se você clicar em API ke você passa o seu e-mail eh escolhe aqui o free né O problema é que você só tem um limite aqui de 1000 requisições por dia só que o que a gente vai fazer aqui vai ser bem menos de 1000

requisições a não seri que deu alguma coisa errada no código mas se você quiser também fazer contribuições né eu no momento não tô Fazendo então preenche o cadastro vai chegar um e-mail do da Open api é da openmove para você e esse e-mail vai pedir para você confirmar o seu e-mail não esquece de clicar para confirmar o e-mail para né mandar um e-mail de confirmação pro serviço e você vai receber uma chave de api uma sequência Alfa numérica né uma sequência até que curta Alfa numérica pega essa chave e o que que a gente vai

fazer aqui agora lá no nosso projeto e Eu vou fazer aqui no meu e você vai fazer no seu é criar um arquivo pra gente guard D essa chave e aí qual que é o problema eu não posso deixar essa chave né junto com o restante do do código eu não posso deixar deixar essa informação hardcoded então o que que a gente faz nesse caso a gente vai criar um uma variável de ambiente para colocar essa informação dentro lá na raiz do nosso projeto então eu vou criar um ponto env é um tipo de arquivo

ponto env De environment né de ambiente e eu vou passar aqui dentro uma variável Onde eu posso guardar essa chave e eu posso não enviar esse arquivo Envy para pro repositório Por exemplo quando você for mandar esse teste a sua chave fica guardada com você então é isso que eu vou fazer sempre que você tiver qualquer informação sensível Semas Chaves de api você vai fazer esse processo Então vamos lá meu arquivo.env eu vou criar uma variável Não precisa escrever var nada api underline ke esse padrão tudo maiúsculo com underline é um padrão quando a gente

cria esse tipo de variável tá então e uso o padrão ap underline Key e eu vou colocar a minha chave eh depois vou pedir para editar só para e não mostrar minha chave aqui porque depois aí maó trampo para eu conseguir outra eu vou colar minha chave aqui não precisa de não precisa ser entre Strings nada é só colocar o valor da sua chave aqui e eu Vou colocar a minha beleza ok já coloquei a minha informação meu dot env tá aqui só que pras variáveis de ambiente funcionarem projetos node a gente precisa instalar uma

biblioteca que é que gerencia essas essas variáveis eu vou então quebrar vou derrubar meu servidor com control c e vou fazer uma nova instalação com npm install dnv DTV é a biblioteca Pequena já instalou vou aproveitar para subir novamente o Servidor com npm Start o dot Envy normalmente a gente eh Faz a chamada dessa biblioteca no ponto que a gente chama de ponto mais externo da aplicação onde eh onde ela vai rodar primeiro no nosso caso é o server então lá no arquivo server JS no topo do arquivo mesmo antes dos das importações do Express

eu vou Import aqui a importação é um pouquinho diferente eu vou Import já vou abrir eh uma string e escrever d env Barcon ponto e vírgula só isso A partir daqui o seu projeto qualquer ponto dele consegue pegar qualquer variável de ambiente que você tenha declarado lá no seu Envy agora que a gente já tem uma chave de api seria legal a gente poder testar o nosso serviço né eu vou voltar aqui no site do da api da Open MOV Tem uma parte do menu que chama exemples né onde a gente consegue ver uns uns

exemplos de utilização e como que a gente chama isso Aqui qualquer api externa que você for utilizar e api não tem muito tem algumas receitas de bolo mas para cada uma vai ter alguns detalhes de como você faz essa chamada então não tem jeito a gente sempre tem que olhar com calma a documentação de cada AP para descobrir como que a gente faz chamadas para ela aqui no caso da openmove Database eles dão uns exemplos então Ó você manda suas requisições para esse endereço vou aumentar aqui um pouquinho você manda Essas as requisições para para

esse endereço aqui ó passa sua api Key né então aqui a gente já sabe que a gente tem que passar uma informação e o e- comercial e- comercial lembrando de parâmetros que a gente passa é quando a gente monta uma url a partir do e-c comercial a gente consegue passar parâmetros embaixo tem uma lista dos parâmetros que a gente vai passar vamos testar ver isso acontecendo para fazer esse teste de api Eu vou utilizar o Postman que é o meu a minha ferramenta de de teste de requisição de teste de API de preferência existem outras

e por exemplo Thunder client você pode usar que você quiser no Postman no caso eu já sou assoi a minha apq é uma variável que é uma função que o post Man temm então quando você for fazer montar sua requisição onde no meu tá escrito apq igual apq você vai colocar o seu a sua chave né que você recebeu lá por control V básico ali né Posso colocar direto contrl V básico isso pode colocar direto sem problemas não precisa estar entre Strings nada então já tá aqui eu já coloquei a minha e eu já tinha

deixado aqui inclusive um teste aqui com um filme por eu vou tirar o plot aqui eh só pra gente fazer o primeiro teste então lembrando como a gente acabou de ver na documentação apiq e- comercial o e- comercial é marca aí onde você consegue separar e colocar vários parâmetros Enfileirados né a primeiro parâmetro você marca onde começa com uma interrogação você vai enfileirando eles com e- comercial o t no caso é um onde você busca por um título tul de um filme então vamos fazer esse teste aqui então um igual aqui né eu tenho aqui

meu primeiro meu primeiro parâmetro com com interrogação e Comercial parâmetro T como tá na documentação igual pera abri uma coisa aqui que não devia aqui abrir um menuzinho D Matrix e Pode colocar com espaço mesmo hoje em dia já já dá para para encodar os espaços então eu coloquei esse filme aqui que eu gosto tem que colocar em inglês né Vamos dar um send tá funcionando ó nosso api retornou Ok sim retornou aqui tudo sobre esse filme que eu gosto né então ano e gênero etc e ó o que a gente quer aqui é o

plot né é a sinopse do filme aqui tá o plot normal plot mais curto mas eu já tinha visto lá na documentação que existe uma opção Plot que você retorna um plot um pouquinho maior e a gente pode colocar aqui né e comercial para separar parâmetro plot igual a full e fazer uma nova requisição e ele traz novamente o filme com plot um pouquinho maior pra gente testar tá funcionando nossa nossa integração aqui só que agora a gente tem que muit bom sim é essas APS de são são muito legais assim quando você vê Nossa

tá funcionando consegui fazer mas agora A gente tem que colocar isso tudo no código né então pensa assim a gente não pode passar a a gente tem a nossa aplicação então pra nossa aplicação funcionar a gente tem que que passar por exemplo pro frontend é rotas da nossa aplicação né não tem como D Não fica legal se eu passar ali ó usa ali essa api se vira mesmo porque eh um detalhe eh a api ela tem chave né então é legal que a gente mantenha isso aqui fechado com a gente porque tem questão de Autenticação

etc etc Então vamos fazer uma rota nossa né porque é o nosso aplicação aqui pra gente mandar a nossa rota pro frontend tudo bonitinho Como que eu faço então Lembrando que a gente e normalmente Qual que é a estrutura quando a gente faz um tá trabalhando aí com uma API http a gente tem uma estrutura tem um tipo de arquivo que é responsável por fazer esse gerenciamento de rotas que é o que a gente chama de controlador então a gente Já criou rotas agora a gente vai lá dentro de src vou criar uma nova pasta

vou chamar de controllers onde a gente vai ter os controladores que vão receber as ras receber as informações que vem das rotas e manejar as requisições pra gente então dentro de controllers eu vou abrir um novo arquivo eu vou chamar vou chamar de movie controller.js movie com m maiúsculo por quê Porque eu vou criar aqui dentro uma nova classe uma Class movie Controller Com m maiúsculo as classes não levam é parâmetro só abre e fecha parênteses e aqui dentro a gente começa a colocar uns métodos para fazer as nossas rotas funcionarem bom eu vou criar

o primeiro método eu vou criar esse método estático tá então o métodos estáticos Lembrando que eles não precisam que a gente instancie move Controller para funcionar é só fazer a chamada direto e chamando a nossa classe e chamando o método então static eu vou dizer que Esse método é Aim porque eu já sei que eu vou precisar fazer requisições e respostas então a gente já sabe que isso vai ser assíncrono eu vou chamar basicamente ele não tá ele não tá local aí a gente vai ter que bater isso no servidor lá de algum lugar para

pegar enquanto ele espera Nossa tela não pode ficar travada exatamente então a sincronicidade separa essa requisição para ir se resolvendo enquanto o resto do código continua funcionando uhum eh Eu vou chamar isso essa esse método de get movie plot eh pra gente pegar o plot né pegar a sinopse do do filme e ele vai receber como parâmetro hack e res né nosso padrãozinho aqui quando a gente sabe que vai mexer com requisição e resposta primeira coisa que a gente tem que fazer é pensar assim se eu quero que a minha rota eh faça uma pesquisa

de um filme determinado a gente já tem uma dica pela api do Move Database que tá mandando aqui via parâmetro o nome do Filme então na nossa rota a gente pode manter a mesma coisa então a gente pode dizer que a nossa rota vai receber também o nome do filme para procurar é por parâmetro então vou fazer o seguinte eu vou criar uma const eu vou chamar de movie name igual e aí eu recebo hack. query pmov Hum que que é hack. query pmov significa que eu vou também receber e dentro da minha requisição dentro

da Minha query vou receber query params né parâmetros de da né requisição aqui né parâmetros da consulta e eu tô chamando esse parâmetro de move tá isso esse nome sou eu que tô dando eh vou chamar de move porque é o nome que a gente vai usar lá ok mas nada disso existe ainda então vamos lá eu vou criar um um bloco try catch que é o básico aqui quando a gente trabalha eh com requisições e a gente quer pegar Tantos acertos Quantos erros então na parte de erro desse Cat eu vou dar só uma

resposta básica tá que a gente não vai Vai ter muito como trabalhar com isso agora então dentro do catch vou passar res P status vou passar 500 aqui mesmo pon Jason e aí dentro desse Jason eu vou passar só um obje Dinho com message E aí a mensagem vai receber error que é o nosso parâmetro do catch pon message e message eu sei que ele é uma propriedade que sempre vem nesses Objetos erros e agora o mais importante que é o try hum eh é aqui eu vou dizer que assim eu vou deixar um comentário

dizendo que aqui vai o plote é traduzido porque a gente ainda não tem isso para mandar de volta a gente ainda não nem pegou o plot lá do do da da api e nem mandou traduzir só que aqui onde o que eu tô montando Aqui é onde vai ser o a resposta da nossa requisição e a gente ainda não tem isso mas beleza então vamos fazer o seguinte Eu vou dizer que por enquanto a gente vai trazer só a o nome do parã Pr gente testar para testar deixar assim que a gente não esquece o

que a gente tá fazendo E aí que que eu vou fazer eu vou dar o a minha resposta né Então res P status 200 padrão aqui pon Jon e vou passar MOV name aqui MOV name que aí ele já vem lá dos parâmetros então quando eu por enquanto Quando eu fizer uma requisição para uma rota que a Gente ainda vai criar a resposta tem que ser só o nome do filme que eu passei só pra gente testar depois a gente vê o restante não posso esquecer de exportar Então vou dar um Export default aqui Export

defa Qual que é o nome da minha classe move Controller beleza exportei tudo certinho e agora Já criei o Controller criar a rota Vamos criar essa rota vou criar então de novo eu tô criando aqui dentro do Index Esse é o tipo de coisa que vai ser legal se você For fazer o seu teste você separa oex o ponto de entrada né dessa parte de rotas das rotas que você vai fazer no seu projeto eu t fazendo aqui tudo junto mas você pode separar eu super recomendo inclusive mas dentro de index eu vou importar primeiro

o nosso move Controller Deixa eu só confir tudo OK agora Acho que sim né tá saindo de rotas entrando em Controller MOV controller.js agora Cent da noss Né que faz todo esse pacotão de rotas eu vou adicionar uma rota as que a gente já tem Então vou adicionar mais uma rota get então app.get parâmetro do get eu passo uma string com a Rota que eu quero eu vou chamar essa rota de barra MOV barra search Então vou dizer aqui search com a e vou dizer aqui que bateu nessa rota você vai chamar aquele método que

a gente acabou de criar lá no nosso controlador então movie search Qual que É o segundo parâmetro aqui da função get né do método get é a função que a gente chama né no caso vai ser mve Controller pon get MOV plot que é a única que a gente tem isso aqui padrão do Express padrão de apis com Express criei a minha rota get e agora a gente pode testar essa rota que que eu espero então que aconteça Quando eu der um get em local host 3000 como é um get dá para fazer no navegador

mesmo Barra bar search eu espero que Apareça o nome do filme que eu pesquisar e como é que eu vou pesquisar esse filme lembrando como que a gente fez isso passando quy pars né passando parâmetros Então como que a gente faz começa a fila de parâmetros Com interrogação o primeiro parâmetro eu chamei de move lá atrás e aqui a gente pode passar meus preferidos Lord of the RS com espaço mesmo não tem problema vamos ver funcionou funcionou legal trouxe um Jason só que esse Jason não tem nada só Tem o nome do nosso parâmetro se

a gente trocar por e fala um filme que você gosta aí Fabrício tem o inception inception que é em português é a origem a origem esse eu vi no cinema inception tá tudo sim tá tudo funcionando beleza então agora a gente já consegue se conectar com a nossa api Porque a gente já viu que a que a chave tá funcionando e a nossa rota também tá funcionando beleza só que a gente não vai fazer isso no controlador a gente Vai criar a gente vai criar uma outra separação também que é Classic do modelo mvc que

é uma pasta de serviços de Services pra gente conseguir fazer essa conexão com o serviço externo eh Services T várias outras outras outros usos né eu vou criar uma nova pasta vou chamar de Services dentro de src e aqui eu vou criar movie service service PJS e dentro de Services vou criar Também uma classe pra gente criar os nossos métodos aqui dentro então classe movie service abre e fecha Chaves criar o nosso primeiro método né também vai ser um método estático pra gente não ter que instanciar movie service toda vez ele vai ser eles esse

sim muito importante ser ass S porque é aqui que a gente vai fazer a conexão com o serviço externo então com certeza isso aqui vai ser uma operação assíncrona então avisei que é Estático avisei que é SN eu vou botar o nome desse método de get move info E aí que que ele precisa receber precisa receber o nome do filme que a gente vai pesquisar Então vou dizer que ele vai receber movie name vai receber aqui MOV name Ok e é aqui que a gente vai fazer o fat na api que que é fat fet

é uma API interna do node que a gente usa para fazer requisições http post get etc só que aí e vamos fazer o seguinte eu não Para fazer essa parte de fet de api e tal a gente já sai um pouquinho do serviço então eu vou criar mais uma pasta rapidinho pra gente deixar tudo mais organizado eu vou criar uma pasta que eu vou chamar de utils dentro de utils eu vou criar um arquivo que eu vou chamar de api connect.js só pra gente separar essa parte do fet tá para ela ficar modularizada beleza aqui

não precisa criar uma classe eu só vou criar aqui Uma função mesmo assíncrona não pode esquecer então vou criar uma Sync function aqui o nome vai ser fat movie vamos fazer literalmente isso e o parâmetro que eu preciso passar novamente aqui é o MOV name para ela saber qual que é o nome que eu quero pegar e eu vou criar aqui uma const eu vou chamar de o o RL também o RL maiúsculo por quê Porque aqui eu vou passar eu vou chumbar como a gente né tá tá tá fazendo as coisas um pouco mais

Resumidas eu vou chumbar aqui literalmente colocar hardcoded a nossa e url de requisição aqui no caso se você quiser você pode colocar vou copiar copiei da da da documentação né o http e B api com apiq etc aqui você pode separar depois no arquivo de constants se você quiser etc bom isso aqui essa essa URL ela precisa de algumas informações que a gente vai concatenar para criar uma string com ela completa Então vou usar os back tickets aqui né o os acentos Agudos a parte da onde a gente copiou onde marca que tem que Inserir

a nossa chave de api lembrando a gente já criou essa chave de api lá no nosso Envy então a gente só tem que lembrar Qual foi o nome da variável que a gente usou no caso eu sei que é apiq né então cifrão abre e fecha Chaves e aqui dentro eu vou passar process ponto env ponto e aqui da mesma Forma que a gente declarou lá na lá no env letra maiúscula e underline apiq então só isso o node já consegue pegar lá do nosso ambiente lá da nossa varável de ambiente e concatenar aqui e

a outra informação que a gente precisa passar é justamente o nome do filme e eu sei que aqui o parâmetro pra gente fazer uma busca por título é T como tá lá na documentação T minúsculo então t igual e aqui eu vou concatenar a outra informação qual que é essa informação Move name que a gente vai receber do parâmetro deixa eu quebrar minha linha aqui movie name e eu vou também passar aquele outro parâmetro que a gente testou que é pra gente trazer o plot um pouquinho com um pouquinho mais comprido né pra gente é

ter um exemplo mais legal então e comercial para concatenar mais um parâmetro plot igual a full só isso que a gente precisa e agora fazer o nosso fet então aqui dentro de api Connect Mesmo eu vou fazer um TR Cat aqui pra gente conseguir depois é se for o caso criar casos de erro etc e a resposta eu vou só dar um return aqui é em error tá na parte do catch só pra gente retornar qualquer coisa e aqui no try é onde vai fazer o nosso fat então conste eu vou chamar de res tá

que vai ser a nossa a resposta do nosso fat vai ser a wait então avisei que a função é assíncrona agora eu tenho que avisar aqui dentro Qual que é o processo que vai ser Assíncrono aqui que vai ser fat fat lembrando não é a biblioteca interna PR a gente usa para fazer essas requisições que que o fet precisa receber por parâmetros se você for na documentação do mdn vai ter vários casos o principal que não pode faltar que é o primeiro é a URL para onde a gente vai fazer essa chamada nesse caso eu

só vou precisar fazer e usar essa URL Porque a gente já viu que só ela funciona não precisa passar Mais nada então F URL vou passar só um if aqui pra gente fazer uma verificação Simples então se essa osta ela for qualquer coisa que não seja Ok então se não for né exclamação res.ok eu vou só pedir para mandar um erro para fora então vou pedir para ela dar um troll né então troll New error e vou passar aqui um caso de falha então vou abrir aqui back tickets de novo e falha dois pontos e

aí vou concatenar Aqui Com cifrão e Chaves res P status Opa Meu New error ficou com um w a mais ok beleza é return er ok só falta agora a gente exportar né então vou dar um Export default aqui na nossa fat movie e agora a gente já pode usar e que que eu vou fazer Lembrando que a gente estava fazendo tudo isso lá no no service né então eu importo lá no serviço principal na nossa classe movie service Import fat movie from utils deixa eu ver se ele saiu certinho Agora ele tá mais esperto

né então agora ele já sabe uhum só falta colocar o ponto JS no final que ele n não tá querendo colocar de jeito nenhum eh beleza get MOV info vai pegar o nome do filme então a gente já sabe que a gente tem que fazer esse fat e eu vou guardar esse fat dentro de uma variável Então vou criar uma const movie aqui await fat movie passando MOV name que é o parâmetro que tá chegando aqui dentro da nossa do nosso único método né que é Nosso método get movie info e eu vou pedir paraar

né return movie Export default pra gente conseguir chamar isso aqui lá no controlador debugger não Sport defo é movie service Ok abri uma linha a mais ok agora a gente já pode chamar isso no controlador e eu espero o que que eu espero que aconteça aqui que quando a gente chame isso no Execute né a gente faça essa requisição ele traga o plot em inglês que aí só vai faltar Traduzir então lá no try onde eu deixei as o comentário agora sim a gente pode criar uma const que eu vou chamar de movie plot não

get MOV plot só MOV plot que é o nome da minha da minha da minha const igual e aqui eu vou chamar deixa eu ver se Ah eu esqueci de fazer uma coisa eu esqueci aqui de importar né o nosso serviço S então Import Service Services MOV service.js e agora a gente já pode chamar o movie service e o movie service Tá chamando o nosso fat tá batendo no api do Open Open mve e tudo vai se conectar magicamente e a gente tem o MOV name aqui então vai dar tudo certo é espero que dê

tudo certo nós não testamos isso e MOV plot await né operação assíncrona é movie service movie service nosso método chama get MOV info passando o MOV name Então tá tudo recebendo de tudo quanto é lugar aqui aí agora a única coisa que falta é trocar aqui né de move plot o Nossa resposta da Requisição agora o que eu espero é que venha alguma coisa vamos torcer não só o nome né que vem o plot do do filme Exatamente exatamente eu vou olhar aqui servidor escutando então não tem nenhum erro vou lá no navegador mesmo onde

a gente tava vamos deixar inception mesmo e agora vamos ver o que acontece se eu recarregar hum não veio nada não veio o nosso move inception Deixa eu olhar no terminal ai ai ai sabia que devia ter testado alguma Coisa eh eu vou fazer o seguinte eu vou testar o Pode ser que eu esteja deixando de eu vou fechar o server aqui deixando de de retornar alguma coisa aqui no nossoo api Connect eu tô Ah olha só olha só o que que eu esqueci Olha só se não for Ok dá erro se for Ok não

faz nada não acontece nada não acontece nada eu gente eh Fabrício eu sempre você viu que eu fui direto na verdade eu sempre esqueço de retornar coisa em Função sempre desde meu primeiro dia então eu já fui direto e vai acontecer com você de casa provavelmente também então relaxa é não relaxa relaxa Total assim porque isso é normal eh bom agora que eu tô retornando meu Jason r. Jason né porque eu já quero que ele venha eh pareado bonitinho eu vou votar no terminal servidor escutando e vamos lá vamos refazer aqui ah agora sim agora

foi que bonito sim bom mas o que a gente não quer tudo isso né A gente só quer o Plot Então eu imagino que se isso aqui é um Jason que tem várias propriedades e ela tem a propriedade a propriedade plot se é eu retornar MOV P plot deve funcionar né Uhum deveria deveria né então vamos fazer o seguinte onde que isso tá sendo e trazido pra frente que Jason eu vou tentar colocar aqui mesmo né ponto plot plot pon plot lá no na resposta mesmo no no controlador vamos ver se já funciona é OK

Opa aí já já não ele já não trouxe eu vou fazer o seguinte e eu vou formatar essa saída tá lá no tis vamos fazer o seguinte lá nos eu vou abrir uma um novo arquivo eu vou chamar de helpers.js essa esse padrão ele ele ele é bem comum quando você precisa criar helper functions helper function são funções que elas são funções que elas servem para ajudar formatar coisa por exemplo quer formatar um objeto tal não sabe Onde colocar você pode usar uma colocar isso dentro dos que que eu vou fazer aqui vou dar um

spor aqui vou criar uma function eu vou chamar ela de formate movie Object vou passar aqui um Jason esse Jason aí que a gente tá recebendo eu vou pedir para ela retornar a saída o que eu quero receber porque eu não quero receber na minha requisição tudo que estava estava agora Dev voltar a receber isso eu não quero Receber tudo isso eu só querce receber por exemplo o nome do filme E o plot pra gente começar Então vou retornar aqui abro o parênteses para ele retornar já o objeto direto então parênteses Chaves é um objeto

com com dois parâmetros é title que vai ser o Jason que a gente vai receber ponto title que é um um outro Opa vírgula que é um uma outra propriedade que a gente já viu lá no Jason que tem e plot que vai ser jon plot jon plot então Beleza tem aqui Um obje e agora que que a a gente vai fazer agora a gente vai lá no controlador E aí eu vou mudar essa saída Então eu tenho aqui MOV plot Ok eu vou fazer do jeito mais comprido vou criar uma const response igual for

formate movie Object deixa eu ah ele já importou aqui bonitinho formate movie Object passando o nosso movie plot né que a gente já Sabe que movie plot que é o que tá dentro dessa const é o que tá aparecendo aqui né é o que tá sendo retornado Por enquanto aqui na nossa requisição então eu vou trocar por response já mandei receber o nosso Jason formatar e trazer só o que eu quero e agora eu vou mandar voltar a nossa response salvei lá no terminal tá tudo ok vamos voltar no navegador de novo inception Hum será

que eu esqueci de botar algum Retorno de novo lá no nosso helper não quero o retorno tá aqui deixa eu ver o que aconteceu agora Talvez seja aquela hora que a gente tem que começar a distribuir console pon log né então nossos hel meu helper tá aqui eu exportei ele importou certinho formate MOV Object eu vou dar um console P log aqui em response para ver se tá vindo Response e vou colocar um outro console aqui no MOV plot para ver se de repente MOV plot eu não tô errando alguma coisa vou voltar terminar tudo

ok vou fazer de novo a requisição e vou no terminal Ah ele veio hum tit undefined plot undefined na minha responsa response ó que doideira mas o MOV plot tá vindo bonitinho então isso significa que vamos lá aqui tem algum problema nessa parte aqui porque aqui tá Chegando direitinho vamos lá no meus helpers e tô retornando o meu formate movie Object tá sendo retornado direitinho deixa eu dar uma olhada então eh aqui na no retorno que eu já tinha feito antes no post m tá Ah pera aí eu acho que eu sei o que é

que é um inclusive é um erro muito comum aqui no meu J eu coloquei title e plot com letra minúscula e olha só olhando de novo no retorno é com letra maiúscula sim eh me Passou uma rasteira aqui esse é o tipo de coisa que o typescript acho que me ajudaria também a não ter esse ele o aut complete dele já ia colocar para mim a não ia ter esse problema mas tudo bem vamos lá eu acho que é isso né então servidor escutando vou voltar no navegador tentar fazer essa requisição de novo ai agora

foi tudo em casa certo que susto Beleza eii então tá bom a gente podia fechar por aqui já né porque a Gente já fez uma API que tá fazendo conexão com uma API externa a gente inclusive tá dando uma ligeira tratada aqui né pegando formatando os dados que a gente quer e mandando pra frente só que a gente quer isso em português né a gente quer traduzir isso e eu já falei que a gente ia esse spoiler né que a gente ia utilizar um serviço é baseado em machine learning né para fazer esse trabalho pra

gente o serviço que a gente Vai usar chama libre translate é uma biblioteca open source que permite tanto que você vou já deixei a documentação dela aberta permite tanto que você utilize e a versão online dela Se você quiser utilizar a api deles da mesma forma que você acabou de a gente tá utilizando né a do Open MOV pode porém ela é paga então você pode ir lá get api ke mas mas como ela é paga que que a gente vai fazer ela é open source e ela Possibilita que nós e rodemos isso localmente então

você pode pegar todo o código e executar E é isso que a gente vai fazer e é aqui que a gente vai utilizar o docker porque essa biblioteca ela dá opção de você instalar e rodar e usando o Python tal mas aí a gente não quer instalar o Python se você não tiver instalado etc mas ela também dá a opção de rodar com docker que é o que a gente vai fazer então se você tiver usando Linux ou Macos você vai utilizar esse comando aqui eu vou aumentar um pouco aqui o run.sh porque ele tem

um script aqui né se você olhar aqui na documenta aqui na no github você vai ver que tem um um script né escrito em Shell script para rodar eh essa essa biblioteca né ou a versão no Windows então o que que você tem que fazer que eu já fiz eu já fiz o fork e e o clone desse código do github Então você vai vir aqui vai fazer o fork Né E vai fazer o clone pro seu computador eu já fiz isso ess eu vou voltar aqui onde tá o comando instal Run with docker eu

vou voltar no terminal eu vou abrir um novo terminal deixar um zoomzin aqui vou sair da pasta do projeto e entrar aqui em libre translate onde eu já baixei e aqui tudo baixado eu posso só executar esse script aqui porque eu tô no Linux Então vou executar no Linux é tô no Linux aí eu executo a versão de Linux ou Mac OS e você no Windows vai Executar a versão do Windows ele vai rodar esse x script da primeira vez que você fizer isso é capaz que ele demore bastante porque ele vai puxar um monte

de coisa ele tem também uma opção eu vou derrubar aqui com control c porque ele tem opção também de você passar argumentos né então você pode passar um argumento que é ifen ifen load if only e passa com espaço em de inglês né vírgula vírgula sem espaço tá PT E de português então você pode passar dessa forma também ele vai demorar um pouquinho porque da primeira vez ele vai puxar tudo da internet né do repositório do registry né como como eu já tinha feito isso antes para mim foi um pouco mais rápido e no final

a mensagem que você quer receber é que ela vai est rodando em http porta 5000 Então se certifique que a sua porta 5000 está e liberada também senão você não vai conseguir e Executar certo então Teoricamente já tá tudo certo inclusive se eu for no navegador Olha só vou no navegador aqui e vou executar local host dois pontos 1000 já tem uma versão da biblioteca aqui funcionando funcionando localmente é muito legal mas a gente não quer isso né a gente quer colocar isso dentro da nossa api então o que que a gente vai fazer voltar

no nosso código eu vou lá no nosso tis api Connect e eu vou criar mais um método Que agora a gente vai fazer um novo fat né só que agora para local rost 5000 Então vou criar vou fazer o seguinte eh eu vou mudar um pouco aqui o Sporte vou tirar esse Sporte de e vou passar na função que a gente já tinha fat moove vou colocar um sport na frente dela vou tirar o Sport de porque agora a gente vai ter mais de uma função né e vou criar uma outra função embaixo que também

vai ser Export então depois eu só não posso esquecer de mudar essas essas Importações Sport a function eu vou chamar de Fat tr translation que vai receber um MOV plot que é o que a gente já sabe que a gente tem essa informaç essa informação Opa deixa eu pegar aqui abr e fechar Chaves mesma coisa que a gente fez o anterior vou criar uma con URL vou chumbar aqui no código a a nossa con Mas você vai querer que de repente separar isso todas as consts no mesmo lugar E aqui não vai ser só local

host 5000 tá porque se eu fori local host 5000 ele vai subir aí a o front end e tal não é isso que a gente quer a gente quer localhost 5000 bar translate é essa que é a rota da para você fazer a chamada pra api que tá local e eu não preciso eu vou não preciso nem passar nenhum dado para concatenar aqui então pode chamar entre aspas mesmo essa string Ok criei aqui o RL vou criar uma const res igual a weight fat nosso fet Velio de guerra aqui e aqui sim eu vou ao

contrário do fet anterior onde onde só Precisei passar o RL aqui eu vou precisar passar ao RL primeiro parâmetro e o segundo parâmetro do fet dessa api né é um objeto onde a gente define eh dados a mais né informações a mais que a nossa requisição precisa ter para conseguir ser mandada com sucesso nesse caso se você tiver qualquer dúvida essas informações elas estão na documentação do libre translate tá vai ter exemplo de Como fazer essa requisição de como fazer e as chamadas e mas eu já fiz né então já sei o que eu tenho

que passar aqui mas tá tudo na documentação do libre translate Então dentro desse objeto eu vou passar método igual igual não dois pontos post que eu vou ter que fazer um post nessa api com a informação que eu quero buscar que eu quero traduzir na verdade e o segundo segundo a segunda propriedade desse objeto aqui é o bar é o corpo da Requisição né que eu tenho que mandar o texto Então vou mandar o texto vai ser método post e que que vai ter nesse texto vai ser Jason com tudo maiúsculo pon string porque eu

preciso pegar esse json transformar em string para ele viajar na requisição E aí que que eu tenho que mandar dentro desse string F eu vou abrir um objeto aqui porque eu vou ter que mandar algumas coisas eu vou mandar q dois pontos q de query né de consulta Que vai ser mve plot que é o que eu quero que seja traduzido e vou mandar mais algumas informações que isso é o a api da libre translate que pede né Então pede que seja feito pede que o bar que o corpo da requisição seja mandado exatamente dessa

forma ele pede source qual que que que é source né source é a o idioma de origem é a fonte então o idioma de fonte idioma de origem Exatamente isso ele vai est em inglês como a gente viu né Uhum Então passo em Que é o código aí para inglês e eu quero que seja traduzido para português então o alvo o target então outra propriedade target vai ser PT entre é uma string né e o formato formate dois pontos mais uma string text beleza passei aqui esse objeto mais uma outra propriedade que eu preciso passar

aqui nesse grande objet aqui que é o segundo parâmetro do fet que é a última propriedade que é o headers headers são os cabeçalhos dessa Requisição Quais são os cabeços que eu preciso passar vou abrir aqui um objeto e vai ter o nosso o famoso content Type que eu passo aqui como string também content Type com c maiúsculo e t maiúsculo dois pontos application barjon também em string Beleza agora tá tudo certinho isso aqui de novo tá lá na documentação do libre translate se você tiver qualquer dúvida são os parâmetros que a Biblioteca pede Ok

a partir do momento Que eu tenho a resposta nessa R que Teoricamente vai retornar para mim com texto traduzido que eu preciso fazer é mandar isso pra frente então vou criar uma con vou chamar de translated obj de objeto né para eu poder mandar isso aqui pra frente vou dar um await res P Jason abre e fecha parênteses então ele vai pegar isso vai a não a ait Jason Então vai pegar isso vai parar de novo para Jason pra gente Poder trabalhar é eu vou fazer o seguinte eu vou ser audaz aqui não vou testar

eu vou dar um return direto aqui no nosso translator de Object senão a gente podia colocar um console P log aqui para ver se tá funcionando mas vamos embora Quem que tá chamando esses fats o nosso service Então vou lá no Movie service primeira coisa que eu vou fazer é arrumar os nossos imports lá do Fat movie que agora a gente importa ele Dentro de Chaves Então deve voltar a funcionar aqui e F eu vou importar aqui também esse método que a gente acabou de criar o f translation Então importei vou criar agora uma outra

classe dentro de movie service na verdade eu não vou criar get info deixa pensar aqui é vou criar uma nova classe aqui um novo método static também ass que vai ser get get translation recebendo movie V chamar de movie info movie Info e aqui eu vou criar uma const pra gente receber o resultado né então translated vai ser await fet translation onde a gente fez Faz a chamada pro fet lá para a nossa API de tradução passando aqui sim ó aqui a gente pode passar movino plot e aqui plot com P minúsculo por quê Porque

esse plot aqui foi o que eu criei aqui ó com o nosso helper então por isso aqui é plot minúsculo plot com P minúsculo mesmo então eu tô pegando esse objeto que já passou pelo api do mve info já foi formatado já tá sendo devolvido e é esse objeto que eu vou passar para dentro do nosso serviço de tradução passei pro serviço de tradução espero aqui torcendo para dá certo eu vou ter aqui a minha tradução feita dentro da conche translated e eu vou só retornar isso aqui né então return translated e eu vou pedir

para ele Retornar Por enquanto só o translated mas por via das dúvidas eu vou passar aqui um console.log dentro de translated só pra gente conferir porque não estamos usando typescript o que que vai chegar aqui vou agora atualizar o meu Controller que e formatou fez o MOV Object só que agora eu não quero mais retornar esse MOV Object que é o que tá retornando no momento né Eu quero retornar a minha tradução Então vou pegar o que tá vindo Do movie plot que já tá vindo formatado aqui né e é esse aqui agora eu posso

chamar o meu serviço de tradução Então vou criar uma con vou chamar de Translate ig a movie movie service que que era mesmo era get translation né get translation passando a nossa response aqui para dentro depois ess esse nome respons acabou ficando não ficando tão claro mas depois se quiser você pode aí Fazer um ajuste de nome e dentro da nossa resposta agora a gente tem que mandar noss lat de plot eu acho Fabrício que tá tudo certo se tiver ol tá tudo okas coisas né Mas é para Tá ok É para Tá ok vamos

torcer sempre é né sim aqui ah é aqui que eu tem que vir então agora se eu apertar o enter tem que vir alguma coisa traduzida vamos ver se vem veio Olha só olha Só que legal perfeito e Era exatamente né eu Us D COB Skill Thief agora D COB é um ladrão habilidoso tá tudo certo tá tudo certo tá tudo certo a tradução automática a gente sempre tem que né Uhum ter aquele ter aquele cuidado mas pô pra gente faz fazendo aqui essa essa atividade eu acho que ficou ficou bem bacana Aí depois a

gente passa aí pros revisores de texto do do mundo do universo revisarem os textos pra gente Mas tá tudo aqui se você quiser também você pode só retornar o o texto né então você pode pedir pra sua requisição lá sua resposta retornar só o valor aqui da propriedade translated text né então se a gente passar lá na resposta no controlador translated plot P translated text dá para você retornar só o texto Então vamos de novo aqui retornou só o texto eu vou trocar de move de MOV vou trocar de filme aqui vou colocar D Matrix

de novo De repente Retornou Thomas Anderson homem que vive Duas Vidas vou fazer mais um teste aqui com Lord of the Rings e ah ok hobit chamado Frodo aparentemente tá tudo certo deve ter uns errin de tradução aí mas tá tudo certo e aí Fabrício O que que você achou eu adorei não eu acho que o pessoal de casa vai curtir bastante também porque isso é um projetaço é um projeto lindo para est no seu portfólio é um portfólio do zero que você criou junto com a gente aqui e Ju eu vou até Me permitir

e continuar aqui né propor uma continuação do desafio que é você continuar fazer isso daqui e criar Quem sabe um front end para isso agora né a gente focou mais na parte da api mais a parte do back aqui de você colocar o servidor no ar basicamente Mas agora você fazendo um frontend bonitinho talvez pegando as imagens lá também né do omdb do online Movie Database fazendo uma coisa bacana pode ficar um projeto ainda maior sim Total se você se você Tem interesse em Full stc já é um acho que é uma ótima oportunidade de

você fazer um front end bacana se você quiser focar aqui na parte de api tem algumas coisas também que a gente acabou fazendo aqui no corre mas que que eu recomendo eh tem várias coisas por exemplo eu falei das rotas Ah que a rota normalmente eu separo então eu criei aqui Services Beleza mas se você quiser dar uma repensada em como está sendo feito a modularização desse projeto Então eu comentei lá atrás também que eu não criei um app para separar o nosso server eh da parte da aplicação isso também pode ser pensado Então acho

que assim a parte de modularização se você quiser repensar em como você quer fazer essa parte também é uma coisa legal de de estudar eh outra coisa que eu acho que é bacana é sei lá se você Vai disponibilizar essa Api para outras pessoas consumirem como é que você doiz essa aplicação também Também e tem um detalhe que aqui como a gente já está usando uma aplicação doiz que no caso é a libre translate existem alguns detalhes que vão ser bacanas para você estudar em como você faz esses dois contêiners se conversarem mas isso aí

eu vou deixar para ir nos seus estudos de docker porque é bem interessante estão sempre que você for mandar um teste mandar uma atividade aí que que peçam para você fazer algum teste manda doiz que aí facilita para Pessoa que vai acessar que vai rodar seu teste vai rodar sua aplicação subir ela com tudo que ela precisa outra coisa importante testes né Eu acho que o próximo passo aqui independente de você querer fazer o Fronte ou não pelo menos os testes unitários que aqui pode ser feito teste de api também eh mas pelo menos começar

aí pelos testes unitários é sempre legal você fazer todos os testes necessários entregar uma entregar um projeto entregar um portfólio que Tenha os testes rodando E aí você coloca no ridm aqui como que roda os testes como que executa os testes como é que você tá fazendo eles e também documentar né documenta depois as a todas as rotas que a sua api disponibiliza Como que você chama essas rotas então por exemplo a gente sabe como que executa aqui porque a gente que fez né então a gente sabe que a gente tem uma rota move que

essa rota ela tem um parâmetro que a gente chama de move a gente passa um String Mas isso você tem que deixar documentado para quem vai rodar o seu projeto conseguir executar né conseguir rodar o seu projeto e bater na rota e ter o O Retorno que a pessoa tá esperando H acho que é isso depois é bastante coisa né muita coisa para estudar e muita coisa para muita possibilidade para desenvolver o projeto ainda mais uhum Ju Muitíssimo obrigado pelo projeto aqui com a gente tenho Certeza que o pessoal vai adorar e se eles quiserem

continuar ou se eles se perderam em algumas partes eu recomendaria também ir lá na alura.com.br tem as formações completas ali desde você começar com node né começar ali com JavaScript mesmo o typescript que a Juliana mencionou várias vezes aqui que se fosse typescript não funcionaria bem assim já já iria direto a parte do docker também ou então se você não manja de front end Tem as formações completas lá de frontend também muito muitas dessas formações feitas pela própria Juliana amí é verdade tem várias coisas lá que se você fori estudar apis com no apis com

node de JavaScript é possível que você me encontre por lá Aí uma outra coisa que eu não falei mas se você quiser aproveitar para estudar typescript também converter tudo para typescript também é bacana para para aí você ter uma oportunidade de estudo Perfeito Então pessoal Muitíssimo obrigado e a gente se vê aqui mês que vem mais um episódio da nossa websérie hipsters portfólio Dev tchau tchau tchau tchau [Música] [Música]