Skip to content

Instantly share code, notes, and snippets.

@jaredhirsch
Last active August 26, 2016 03:18
Show Gist options
  • Save jaredhirsch/ebd7266dbf23ef82fce75530c9db1f3a to your computer and use it in GitHub Desktop.
Save jaredhirsch/ebd7266dbf23ef82fce75530c9db1f3a to your computer and use it in GitHub Desktop.
tech articles as narrative git commits

Step 1: Visualizing single commits

Use the github API to get a JSON commit object (or use any git repo with an adapter (not included) that matches the parts of the github commit API schema that are used below)

Then, given a JSON blob representing an object,

  • template the code diff (response.files.patch) into a right pane with syntax highlighting
  • template the commit message (response.commit.message) through a markdown processor (like https://github.com/chjj/marked) and into a left pane with nice vertical rhythm.

Step 2: Visualizing multiple commits

Use the github tree API to get a list of commits for a given branch.

Then loop over that list and get the complete commit objects for each. Seems nicest to prefetch the previous and next few, but grabbing them one at a time is probably simplest: fetch, then fire a pubsub signal to update the page. Or, use React and tuck the commit data into the UI state machine, whatever.

UI:

  • create a (collapsible?) Table of Contents pane that lists the commits in order (SHA & title, maybe date)
  • add a back/forward control that does a fetch-then-update

I think that's it?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment