gitHubLike is a library that provides GitHub repository cards for a user using React.js
gitHubLike library exposes the following JS objects:
-
GitHubCards: This object exposes 2 methodsrenderandgetMyLanguages.-
render: The render method has the signaturerender(userName, elementId, callback)whereuserNameis the name of the user whose GitHub repositories are to be fetched.elementIdis the ID of the DOM element(div) within which React will render the components.callbackis the callback function that gets executed after the component has been rendered to the screen. -
getMyLanguages: This method fetches the names of all the languages used in the user's GitHub repositories. Should be used in the callback function passed to the render method.
-
-
GitHubLangColors: This object provides all the colors associated with languages on GitHub.
An example usage would be(the code is taken from my personal blog(https://sidmishraw.github.io):
<script src="/js/github-like.bundle.js"></script>and
githubLike.GitHubCards.render("sidmishraw", "projectsList", () => {
/// WIP, will make a language carousel thingy
jQuery("#languagesIDabbleIn").html(
`<ol class="pinned-repos-list mb-4">` +
githubLike.GitHubCards.getMyLanguages() +
`</ol>`
);
/// WIP, will make a language carousel thingy
stopLoader();
});Tested with react(v16.0.0), react-dom(v16.0.0) and jQuery(v3.2.1)
Note: Add
react.jsbefore addingreact-dom.jsto the<head>tag in<script>tags becausereactneeds to be loaded beforereact-dom.
-
Install
yarn. You can download it from here. -
Clone the repository and then run:
yarn install-
yarnwill download and install all the dependencies. After it has installed all the dependencies -
Run the following commands for running the test server and build respectively:
yarn start --watch # this runs the development test server by using webpack-dev-server
yarn build # bundles everthing to the `bin` directory- Copy and use the
github-like.bundle.jsinside thebindirectory. Add it to your html file or use it as a library :)
Note: Do use the
styles.csswithgithub-like.bundle.js
- Sid