Catálogo de filmes
Catálogo de filmes estilo Netflix em JavaScript puro, com dados do TMDB.
Contexto
Projeto de estudos para exercitar DOM, fetch, carrosséis nativos (scroll-snap) e arquitetura de frontend sem frameworks — replicando a experiência de um catálogo de streaming.
O desafio
Consumir a API do TMDB sem expor a chave no cliente. A solução foi um proxy serverless na Vercel, com a chave protegida em variável de ambiente e cache de edge para reduzir chamadas.
Papel e responsabilidades
- Arquitetura de componentes em vanilla JS (sem frameworks)
- Carrosséis nativos com scroll-snap e navegação por teclado
- Proxy serverless na Vercel com proteção de chave e cache de edge
- Modal de detalhes acessível (foco preso, ESC, aria)
Stack e arquitetura
HTML, CSS e JavaScript puros; Vercel Functions para o proxy; TMDB como fonte de dados.
Destaques
- Zero dependências de frontend
- Chave de API nunca exposta ao cliente
- Deploy contínuo na Vercel a cada push
Aprendizados
Reconstruir na mão o que frameworks resolvem (estado, roteamento, acessibilidade) é o melhor jeito de entender o que eles fazem por você — e quando eles valem a pena.