Hospedar Vercel Stats Card para GitHub
Tags: tutorial, github, vercel, webdev
Published: 2023-01-17 19:46:37

Já acessou a página principal do seu **GitHub** após incrementar seu **README** com os cartões de estatísticas do **GitHub** da **Vercel** e, para sua surpresa, havia a seguinte mensagem de erro: “_Something went wrong! file an issue at … / Maximum retries exceded_”?

![Mensagem de erro de requisição](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v1liset6s83bz3roxvfs.png)

Isso ocorre porquê, atualmente, existe um gigantesco número de requisições acontecendo a cada hora para a instancia da Vercel para o projeto.
Atualmente, o projeto possui 7 **PAT**’s (_Personal Access Token_) com 5000 pontos de acesso por hora. Isso é muito pouco em comparação com o número de requisições ao projeto e por isso, às vezes, a requisição dos dados do seu cartão de estatísticas falha e você recebe essa mensagem.
Para ajudar a entender, imagine que você está numa estação de ônibus. Se for um horário com menos circulação de passageiros, provavelmente haverá lugar para você embarcar e chegar ao destino. Porém, caso seja um horário de pico, talvez o ônibus já esteja lotado e você não consiga embarcar, e precisará esperar um tempo até que algum ônibus chegue com um lugar vago para você. Nessa metáfora, o ônibus é o token de acesso que levará sua requisição (ou você, como na metáfora) até o site que fornecerá os dados. Se todos os pontos de acesso (ou assentos) dos **PAT**’s estão sendo usados, não há como sua solicitação chegar ao destino naquele momento, resultando no erro.
Apesar dos gestores do projeto já estarem trabalhando numa expansão de **PAT**’s para diminuir o problema, há uma maneira de resolver esse problema para suas estatísticas: basta fazer o deploy da sua própria instância no Vercel. Voltando à metáfora, seria como dar adeus ao transporte público, pegar um carro e ir só você, no maior conforto, até seu destino. E é muito fácil de fazer:

1 - Faça login ou crie uma conta no site da **[Vercel](https://vercel.com/)** com o **GitHub** (opção “_Continue with GitHub_”);

2 - Caso solicitado, permita o acesso da **Vercel** aos seus repositórios no **GitHub**;

3 - Vá até o **GitHub** e faça fork do seguinte repositório: [https://github.com/anuraghazra/github-readme-stats](https://github.com/anuraghazra/github-readme-stats);

4 - Abra o arquivo “_vercel.json_” e modifique o campo “_maxDuration_” para “10”, como na imagem a seguir:

![Arquivo vercel.json](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f2idt3r24homn9dxhwcw.png)

* Você pode pular essa etapa se fizer o fork deste repositório, já modificado: [https://github.com/marianapcorrea/github-readme-stats](https://github.com/marianapcorrea/github-readme-stats);

5 - Ainda no **GitHub**, acesse essa página e siga os próximos passos para criar um _Personal Access Token_ (caso prefira encontrar a página manualmente, siga o caminho: ícone do seu usuário (canto superior direito)>>_Settings>>Developer settings>>Personal access tokens_).
* Coloque um identificador no campo “_Note_” (como, por exemplo, “GitHub Readme Stats”)

![Tela de criação de novo Token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/savsoxd9n0r3thw2wama.png)

* Defina o período de expiração do seu _token_ (para saber mais sobre expiração de _tokens_, clique aqui e leia a documentação oficial do **GitHub**).

![Tela de criação de novo Token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zq9lrxaoc3pjuesbp6pr.png)

* Vá até o fim da página e clique em “_Generate token_” para gerar seu _token_ (não é necessário alterar nada no campo “_Select scopes_”).

![Tela de geração de novo Token](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3q009efiln6xywpsaqlf.png)

* O **GitHub** solicitará que você insira sua senha e após isso, te encaminhará para a página com o _token_ gerado. **ATENÇÃO**: copie seu _token_ e o salve em algum lugar por segurança, pois ele não será exibido novamente.

![Confirmação e exibição do token gerado](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wgw1bopfbxg91fshswit.png)

6 - Volte ao site da **[Vercel](https://vercel.com/)**. No seu _DashBoard_, clique no botão “_Add New…_”. Nas opções que irão abrir, clique em “_Project_”;

7 - Na página de projetos, vá até o quadro intitulado “_Import Git Repository_”, localize o repositório “_github-readme-stats_” e clique em “_Import_”.

![Tela de Projetos na Vercel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bmbtgpzj2tw2aljbuyh5.png)

8- Na nova página, abra o campo “**Enviroment Variables**”, adicione o nome **PAT_1** no campo “_Name_” e o seu _token_ no campo “_Value_”.

![Tela de configuração de projeto no Vercel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/389hx9qtwjeyylkan79l.png)

9 - Clique em “_Deploy_” e aguarde o fim do processo.

10 - Clique em “_Continue to Dashboard_”

11 - Escolha e copie um dos link mostrados no campo “_Domains_”.

![Tela de Deploy no Vercel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ewuc0nrsywtvrrlr4mtd.png)

12 - No seu **README.md**, na linha do cartão de estatísticas, substitua o trecho ”**github-readme-stats.vercel.app**” pelo link copiado anteriormente e faça o **commit**.

![Readme antes da substituição
](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qi54hjssymrtsbn5c661.png)

![Readme depois da substituição](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lh4e53v7r033nwgfd7yd.png)

Pronto! Agora você tem um cartão de estatísticas cuja origem só é acessada por você, eliminando a possibilidade do erro de excesso de requerimentos ocorrer.

**Fonte**: [https://github.com/anuraghazra/github-readme-stats](https://github.com/anuraghazra/github-readme-stats)

Leituras adicionais sobre PAT:
* [Criando um token de acesso pessoal
](https://docs.github.com/pt/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token
)
* [Vencimento e revogação de token
](https://docs.github.com/pt/authentication/keeping-your-account-and-data-secure/token-expiration-and-revocation)