Criar interfaces acessíveis através de um browser que permita o usuário a gerenciar a discografia da dupla caipira Tião Carreiro e Pardinho🤠.
- JavaScript
- React.js
- Axios
- CSS
Para iniciar o projeto, siga os passos abaixo:
-
Clone o repositório para a sua máquina local:
git clone https://github.com/Brunonavarrooficial/DesafioTecnico_ReactJS_SupliuTecnologia.git -
Instale as dependências do projeto:
cd nome-do-repositorio npm install` -
Crie o arquivo
.envna raiz do projeto e configure as variáveis de ambiente:REACT_APP_API_URL=coloque_sua_api REACT_APP_API_KEY=coloque_seu_toquem -
Inicie o servidor de desenvolvimento:
npm start -
Abra o projeto no seu navegador:
http://localhost:3000
-
Segue abaixo as ações que o usuário poderá executar:
- As interfaces foram criadas utilizando a biblioteca React.js
- os métodos da API REST disponível no link https://tiao.supliu.com.br/ foram consumidos.
-
Ver lista de álbuns e faixas
-
Pesquisar álbuns por nome
-
Adicionar um novo álbum
-
Adicionar uma nova faixa em um álbum
-
Excluir uma faixa
-
Excluir um álbum
Os formulários têm validações para evitar requisições desnecessárias à API.
Foram adicionados @media-query nos arquivos CSS para garantir a responsividade do projeto em dispositivos móveis, tablets e outros.
No formulário de adicionar faixa, a aplicação permite que você insira o tempo da faixa em segundos completos e automaticamente faz a transformação para minutos e segundos (Exemplo: 195 seg se tornará 3:15 min).
- Um arquivo .env-exemplo foi fornecido para configurar as variáveis de ambiente necessárias para o projeto:
- Lembre-se de substituir
seu-usuario,nome-do-repositorioe outras informações relevantes pelos valores corretos do seu projeto.
- Lembre-se de substituir
