GitHub: How we think about browsers

GitHub is currently shipping ES2019-compatible code, and will soon ship ES2020 code. GitHub will soon be serving JavaScript using syntax features found in the ECMAScript 2020 standard, which includes the optional chaining and nullish coalescing operators. This change will lead to a 10kb reduction in JavaScript across the site. Wow, won’t that exclude a whole …

GitHub Skyline — Your GitHub Story in 3D

Nice in-browser 3D-render of your GitHub History. You can download the result as a .stl file to run it through your 3D printer. Here’s my 2020 timeline for example: I take pride in the fact that my Saturdays (front row) and Sundays (back row) remain as good as empty, and that there’s an occasional gap …

GitHub1s — One second to read GitHub code with VS Code

This tool — not endorsed nor affiliated with GitHub — lets you quickly load any GitHub repo in an online hosted Visual Studio Code environment. Just add 1s after github and press Enter in the browser address bar for any repository you want to read. Note that this is a *viewer* only, no editing. For …

How we built the GitHub globe

The GitHub homepage features a very nice rotating 3D globe, augmented with realtime data shooting around. Here’s how they built it: At the most fundamental level, the globe runs in a WebGL context powered by three.js. We feed it data of recent pull requests that have been created and merged around the world through a …

Customizing GitHub Gist Embeds

When embedding a GitHub Gist using a script tag, its contents gets injected into your page’s DOM. As the injected wrapper node has a .gist class, it’s perfectly possible to customize the appearance on your own site. Will Boyd walks us through it. Will also created a repository with several pre-built themes. Simply add one …

Automatically update your GitHub readme through GitHub Actions

Pawel Grzybek has set up a workflow that uses GitHub Actions’ Scheduled Events to automatically update his profile README.md. It runs every 6 hours and pulls in his RSS feed to populate the README.md import fs from "fs"; import fetch from "node-fetch"; import parser from "xml2json"; const FEED_URL = "https://pawelgrzybek.com/feed.xml"; const TAG_OPEN = `<!– FEED-START …

Run your GitHub Actions locally with act

When you run act it reads in your GitHub Actions from .github/workflows/ and determines the set of actions that need to be run. It uses the Docker API to either pull or build the necessary images, as defined in your workflow files and finally determines the execution path based on the dependencies that were defined. …

Webmentions on a static site with GitHub Actions

Sebastian his website supports Webmentions. To show these on his website he used a tad of JS to display them underneath each page. Not being 100% happy with that flow, he sought a better way to implement these … After some tinkering, I came up with an alternative: a cron-based GitHub Action that queries webmention.io …

RSS Feeds for GitHub Project Releases and User Activity

As an extra to RSS feed for youtube channels and GitHub projects, Pawel notes that it’s also possible to get a feed for the releases published in GitHub Projects. GitHub gives us RSS feeds for project releases and tags. Thats my preferred way of finding out about my followed projects fixed bugs and new features. …

Easily Build and push Docker images with the `build-push-action` GitHub Action

The Docker folks have released their first GitHub Action build-push-action which builds and pushes Docker images and will log in to a Docker registry if required. Building and pushing an image becomes really easy: uses: docker/build-push-action@v1 with: username: ${{ secrets.DOCKER_USERNAME }} password: ${{ secrets.DOCKER_PASSWORD }} repository: myorg/myrepository tags: latest Amongst other options you can also …