Modulo 6 / Back-End com Node.js

Express.js

Rotas, middleware e arquitetura MVC.

school Aula 27 schedule 2 horas

Framework

O que é o Express.js?

dns Framework minimalista

▸ Framework web mais popular do Node.js
▸ Simplifica a criação de servidores e APIs
▸ Minimalista: você escolhe o que adicionar
▸ Enorme ecossistema de middleware
▸ Base para frameworks como NestJS

rocket_launch Setup rápido

# Criar projeto
$ mkdir minha-api
$ cd minha-api
$ npm init -y

# Instalar Express
$ npm install express

# Instalar devDependencies
$ npm install nodemon --save-dev

Hello World

Servidor básico

code index.js

const express = require('express');
const app = express();
const PORT = 3000;

// Rota GET na raiz
app.get('/', (req, res) => {
  res.send('Olá, Express!');
});

// Iniciar servidor
app.listen(PORT, () => {
  console.log(
    `Servidor em http://localhost:${PORT}`
  );
});

compare_arrows HTTP puro vs Express

// Sem Express (muitas linhas)
const http = require('http');
const server = http.createServer(
  (req, res) => {
    if (req.url === '/') {
      res.writeHead(200);
      res.end('Olá!');
    } else {
      res.writeHead(404);
      res.end('Not found');
    }
  }
);
server.listen(3000);

Express abstrai toda essa complexidade, deixando o código mais limpo e organizado.

Routing

Sistema de rotas

route Métodos HTTP

// GET — buscar dados
app.get('/usuarios', (req, res) => {
  res.json([{ nome: "Ana" }]);
});

// POST — criar dados
app.post('/usuarios', (req, res) => {
  res.status(201).json(req.body);
});

// PUT — atualizar dados
app.put('/usuarios/:id', (req, res) => {
  res.json({ atualizado: req.params.id });
});

// DELETE — remover dados
app.delete('/usuarios/:id', (req, res) => {
  res.json({ removido: req.params.id });
});

data_object Parâmetros de rota

// Route params (:id)
app.get('/usuarios/:id', (req, res) => {
  const id = req.params.id;
  res.send(`Usuário ${id}`);
});

// Query params (?nome=Ana)
app.get('/buscar', (req, res) => {
  const nome = req.query.nome;
  res.send(`Buscando: ${nome}`);
});

GET /usuarios/42 → params.id = 42

GET /buscar?nome=Ana → query.nome = Ana

Conceito-chave

O que é middleware?

filter_alt Fluxo da requisição

Requisição → Middleware 1 → Middleware 2 → Rota → Resposta

▸ Funções que interceptam a requisição
▸ Executam antes da rota final
▸ Podem modificar req/res ou encerrar
▸ Chamam next() para continuar

code Criando middleware

// Middleware de log
function logger(req, res, next) {
  console.log(
    `${req.method} ${req.url}`
  );
  next(); // continua para o próximo
}

// Aplicar em todas as rotas
app.use(logger);

// Middleware built-in
app.use(express.json());
app.use(express.static('public'));

Essenciais

Middleware comuns

data_object express.json()

Interpreta o body da requisição como JSON. Essencial para receber dados via POST/PUT.

app.use(express.json());

// Agora req.body funciona!
app.post('/api', (req, res) => {
  console.log(req.body);
});

folder express.static()

Serve arquivos estáticos (HTML, CSS, JS, imagens) de uma pasta.

app.use(
  express.static('public')
);

// public/style.css → /style.css
// public/logo.png → /logo.png

shield cors

Permite requisições de outros domínios (necessário para APIs).

$ npm install cors

const cors = require('cors');
app.use(cors());

API

API REST completa

const express = require('express');
const app = express();
app.use(express.json());

let tarefas = [
  { id: 1, titulo: "Estudar Express", feita: false },
  { id: 2, titulo: "Criar API", feita: false }
];

app.get('/tarefas', (req, res) => res.json(tarefas));

app.post('/tarefas', (req, res) => {
  const nova = { id: tarefas.length + 1, ...req.body, feita: false };
  tarefas.push(nova);
  res.status(201).json(nova);
});

app.put('/tarefas/:id', (req, res) => {
  const tarefa = tarefas.find(t => t.id == req.params.id);
  if (!tarefa) return res.status(404).json({ erro: "Nao encontrada" });
  Object.assign(tarefa, req.body);
  res.json(tarefa);
});

app.delete('/tarefas/:id', (req, res) => {
  tarefas = tarefas.filter(t => t.id != req.params.id);
  res.json({ mensagem: "Removida" });
});

app.listen(3000);

Testando

Testando sua API

bolt

Thunder Client

Extensão do VS Code. Interface visual para testar APIs sem sair do editor.

send

Postman / Insomnia

Apps dedicados para testar APIs. Interface completa com collections e ambientes.

terminal

curl (terminal)

# GET
$ curl http://localhost:3000/tarefas

# POST
$ curl -X POST \
  -H "Content-Type: application/json" \
  -d '{"titulo":"Nova"}' \
  http://localhost:3000/tarefas

Padrão

Arquitetura MVC

database Model

Responsável pelos dados e regras de negócio. Representa as entidades da aplicação.

models/tarefa.js

preview View

Responsável pela apresentação. Em APIs, é o JSON retornado. Em apps web, são as páginas HTML.

views/ ou JSON response

settings Controller

Recebe a requisição, processa usando o Model e retorna a View. Orquestra a lógica.

controllers/tarefaController.js

Cliente → Rota → Controller → Model → Resposta

Organização

Estrutura de pastas

minha-api/

├── controllers/

└── tarefaController.js

├── models/

└── tarefa.js

├── routes/

└── tarefaRoutes.js

├── middleware/

└── logger.js

├── public/

└── (arquivos estáticos)

├── index.js

├── package.json

└── .gitignore

route routes/tarefaRoutes.js

const express = require('express');
const router = express.Router();
const ctrl = require(
  '../controllers/tarefaController'
);

router.get('/', ctrl.listar);
router.post('/', ctrl.criar);
router.put('/:id', ctrl.atualizar);
router.delete('/:id', ctrl.remover);

module.exports = router;

// No index.js:
app.use('/tarefas', require(
  './routes/tarefaRoutes'
));

Hora de praticar

Exercício prático

api API de Tarefas (To-Do)

Crie um projeto Node.js e instale o Express
Implemente as 4 rotas CRUD para tarefas (GET, POST, PUT, DELETE)
Adicione um middleware de log customizado
Use express.json() para parsear o body
Teste com Thunder Client ou curl
Organize em pastas MVC (routes, controllers, models)

lightbulb Desafio extra: adicione validação no middleware (título obrigatório) e tratamento de erros global.

Próxima aula

Aula 28

APIs RESTful e integração com banco de dados.

task_alt O que aprendemos hoje

check_circle O que é Express.js e setup do projeto
check_circle Rotas HTTP (GET, POST, PUT, DELETE) e parâmetros
check_circle Middleware: conceito, criação e built-in
check_circle API REST completa (CRUD de tarefas)
check_circle Arquitetura MVC e organização de pastas

Próxima aula

auto_stories Referência: Express.js Docs