⚠️ ImportanteA API utilizada neste projeto foi descontinuada, portanto a aplicação pode não funcionar corretamente no momento.
O GIF demonstrativo incluído no repositório foi registrado antes da desativação e representa o funcionamento completo da aplicação.
Apesar disso, o projeto permanece relevante como demonstração prática das minhas habilidades em desenvolvimento front-end, incluindo consumo de APIs, gerenciamento de estado, tratamento de dados assíncronos, componentização e boas práticas com React e TypeScript.
💡 Caso necessário, a aplicação pode ser facilmente adaptada para utilizar uma nova API futuramente.
- Descrição
- Funcionalidades
- Tecnologias utilizadas
- Inicie localmente o Projeto
- Gif demostrativo
- Como contribuir
O projeto consiste em uma página que exibe citações das personagens do famoso desenho norte-americano "Os Simpsons".
Foi desenvolvido com o objetivo de aprimorar o conhecimento nas tecnologias: React, TypeScript e Styled Components, além de aperfeiçoar as habilidades de integração com a API "The Simpsons Quotes" por meio do uso do Axios para realizar requests HTTP.
- Screen loading inicial;
- Temas light e dark (salvo em LocalStorage);
- Salvar citações (as citações salvas, ficam guardadas no LocalStorage do browser);
- Scroll Infinito para o carregamento de mais quotes;
- Animações;
- Controle de som (play, pause, vol+, vol-, minimizar player)
- Buscar personagens por nome;
- SEO - (Search Engine Optimization (otimização para mecanismos de busca));
- Responsividade a diversos tamanhos de tela (desktops, tablets e smartphones);
| Tecnologias | Ícones |
|---|---|
| React |  |
| React Router Dom v.6 |  |
| React Icons |  |
| Styled Components |  |
| TypeScript |  |
| Axios |  |
| Radix UI |  |
| Vite |  |
Primeiro certifique-se de ter o Node instalado em sua máquina.
clone o projeto através do comando:
git clone https://github.com/Soaressluiss/the-simpsons-quotes.git
Vá para o diretório da pasta:
cd the-simpsons-quotes
Instale todas as dependências:
npm install
Inicie o projeto com o comando:
npm run dev
-
Faça um Fork desse repositório.
-
Crie uma branch com a sua feature:
git checkout -b my-feature -
Commit suas mudanças:
git commit -m 'feat: My new feature' -
Push a sua branch:
git push origin my-feature
Esse projeto está sob a licença MIT. Veja o arquivo License para mais detalhes.
