🎯 Objetivo do Capítulo

Até agora você aprendeu a criar rotas com Express e a conectar o Node ao PostgreSQL.

Agora vamos unir as duas coisas em uma aplicação real:

👉 O front-end (HTML + JS) vai chamar as rotas da API usando fetch()

👉 A API vai buscar e salvar dados no PostgreSQL com múltiplas tabelas relacionadas

👉 A tela vai atualizar dinamicamente com os dados recebidos


1️⃣ Preparando o Banco de Dados

Abra o pgAdmin, conecte no servidor e abra o Query Tool.

Crie o banco:

CREATE DATABASE games_db;

Conecte no banco games_db e execute:

-- Tabela de plataformas
CREATE TABLE plataformas (
    id      SERIAL PRIMARY KEY,
    nome    VARCHAR(50) NOT NULL,
    empresa VARCHAR(50)
);

-- Tabela de categorias
CREATE TABLE categorias (
    id   SERIAL PRIMARY KEY,
    nome VARCHAR(50) NOT NULL
);

-- Tabela de jogos (relacionada com plataformas e categorias)
CREATE TABLE jogos (
    id            SERIAL PRIMARY KEY,
    titulo        VARCHAR(150) NOT NULL,
    preco         DECIMAL(10,2) NOT NULL,
    nota          DECIMAL(3,1),
    ano           INTEGER,
    plataforma_id INTEGER REFERENCES plataformas(id),
    categoria_id  INTEGER REFERENCES categorias(id)
);

-- Dados iniciais
INSERT INTO plataformas (nome, empresa) VALUES
    ('PlayStation 5', 'Sony'),
    ('Xbox Series X', 'Microsoft'),
    ('PC',            'Diversos'),
    ('Nintendo Switch','Nintendo');

INSERT INTO categorias (nome) VALUES
    ('RPG'),
    ('Ação'),
    ('Aventura'),
    ('Esportes'),
    ('Estratégia');

INSERT INTO jogos (titulo, preco, nota, ano, plataforma_id, categoria_id) VALUES
    ('Elden Ring',             199.90, 9.5, 2022, 1, 1),
    ('God of War Ragnarök',    249.90, 9.0, 2022, 1, 2),
    ('Halo Infinite',          149.90, 8.0, 2021, 2, 2),
    ('Forza Horizon 5',        199.90, 9.2, 2021, 2, 4),
    ('Cyberpunk 2077',         149.90, 8.5, 2023, 3, 1),
    ('The Witcher 3',           99.90, 9.7, 2015, 3, 1),
    ('Zelda: Tears of Kingdom',299.90, 9.8, 2023, 4, 3),
    ('Mario Kart 8 Deluxe',   249.90, 9.1, 2017, 4, 4);

✅ Execute SELECT * FROM jogos para confirmar os dados.


🧠 Por que três tabelas?

Com uma tabela só, os dados ficariam assim:

titulo        | plataforma    | categoria
Elden Ring    | PlayStation 5 | RPG
God of War    | PlayStation 5 | Ação

Se a Sony mudar o nome do PlayStation, você precisaria atualizar cada linha da tabela de jogos.

Com tabelas relacionadas:

jogos.plataforma_id = 1  →  plataformas.id = 1 → "PlayStation 5"

Você altera uma linha na tabela de plataformas e todos os jogos refletem automaticamente.


2️⃣ Preparando o Projeto

No terminal execute:

mkdir games-fullstack
cd games-fullstack
npm init -y
npm install express pg

No package.json, adicione "type": "module":

{
  "name": "games-fullstack",
  "version": "1.0.0",
  "type": "module"
}