Skip to content

pesquisa por artistas ou bandas e visualiza prévia das músicas. | aplicação front-end com utilização de React Router + ciclos de vida e da API da iTunes

Notifications You must be signed in to change notification settings

duarte-dot/trybe-tunes

Repository files navigation

Este projeto é uma aplicação web que permite ao usuário pesquisar por artistas ou bandas e visualizar seus álbuns e músicas. O usuário pode reproduzir uma prévia das músicas dos álbuns, favoritar e desfavoritar músicas e visualizar a lista de músicas favoritas. Além disso, o usuário pode visualizar e editar seu perfil.

Funcionalidades

  • Fazer login;
  • Pesquisar por uma banda ou artista;
  • Listar os á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;
  • Ver o perfil da pessoa logada;
  • Editar o perfil da pessoa logada.

Tecnologias utilizadas

  • React
  • React Router
  • CSS
  • API da iTunes

Como rodar o projeto

  1. Clone o repositório: git clone https://github.com/duarte-dot/trybe-tunes.git
  2. Entre na pasta do projeto: cd trybe-tunes
  3. Instale as dependências: npm install
  4. Inicie o servidor: npm start
  5. Acesse a aplicação no seu navegador em: http://localhost:3000

Você também pode acessar através do link de deploy.

Principais aprendizados

  • 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;
  • Criar links de navegação na aplicação com o componente Link.

Conclusão

Este projeto foi uma oportunidade de aplicar os conhecimentos adquiridos durante o curso da Trybe sobre React e consumir dados de uma API. Com as funcionalidades desenvolvidas, o usuário pode pesquisar e explorar músicas de seus artistas favoritos de forma fácil e intuitiva. Além disso, a implementação do sistema de favoritos e edição de perfil permite que o usuário personalize sua experiência na aplicação.

About

pesquisa por artistas ou bandas e visualiza prévia das músicas. | aplicação front-end com utilização de React Router + ciclos de vida e da API da iTunes

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages