Oito módulos em ordem progressiva — de como a web funciona até componentes em React com TypeScript. Texto, exemplos e código em cada um.
Cada módulo assume apenas o que veio antes. Nada de “você vai ver isso depois” no meio de uma explicação — se aparece, é porque já foi construído.
O que acontece entre digitar uma URL e ver a página carregar. DNS, HTTP, headers, status codes e o pipeline de renderização do navegador.
Estrutura de documentos, elementos semânticos, formulários e acessibilidade. A camada que define o que o conteúdo é — antes de qualquer estilo.
Seletores, especificidade, fluxo, flexbox, grid e design responsivo. Como o navegador decide onde cada pixel aparece na tela.
.hero {
color: blue;
background: white;
}
display: grid
grid-template-columns: 1fr 1fr;
gap: 1rem;
Variáveis, funções, DOM, eventos e async/await. Do console do navegador até requisições HTTP com fetch.
Por que tipos importam. Interfaces, type aliases, genéricos e o modo strict — detectando erros antes mesmo de rodar o código.
JSX, componentes de função, props tipadas, estado com useState e efeitos com useEffect. Construindo uma app pequena do início ao fim.
Por que testes existem, o que realmente vale testar e como escrever testes com Vitest, Testing Library e uma pitada de Playwright.
Um recap do que foi coberto e um panorama do que vem depois: frameworks, full-stack, ferramentas e comunidades para continuar aprendendo.
O primeiro módulo explica o caminho entre digitar uma URL e a página aparecer na tela — é daí que tudo parte.
01 Como a web funciona