3 ways to get data from GitHub Gists

3 ways to get data from GitHub Gists

3 min read

Generate audio versions of your articles with Blogcast.

While working on my side-projects (Snaptier and UnMarkDocs), I had to get data from GitHub Gists. Here are the three ways to do it:

1. The JavaScript way

This is the official way to do it, the one that is mentioned in the GitHub Documentation. It consists on adding .js to the end of the URL and including it in a script tag:

<!-- If we have the following Gist: 
https://gist.github.com/m1guelpf/53e1780a5a68fe9281cfbbc9820d381f -->
<script src="https://gist.github.com/m1guelpf/53e1780a5a68fe9281cfbbc9820d381f.js"></script>

2. The JSON way

Adding .json to the end of the Gist URL returns something like this:

{
  "description": "Personally written version of Chris Fidao's video on setting up a Forge like server: https://youtu.be/VQNrsMYCOFg ",
  "public": false,
  "created_at": "2017-07-13T21:01:10+02:00",
  "files": [
    "forgeLikeServerSetup.md"
  ],
  "owner": "m1guelpf",
  "div": "...",
  "stylesheet": "https://assets-cdn.github.com/assets/gist-embed-3cc724162479db25e452fdf621f2349adef3e742b53552c2a93f82d28156cb96.css"
}

This is very useful when working with Gists server-side

3. GitHub API

Of course, you can use the GitHub API to get this content. According to the API documentation, you have to make a GET request to https://api.github.com/gists/$GIST_ID where Gist ID is the part of the URL that appears after your username.

Here’s an example response:

{
  "url": "https://api.github.com/gists/53e1780a5a68fe9281cfbbc9820d381f",
  "forks_url": "https://api.github.com/gists/53e1780a5a68fe9281cfbbc9820d381f/forks",
  "commits_url": "https://api.github.com/gists/53e1780a5a68fe9281cfbbc9820d381f/commits",
  "id": "53e1780a5a68fe9281cfbbc9820d381f",
  "git_pull_url": "https://gist.github.com/53e1780a5a68fe9281cfbbc9820d381f.git",
  "git_push_url": "https://gist.github.com/53e1780a5a68fe9281cfbbc9820d381f.git",
  "html_url": "https://gist.github.com/53e1780a5a68fe9281cfbbc9820d381f",
  "files": {
    "forgeLikeServerSetup.md": {
      "filename": "forgeLikeServerSetup.md",
      "type": "text/plain",
      "language": "Markdown",
      "raw_url": "https://gist.githubusercontent.com/m1guelpf/53e1780a5a68fe9281cfbbc9820d381f/raw/a74da413bd8ad348523b4535053687533cc10485/forgeLikeServerSetup.md",
      "size": 7434,
      "truncated": false,
      "content": "..."
    }
  },
  "public": false,
  "created_at": "2017-07-13T19:01:10Z",
  "updated_at": "2017-07-13T19:01:10Z",
  "description": "Personally written version of Chris Fidao's video on setting up a Forge like server: https://youtu.be/VQNrsMYCOFg ",
  "comments": 0,
  "user": null,
  "comments_url": "https://api.github.com/gists/53e1780a5a68fe9281cfbbc9820d381f/comments",
  "owner": {
    "login": "m1guelpf",
    "id": 23558090,
    "avatar_url": "https://avatars0.githubusercontent.com/u/23558090?v=4",
    "gravatar_id": "",
    "url": "https://api.github.com/users/m1guelpf",
    "html_url": "https://github.com/m1guelpf",
    "followers_url": "https://api.github.com/users/m1guelpf/followers",
    "following_url": "https://api.github.com/users/m1guelpf/following{/other_user}",
    "gists_url": "https://api.github.com/users/m1guelpf/gists{/gist_id}",
    "starred_url": "https://api.github.com/users/m1guelpf/starred{/owner}{/repo}",
    "subscriptions_url": "https://api.github.com/users/m1guelpf/subscriptions",
    "organizations_url": "https://api.github.com/users/m1guelpf/orgs",
    "repos_url": "https://api.github.com/users/m1guelpf/repos",
    "events_url": "https://api.github.com/users/m1guelpf/events{/privacy}",
    "received_events_url": "https://api.github.com/users/m1guelpf/received_events",
    "type": "User",
    "site_admin": false
  },
  "fork_of": null,
  "forks": [

  ],
  "truncated": false
}

This are the three ways you can get data from GitHub Gists. Now it's up to you to decide which one of them suits your use-case better.

Happy coding!

Enjoyed the article? Consider sharing it on Twitter so others can enjoy it too :)

Receive project updates, article drafts & thoughts on your inbox every saturday.

Subscribe
next article
Free hosting for markdown-based presentations
previous article
Building a Laravel Blog App with Fly