Módulo gratuito 1h 30min

F01 — O mapa: cada peça da stack como um posto do restaurante

Entenda o que são servidor, HTTP, API, JSON, banco de dados, framework e ORM percorrendo a viagem de um pedido — e descubra onde a analogia do restaurante quebra.

Em uma frase: Um sistema como o MySuperStore é um restaurante: cada tecnologia é um posto de trabalho com uma função clara.
Pergunta guia: Quando alguém toca em 'Comprar', quais peças de software acordam e por que cada uma precisa existir?

Vídeo da lição F01 · NotebookLM

Material multimídia da lição

O caminho de um clique até o banco de dados

Resumo visual do trajeto de um pedido: do navegador ao Caddy, urls.py, serializer, view, ORM e PostgreSQL.

Vídeo MP4
Passo 1 · Antes de ler: preveja

Tente responder antes de abrir o gabarito

Errar uma previsão mostra exatamente onde está a lacuna. Chute mentalmente ou no papel antes de revelar a resposta do professor.

1. Uma cliente toca em 'Comprar'. O pedido passa por quantos computadores diferentes até ser gravado de forma definitiva?

2. Onde fica gravado o fato 'esta bolsa foi vendida': no celular dela, na tela do site ou em outro lugar?

3. Se o servidor cair no meio do caminho, o pedido existe ou não?

Modelo mental único · O restaurante

Clique em cada posto para ver a tecnologia real

Front-end (Next.js + React)Next.js + React hospedado na Vercel

O salão e o cardápio

O cliente precisa de uma tela clara e rápida para navegar e pedir.

1. A viagem de um pedido (do toque ao banco)

Quando a cliente toca em Comprar, a tela (Front-end) monta uma comanda em formato JSON e envia pela rede via HTTPS. O porteiro (Caddy) confere o certificado e entrega ao Django.

Lá dentro, o garçom (urls.py) direciona para o cozinheiro (View), o conferente (Serializer) valida os dados, o cozinheiro consulta a despensa (PostgreSQL) via tradutor (ORM) e grava o pedido. Só então volta a resposta '201 Criado' em JSON.

Fluxo completo da requisição

Celular (Next.js) --[HTTPS + JSON]--> Caddy (porteiro)
  --> urls.py (garçom) --> serializer (conferente) --> view (cozinheiro)
  --> ORM (tradutor) --> PostgreSQL (despensa)
  <-- Resposta JSON "201 Criado" <--

2. Onde a analogia do restaurante quebra (muito importante!)

Toda analogia ajuda a lembrar, mas ela não é a coisa real. Na internet, três fenômenos acontecem que não existem num restaurante comum:

1) Mil clientes na mesma última unidade: um restaurante atende uma mesa por vez; na web, duas pessoas clicam em 'Comprar' no mesmo milissegundo. Sem trava no banco, você vende a mesma peça duas vezes.

2) O entregador que toca a campainha duas vezes: o provedor de pagamento pode enviar o mesmo webhook repetido se a rede oscilar. Sem idempotência, você confirma e repassa duas vezes.

3) O cliente pode falsificar a comanda: no navegador, qualquer pessoa pode abrir o DevTools e tentar enviar preço R$ 0,01. O servidor precisa recalcular tudo.

Quebre de propósito

Remover a validação no servidor e confiar só no navegador

Experimento: Imagine um checkout onde o navegador envia { produto_id: 1, preco_total: '0.01' } e a View grava direto sem consultar o preço no banco.

O que falha: Qualquer usuário técnico altera o JSON no navegador antes do envio e compra um produto de R$ 200,00 por R$ 0,01.

Por que a regra existe: Quem mostra (front-end) nunca decide valor nem estoque. Quem decide e recalcula é sempre o back-end consultando o banco.

Armadilhas comuns (errado × certo)

ErradoCertoPor quê
Achar que o navegador guarda o estoque oficialO banco de dados (PostgreSQL) é a única fonte da verdadeDados no navegador podem ser alterados pelo usuário e somem se trocar de aparelho.
Confundir Framework (Django) com BibliotecaBiblioteca você chama (ex.: math); Framework chama o seu código na hora certaNo Django, você escreve views e models e o framework orquestra o ciclo HTTP.
Mão na massa

Exercício com pista e gabarito

Mapeie no papel: se um cliente reclamar 'paguei o PIX e a tela não atualizou sozinha', quais dois postos do restaurante estão envolvidos?

Ver pista

Pense em quem avisa o servidor que o dinheiro caiu e quem mantém o canal aberto com a tela.

Ver gabarito

O Webhook (entregador do provedor de pagamento tocando a campainha do servidor) e o WebSocket (interfone entre a cozinha e a mesa para atualizar a tela na hora).

Quiz da lição

Quiz com explicação de cada erro

Na analogia do restaurante, qual peça valida o JSON que entra e formata o JSON que sai?
Por que a analogia do restaurante quebra quando falamos de concorrência na internet?
Revisão espaçada · 1, 3 e 7 dias

Fichas de revisão (clique para virar)

Se você só lembrar de 3 coisas desta lição:
  • Quem mostra (front-end) não decide; quem decide e grava é o back-end no banco de dados.
  • Cada tecnologia resolve um problema específico — não decore nomes, entenda o posto de trabalho.
  • Na web, requisições chegam em paralelo e falham no meio: por isso existem travas, transações e idempotência.
Apoio rápido · 44 termos

Glossário de Fundamentos (A–Z)