Tracking commits to a GitHub repo with RSS

Watching a repo on GitHub will keep you up to date with it’s issues and pull requests. From time to time there are repos that need a closer eye kept on them though.

I inspected the page of one such repo this afternoon and to my slight surprise found what I was after: an RSS feed. Props to GitHub for going one step further by providing per-branch commit feeds, structured like this:

https://github.com/user/repo/commits/branch.atom

A working example:

https://github.com/elliotekj/specify/commits/master.atom

New about page

I finally took some time this weekend to sit down and write an about page for this site. As part of my continued push for this site to tell a complete story—to document both the personal and professional ups and downs, I forced myself to break out of the boilerplate 3 line about page I’ve some to expect on personal websites:

Hello, my name’s NAME. I work at COMPANY in CITY as a JOB TITLE. Formerly at OLDCOMAPNY and OLDCOMPANY2. Feel free to get in touch.

Read on, there’s more ⇒

Improving webfont performance with FontFaceObserver and sessionStorage

I spent some time trying to optimise webfont loading on this site yesterday. The current best-practice for most websites leverages FontFaceObserver and sessionStorage.

FontFaceObserver is a fairly small Javascript library made by Bram Stein that will load one or multiple @font-faces, then notify you once they have finished loading via a Promise. sessionStorage is like localStorage except that, as it’s name suggests, it expires at the end of the session. We’ll be using it to keep track of whether or not the fonts have been loaded.

Let’s start by adding the necessary @font-face syntax to our CSS. This site uses Domine, which I self-host. FontFaceObserver is compatible with any webfont service though.

Read on, there’s more ⇒

On importing my old writing

I’ve been going back and forth with myself on this for what feels like an age. When I came back to having everything associated with this domain, including my writing, I started afresh.

The question I’ve been going back and forth on is whether or not I should import my old writing. Having started afresh, I feel like the site no longer tells the full story. Whether we like it or not we are a culmination of the events of our past, and whilst there are posts I’ve written in the past that I regret publishing and/or no longer agree with, redacting or deleting them isn’t going to change the fact that once upon a time I put them out into the world with my name next to them. Doing that feels like I’m being deceitful—first and foremostly to myself.

All that to say that I have now imported all the old posts from casualnotebook.com and all the posts I could find from the first version of elliotekj.com as they were originally published.

Screencast #1: How I manage my dotfiles with GitHub

There are plenty of different ways to manage dotfiles. This screencast shows you how I sync mine across machines via GitHub.

I like this solution because it doesn’t rely on any tools other than Git which is more or less platform-ubiquitous. There’s no need to install other scripts or software and if you’re not a fan of GitHub then you can just as easily use Bitbucket or any other host.

Hacker News commenter StreakyCobra is the brains behind this setup and, as I mentioned in the video, it’s a setup that has served me flawlessly so far.

Configuration for a cleaner command history in ZSH

Being able to scroll back through all of the commands entered into the terminal with the up arrow key is very handy. A level of annoyance is added when having to scroll back through all the occurrences of a command that was repeated multiple times in succession however.

Fortunately, there’s an option you can set in your .zshrc to reduce a block of repeated commands down to just one line in the command history.

setopt hist_ignore_dups # Don't save multiple instances of a command when run in succession

You can go further with the setopt hist_ignore_all_dups option. With that set, all previously saved commands that match the command you just entered will be removed from the history. I personally don’t like this though, as when I’m going back through my history I like having the complete context around any previously entered command.

Lastly, in the name of a cleaner command history, you can set setopt hist_reduce_blanks which will just remove any superfluous whitespace from the command before saving it to the history.

Section comments with centred text in Vim

Everyone has their own taste when it comes to comment styles. I personally like section comments with centred text as shown below. They’re time consuming to get right though so I tend to opt for a simpler format.

/* -------------------------------------------------------------------------- *
 *                                 COMPONENTS                                 *
 * -------------------------------------------------------------------------- */

Some light procrastination led me to investigating how much of the above layout could be automated in Vim. As it turns out, all of it. Here’s what the final workflow looks like in action.

center-block-comments-vim-demo.gif

The mapping isn’t particularly pleasant to read, but it works.

nnoremap <leader>sh VU:center 79<cr>0c2l<space>*<space><esc>A<space><esc>40A<space><esc>d79<bar>ch<space>*<esc>YPS<esc>i/*<space><esc>74A-<esc>A<space>*<esc>jo<esc>S<esc>i<space>*<space><esc>74A-<esc>A<space>*/<esc>o<esc>o<bs>

As a reminder, you can change the mapped commands based on the filetype of the file being edited. That way, <leader>sh can always be “section header” but the comment syntax can be changed for languages that don’t use /* */.

autocmd BufRead,BufNewFile *.{es6,js,scss,css} nnoremap <leader>sh VU:center 79<cr>

jQuery to pure JS: Target each direct child of an element

If you’re coming from jQuery to pure Javascript and are trying to target each direct child of an element, your first attempt to select the direct children will probably be element.querySelector('> *'). That will throw an error though, because .querySelector() doesn’t support tag-name wildcards.

Your next attempt might involve element.childNodes, and you’d be closer. The issue with that is that .childNodes will return all of the element’s children, not just the direct children.

Read on, there’s more ⇒