/YourMusic-Project

Essa aplicação simula um streaming de musica, ela consome da API Itunes Search Api. A aplicação utiliza os seguintes componentes do react-router-dom: BrowserRouter, Switch, Route, Redirect e Link

Primary LanguageJavaScript

YourMusic 🎵

✏ Sobre o projeto

O objetivo do projeto é desenvolver uma aplicação que simula um streaming de musica, como exemplo o Spotify ou Itunes, essa aplicação consome da API Itunes Search Api.

Esse projeto permite reproduzir prévia de músicas das mais variadas bandas e artistas, e criar uma lista de músicas favoritas, sendo possível adicioná-las ou removê-las dos favoritos na página de músicas favoritas. 🎧

É possível para usuário dessa aplicação:

  • Fazer login;
  • Pesquisar por uma banda ou artista;
  • Ver um conjunto de álbuns disponíveis dessa banda ou artista;
  • Visualizar as músicas de um álbum selecionado;
  • Reproduzir uma prévia das músicas deste álbum;
  • Favoritar e desfavoritar músicas;
  • Ver a lista de músicas favoritas;

🔧 Habilidades desenvolvidas:

  • Fazer requisições e consumir dados vindos de uma API;

  • Utilizar os ciclos de vida de um componente React;

  • Utilizar a função setState de forma a garantir que um determinado código só é executado após o estado ser atualizado

  • Utilizar o componente BrowserRouter corretamente;

  • Criar rotas, mapeando o caminho da URL com o componente correspondente, via Route;

  • Utilizar o Switch do React Router

  • Usar o componente Redirect pra redirecionar para uma rota específica;

  • Criar links de navegação na aplicação com o componente Link;

🛸 Principais tecnologias utilizadas:

Como utilizar o projeto na sua máquina

1. Deploy:
https://yourmusicnow.netlify.app/

2. Faça o git clone na sua máquina e entre no diretório:

  • Lembre-se de clonar o repositório no diretório desejado na sua máquina!
 git@github.com:Marcio-Gabriel-Roque-Mendes/YourMusic-Project.git
 cd YourMusic-Project/

Instale as dependências

  • Atente-se para instalar na pasta raiz do projeto
 npm install

Inicie a aplicação

 npm start

Prévia da aplicação rodando:

demonstracao.da.aplicacao.rodando.deploy.version.mp4

Desenvolvido por:

Marcio Gabriel Roque Mendes

Observações:

Este projeto foi desenvolvido inspirado no projeto Trybe Tunes proposto no curso de Desenvolvimento Full Stack da Trybe no qual os alunos deveriam desenvolve-lo para fins didáticos, os arquivos na pasta src/services são de autoria da Trybe