Let's give recognition to those supporting our work on GitHub Sponsors.
Kaiz Khatri
Posted on February 9, 2023
To shoutout your sponsors, all you need to do is use the image endpoint https://sponsor-spotlight.vercel.app/sponsor and append your GitHub Sponsor program-eligible username as the login query parameter in a markdown image tag. For example:
This will display a "Shoutout" image for a random sponsor with every request.
In some instances, you may receive a message for onboarding new sponsors.
If you have not joined the GitHub Sponsorship program or if your GitHub username cannot be found, the following will appear:
Why Sponsor Spotlight?
As a popular open-source project author or maintainer, you are likely aware of the crucial role played by your sponsors. These sponsors play a vital part in ensuring the success of our project, and it is essential to acknowledge their contributions in a meaningful way. To do this, you may use tools that generate an image featuring the avatars of all active sponsors, providing an overview of their support for the project.
However, despite the convenience of these tools, I found some visual glitches to be particularly concerning. For instance, the image generated by these tools can consume a significant amount of space in the readme, potentially becoming a distraction for users. Additionally, these tools often lack categorization capabilities, making it challenging to provide individual recognition to sponsors, which can be a significant issue for those who desire more personal recognition for their contributions.
Furthermore, slow response times can result in broken sponsor avatars appearing on certain requests, leading to an unprofessional appearance for your project.
To resolve this issue, I decided to take the time to improve the situation. I was recently accepted into the GitHub Sponsorship Program and had already started receiving my first sponsorship, so I wanted to ensure that everything looked as professional as possible. A big shoutout goes to @splooge for being my first sponsor!
With the goal of making things better, I created a public repository on GitHub called "Sponsor Spotlight". This repository generates a dynamic image (in the form of an SVG) using a serverless function and React. The image displays a random sponsor with each request, and has a subtle animation that gives your project a unique and lively look. It took me a few days and less than a week to make the code compatible with all GitHub users and to hand designed the cute Octocat icons into the SVG format.
The source code for this is available on GitHub for anyone to access. If you have any feature requests or run into any issues, you can report them on the issues page. I welcome your thoughts and am happy to work on solving any problems in my free time.
Let's give recognition to those supporting our work.
sponsor-spotlight
This project would like to extend a warm shoutout to our fantastic Github monthly sponsors. Approximately 70% of requests will feature a randomly selected sponsor, with the remaining being utilized for onboarding new sponsors.
Usage
Simply use the image endpoint https://sponsor-spotlight.vercel.app/sponsor and append your GitHub Sponsor program-eligible username as the login query parameter. For example:
This will display a "Shoutout" image for a random sponsor with every request.
In some instances, you may receive a message for onboarding new sponsors.
If you have not joined the GitHub Sponsorship program or if your GitHub username cannot be found, the following will appear:
Development
Images are generated by a React component and is embedded within an SVG. You can run the project locally using the Vercel CLI by running the following command in your terminal:
vercel dev
And also require Github personal access token (classic) with read:org and…
