Passar para o conteúdo principal

Crie uma lista de jogos e resultados

Use um assistente de IA para criar uma página com todas as partidas da sua temporada, com filtros por competição e por time.

Escrito por Pedro Maia

Uma página de jogos e resultados lista todas as partidas da sua temporada, disputadas e a disputar, agrupadas por data. Os visitantes podem filtrar por divisão, copa ou time, e alternar entre resultados e próximas partidas.

Você não precisa ser desenvolvedor. Um assistente de IA como o ChatGPT ou o Claude pode criar a página para você com as instruções abaixo.

Antes de começar

  • Sua liga precisa do plano Gold com a API ativada. Veja Primeiros passos com a API.

  • Você precisa do ID da sua temporada. O artigo Como a API funciona mostra como encontrá-lo.

  • Ainda não tem uma liga? Teste o prompt primeiro com a liga de demonstração do LeagueRepublic: use o ID de temporada 153020000.

Como usar o prompt

  1. Copie o prompt da caixa cinza abaixo.

  2. Preencha o ID da sua temporada. Substitua [ID-DA-MINHA-TEMPORADA] pelo seu número.

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

  4. Cole no assistente de IA e envie.

  5. Abra o arquivo que ele entregar. Salve o arquivo e clique duas vezes nele para abri-lo no navegador.

  6. Compare com o site da sua liga. Se algo parecer errado, diga à IA com palavras simples, por exemplo "as partidas adiadas estão aparecendo como resultados". Ela vai corrigir.

O prompt

Antes de começar, leia a especificação da API JSON do LeagueRepublic em https://docs.api.leaguerepublic.com/leaguerepublic-read-api.md. Use somente os serviços, endereços web e nomes de campos descritos nela, e siga as regras dela sobre o limite de solicitações, valores vazios, erros e "road" significar visitante. Se você não conseguir abrir esse endereço, pare e me peça para colar a especificação.

Crie para mim uma única página web (um arquivo HTML que eu possa abrir no navegador) que liste todas as partidas da temporada da minha liga. O ID da minha temporada é [ID-DA-MINHA-TEMPORADA].

A página deve:

1. Carregue todas as partidas da temporada uma única vez, usando o serviço Get Fixtures For Season, e faça todos os filtros na própria página, sem carregar de novo.

2. Tenha duas abas: "Resultados", das mais recentes para as mais antigas, e "Jogos" (partidas ainda a disputar), das mais próximas para as mais distantes.

3. Agrupe as partidas por data, com a data como título.

4. Para cada partida, mostre o time da casa, o placar ou o horário de início, o time visitante, o nome da divisão ou da copa, a fase da copa se houver, e o local.

5. Permita que eu filtre por divisão ou copa, e por time, usando menus montados a partir das próprias partidas.

6. Se uma partida for adiada, mostre isso em vez do horário. Coloque as partidas com data a confirmar em uma seção própria no final da aba Jogos. Se a data de uma partida já passou mas ainda não há resultado, mostre "Aguardando resultado" em vez do horário.

7. Não recarregue os dados mais de uma vez por minuto.

Mantenha o design limpo e fácil de ler no celular. Explique em passos simples como abrir e usar o arquivo. Pergunte se algo não estiver claro.

Design: [DESCREVA O VISUAL QUE VOCÊ QUER OU ANEXE UMA CAPTURA DE TELA]

Se algo der errado

  • Os placares de intervalo ou de pênaltis não aparecem. Esta lista não inclui esse detalhe extra no momento. A central de partidas e a página de time incluem.

  • Está faltando um resultado. Os resultados só aparecem depois que a liga os aprova.

  • A página mostra uma mensagem de erro. Confira o ID da sua temporada 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 buscar dados de outros sites. Salve o arquivo e abra no seu 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.

Todos os detalhes do serviço Get Fixtures For Season estão na especificação da API.

Respondeu à sua pergunta?