Passar para o conteúdo principal

Crie uma página de central de partidas

Use um assistente de IA para criar uma página que mostra as partidas, os placares e as tabelas da sua liga em qualquer dia.

Escrito por Pedro Maia

Uma página de central de partidas mostra tudo o que acontece na sua liga em um dia: as partidas, os placares e as tabelas, com uma faixa de datas para alternar entre os dias. Ela é parecida com a página Match Hub do seu site LeagueRepublic, mas o design é você quem decide.

Você não precisa ser desenvolvedor. Um assistente de IA como o ChatGPT ou o Claude pode criar a página para você a partir das 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. 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 [MY-SEASON-ID] pelo seu próprio número.

  3. Diga como você quer que fique. Descreva suas cores e seu 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 e depois dê dois cliques 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 "os placares estão invertidos". 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 apenas os serviços, endereços web e nomes de campo que ela descreve, e siga as regras dela sobre o limite de requisições, valores vazios, erros e "road" significando visitante (away). Se você não conseguir abrir esse endereço, pare e peça para eu colar a especificação.

Crie para mim uma única página web (um arquivo HTML que eu possa abrir no navegador) que mostre a central de partidas da minha liga, usando o serviço Get Match Hub. O ID da minha temporada é [MY-SEASON-ID].

A página deve:

1. Mostrar no topo uma faixa de dias de partidas clicáveis, incluindo a entrada "a confirmar". Cada dia mostra quantos resultados e partidas a jogar ele tem. Clicar em um dia o carrega. Quando a página abrir, role a faixa para que o dia exibido fique visível.

2. Permitir que eu alterne entre temporadas.

3. Mostrar as partidas do dia agrupadas sob o nome de cada divisão ou fase da copa.

4. Para cada partida, mostrar o time da casa, o placar e o time visitante. Se ela ainda não começou, mostrar o horário de início no lugar. Marcar placares ao vivo como "Ao vivo" e resultados que a liga ainda não aprovou como "Provisório". Se uma partida foi adiada, mostrar isso no lugar do horário. Se a data de uma partida já passou mas ainda não há resultado, mostrar "Aguardando resultado" no lugar do horário.

5. Mostrar qualquer detalhe extra do placar, como o primeiro tempo ou os pênaltis, em texto pequeno. Não repetir a fase da copa sob uma partida se ela já estiver no nome do grupo.

6. Sob cada divisão, mostrar a tabela de classificação: posição, time, jogos, vitórias, empates, derrotas, saldo, pontos e desempenho recente.

7. Quando uma partida tiver jogos individuais (dardos, sinuca) ou placares por innings ou por quartos, mostrá-los em uma seção que eu possa abrir e fechar.

8. Salvar cada dia depois de carregá-lo e não pedir o mesmo dia de novo em menos de um minuto.

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

Design: [DESCRIBE THE LOOK YOU WANT, OR ATTACH A SCREENSHOT]

Se algo der errado

  • 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 mostra nenhum dado. Diga à IA exatamente o que você está vendo. Ela pode precisar mudar a forma como a página carrega os dados.

  • A página não funciona na janela de visualização da IA. Muitas visualizações não conseguem buscar dados de outros sites. Salve o arquivo e abra-o 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.

Todos os detalhes do serviço Get Match Hub estão na especificação da API.

Respondeu à sua pergunta?