Este projeto buscou criar uma forma fácil de mostrar os filmes indicados e vencedores do Oscar de cada ano.

Além de uma visão geral de todos os filmes indicados naquele determinado ano e da página dedicada para cada categoria de premiação, é possível acessar as informações de cada filme, com o elenco principal, informações de diretos e roteristas, e uma lista de serviços de streaming em que o filme está disponível no Brasil.

O projeto utiliza um backend criado pelo Nuxt para consumir a API do TMDb. Os dados coletados são salvos em um banco de dados SQLite, que é consultado utilizando o Drizzle. O site possui design responsível, que se adapta a telas de diferentes tamanhos, utilizando HTML e CSS moderno, e Vue como framework.

O site está hospeadado em uma máquina virtual, rodando um container Docker. Todo o processo de deploy é automatizado utilizando Github Actions.

O objetivo deste projeto foi criar e implementar um design elegante e moderno para o site de uma empresa fictícia de arquitetura, que transmitisse uma imagem profissional e sofisticada.

Um dos principais destaques do site é a navegação por meio de um mural, que se transforma em um cabeçalho para cada página. O mural é um grid de CSS que utiliza informações de navegação para modificar o tamanho de cada linha e coluna, deixando somente a imagem desejada em destaque quando um dos links é acessado.

Para a realização deste projeto, foram utilizados VueJS e Typescript. Com a utilização da framework Nuxt, foi possível implementar a transição entre páginas de forma eficiente. Além disso, o uso do pré-processador SASS permitiu a criação de CSS modular, escalável e com alta facilidade de manutenção.

O site está hospedado na plataforma Netlify, que também fornece mecanismos de CI/CD, permitindo integração contínua e entrega automatizada.

É comum esquecer completamente quais livros você já leu quando alguém pede uma sugestão de leitura. Para resolver esse problema, comecei um projeto de um website com os livros que recomendo, já li ou estou lendo. Para hospedar as informações de cada livro, como título, nome dos autores, editora, ano de lançamento e imagem da capa, utilizei o Contentful, um sistema de gerenciamento de conteúdo (CMS).

Para manter o site sempre atualizado, utilizei o Next.js 13, um framework de React. Com a estratégia de Server Side Rendering, o site é construído no servidor a cada visita, resultando em um site sempre atualizado.

Como o site lida com informações externas, utilizei o Zod para validar os resultados de chamadas da API e o TypeScript para garantir que o modelo de conteúdo estivesse de acordo com o código. Isso me permitiu ter confiança quando precisei modificar o modelo de conteúdo ou refatorar meu código.

O resultado é um site rápido, sempre atualizado e fácil de ser mantido. Para adicionar um novo livro, basta utilizar o CMS, sem precisar editar o código ou construir o site localmente. Com essa abordagem, o projeto se torna robusto e confiável para futuras atualizações.

Este projeto é um aplicativo web que permite verificar o nível de contraste entre diferentes cores ao mesmo tempo, ajudando a determinar se uma combinação de cores possui o contraste necessário para atender aos padrões de acessibilidade da WCAG (Web Content Accessibility Guidelines).

É possível adicionar, modificar e remover cores utilizando um seletor de cores ou modificando a representação da cor em RGB. Mesmo após fechar ou reiniciar o aplicativo web, as cores escolhidas são salvas.

Uma tabela de resultados exibe os valores de contraste entre a cor de primeiro plano e segundo plano, e se eles atendem aos limites de contraste exigidos pela WCAG. O valor do contraste é exibido em uma caixa que utiliza as cores selecionadas.