@node-haneulab/get-github-api v1.0.6
@node-haneulab/get-github-api
NPM Package for using github api and manipulate api data in browsers.
The following guidline will assume that your project files are in the layout below.
index.html
style.css
app.js
Installation
First install the package and browserify as development dependency. Type the following commands in your project's root directory.
# create package.json
npm init -y
# download the main package
npm i @node-haneulab/get-github-api
# download the dependent package to make your project scripts run on browsers
npm i -g browserifybrowserify is needed because I am using node-fetch package as development dependency for this package.
Set up your project pakcage.json
In your package.json in the script module, include the following
{
"scripts": {
"bundle": "browserify app.js -o bundle.app.js"
}
}Basic Usage
In your app.js, load the package via
const github = require("@node-haneulab/get-github-api");
const ready = github().ready;
const use = github().use;ready returns two methods
getRepos(username) : a promise function that fetches your repositories in json object as an array. You can then use .then(data => ..) function to do what you want with the returned array of repository objects.
refer to url https://api.github.com/users/<your username>/repos
getUser(username) : a promise function taht fetches a single user object. It has the main information about the user.
refer to url https://api.github.com/users/<your username>
use returns one method
filtered(repos) is a method that takes repos array of repository object, then returns two methods
byName(condtion)takes a callback functionconditionthat takes each repo's name, then returns boolean for the givenconditionfunction.byLanguage(condtion)is a methodd that takes a callback functionconditionthat takes each repo's language, then returns boolean for the givenconditionfunction.
The basic program might look like below
// app.js
const github = require("@node-haneulab/get-github-api");
const ready = github().ready
const use = github().use
// my username on github
const username = "haneulab"
// fetch repos
ready.getRepos(username)
.then(repos => {
// filter repos that have name 'web' as a first element when splited by "-"
const byName = use.filtered(repos).byName(function (name) {
return name.split("-")[0] === 'web'
});
// filter repos of each whose mostly used language is `JavaScript`
const byLang = use.filtered(repos).byLanguage(function (lang) {
return lang === 'JavaScript'
})
// since 'byName' and 'byLang' are now filtered array of repos, you can do what you need to do below.
doSomethingHere()
}).catch(error => {
handleErrorHere(error) // or ...
alert("There was an error found while fetching " + error); // simple alert to user the error message
})Advanced Usage
Currently building the advanced usage documentation site. Please check back soon!
Bundling & Including
After you finish writing your program, type the npm run bundle command, this will create a new bundlded script file bundle.app.js.
You need to include this script to your index.html
<!-- index.html -->
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./style.css">
<script src="./bundle.app.js" ></script>
<!--
<script src="./app.js" ></script>
Don't include this, it won't work in browsers
-->
</head>
<body>
<div id="app">
...
</div>
</body>