Ir para conteúdo principal

Criar uma tabela classificativa

Use um assistente de IA para criar uma página que mostre as tabelas classificativas da sua liga, com um menu para alternar entre divisões.

Escrito por Pedro Maia

Uma página de tabela classificativa mostra as classificações de cada divisão da sua liga, com um menu para alternar entre elas. Pode usá-la sozinha ou colocá-la no seu site ao lado das notícias.

Não precisa de ser programador. Um assistente de IA, como o ChatGPT ou o Claude, pode criar a página por si a partir das instruções abaixo.

Antes de começar

  • A sua liga precisa do plano Gold com a API ativada. Consulte Primeiros passos com a API.

  • Precisa do seu ID da época. Como funciona a API mostra como o encontrar.

  • Ainda não tem uma liga? Experimente primeiro o prompt com a liga de demonstração do LeagueRepublic: use o ID da época 153020000.

Como usar o prompt

  1. Copie o prompt da caixa cinzenta abaixo.

  2. Preencha o ID da sua época. Substitua [MY-SEASON-ID] pelo seu próprio número.

  3. Diga como quer que fique. Descreva as suas cores e o seu estilo, ou anexe uma captura de ecrã do seu site ou de um design de que goste. Uma imagem costuma funcionar melhor. Se não disser nada, a IA escolherá um design simples.

  4. Cole-o no assistente de IA e envie-o.

  5. Abra o ficheiro que ele lhe dá. Guarde-o e depois faça duplo clique para o abrir no navegador.

  6. Confira-o com o site da sua liga. Se algo parecer errado, diga à IA por palavras simples, por exemplo «falta a coluna dos pontos». Ela corrigirá.

O prompt

Antes de começares, lê a especificação da API JSON do LeagueRepublic em https://docs.api.leaguerepublic.com/leaguerepublic-read-api.md. Usa apenas os serviços, os endereços web e os nomes de campos que ela descreve, e segue as suas regras sobre o limite de pedidos, os valores vazios, os erros e o significado de «road» como fora de casa. Se não conseguires abrir esse endereço, pára e pede-me que cole a especificação.

Cria-me uma única página web (um ficheiro HTML que eu possa abrir no meu navegador) que mostre as tabelas classificativas da minha liga. O ID da minha época é [MY-SEASON-ID].

A página deve:

1. Usar o serviço Get Fixture Groups For Season para listar as divisões da época e mostrá-las num menu. Abrir na primeira divisão.

2. Quando eu escolher uma divisão, mostrar a respetiva tabela com o serviço Get Standings For Fixture Group. Carregar uma divisão apenas quando eu a escolher.

3. Mostrar posição, equipa, jogos, vitórias, empates, derrotas, golos marcados, golos sofridos, diferença e pontos, além da forma recente em pequenos emblemas coloridos (vitória, empate, derrota).

4. Listar também as taças no menu, mas só verificar se uma taça tem tabelas quando eu a escolher. Se for disputada por grupos, mostrar uma tabela por grupo, com o nome do grupo por cima. Se não tiver tabelas, dizê-lo.

5. Deixar-me tocar numa equipa para destacar a sua linha.

6. Num telemóvel, manter a posição, a equipa, os jogos, a diferença e os pontos, e ocultar as outras colunas.

7. Guardar cada tabela depois de a carregar e não voltar a pedir a mesma tabela no espaço de um minuto.

Mantém o design limpo e fácil de ler num telemóvel. Explica em passos simples como abrir e usar o ficheiro. Pergunta-me se algo não estiver claro.

Design: [DESCREVE O ASPETO QUE PRETENDES, OU ANEXA UMA CAPTURA DE ECRÃ]

Se algo correr mal

  • A tabela de uma divisão está toda a zeros. Essa divisão ainda não disputou nenhum jogo. Ficará preenchida quando forem introduzidos resultados.

  • Falta uma divisão. As divisões com as tabelas ocultas no site da sua liga também estão ocultas aqui.

  • A página mostra uma mensagem de erro. Verifique o ID da sua época e se a API está ativada para a sua liga.

  • A página não funciona na janela de pré-visualização da IA. Muitas pré-visualizações não conseguem obter dados de outros sites. Guarde o ficheiro e abra-o antes no navegador.

  • A IA diz que não consegue ler a especificação. Abra o endereço da especificação no navegador, selecione tudo, copie e cole na IA.

Os detalhes completos dos serviços aqui utilizados estão na especificação da API.

Isto respondeu à sua pergunta?