React-github-user-stats NPM

react-github-user-stats

This simple npm package provides you an easy way to get Github user's stats using React Hooks.

Demo

Install

npm install --save react-github-user-stats

Usage

import * as React from "react";
import useGithubStats from "react-github-user-stats";

const Example = () => {
  const { error, loading, userData } = useGithubStats("munafio");

  if (loading) return <h1>Loading data..</h1>;
  if (error) return <h1>ERROR: {error}</h1>;
  if (!userData) return <h1>Not found!</h1>;

  return (
    <div>
      <pre>{JSON.stringify(userData, null, 2)}</pre>
    </div>
  );
};

Do not forget to replace munafio with the username you want.

Sample

The userData returned from this hook contains props as the below sample shows:

{
  "data": {
    "id": 20261627,
    "name": "Munaf Aqeel Mahdi",
    "username": "munafio",
    "avatar_url": "https://avatars.githubusercontent.com/u/20261627?v=4",
    "url": "https://github.com/munafio",
    "type": "User",
    "company": "Full-Stack Web Developer",
    "website": "munafio.com",
    "location": "Babil ⇄ Iraq",
    "email": null,
    "bio": null,
    "twitter_username": "munafiofficial",
    "public_repos": 19,
    "public_gists": 1,
    "followers": 242,
    "following": 5,
    "total_stars": 1775,
    "total_forks": 462,
    "created_at": "2016-07-03T01:06:30Z",
    "updated_at": "2022-06-12T12:11:17Z"
  }
}