How I built a now reading feature
I added a now reading section to my site to share the book I’m reading. It’s powered by GitHub Actions and the pressure that comes when all my library loans become available on the same day.
(I wrote about this idea last year when I built an e-paper display to show the book I’m reading.)
New outputs in read-action
To make this feature work, I updated read-action (my GitHub action that keeps track of my books in a JSON file) to add an output parameter. The nowReading
output parameter has the metadata of the book I’m reading.
Now, every time I use read-action to add a book I’ve started, my workflow can access a parameter containing the data to display that book on my site. But, I still need to get that data from a private repository to my public repository.
Pass data from repository to repository
Since I run read-action in a private repository, I used a repository dispatch to pass the book data to my public repository. I did this by updating the workflow in my private repository to add a step after read-action. This new step checks if read-action has the output parameter nowReading
. If it does, then it will use repository-dispatch to send the contents of nowReading
to my public repository as an event.
- name: Now reading
if: steps.read_action.outputs.nowReading != ''
uses: peter-evans/repository-dispatch@v2
with:
repository: katydecorah/katydecorah.github.io
event-type: now-reading
client-payload: '{"github": ${{ toJson(steps.read_action.outputs.nowReading) }}}'
In my public repository, I created a workflow that waits to receive the now-reading repository dispatch, and once triggered, it will write the contents to _data/now-reading.json
and commit the file.
name: Now reading
on:
repository_dispatch:
types: [now-reading]
jobs:
nowReading:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Update now-reading.json
env:
JSON_DOC: ${{ github.event.client_payload.github }}
run: |
echo $JSON_DOC > _data/now-reading.json
- run: |
git config --local user.email "action@github.com"
git config --local user.name "GitHub Action"
git add -A && git commit -m "📚 Now Reading"
git push
Markup the metadata
As soon as the workflow commits the file, GitHub pages will build the site to display the book. My site uses the following markup (more or less):
<h2>Now reading</h2>
{% assign nowReading = site.data['now-reading'] %}
<div class="home-now-reading">
<img alt="" src="book-{{nowReading.isbn}}.png" />
<div>
<strong>{{nowReading.title}}</strong> by {{nowReading.authors | join: ", "}}
</div>
</div>
Or, I can tell you right here, that I’m reading “The Employees” by Olga Ravn. (This sentence will update once I start a new book.)