I recently ran into an issue when deploying WhatsPopularOnYouTube.com, an AngularJS app that displays a live feed of the most popular videos on YouTube.
The app was scaffolded with the Angular Seed Project, which offers a nice starting structure for Angular apps. When using the Angular Seed Project the document root for the app is the
app directory, which is one level above the repository root.
Since the app doesn't involve any server side coding, and a database is not needed, I wanted to use Github pages for hosting. My original plan was to push the entire repository up to Github and put the CNAME file in the
app directory, one level above the repository root. I figured this would work since I had seen something similar in the Jekyll repository, where there is a CNAME file in the
site directory, one level above the repository root.
I pushed the repository up, with the CNAME file in place, updated the A record at my registrar, and refreshed the page for about 10 minutes, only to continue getting a generic Github 404 error. I re-checked the A record at the registrar, re-checked the spelling on in my CNAME file, but everything was done properly. Finally, after Googling terms like 'github pages CNAME subdirectory' and learning nothing, I decided to contact Github about the issue
Much to my surprise, I received the following response...
Your CNAME file definitely needs to be in the root of the repository.
So I made that change and within 10 minutes my site was up and running.
The point of this blog post is to help out anyone who might have a similar idea about putting the CNAME file in a directory outside of the repository root. For example, someone who has seen the Jekyll repository (which has over 13,000 stars on Github at the time of writing this), might be inclined to think that the CNAME file could be placed there.
Since all the searches I ran on Google provided no quick guidance on this issue, hopefully this blog post will help someone out.
Using YouTube to integrate video into your website is suspiciously easy. Just use YouTube's iframe embed code and voila, you now have shiny video player on your web page.
However, there's a lot of suck that comes with embedding YouTube videos that way. "How much suck?" you might ask. Well, each YouTube video you embed will force your user to download roughly 400K of data, before they even click play.