Post to your GitHub-hosted blog using a simple bookmarklet.

TL;DR

Go to github.com/vrypan/jekyll-post-via-web.

Background

Jekyll is a blog-aware, static site generator in Ruby, probably the most popular of its kind. One of the reasons it's so popular is that it's "extremely" easy to host a jekyll blog on GitHub.

Most users think of GitHub as an advanced file system, and that updating a GitHub hosted jekyll blog means uploading new content using git. However, GitHub is actually an advanced document store with a REST API, event webhooks and other powerful features.

So, in theory, one should be able to post to a GitHub-hosted Jekyll blog (i.e. crete a new markdown document in a GitHub repo), using javascript served from a static page, right?

Since I wanted to host my linkblog on GitHub, and I wanted a simple way to post to it using a bookmarklet, I decided to see if I could put something like this together. And it worked, like a charm!

This is my linkblog and here is a screenshot of the bookmarklet in action:

Installation

1. Download cms.html from github.com/vrypan/jekyll-post-via-web,
2. copy it in your Jekyll source folder,
3. deploy the updates to GitHub, and
4. visit cms.html at your blog, usually at <site.url>/<site.baseurl>/cms.html

Notes, ideas and thoughts

1. You will need to enter your GitHub username/password every time you post using the bookmarklet. This is a requirement (as far as I know) of the GitHub API. This is safe, as they are just sent to GitHub and no one else, but it's not very convenient. I could use something like storing them in a cookie or in the browser's local storage, but I was a bit concerned about security implications. I decided to go with a hack: Clicking "remember username/password" will post the form to itself, making your browser to bring up the "remember password" options (or even a third-party password manager if you use one). I feel this is a workflow users are more familiar with (and it's implications).

2. There is huge space for improvements, like showing up tagging options, or identifying media in the page to be bookmarked (for example, photos or video embeds) and automatically generating different post types.

3. It may be a good idea to use a third-party javascript library to access the GitHub API. I wanted to keep this first version as simple as a single HTML page, but future versions may include other elements too —but I'm not 100% sure if this is the way to go.

4. It should not be difficult to turn jekyll-post-via-web into a full featured CMS that allows users to edit existing posts, etc. In the meantime, I modified my linkblog templates to include a link to the source of each post ({{ site.github_repo }}/{{ site.github_branch }}/{{ page.path }}), where I can use the GitHub web interface to edit it.