backend javascript express
JavaScript

Express.js para Iniciantes: Crie seu Primeiro Backend com JavaScript e Node.js

Aprender JavaScript no navegador é apenas o primeiro passo da jornada de um desenvolvedor.

Depois de dominar variáveis, funções, objetos, arrays e manipulação do DOM, surge uma nova pergunta:

Como os sites realmente funcionam por trás das telas?

Quando você faz login em uma aplicação, pesquisa um produto em uma loja virtual ou consulta seus dados em um sistema, existe um servidor processando essas informações e respondendo às solicitações do navegador.

É exatamente esse mundo que você começará a conhecer neste projeto.

Nesta aula construiremos o primeiro Backend com JavaScript, utilizando Node.js e Express.js, entendendo como funciona a comunicação entre cliente e servidor através de rotas, requisições e respostas HTTP.

Ao final, você terá criado uma pequena API funcionando e compreenderá os conceitos fundamentais que servirão de base para projetos muito maiores.


O que é Backend?

O Backend é a parte da aplicação responsável por processar informações, executar regras de negócio, acessar bancos de dados e responder às requisições feitas pelos usuários.

Sempre que uma pessoa acessa um site acontece algo parecido com isto:

Cliente
    │
    ▼
Requisição HTTP
    │
    ▼
Servidor (Backend)
    │
    ▼
Processamento
    │
    ▼
Resposta HTTP
    │
    ▼
Cliente

Enquanto o Front-end cuida da interface que o usuário vê, o Backend é responsável por tudo o que acontece “nos bastidores”.

É ele quem:

  • valida logins;
  • consulta bancos de dados;
  • salva informações;
  • calcula resultados;
  • cria APIs;
  • envia respostas ao navegador.

JavaScript também pode ser utilizado no servidor

Durante muitos anos, JavaScript era utilizado apenas dentro do navegador.

Com o surgimento do Node.js, passou a ser possível executar JavaScript diretamente no servidor.

Isso trouxe uma enorme vantagem para quem deseja trabalhar como desenvolvedor Full Stack.

Hoje é possível utilizar JavaScript em praticamente toda a aplicação.

Exemplo:

Front-end
HTML
CSS
JavaScript
React

↓

Backend
Node.js
Express.js

↓

Banco de Dados
MySQL
PostgreSQL
MongoDB

Aprender Backend com JavaScript significa ampliar bastante as possibilidades de desenvolvimento.


O que é Node.js?

O Node.js é um ambiente de execução que permite rodar JavaScript fora do navegador.

Com ele podemos criar:

  • APIs REST;
  • Servidores Web;
  • Sistemas completos;
  • Aplicações em tempo real;
  • Ferramentas de automação;
  • Scripts;
  • Integrações entre sistemas.

É graças ao Node.js que podemos utilizar JavaScript para desenvolver o lado servidor de uma aplicação.


O que é npm?

O npm (Node Package Manager) é o gerenciador de pacotes do Node.js.

Ele permite instalar bibliotecas prontas desenvolvidas pela comunidade.

Em vez de criar tudo do zero, podemos simplesmente instalar um pacote utilizando:

npm install

ou

npm i

O npm é um dos maiores ecossistemas de software do mundo, contendo milhões de bibliotecas disponíveis gratuitamente.


Criando o primeiro projeto

Antes de instalar qualquer biblioteca, criamos o projeto:

npm init -y

Esse comando gera automaticamente o arquivo:

package.json

Esse arquivo funciona como a identidade do projeto.

Ele informa:

  • nome;
  • versão;
  • dependências;
  • scripts;
  • arquivo principal;
  • diversas configurações.

Sempre que outra pessoa baixar seu projeto, bastará executar:

npm install

e todas as dependências serão instaladas automaticamente.


Instalando o Express.js

Depois do projeto criado, instalamos o Express.

npm install express

ou simplesmente

npm i express

Automaticamente serão criados:

  • package-lock.json
  • node_modules

e o Express será registrado dentro do package.json.


O que é a pasta node_modules?

Essa pasta armazena todas as bibliotecas utilizadas pelo projeto.

Ela pode conter milhares de arquivos.

Por isso, normalmente ela não é enviada para o GitHub.

Quando alguém clona o projeto basta executar:

npm install

que toda a pasta será recriada automaticamente.


O que é Express.js?

Express.js é um framework para Node.js criado para facilitar a construção de aplicações Backend.

Sem Express seria necessário escrever muito mais código.

Com ele podemos criar rapidamente:

  • rotas;
  • APIs;
  • Middlewares;
  • autenticação;
  • servidores;
  • aplicações REST.

Por isso ele é considerado um dos frameworks mais importantes do ecossistema Node.js.


Criando o primeiro servidor

Depois de instalar o Express, criamos nossa aplicação.

Primeiro importamos o framework.

Depois criamos uma instância da aplicação.

Por fim utilizamos o método listen() para deixar o servidor aguardando conexões.

Nesse momento o servidor já está preparado para receber requisições através da porta 3000.


Criando a primeira rota

Uma rota representa um endereço da aplicação.

Por exemplo:

/

ou

/sobre

Cada rota executa uma função diferente.

Na aula criamos diversas rotas utilizando:

  • app.get()

Esse método é responsável por responder às requisições HTTP do tipo GET.


Entendendo req e res

Sempre que uma rota é executada recebemos dois objetos muito importantes.

req

Representa a requisição enviada pelo cliente.

res

Representa a resposta que será enviada pelo servidor.

Esses dois objetos aparecem praticamente em todas as aplicações Express.


Enviando respostas

Existem diversas maneiras de responder uma requisição.

Nesta aula utilizamos duas das principais.

res.send()

Utilizado para enviar textos simples.

res.json()

Utilizado para retornar objetos em formato JSON.

Esse formato é extremamente utilizado por APIs modernas.

Aplicações React, Angular, Vue, Flutter e até aplicativos Android normalmente recebem informações utilizando JSON.


Criando múltiplas rotas

Durante a aula foram criadas diversas rotas para demonstrar diferentes situações.

Entre elas:

  • rota principal;
  • página Sobre;
  • retorno de JSON;
  • rota com parâmetros;
  • consulta utilizando Query String;
  • pequena API de filmes.

Essa evolução permite compreender como uma API começa simples e vai crescendo conforme novas funcionalidades são adicionadas.


Recebendo parâmetros com req.params

Nem todas as rotas possuem sempre o mesmo endereço.

Em muitos casos precisamos receber uma informação diretamente na URL.

Exemplo:

/aluno/Marcos

Nesse caso o valor “Marcos” é recebido através de:

req.params

Esse recurso é muito utilizado em APIs.

Exemplos reais:

/produtos/25

/clientes/8

/usuarios/50

/pedidos/300

Sempre que precisamos identificar um recurso específico normalmente utilizamos parâmetros de rota.


Trabalhando com Query String

Outra forma bastante comum de enviar informações para o servidor é utilizando Query String.

Exemplo:

/produtos?nome=notebook

Nesse caso estamos pesquisando um produto.

A informação é capturada através de:

req.query

Query Strings são muito utilizadas para:

  • filtros;
  • pesquisas;
  • paginação;
  • ordenação;
  • relatórios;
  • buscas por datas.

São recursos presentes praticamente em qualquer sistema profissional.


Criando uma pequena API de filmes

Depois de entender os conceitos básicos, desenvolvemos uma pequena API para consolidar o aprendizado.

A aplicação permite:

  • listar todos os filmes;
  • consultar um filme específico pelo ID;
  • retornar informações em formato JSON.

Embora seja um projeto simples, ele demonstra exatamente como APIs profissionais funcionam.

A única diferença é que, em sistemas reais, essas informações normalmente vêm de um banco de dados.


Código completo disponível no GitHub

Todo o projeto desenvolvido durante a aula está disponível gratuitamente no GitHub.

Lá você encontrará exatamente o código construído durante a live, incluindo:

  • configuração do Node.js;
  • instalação do Express.js;
  • criação do servidor;
  • rotas utilizando app.get();
  • respostas com res.send();
  • retorno de objetos com res.json();
  • exemplos utilizando req.params;
  • exemplos utilizando req.query;
  • mini API de filmes apresentada na aula.

Repositório do projeto:

👉 https://github.com/marcoscaldas/backEndComJavaScriptExpressGet.git

Uma excelente forma de estudar é clonar o repositório, executar o projeto no seu computador e modificar as rotas por conta própria. Experimente criar novas páginas, adicionar filmes e fazer alterações para entender como cada parte da aplicação funciona.


O que você aprendeu nesta aula?

Ao concluir este projeto você terá dado um dos passos mais importantes no desenvolvimento Backend.

Você aprendeu:

  • o que é Node.js;
  • o que é npm;
  • como instalar bibliotecas;
  • para que serve o package.json;
  • para que serve a pasta node_modules;
  • como criar um servidor web;
  • como utilizar o Express.js;
  • como criar rotas;
  • como utilizar app.get();
  • como enviar respostas;
  • como retornar JSON;
  • como trabalhar com req.params;
  • como utilizar req.query;
  • como criar uma API simples.

Esses conceitos serão utilizados constantemente em qualquer projeto desenvolvido com Node.js.


Próximos passos

Esta foi apenas a primeira aula da série de Backend com JavaScript.

Nos próximos projetos avançaremos para recursos ainda mais importantes, como:

  • método POST;
  • express.json();
  • req.body;
  • cadastro de dados;
  • atualização de registros;
  • exclusão de informações;
  • conexão com banco de dados;
  • autenticação;
  • JWT;
  • Sessions;
  • Cookies;
  • APIs completas.

Cada nova aula adicionará um novo bloco de conhecimento até chegarmos à construção de sistemas profissionais.


Assista à aula completa

Se você deseja acompanhar todo o desenvolvimento passo a passo, assista à aula completa no YouTube.

Durante a aula mostramos desde a instalação do Node.js e do Express até a construção da API de filmes, explicando cada conceito de forma prática.

Além disso, toda esta aula faz parte da série:

Backend com JavaScript | Node.js e Express.js do Zero


Conclusão

Entrar no mundo do Backend pode parecer desafiador no início, mas compreender os conceitos fundamentais faz toda a diferença.

Nesta primeira aula você viu que uma API nada mais é do que um programa capaz de receber requisições, processar informações e devolver respostas para quem as solicitou.

Mais importante do que decorar comandos é entender esse fluxo de comunicação entre cliente e servidor.

Depois que essa base estiver sólida, aprender recursos como autenticação, banco de dados, upload de arquivos e integração com outras aplicações se tornará muito mais natural.

Este projeto representa o primeiro passo de uma jornada que permitirá desenvolver APIs completas, sistemas Full Stack e aplicações modernas utilizando JavaScript do Front-end ao Backend.

Leave a Reply

Your email address will not be published. Required fields are marked *