Jekyll, the static site generator, uses the _config.yml
for configuration. The configurations are all Jekyll-specific. But you can also define variables with our own content in these files and use them throughout your website. In this article, I'll highlight some advantages of dynamically creating Jekyll config files.
On my local laptop, I use the following command to serve my Jekyll website for testing:
bundle exec jekyll serve --incremental --config _config.yml
Combining many configuration files
During local testing, it's sometimes necessary to override configuration options. My website's current _config.yml has the following settings:
# Jekyll Configuration
# Site Settings
url: "https://notes.ayushsharma.in"
website_url: "https://notes.ayushsharma.in/"
title: ayush sharma's notes ☕ + ? + ?️
email: ayush@ayushsharma.in
images-path: /static/images/
videos-path: /static/videos/
js-path: /static/js/
baseurl: "" # the subpath of your site, e.g. /blog
Since the local jekyll serve
URL is http : //localhost:4000, the URL defined above won’t work. I can always create a copy of _config.yml
as _config-local.yml
and replace all the values. But there is an easier option.
Jekyll allows specifying many configuration files with later declarations overriding previous ones. This means I can define a new _config-local.yml
with the following code:
url:""
Then I can combine the above file with my main _config.yml
like this:
bundle exec jekyll serve --incremental --config _config.yml,_config-local.yml
By combining both files, the final value of url
for this jekyll serve
will be blank. This turns all URLs defined in my website into relative URLs and makes them work on my local laptop.
Combining dynamic config files
As a simple example, suppose you want to display the current date on your website. The bash command for this is:
> date '+%A, %d %B %Y'
Saturday, 16 October 2021
I know I can use Jekyll's _config.yml's for custom content as well. I'll output the above date into a new Jekyll config file.
my_date=`date '+%A, %d %B %Y'`; echo 'my_date: "'$my_date'"' > _config-data.yml
Now _config-data.yml
contains:
my_date: "Saturday, 16 October 2021"
I can combine my new config file with the others and use the my_date
variable on my website.
bundle exec jekyll serve --incremental --config _config.yml,_config-local.yml,_config-data.yml
On running the above command, {{ site.my_date }}
outputs its configured value.
Conclusion
The example above is quite simple, but the possibilities are endless. Bash, Python, and other programming languages can dynamically generate Jekyll config files. I can then combine these during the build
or serve
process.
For findmymastodon.com, I'm using Python to fetch Mastodon user statistics. I'm then writing these into a new _config-data.yml file (currently manually). Finally, the home page and others display these from the configuration file. This way, I can leverage a dynamic backend and still keep all the static website goodness I'm so fond of.
I hope this has sparked some ideas for your own static websites. Jamstack is great for static websites, but you can avoid creating an entire API backend for dynamic content. Why not instead use a build job to create config files with updated content? It might not suit every use case, but one less API means fewer infrastructure moving parts.
I hope this helps you in some way during your next static website project. Keep reading, and happy coding.
This article originally appeared on the author's website and is republished with permission.
Comments are closed.