3.0 KiB
date, title, feature_link, feature_text, description, isStarred, tags, categories, images, keywords, series, syndication, comments
| date | title | feature_link | feature_text | description | isStarred | tags | categories | images | keywords | series | syndication | comments | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 2025-09-01T08:40:34+02:00 | Hugo Blog With Jupyter Notebook | https://www.midjourney.com/home/ | by IA Midjourney | How to integrate a Jupyter Notebook to your Hugo Blog | false |
|
|
null | null |
|
|
|
A long time ago, I wrote a [post]({{< relref "/post/2017/jupyter-notebook-pelican-combo/" >}}) about writing a post for the Pelican static site generator made with a Jupyter Notebook. I did it because, at the time, I was a huge fan of the Notebooks and I had the blog generated by Pelican so...
And now, after a PyDataVe (the 22nd event), I make a Jupyter Notebook after a lot of time and I feel the need to have a solution for make a Jupyter Notebook one of the post of my blog so I find a way to do it. This time in Hugo
Jupyter in my Hugo
So first I search for a way to convert a Jupyter Notebook to a Markdown file with the headers for Hugo. So I find a python module to generate a Notebook with a starting metadata for my blog. All the metadata are inside the first cell set as a Markdown type cell.
All this is made by launching this command for generate the notebook
hugo_nbnew content/post/test-hugo-page
And at the end of all the writing I launch this command
hugo_nbconvert content/post/test-hugo-page/index.ipynb
for generate/updating the markdown file for Hugo.
Other little things I have done
After testing all of this stuff I make some script for my personal writing pipeline (if I don't make some automation I feel bad) I fix some CSS of my site for the code part. I am a Backend Dev, so I don't share my CSS edit because it is something working but not so pretty to share...
After that I find myself wanting to have some way to cite a part of the post with a link (because I want to share a specific part of the post as a response to post/tweet/tooth on the web) and I search for something clean and usefull.
So I find a JS script for adding deep anchor links to my post and I set it to add a deep anchor for every paragraph of the posts.
And after all I check if I implement the meta tag for journalism for Mastodon because I share a lot of stuff on Mastodon.
Final consideration
I like my new configuration with the possibility to add Jupyter Notebook in my blog and this is the first Notebook I had to my Hugo Blog. I also like the idea that I can work for something else, make a Notebook and, only changing the data, make multiple article about something with the updated data every time I need to add the blog with the latest report for the dataset.