#TIL: Using littlefoot.js with Next.js

For a long time, I've had some ideas of what I would want my blog to look like, many of which were inspired by other blogs I've read, like Hynek's use of bigfoot.js for better looking footnotes¹.

When I [finally] sat down to start working on a blog, it was one of the first things I looked into. I noticed bigfoot.js wasn't actively maintained, and required jQuery, so I decided to take a quick look at what else was out there and came across littlefoot.js -- a fork of bigfoot that doesn't require jQuery 🎉🎉🎉

Adding littlefoot to this Next.js-based blog was as simple² as:

import { useEffect } from 'react'
import 'littlefoot/dist/littlefoot.css'
export default function App({ Component, pageProps }) {
  useEffect(() => {
    const { littlefoot } = require('littlefoot')
    littlefoot()
  })
  // ... rest of App
}