Blogging AI with Jupyter and Quarto

setup
blog
Jupyter
Quarto
Published

February 8, 2023

Modified

March 3, 2023

Introduction

Welcome to my blog! My name is Sam Watkins, and I am a programmer and math enthusiast with a keen interest in artificial intelligence. As part of my journey to learn more about AI, I am starting this blog to document my studies, particularly with the fast.ai book and courses.

In this first post, I will provide an overview of why I am starting this blog and share some details on how I plan to use Jupyter, Quarto, and nbdev2 tools to create software libraries, documentation, apps, and blog posts. I believe that blogging will not only help me solidify my understanding of AI but also provide a platform to share my insights and get feedback from others in the community. Blogging can be a powerful tool for learning, networking, and personal development.

I want to note from the beginning, that I am using ChatGPT to help me write better blog posts; but I’m doing most of the work!

Why write a blog?

In a previous post on dev.to, I discussed the benefits of keeping a development log. Writing about my progress helps me learn more effectively, and the feedback I receive can be invaluable. I’ve also learned from the success of other developers, like the creator of the game Gunpoint, who grew a community around his blog and received feedback at every step of his project.

I hope that by starting this blog, I can experience some of the benefits of blogging for myself and maybe help others in the process. Please leave a comment using the hypothes.is plugin on the right side, if you have any thoughts on the topic or suggestions for me as I begin this journey.

See also

Why use Jupyter and Quarto?

The fast.ai team recommends to work in Jupyter and blog using Quarto. Their nbdev2 tool also makes use of Quarto. We can work on a notebooks in Jupyter, then run them through nbdev2 and Quarto to produce software libraries, documentation, apps, blog posts, papers, and even books.

See also
  • fast.ai: A company that provides practical deep learning courses and libraries, as well as open source software tools for building and deploying deep learning models.
  • nbdev+Quarto: A new secret weapon for productivity: The blog post recommending to use Jupyter with nbdev and Quarto.
  • Jupyter: A web-based interactive development environment for creating notebooks, code, and data visualizations. Supports multiple programming languages.
  • Quarto: A document automation tool that can be used for creating books, reports, and blogs using Markdown, Jupyter Notebooks, and other file formats.
  • nbdev: A tool that helps you develop Python packages using Jupyter Notebooks.

Installing the software

I am running the AI tools on my home PC, with Debian GNU/Linux and an NVIDIA GPU. I’ll write more about my setup in another post.

I downloaded Quarto from their Get Started page, and installed it.

To manage the installation of Python packages, I’m using pip, which is a package installer for Python. It’s a command-line utility that helps you install and manage software packages written in Python. You can learn more about pip and its usage from the official pip documentation.

This command installs or upgrades Jupyter, fastbook, and nbdev Python packages, which I’ll need to use for AI experiments and to help me write my blog.

pip install -qq -U jupyter fastbook nbdev

Setting up the blog

To set up the blog, I first created a Git repository called ai in my home directory. I used the following commands to create the blog project.

cd
mkdir -p ai
cd ai
git init
Reinitialized existing Git repository in /home/sam/ai/.git/
quarto create-project blog --type website:blog
Creating project at /home/sam/ai/blog:
  - Created _quarto.yml
  - Created .gitignore
  - Created index.qmd
  - Created posts/welcome/index.qmd
  - Created posts/post-with-code/index.qmd
  - Created about.qmd
  - Created styles.css
  - Created posts/_metadata.yml

I also ran the command nbdev_install_hooks to prevent unnecessary Git merge conflicts and enable conflict resolution in Jupyter.

nbdev_install_hooks
Hooks are installed.
See also

Adding this post to the blog

I had already started writing this post in a Jupyter Lab notebook blogging.ipynb. Now I needed to put it in the right place, so I made a directory for it:

I started writing this post in a Jupyter Lab notebook called blogging.ipynb. When I got to this point, I needed to put it in the right directory to include it in the blog. I first created a directory called blog/posts/blogging:

mkdir -p blog/posts/blogging

Then I simply moved the blogging.ipynb file to that directory using Jupyter Lab’s file browser. This allowed me to easily include the post in the blog without even having to close the notebook.

Previewing the blog

Once you’ve set up your blog, you can preview it by running the following command in a terminal:

quarto preview blog

Make sure to run this command outside of Jupyter, as it can cause Jupyter to hang if run in a cell.

You can also use additional options to customize the preview. For example, if you don’t want to launch a browser, you can use the –no-browser option. If you want to specify a custom port, you can use the –port option followed by the desired port number. Here’s an example of how to use both options:

quarto preview blog --no-browser --port 4242

This will start the preview on port 4242 and prevent it from automatically launching a browser. I do it this way myself, because I open the preview window from a separate startup script.

Finishing up

To clean up the blog ready for publishing my first post, I removed the example posts, changed the settings, filled in the about page, added links to my social media profiles, and added a profile picture.

I also followed the Quarto documentation to enable comments using Hypothesis and an RSS feed for the blog.

The Hypothesis annotation tool to allow readers to leave comments and annotations on the blog posts. This feature required me to create an Hypothesis account and link it to the blog. It’s functional, but looks and feels different from regular commenting. Please try it out and leave a comment for me.

For the RSS feed, I followed the Quarto guide to add an RSS feed to the blog. This enables readers to subscribe to the blog and receive updates whenever new posts are published. Personally I am using the Miniflux RSS reader; Newsblur is another good option. After a bit of research, I found that I can follow the comments on my blog using this RSS stream.

See also

Committing to git

The Quarto doc says “you should always fully quarto render your site before deploying it”, so let’s do it, and commit to git:

cd ~/ai
quarto render blog
git add blog
git commit -m 'update blog'
git push
git push opal
git push pi

I pushed to github, and my two servers opal and pi.

See also

Publishing the blog

I used a symlink on my server to put the rendered blog into my website at sam.ucm.dev/blog:

ln -s ~/ai/blog/_site ~/www/sam.ucm.dev/blog
See also

Conclusion

In this post, we’ve seen how to set up a blog using Quarto and Jupyter. These tools allow us to write and publish blog posts as Jupyter notebooks, which can be converted to various formats such as HTML, PDF, and LaTeX, among others. We’ve also looked at using Hypothesis for comments and annotations, and how to commit our changes to git and deploy our blog on a personal server. By following these steps, we can create a blog that showcases our AI studies and provides a platform for getting feedback, sharing knowledge, and building a community.

One thing I would like to explore further, is a way that I can automatically link to other AI bloggers in the community. Link sharing and discovery is one of the benefits of posting on an off-the-shelf playform, such as Towards Data Science; it would be good to have something similar for indie bloggers. Maybe just an RSS aggregator plugin that would show links to other recent posts from selected friends and communities…

If you have any questions or suggestions, please leave a comment, if you can figure out how to use Hypothesis. Thanks for reading!