My goal is to:
- query GitHub v4 (graphql) api for data about an organization’s repos,
- consume the GH api response data from a separate react app that renders the data as a pretty list in HTML.
Thanks to Glitch allowing private environment variables, I can keep my GitHub token a secret when querying their api.
Based on what I know how to do, my plan is to:
- save the latest GH response to a json file every hour using a cron job
- make a XMLHttpRequest from a react app on github pages to the json file mentioned above, and render out the react components based on the json data.
I’ve successfully written a small node app in Glitch that saves the GH api response into .data/data.json
.
My questions:
- How can I expose
.data/data.json
to another web page via a XMLHttpRequest? Do I need to install a server like express or something similar? (As a side note, although I can see the.data/
folder in my Glitch project via the console, I cannot see the.data/
folder in my main Glitch project directory view.) - Is my approach of centering this app around a json file the most appropriate method? Or would a better practice be to somehow return the GH data from a function instead of a file? (I feel like the function method would be slower because it would have to go get the GH data first, whereas the file method would already have the data at the ready.)
Here’s my working node app code:
const fs = require('fs');
const request = require('request');
const CronJob = require('cron').CronJob;
const options = {
'uri': 'https://api.github.com/graphql',
'method': 'POST',
'headers': {
'User-Agent': 'brianzelip'
},
'auth': {
'bearer': process.env.TOKEN
},
'body': JSON.stringify({
"query": "query { \
organization(login: \"NCBI-Hackathons\") { \
login \
repositories(first: 100) { \
totalCount \
nodes { \
name \
description \
url \
languages(first: 1) { \
edges { \
node { \
name \
} \
} \
} \
releases(first: 1) { \
totalCount \
} \
issues(first: 100, labels: \"manuscript\") { \
edges { \
node { \
body \
} \
} \
} \
} \
} \
} \
}"
}),
};
new CronJob('0 0 */1 * * *', function() {
request(options, function (error, response, body) {
if (error) {
return `ERROR!: ${error}`;
} else if (response.statusCode === 200) {
console.log('GitHub api was successfully queried 🎉\n');
fs.writeFile('.data/data.json', body, (err) => {
if (err) throw err;
console.log(`.data/data.json was successfully written 🎉\n`);
});
let timestamp = new Date();
const logEntry = `NCBI-Hackathons repos data refresh happened at ${timestamp} 🎉\n`;
console.log(`timestamp is ${timestamp}`);
fs.appendFile('.data/data.log', logEntry, (err) => {
if (err) throw err;
console.log(`The timestamp ${timestamp} was appended to .data/data.log 🎉\n`);
})
return;
} else {
return `Problem! Status code = ${response.statusCode}, response = ${response}`;
};
});
}, null, true, 'America/New_York');