Category Archives: Web

How to Use GitHub Pages for Parked Domains

ifmodified.com screenshot

For domain names I’ve reserved but haven’t done anything with yet, I like to have them parked with my own simple landing page rather than one of those ad-filled “parked domain” pages hosted by the registrar. Previously I had set mine up on a Digital Ocean VM. This wasn’t too difficult (and had a side benefit of forcing me to brush up on my Apache HTTP Server skills) but I’ve switched to a much easier method: hosting for free via GitHub Pages. This is not only free in terms of cost, but also time because it’s very simple to set up and run.

GitHub Pages

First of all this was a good excuse to finally learn more about GitHub pages and support for building static sites with Jekyll. In essence GitHub will automatically create and publish an HTML website from your repo source files. Both public and private repos are supported; GitHub will remind you that all generated sites are public though, so be careful if publishing private repos this way.

For anyone wanting to learn more, I suggest going through the Jekyll Quickstart first and then the specific notes for running Jekyll on GitHub Pages. After coming up to speed on the basics, I tried publishing things a few different ways and came to a few conclusions:

  • Pages makes it very easy to publish automatically (no need for any separate deployment tools)
  • You can use either full Jekyll, or fall back to writing your own HTML (which Jekyll which simply publish as-is)
  • Troubleshooting Jekyll build issues is difficult if not impossible
  • With an NPM module it’s possible to run the Pages build locally which is very helpful for debugging
  • The GitHub documentation for Pages is pretty confusing
  • Pages would be a great solution for anything simple, but not for anything more complex or critical
  • SSL is included, and certificate renewals are automatic (thanks to Let’s Encrypt)
  • Custom domains are also supported (no charge)

In the end I decided to go with a very plain HTML solution without anything Jekyll specific. Read on to see the steps I followed.

Setting up Parked Domains on GitHub Pages

These are the steps I followed for setting up my parked domain name pages on GitHub Pages. The example I’ll use here is my domain ifmodified.com.

  1. For your domain name (whether it’s new or existing), lower the DNS time to live (TTL) to be very short (an hour or less). If you had an existing TTL which was longer, you can do this step the day before to give it time to propagate.
  2. On GitHub, create a new public repo and choose the option to include a starter README. I’m using the domain name as the repo name, so my repo is at bcantoni/ifmodified.com.
  3. Note that private repos work too, but since the site is going to be public anyways, it seems to make sense for the repo to be public.
  4. On your local system, do a git clone to bring the repo down.
  5. Add your web content (even if just a simple index.html).
  6. Commit and push
  7. On the GitHub repo settings, enable GitHub Pages and choose the option to publish from root of the master branch. (Other options here include using the /docs path in the master branch, or the dedicated gh-pages branch.) I also like to turn off wikis, issues and projects since none of those will be needed.
  8. Your site should now be available on youruserid.github.io/yourdomainname.com.
  9. Next you’ll set up your custom domain by starting at your DNS provider. Add an A round-robin pool to include the 4 GitHub IP addresses: 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153.
  10. Wait a bit for this change to propagate, then check the DNS entry on your system with the command line dig yourdomainname.com. If dig does not respond with the new expected IP addresses, wait and try again later.
  11. Once the DNS lookup is working, return to the GitHub Pages settings and enter your domain as the custom domain name and save it.
  12. After a moment, GitHub should say your site is now available under yourdomainname.com.
  13. Finally you can enable Enforce HTTPS. After several minutes, this will be configured on the GitHub side and you can confirm by visiting your custom domain.
  14. If you have any trouble, remove and then re-add the custom domain name. That step will trigger the logic on the GitHub side to reconfigure everything.
  15. Once everything is confirmed working, return to your DNS provider and set a normal TTL once again (typically 24 hours or more).
  16. Whenever you need to make site content changes, just push them to GitHub and your results will automatically go live right away.

The UI might change around a bit over, but as of this writing here’s what the GitHub Pages settings section will look like when done:

Screenshot of GitHub Pages settings

Finally the results – these are my currently parked domains which are all using this technique:

For completeness, I also used the same method to hang a really simple landing page for Gorepoint (this one uses a minimal design built with Materialize.)

Photo credit: chuttersnap on Unsplash

HTTP Request Inspectors

Someone wrote in to let me know that an older project of mine which provides a simple webservice echo test was referencing some out of date projects. My HTTP test service doesn’t use any of those other services, but I’ve updated the blog post description to point to some new options for comparison purposes.

