Publish a blazingly fast and super cool blogroll with recent posts using Github Actions and Pages!
Fast Setup ⚡ Low Maintenance 💪 Extremely Dapper 😎 Statically-Generated
I'm a big advocate that everyone should be maintaining a blogroll. Not super actively - maybe more passively - but you should definitely have one. No doubt there's dozens of blogs a year you tune into - an article here to get help on an issue, an article there to learn about a topic, articles for fun or insight or curiousity. If you need some convincing, I wrote a bit about this - on my blog!
This template repo makes it ridiculously easy to get up and going with a standalone blogroll that doubles as an RSS reader, displaying the most recent posts from your blogs' RSS feeds. Since it's a template repo and not a standalone app or library, it's infinitely customizable for you to make it your own.
It's easy to set up your own blogroll using this repo, though it does include a couple steps to configure GitHub appropriately:
- Create a new repo using this template (follow that link or click the
Use this template
button on the top right) - On your new repository, go to Settings > Actions (under Code and Automation) > General, and in the section Workflow permissions:
- Select
Read and Write Permissions
- Check
Allow GitHub Actions to create and approve pull requests
- Click Save
- Select
- Note that the very first run will have failed - this is because the above permission for GitHub Actions was not set. After granting the permission the build should work, so let's kick off a build which will generate a new branch called
gh-pages
(from which we'll deploy the site). Add an RSS feed toFeeds
inconfig.json
and commit it to test that the build works. RSS implementations can vary widely, and sometimes RSS files can be invalid. I like testing withhttps://gizmodo.com/feed
because I know it's always well-formed. If the build worked, there should now be agh-pages
branch in your repository! - Now that we have the
gh-pages
branch built with our generated site, we can deploy it using GitHub Pages. On your repository, go to Settings > Pages (Under Code and Automation), and in the Build and Deployment section:- Set Source to
Deploy from a branch
- Select
gh-pages
as the Branch - Click Save
- Set Source to
- Your site should deploy in a few seconds to a default URL. Navigate to this URL to ensure it deployed correctly.
- You're done! Add all the RSS feeds you want, though be careful that invalid RSS files can cause the build to fail. Continue on this README for all the options you have for configuration, and then when you're happy share your blogroll with the world!
The only final step is to show off your fancy new blogroll: post your blogroll in our showcases in the discussions for this repo!
If you get stuck anywhere please feel free to ask a question in the discussions on this repository, or search if someone's already had the same issue. I aim to respond within the next business day unless I'm out on vacation.
The way the Action workflow works is it runs the build tool then copies the output HTML files into a separate branch, gh-pages
from which Pages deploys the site. In order to do this, Actions needs permissions to be manually configured in the repository settings (described in step 2 above). When you first create your repository, you'll notice that Actions will kick off the workflow and this first run will fail because the permissions weren't set. It's important to follow through to step 3 above to commit to the main branch to trigger a rebuild. If this one fails, be sure to check that you're checking the exact setting described above.
Pages has some interesting, clever tricks up its sleeve about where it deploys your site. If you're like me, you might have a separate repo using Pages to host a personal (or some other) site with a custom URL - in my case it's ian.wold.guru. If that's the case, Pages will deploy your site to <your-url>/<your-repo-name>
, which in my case was ian.wold.guru/Blogroll. This might be desirable for you, or it might not. If your DNS for your custom domain is improperly configured, your site will not show even though Actions will report that it deployed your new blogroll to <your-url>/<your-repo-name>
. Be sure to check your DNS settings on your custom domain. For more documentation about how Pages works with custom domains, check out Pages' documentation.
The config.json
file contains all the configuration for the generated site:
Title
is the title of the generated blogroll site, both the page title (<title>
) as well as at the top of the navigation bar.PostsToShow
is the maximum number of posts from your RSS feeds to display on the "latest" page. Set to-1
to show all posts.CssUrl
is the URL to the CSS for your page. By default this is MVP.css, which I recommend because of its quality in styling plain HTML. This can be a URL to any CSS served via CDN, or to set this to your own CSS file putyourfile.css
in theStatic
directory then set this property to./yourfile.css
. Note that if your CSS requires any modifications to the HTML, you can update the templates in theTemplates
directory.Pages
contains the title and subtitle settings for the Blogroll and Latest pages, which are the headings that display at the top of each page. You can write any HTML in these properties you like!Feeds
is the set of links to your RSS feeds.
This is very intentionally not a product you install and host, but a template for you to make your own repo and do your own thing with. It's a base canvas you can use and extend however works best for you!
/Static
Files in this directory are copied over to the root level of the output directory. You can include CSS, favicon, anything!Robots.txt
is the only file here by default. This controls how search engines navigate your site. By default it only includesnoindex nofollow
, which prevents search engines from listing the site.
/Templates
this includes the templates for the Blogroll and Latest pages, as well as a base layout which holds the containing HTML for each page.build.csx
is the C# Script file that generates the static site. It reads inconfig.json
, fetches and processes the RSS feeds, then uses Metalsharp to generate the site. You can edit this file to change any aspect of how the site is built. The site is deployed via GitHub Actions.
The workflow is defined at .github/workflows/build.yml
; you can edit this file to change when the site is built or some aspects around its deployment.
It will run each day at midnight automatically, or when you push to the main
branch. It sets up dotnet
and dotnet-script
so that it can run the CSX file. That setup is cached, so it will take longer to setup the first time but subsequent setups will only take a few seconds to fetch the cached files.
It then runs build.csx
, which outputs the site to /output
. The contents of that file are then committed onto the gh-pages
branch, from which GitHub Pages will deploy.
Thank you for your interest, I would love for you to contribute! If you have an idea for something to add please open a discussion on it and we can figure out next steps. I can't promise to include all features, my goal is to maintain this as a lightweight, super-easy way for folks to start a repo and get going.
If you've identified a bug please open an issue and I'll be sure to prioritize it. However, if you already have a simple fix it's definitely alright to open a PR off the bat!