examples

github stars

• The example starts with a basic text saying the repo has "some" starts.
• A call is made to the GitHub API to pull the actual number.
• If the call succeeds the value is updated. Otherwise, nothing changes.
• Aside: This approach is basic and results in a visual change when the data loads for the demonstration. I'd hide the entire string until the data loaded in real world usage.

html

<p>bitty's repo has <span data-r="stars">some</span> stars.</p> 
<p>feel free to <a href="https://github.com/alanwsmith/bitty">add more</a>.</p>

javascript

export const b = { init: "stars" };

const url = "https://api.github.com/repos/alanwsmith/bitty";

export async function stars(_, __, el) {
  const data = await b.getData(url);
  if (data) {
    el.innerHTML = data.stargazers_count;
  }
}