https://github.com/gusdepaula/deezer
Este é um projeto de exemplo que consome a API do Deezer para exibir músicas e álbuns, com foco em responsividade, estrutura de código limpa, e uma interface moderna. O projeto foi implementado usando as tecnologias mais recentes para garantir qualidade e performance.
https://github.com/gusdepaula/deezer
axios chakra-ui dark-theme deezer-api light-theme react responsive-layout testes-unitarios typescript vercel vite vitest
Last synced: 14 days ago
JSON representation
Este é um projeto de exemplo que consome a API do Deezer para exibir músicas e álbuns, com foco em responsividade, estrutura de código limpa, e uma interface moderna. O projeto foi implementado usando as tecnologias mais recentes para garantir qualidade e performance.
- Host: GitHub
- URL: https://github.com/gusdepaula/deezer
- Owner: gusdepaula
- Created: 2025-01-22T09:06:52.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-01-29T19:47:15.000Z (12 months ago)
- Last Synced: 2025-01-29T20:20:59.423Z (12 months ago)
- Topics: axios, chakra-ui, dark-theme, deezer-api, light-theme, react, responsive-layout, testes-unitarios, typescript, vercel, vite, vitest
- Language: TypeScript
- Homepage: https://deezer-pi.vercel.app
- Size: 341 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Deezer Project
Este é um projeto de exemplo que consome a API do Deezer para exibir músicas e álbuns, com foco em responsividade, estrutura de código limpa, e uma interface moderna. O projeto foi implementado usando as tecnologias mais recentes para garantir qualidade e performance.
## ✅ Tecnologias Utilizadas
- **ReactJs (Vite)**: Para a criação de interfaces modernas e responsivas.
- **Chakra UI**: Para estilizações dinâmicas e componentes acessíveis.
- **Axios**: Para requisições HTTP à API do Deezer.
- **Responsividade**: Layout adaptável para diferentes dispositivos.
- **Testes Unitários (Vitest)**: Para garantir a confiabilidade e a manutenção do código.
- **Documentação Clara**: Para facilitar a compreensão e utilização do projeto.
- **Estrutura Limpa**: Organização que segue boas práticas de desenvolvimento.
- **Vercel**: Hospedagem da aplicação.
- **API do Deezer**: Consumo dos dados de álbuns, artistas e faixas.
## 🏡 Endereços
- **Aplicação Online**: [https://deezer-pi.vercel.app/](https://deezer-pi.vercel.app/)
- **Repositório GitHub**: [https://github.com/gusdepaula/deezer](https://github.com/gusdepaula/deezer)
## ⚙️ Como Baixar e Rodar o Projeto Localmente
1. Clone o repositório:
```bash
git clone https://github.com/gusdepaula/deezer.git
```
2. Acesse o diretório do projeto:
```bash
cd deezer
```
3. Instale as dependências:
```bash
npm install
```
4. Inicie o servidor de desenvolvimento:
```bash
npm run dev
```
5. Abra o navegador e acesse:
```
http://localhost:5173
```
## 🔧 Como Executar os Testes Unitários
1. Certifique-se de que as dependências foram instaladas:
```bash
npm install
```
2. Execute os testes:
```bash
npm run test
```
3. Para executar os testes em modo "watch" (observando as alterações nos arquivos):
```bash
npm run test:watch
```
## 📊 Funcionalidades Principais
- Exibição de músicas, álbuns e artistas.
- Busca dinâmica por músicas e artistas.
- Botões interativos com ícones de favoritos.
- Layout responsivo para dispositivos móveis, tablets e desktops.
- Dark/light mode do Chakra UI
## ✨ Contribuições
Contribuições são bem-vindas! Sinta-se à vontade para abrir issues ou pull requests no repositório GitHub.
---
Desenvolvido com ❤️ por Gustavo.