Recapitulação e Prática

Principais aprendizados

• Todo app tem quatro partes: um frontend (o que os usuários veem), um backend (as regras e a lógica), um banco de dados (onde os dados persistem) e uma hospedagem (onde tudo isso roda). O frontend nunca toca o banco de dados diretamente — ele passa pelo backend.
• No navegador, HTML é estrutura, CSS é estilo, e JavaScript é comportamento; o código muda a página ao mudar o DOM.
• Você não escreve tudo sozinho — pacotes (gerenciados pelo npm via package.json e um lockfile) fornecem problemas já resolvidos como dependências.
• Variáveis de ambiente mantêm segredos fora do código e permitem que o mesmo código se comporte corretamente em dev e prod.
• Uma requisição flui frontend → hospedagem → backend → banco de dados e de volta; nomear a camada onde um problema mora é metade do caminho para resolvê-lo.

Coloque em prática

Escolha um app que você usa todo dia e narre em voz alta uma ação através das camadas: "Eu toco em enviar (frontend) → isso vai para o servidor deles (backend) → que verifica se eu tenho permissão e salva a mensagem (banco de dados) → e o chat é atualizado (frontend)." Depois, tente adivinhar em qual camada mora cada problema: o botão parece desalinhado; o app diz "você não está logado"; uma mensagem de ontem sumiu. Ficar bom nessa nomeação é a habilidade sobre a qual o resto do livro é construído.

Prompt do capítulo

I'm learning how apps fit together. Here is a feature I want:
<one sentence describing what the user should be able to do>

Before writing any code, break it down by layer for me:
- Frontend: what the user sees and what gets sent
- Backend: what rules/checks must run, and where
- Database: what data needs to be stored or read
- Any env vars or config (especially secrets) involved

Then describe the request flow from click to result in numbered steps.
Keep it in plain language — I want to understand the shape before the code.