capitulo_17_rotas

Capítulo 17: Rotas e Parâmetros no Express 🦔💨

Neste capítulo, vamos aprender a criar múltiplas rotas e a receber parâmetros dinâmicos pela URL usando o Express, com o tema Sonic!

---

📖 O que são Rotas e Parâmetros?

Rotas são os caminhos que o usuário pode acessar no nosso servidor (ex: /sonic, /tails). Parâmetros de rota são partes variáveis da URL que usamos para identificar um recurso (ex: /personagem/sonic ou /personagem/tails).

---

📖 Exemplo Guiado: Velocidade dos Personagens

Vamos criar um servidor que retorna a velocidade de um personagem baseado no nome passado na URL.

1. Crie o arquivo velocidade_sonic.js na pasta src/:

const express = require('express');
const app = express();
 
// Rota com parâmetro dinâmico (:nome)
app.get('/velocidade/:nome', (req, res) => {
    // Pegando o parâmetro da URL
    const nomePersonagem = req.params.nome;
    
    let velocidade = 0;
    
    if (nomePersonagem.toLowerCase() === "sonic") {
        velocidade = 1000;
    } else if (nomePersonagem.toLowerCase() === "tails") {
        velocidade = 500;
    } else {
        velocidade = 100;
    }
    
    res.send(`A velocidade de ${nomePersonagem} e: ${velocidade} km/h`);
});
 
app.listen(3000, () => {
    console.log("Servidor do Sonic rodando em http://localhost:3000");
});

🕹️ Como Executar e Testar no VS Code

1. Abra o terminal integrado e execute: node velocidade_sonic.js
2. Acesse no navegador: http://localhost:3000/velocidade/sonic
3. Tente também: http://localhost:3000/velocidade/tails

Resultado Esperado: “A velocidade de sonic e: 1000 km/h”

---

📊 Ilustração Visual: Parâmetros de Rota

Veja como a URL é mapeada:

graph LR
    A["URL: /velocidade/sonic"] --> B["req.params.nome = 'sonic'"]

---

🛠️ Prática Obrigatória 1: Rota de Fases

Crie uma rota /fase/:numero que responda qual é a fase correspondente (ex: se o número for 1, responde “Green Hill Zone”. Se for 2, responde “Chemical Plant Zone”).

---

🔑 Gabarito de Código

Prática 1: fases_sonic.js

const express = require('express');
const app = express();
 
app.get('/fase/:numero', (req, res) => {
    const numero = req.params.numero;
    
    if (numero === "1") {
        res.send("Fase 1: Green Hill Zone");
    } else if (numero === "2") {
        res.send("Fase 2: Chemical Plant Zone");
    } else {
        res.send("Fase desconhecida!");
    }
});
 
app.listen(3000, () => {
    console.log("Servidor rodando!");
});

---

📤 Instruções de Entrega (GitHub Desktop + Microsoft Teams)

(Siga o padrão estabelecido no Guia)

---

← Capitulo Anterior | Proximo Capitulo →