npm i react-github-embed
Get your Personal Access Token by signing in to your github account and then go to your setting -> developer setting -> Personal access tokens -> Generate new token. Add it to .env file in the root directory.
REACT_APP_GITHUB_TOKEN = <YOUR_GITHUB_TOKEN>
import React from 'react';
import { Repository } from 'react-github-embed';
const RepositoryCard = () => {
return (
<div>
<Repository
username="facebook"
repository="react"
theme="light"
showStarCount={true}
showForkCount={true}
showLanguage={true}
showDescription={true}
showType={true}
/>
<Repository username="Mridul2820" repository="css-js" theme="light" />
<Repository
username="Mridul2820"
repository="next-template"
theme="dark"
/>
</div>
);
};
export default RepositoryCard;| Property | Type | Description |
|---|---|---|
| username (required) |
string | Username of the Github User |
| repository (required) |
string | Repository of the Github User |
| theme |
string | Theme of the card "light" or "dark"Deafults to "light" |
| showStarCount | bool | When true, shows the total star count of repository.Defaults to true |
| showForkCount | bool | When true, shows the total fork count of repository.Defaults to true |
| showLanguage | bool | When true, shows the main language of repository.Defaults to true |
| showDescription | bool | When true, shows the description of repository.Defaults to true |
| showType | bool | When true, shows the type of repository.Public template Private template Private Public ForkedDefaults to true |
import React from 'react';
import { StarCount } from 'react-github-embed';
const StarCountCard = () => {
return (
<StarCount
username="facebook"
repository="react"
theme="light"
iconText="Star"
formatNumber={true}
/>
);
};
export default RepositoryCard;| Property | Type | Description |
|---|---|---|
| username (required) |
string | Username of the Github User |
| repository (required) |
string | Repository of the Github User |
| theme | string | Theme of the card "light" or "dark"Deafults to "light" |
| iconText | string | Text to display on the card. Defaults to Star |
| formatNumber | bool | When true, shows the total star count formatted.Defaults to true |
import React from 'react';
import { ForkCount } from 'react-github-embed';
const ForkCountCard = () => {
return (
<ForkCount
username="facebook"
repository="react"
theme="light"
iconText="Fork"
formatNumber={true}
/>
);
};
export default RepositoryCard;| Property | Type | Description |
|---|---|---|
| username (required) |
string | Username of the Github User |
| repository (required) |
string | Repository of the Github User |
| theme | string | Theme of the card "light" or "dark"Deafults to "light" |
| iconText | string | Text to display on the card. Defaults to Star |
| formatNumber | bool | When true, shows the total fork count formatted.Defaults to true |
| Browser | Works? |
|---|---|
| Chrome | Yes |
| Firefox | Yes |
| Safari | Yes |
| IE 11 | Yes |
Pull requests are welcome!
See CONTRIBUTING.md for more information.