michelmartins9164 / meu-time

Projeto de Aplicação Frontend Angular com API de Futebol

Descrição

Este projeto consiste na construção de uma aplicação frontend Angular que utiliza a API de futebol para obter informações sobre formação de times, lista de jogadores, tabela de jogos e pontos. A aplicação permite ao usuário realizar login com uma chave de API fornecida pela API de futebol, selecionar o país e o ano desejados, visualizar as ligas disponíveis, selecionar um time, e ver os dados detalhados do time escolhido, incluindo escalação, tabela da temporada e gráfico de gols durante os jogos.

Funcionalidades

• Login com validação através da chave de API fornecida pela API de futebol.
• Seleção de país e ano para visualizar as ligas disponíveis.
• Exibição das ligas disponíveis para o país e ano selecionados.
• Seleção de um time para ver os dados detalhados.
• Visualização da escalação do time selecionado.
• Exibição da tabela da temporada com pontos e posições dos times.
• Gráfico de gols durante os jogos da temporada.

Desenvolvimento

Dia 1: Configuração Inicial e Login

No primeiro dia, foi realizada a configuração inicial do projeto e a implementação da funcionalidade de login. Foi criada a tela de login, onde o usuário pode inserir a chave de API disponibilizada pela API de futebol para autenticação. Ao fazer o login com sucesso, a chave é armazenada para uso posterior.

Dia 2: Seleção de País e Ano

No segundo dia, foi implementada a funcionalidade de seleção de país e ano. O usuário pode escolher o país desejado e o ano da temporada por meio de dropdowns. As informações de países e anos foram obtidas da API de futebol. Após a seleção, os dados são coletados para uso nas próximas telas.

Dia 3: Ligas Disponíveis e Times

No terceiro dia, foram adicionadas as telas de exibição das ligas disponíveis e dos times participantes. Ao selecionar um país e um ano, a aplicação busca as ligas correspondentes por meio da API e exibe em uma lista. Ao selecionar uma liga, a lista de times participantes é apresentada em uma tabela.

Dia 4: Dados do Time Selecionado

No último dia, foi implementada a funcionalidade de exibição dos dados detalhados do time selecionado. Ao confirmar a seleção do time, a aplicação busca informações como a escalação, tabela da temporada e gráfico de gols durante os jogos. Esses dados são obtidos por meio de micro serviços conectados à API de futebol. Os dados são apresentados em tabelas e gráficos, estilizados com SCSS, Bootstrap e Angular Material.

Tecnologias Utilizadas

• Angular
• SCSS (Sassy CSS)
• Bootstrap
• Angular Material
• Banco de dados JSON (local)

Instruções de Uso

1. Clone este repositório.
2. Instale as dependências utilizando o comando npm
3. Rode o comando ng serve ou npm run start
4. Abra seu navegador na página http://localhost:4200/

Chave KEY

Você pode conseguir uma chave em https://dashboard.api-football.com

⚠ Lembre-se que você possui um limite de 100 chamadas diárias