‫Jonas: Bem-vindo de volta.
‫Agora, vamos finalmente configurar o Express,
‫criar um servidor simples e fazer algum roteamento
‫básico apenas para ter
‫uma ideia inicial de como realmente trabalhamos no Express.
‫Nesse vídeo, vamos começar a trabalhar
‫no projeto natours, o grande projeto principal que faz
‫parte desse curso.
‫Assim como antes, vá em
‫frente e obtenha o projeto inicial dos arquivos do curso.
‫Eu já tenho aqui.
‫Eu o abri no meu código VS.
‫Vamos dar uma olhada rápida no que temos aqui.
‫Temos o arquivo de
‫configuração mais bonito, exatamente como configuramos antes.
‫Eu também tenho um arquivo de configuração para
‫ESLint, e ESLint que não configuramos neste
‫ponto, mas
‫faremos isso posteriormente nesta seção.
‫Por enquanto, eu só quero
‫começar a codificar e não me preocupar em lintar nosso código.
‫Linting serve apenas para consertar alguns erros.
‫Mas, novamente, vamos fazer isso mais tarde.
‫Aqui só temos alguns arquivos para
‫depois, como css, imagens, ok, e agora também por exemplo, alguns
‫dados que precisamos para construir nosso aplicativo.
‫Novamente, vamos começar a usar esses dados aqui ao
‫longo desta seção.
‫Enfim, agora temos um projeto totalmente novo.
‫A primeira coisa que geralmente fazemos com um novo projeto
‫é criar o pacote. arquivo json,
‫assim como mencionei antes.
‫Fizemos isso no projeto
‫nodefarm e agora vamos fazer aqui também.
‫Abro o terminal integrado.
‫Você pode fazer isso clicando neste atalho aqui ou simplesmente vir aqui
‫para Visualizar e depois no Terminal.
‫Deixe-me levantar um pouco para que você possa ver.
‫Lembre-se de que o comando é npm init.
‫Demos um nome ao projeto.
‫É chamado de natours.
‫Tudo bem, não pode ter letras maiúsculas.
‫Vamos fazer isso de novo.
‫A versão é uma, descrição,
‫digamos apenas um nó de aprendizagem, expresso, e mongoDB, mongoDB.
‫Ponto de entrada, índice. js, bem, na
‫verdade, vamos usar o app. js agora.
‫Vamos chamá-lo de app. js.
‫Não temos comando de teste, nem git,
‫nem palavras-chave, o autor sou eu, e é isso, tudo bem.
‫Aqui temos o pacote. json.
‫Como antes, nada de novo aqui.
‫Agora é hora de instalar o Express.
‫Npm eu expresso.
‫Vou usar o Express aqui,
‫que está no ponto
‫de gravação, a versão mais recente, mas há
‫algum tempo a equipe do Express está trabalhando na versão 5.
‫Essa é uma versão principal que
‫poderia apresentar alterações importantes se você a instalasse.
‫Agora, na verdade, não
‫há muitas mudanças na versão 5, mas para
‫ter certeza, instale o Express na versão 4 exatamente como estou fazendo.
‫Para fazer isso, basta atingir 4.
‫Isso instalará a versão mais recente dentro de 4 com as versões secundárias e de
‫patch mais recentes, portanto, 4. 16 4
‫Essa é a versão que estou usando
‫agora neste curso, e a sua provavelmente será
‫uma versão posterior, mas contanto que você tenha a 4
‫aqui no início, você estará bem.
‫Você vê que ele realmente
‫criou nossa pasta de módulos de nó aqui.
‫Agora, estamos prontos para começar.
‫Estou criando um novo arquivo e se chama app. js.
‫É uma espécie de convenção ter toda a configuração
‫do Express no aplicativo. js.
‫É isso que estou usando aqui agora.
‫Agora temos o aviso de que não
‫é possível carregar o ESLint.
‫Novamente, vamos configurar isso mais
‫tarde nesta seção.
‫Então, vamos usar o Express.
‫Vou exigir, é claro, o pacote Express.
‫Nada de novo neste momento.
‫Dê a ele um cofre.
‫Você vê que a visualização já fez sua
‫mágica aqui, adicionando este ponto-e-vírgula e também adicionando
‫esta nova linha aqui.
‫Importamos o Express e agora o que fazemos
‫é criar uma variável chamada app.
‫Novamente, isso é uma espécie de padrão.
‫Assim, app e resultado atribuído da chamada expressa.
‫É isso mesmo.
‫Esta é uma função que, ao chamar,
‫adicionará vários métodos à nossa variável de aplicativo aqui.
‫O primeiro que vamos usar é,
‫na verdade, um aplicativo. ouça para
‫basicamente iniciar um servidor.
‫Isso é um pouco semelhante ao
‫que fizemos antes com o pacote http nas seções anteriores, certo.
‫Então, novamente, lembre-se de que o
‫Express é 100% sem js nos bastidores e algumas
‫das coisas funcionam
‫de maneira muito semelhante aqui no Express.
‫Tudo bem, mais uma vez, isso simplesmente
‫torna nossas vidas um pouco mais
‫fáceis ao tirar um pouco da complexidade de nós.
‫Assim como antes, no aplicativo. escuta, a
‫gente cola no porto.
‫Vamos criar uma variável para isso aqui antes.
‫Porto e digamos 3000 por agora.
‫Vamos mudar isso um pouco mais tarde.
‫Colamos na porta e uma função de retorno de chamada.
‫Novamente, esta é a
‫função de retorno de chamada que será chamada assim
‫que o servidor começar a escutar.
‫Vamos simplesmente fazer um console. faça login
‫aqui, aplicativo em execução na porta.
‫Tudo bem, então esse é o
‫nosso servidor agora realmente ouvindo.
‫Agora o que precisamos fazer a seguir é definir a rota.
‫E mais uma vez,
‫nós meio que já definimos
‫as rotas antes no projeto nodefarm, lembre-se disso,
‫mas funciona de forma muito diferente com o Express.
‫Lembre-se de que o roteamento
‫significa basicamente determinar como um aplicativo responde a
‫uma determinada solicitação do cliente, ou seja, a uma determinada URL.
‫E, na verdade, não é apenas
‫um URL, mas também
‫o método http que é usado para essa solicitação.
‫Lembre-se disso da aula de http que tivemos antes.
‫Como fazemos isso?
‫Bem, é muito simples no Express.
‫Tudo o que fazemos é app, depois o método
‫http ao qual queremos responder, e vamos começar
‫com o mais simples
‫que é get, e então a URL.
‫Estamos apenas especificando o tipo de URL raiz aqui.
‫Novamente, a rota é basicamente a
‫URL, que neste caso, é apenas esta URL
‫raiz e também o método http, que é get neste caso.
‫Agora, o que realmente queremos
‫que aconteça quando alguém acessa esse URL com uma solicitação get?
‫Bem, tudo o que
‫queremos fazer, precisamos especificá-lo em uma função de
‫retorno de chamada, que especificamos como o segundo argumento.
‫Temos uma função
‫de retorno de chamada exatamente como esta, e
‫essa função de retorno de chamada pode aceitar alguns argumentos.
‫O mais básico, e
‫os que geralmente sempre precisamos, são get request, entity response.
‫Nesse aspecto, é novamente muito semelhante ao
‫que fizemos antes no projeto nodefarm.
‫Naquela época, quando iniciamos nosso
‫servidor, também tínhamos acesso ao objeto
‫de solicitação e resposta.
‫Agora, eles são um pouco diferentes aqui no Express.
‫Eles têm muito mais dados e métodos, mas
‫a ideia é exatamente a mesma.
‫Portanto, você vê que os
‫aplicativos Express e também os aplicativos de
‫nó são todos sobre solicitações e respostas, simplesmente
‫porque é assim que a web realmente funciona,
‫conforme você aprendeu nas seções anteriores.
‫O que queremos fazer agora?
‫Bem, tudo o que queremos fazer é enviar
‫alguns dados de volta muito rapidamente.
‫Podemos usar o objeto de resposta
‫e, a partir daí, podemos usar o método send e
‫especificar algo que desejamos enviar de volta.
‫Olá do lado do servidor.
‫Mais uma vez, apenas uma corda que queremos enviar de volta.
‫Também podemos especificar o código de status e
‫isso é muito fácil.
‫Tudo o que precisamos fazer é, antes de realmente enviar
‫a string para o
‫cliente, apenas adicionar o status antes disso.
‫O método de status e, aqui,
‫especificamos nosso código.
‫E novamente, vamos usar 200 para ok.
‫Na verdade, isso é tudo o que precisamos fazer.
‫Vamos testar isso rapidamente e
‫adicionar mais algumas coisas a ele.
‫Vamos usar o aplicativo nodemon. js.
‫Vamos ver o que
‫acontece e nosso aplicativo está rodando na porta 3000.
‫Excelente.
‫E como testamos agora essa API?
‫Bem, é por isso que instalamos o Postman.
‫Vamos abrir o Postman.
‫Na verdade, ainda está aqui desde a última aula.
‫Vamos excluir isso e
‫escrever a URL ou, na verdade, o IP
‫do host local e, em seguida, nossa porta.
‫Isso é exatamente o mesmo que
‫fizemos no projeto nodefarm.
‫Estamos atingindo apenas a raiz.
‫Podemos escrever a barra ou funciona
‫da mesma forma, sem nada.
‫Vamos enviar isso e, claro, vamos lá.
‫Olá do lado do servidor.
‫Isso é incrível, já funciona.
‫Apenas para ter certeza, é
‫claro que obteríamos exatamente o mesmo resultado em um navegador.
‫Se eu copiar isso aqui, você verá o mesmo resultado.
‫Mas, novamente, vamos usar o
‫Postman porque torna todos os testes de API muito mais fáceis para nós.
‫Você verá, quando realmente começarmos a
‫usar mais e mais recursos deste ótimo aplicativo.
‫Agora, voltando aqui, vamos adicionar mais algumas coisas
‫porque send simplesmente envia essa string aqui de
‫volta para o cliente, mas também é muito
‫fácil enviar json para o cliente.
‫Em vez de enviar, vamos usar json.
‫O método json, e aqui,
‫podemos colar um objeto.
‫Vamos fazer assim.
‫Digamos que esta seja a mensagem.
‫E então apenas algum outro campo aqui, natours.
‫Ok, e agora você vê, aquela
‫prévia aqui formatou isso automaticamente para nós e
‫eles também querem isso em outra linha.
‫Ok, está faltando uma vírgula aqui, é claro.
‫Mas a extensão de visualização ainda o
‫coloca aqui por algum motivo.
‫Mas é claro, isso realmente não importa.
‫É só uma questão de formatação.
‫Vamos dar uma olhada no que acontece agora.
‫Agora temos nosso json bem formatado aqui.
‫Dá-nos todas essas cores diferentes aqui
‫para as chaves e para os valores.
‫Aqui temos os códigos de status.
‫Aqui temos o tempo que levou para fazer essa solicitação.
‫Também temos o tamanho da resposta.
‫Poderíamos, por exemplo, alterar o código aqui com muita facilidade.
‫404 não foi encontrado, lembre-se.
‫Faça novamente, e aqui você verá, 404, não encontrado.
‫Esse é o tipo
‫de coisa para a qual Postman é realmente ótimo.
‫Vamos aumentar o tamanho de tudo isso.
‫Vamos agora continuar, basta adicionar algo mais aqui.
‫Algo muito fácil.
‫Lembre-se, tudo isso é apenas para testar,
‫para molhar os pés e começar a
‫adquirir um pouco de experiência.
‫Lembre-se de que este é o método http para a solicitação.
‫Esta resposta que estamos enviando aqui, então
‫esta aqui, só é
‫enviada quando este método get é enviado ao nosso servidor nesta URL.
‫Deixe-me realmente mostrar para você.
‫Se fizermos, por exemplo, um post.
‫Isso é muito fácil novamente com Postman.
‫Se fizermos uma postagem, não receberemos nada.
‫Em vez disso, o que o Express envia de volta
‫automaticamente é este html aqui que diz não é possível postar e, em
‫seguida, com um 404, não encontrado.
‫Isso porque não temos nenhuma
‫rota definida para este URL e para este método http.
‫Vamos agora fazer isso muito rapidamente.
‫Então poste, queremos a mesma URL, a solicitação e
‫o objeto de resposta.
‫Vamos simplesmente dizer res. enviar, você
‫pode postar neste ponto de extremidade.
‫Para que você possa
‫ver que é assim que enviamos
‫diferentes respostas para diferentes métodos http na solicitação.
‫Vamos executá-lo novamente e, de fato, você
‫pode postar neste endpoint com um código de status 200.
‫Este é realmente o
‫padrão quando não especificamos nenhum em nossos códigos.
‫Aqui temos 404 que não está correto.
‫Mas, novamente, 200 é realmente o padrão.
‫Outra coisa rápida que
‫quero mostrar a você é que usando este método
‫json aqui, por exemplo, isso definirá automaticamente
‫nosso tipo de conteúdo para o aplicativo
‫json, então lembre-se de que fizemos isso manualmente
‫no aplicativo nodefarm quando criamos nossa API muito simples.
‫Naquela época, também enviamos de volta alguns json,
‫mas tivemos que definir manualmente se o
‫conteúdo era json para que o navegador soubesse o
‫que estava esperando.
‫Mas o Express tira esse trabalho de nós.
‫Vamos realmente verificar isso.
‫Voltando para pegar.
‫Aqui temos nossos cabeçalhos de resultados.
‫Aqui você vê que o
‫tipo de conteúdo está realmente definido para o aplicativo json.
‫O Express então também envia automaticamente
‫um monte de outros
‫cabeçalhos, por exemplo, este fornecido pelo Express ou a data ou a conexão.
‫Mas, novamente, cuidaremos mais
‫dos cabeçalhos um pouco mais adiante no curso.
‫Este foi apenas um exemplo muito pequeno e simples aqui,
‫mas você já pode começar
‫a perceber como é muito mais fácil fazer esse tipo de resposta.
‫Para criar esta rota para atender a solicitação do cliente, de uma forma muito mais
‫fácil do que em um nó simples. js.
‫Com isso dito, no
‫próximo vídeo, vamos aprender tudo sobre como construir
‫APIs usando a arquitetura restante, para que depois disso
‫possamos finalmente começar a construir nossa API.