The original hosted version of RequestBin (at requestb.in) is no longer live. This was run by Runscope at the time and the source code is still up on GitHub (Runscope/requestbin). You can see their the status change:

We have discontinued the publicly hosted version of RequestBin due to ongoing abuse that made it very difficult to keep the site up reliably. Please see instructions below for setting up your own self-hosted instance.

Here’s the commit with the awesome (but sad) commit message of :( when they turned it off. Some good comments there from fans of the service.

The good news is with the source code still available, people can still use the service themselves (Heroku and Docker instructions are included) and the adventurous ones can run live services using the same. Here are a few I found with some quick searching (but have not personally used):

Tweetfave Support for Longer Tweets

Tonight I spent a couple hours troubleshooting a problem with my Tweetfave service and handling of links. Luckily I discovered it was a simple matter of keeping up with Twitter’s API changes. This service has been running so smoothly and the API has actually been pretty stable. I needed to dust off my PHP skills and dig in to track down and adapt to an important change.

Background

Tweetfave is a free service which monitors the tweets you mark as favorites (now referred to as “likes”), then sends them to you by email. Currently the system stats show over 250 users have tried the service, recording just under 400,000 tweets!

One of the handy features in Tweetfave is the “un-shortening” of the short URLs embedded in the tweet. Rather than showing a generic “http://t.co/xyz” link, the software will reveal the original URL.

Problem

This has all been working fine, but recently I noticed something strange where the URL decoding resulted in a link back to the original tweet. Instead we should be seeing the the links within the tweet.

Here’s an example with the original tweet which doesn’t have any links, but does include an embedded image which should have a Twitter image URL:

Truebeck tweet screenshot
Example tweet with image

However when it’s processed by Tweetfave, the resulting email snippet shows a link back to https://twitter.com/i/web/status/831963043508596736 which is the original tweet:

Truebeck tweetfave email snippet
Incorrect Tweetfave email snippet

Solution

It took a bit of trial and error, debug logging, and Google searching to find the culprit: the support for more than 140 characters in tweets. When Twitter added that support, they wanted to retain compatibility. Any API call which returned tweet text was still limited to 140 characters, with the link back to the tweet to read the rest.

It looks like the announcements came out in May 2016:

They were a little fuzzy about when the actual changes would happen, but from my logs I think it was around October 2016.

In the end the change was quite simple:

  1. Include the parameters extended_tweet=true in the API requests
  2. Retrieve the original tweet text from the full_text rather than text response field

With those changes in place everything works again. For example this tweet from TheNextWeb includes both an article link and an image:

TNW tweet screenshot
Example tweet with image and link

Once decoded and sent by Tweetfave, the result included decoded links for both the article and the picture:

TNW Tweetfave email snippet
Corrected Tweetfave email snippet

Tech Advent Calendars – 2016

City Advent Calendar 2012 by brickset on Flickr

It’s that time of the year again and I’m happy to see Advent calendars for many tech communities are still going strong. As in past years (2011, 2012, 2013, 2014, and for some reason skipped 2015), I’ve gathered a few here that I’ll be following this year:

In years past I also created a combined feed through Yahoo! Pipes, but sadly that service was shut down in 2015.

Luckily there is still a bit of RSS and feed infrastructure out there, including the aptly-named RSS Mix. Here’s a combined RSS feed with all of the above calendars: http://www.rssmix.com/u/8215936/rss.xml

Update: The RSS Mix feed was sometimes not working correctly, so I also created a mix using MailChimp’s ChimpFeedr service: http://mix.chimpfeedr.com/af982-Tech-Advent-2016

Update #2: From Perl Weekly I just learned about Advent Planet which combines all of the above advent calendars and more into one mega-advent!

Happy Holidays!

Tech Advent Calendars – 2014

Update: For the latest, check out Tech Advent Calendars – 2016

It’s that time of the year again – Advent calendars for many tech communities. As in past years (2011, 2012, 2013), I’ve gathered a few here that should be interesting:
* Perf Planet Advent (performance) – Feed
* 24ways Advent (web design/development) – Feed
* Perl Advent (Perl language) – Feed
* Java Advent (Java language) – Feed
* UXMas (UX for everyone) – Feed
* SysAdvent (Sysadmin) – Feed I have a combined RSS feed (created with Yahoo! Pipes) that picks up all of these advent calendars:

http://feeds.feedburner.com/TechAdventCalendars. (Yahoo Pipe source).