OhMyDB - Catálogo de filmes consumindo a OMDb API

As vezes um teste para uma empresa pode ser uma ótima oportunidade de aprender

OhMyDB é um app catálogo de filmes e séries que consome a OMDb API - The Open Movie Database. Você pode consultar a sinopse do filme, ver detalhes e salva-lo na sua lista de favoritos. O nome OhMyDB é apenas uma brincadeira com o nome da API - O M db.


Aplicação: ohmydb.netlify.app
Repositório: github.com/brenonovelli/OhMyDb


Não sou muito fã de testes para empresas. Porém em certos casos eles podem ser válidos e eu topo.

Semana passada recebi um desafio para fazer um catálogo de filmes consumindo a OMDb API. Recebi algumas telas como base.

Do que seria uma simples aplicação consumindo uma API e exibindo o resultado na tela, saiu uma aplicação React um pouco mais recheada usando:

  • Usando, claro, meu queridinho Styled Components. 💅
  • Context do React para envolver a aplicação Primeiro comecei usando o Redux mas logo vi que o famoso matar formiga com bazuca estava em prática.
  • Testes unitários com Jest / @testing-library/react
  • Testes end-to-end com Cypress
  • Função de favoritar filmes persistindo no local storage com um hook dedicado só pra ela.
  • Responsivo praticamente sem media-queries. As media-queries foram usadas apenas para melhorar a experiência do usuário.

Próximo passo agora é passar tudo para Typescript que venho estudando.

Telas da aplicações

Home Tela de pesquisa Tela de pesquisa - Detalhe do hover Tela de pesquisa - Mobile Filme Filme favoritado Filme favoritado detalhe para remover Filme mobile Favoritos