Player de músicas, integrado com a API da Napster, onde é possível procurar por artistas, álbuns e músicas, ouvir um preview e salvá-los como favoritos na sua biblioteca.
Favster é um player de músicas acessado via web, integrado com a API da Napster, onde é possível procurar por artistas, álbuns e músicas, ouvir um preview e salvá-los como favoritos em uma biblioteca.
Desenvolvido com NextJS (framework para ReactJS), a aplicação utiliza o recurso de Server Side Rendering do NEXT para buscar na API as principais informações necessárias, disponibilizando para o usuário assim que a página é acessada. No desenvolvimento foi utilizado o TypeScript como linguagem. Para quem não conhece, typescript é um superset do Javascript, onde é possível trabalhar com tipagem estática. Utilizando o typescript é possível descobrir melhor os erros e aumentar a inteligência da IDE durante o desenvolvimento.
Para a estilização foi utilizado o SASS (uma linguagem de extensão do CSS) que permite trabalhar de forma mais produtiva e organizada, como separar os estilos em módulos. Além disso, eu utilizo o Framer Motion, uma biblioteca completa para a criação de animações e efeitos de interação.
A aplicação faz integração com a API da Napster através do cliente HTTP Axios e ainda possui integração com o Firebase para a autenticação e o Real Time Database para a persistência dos dados salvos como favoritos na biblioteca.
Ainda foi gerado o PWA (Progressive Web App) da aplicação, onde é possível acessar o site como um aplicativo nativo.
- Autenticação do usuário para acessar a aplicação.
- Opção de tema dark e light.
- O usuário poderá pesquisar por artistas, álbuns e músicas.
- O usuário poderá acessar a página do artista, mostrando detalhes como imagem, bio e principais álbuns e músicas.
- O usuário poderá acessar a página do álbum, podendo reproduzir uma preview das músicas, ver outros álbuns do mesmo artista e álbuns similares.
- O usuário poderá salvar artistas, álbuns e músicas como favoritos.
- O usuário poderá avaliar os seus favoritos.
- O usuário poderá acessar sua biblioteca com todos seus favoritos ordenado pela nota de avaliação.
# Clone this repository
$ git clone https://github.com/Jefferson00/Favster
# Go into the repository
$ cd Favster
# Install dependencies
$ yarn install
or
$ npm install
# Run
$ yarn dev
or
$ 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
Made with ♥ by Jefferson C Silva 👋 Get in touch!