in ✏️ Articles · meta

# How Do I Generate My Knowledge Base From Notable

This post is over 1 year old. Facts and opinions may have changed since the publication date. Contact me for any clarifications before jumping into any conclusions.

For quite a few time, I used Bear as my go-to Notes application for two reasons: it was simple to use and the syntax was quite similar to markdown. However, it is not markdown and it does not support some things that’d like to see on such software: diagrams, mathematics, wiki-like links, etc.

After searching for a bit I found out an app called Notable. In addition to having all the features I wanted from Bear, it is also storage independent, meaning everything is stored as markdown plain-files that I can version control with Git or some similar software.

I only have one small complain about the project and it is the fact that it is not open source anymore. It is also free for now, but it might change. Please take a look at this issue where the author explains their decision.

Nevertheless, it is a real nice piece of software that has been serving me well. But that is not what this post is about: I’m here to explain how I generate my knowledge base page from my Notable notes.

It is quite simple actually. First of all, I have a git repository - hosted on GitHub - where all my notes are. Every 15 minutes, I have a script that runs on my machine and pushes if there are any changes. It looks like this:

1#!/usr/bin/env bash
2
3set -euo pipefail
4
5cd /path/of/my/notes
6(git add -A && git commit -m "$(date)" && git push) || echo "no changes"  For the curious, I’m using macOS’s launchd to run this script every fifteen minutes. After pushing to GitHub, it will trigger a webhook that makes a request to my website API saying “there’s new commits available, you should pull them” and that’s what I do. As soon as the server receives the hook request, it runs git pull on the server copy of the notes repository. Then, it runs a script that looks like this to convert the Notable notes to Hugo posts:  1const fs = require('fs-extra') 2const { join } = require('path') 3const yaml = require('js-yaml') 4const slugify = require('slugify') 5 6const dst = "/path/to/website/content/kb" 7const src = "/path/to/original/notes" 8 9await fs.remove(dst) 10await fs.ensureDir(dst) 11 12await fs.outputFile( 13 join(dst, '_index.md'), 14 --- 15title: Knowledge Base 16emoji: 🧠 17--- 18) 19 20const files = await fs.readdir(src) 21 22for (const index of files) { 23 const path = join(src, index) 24 if (fs.statSync(path).isDirectory()) { 25 continue 26 } 27 28 const file = (await fs.readFile(path)).toString() 29 let [frontmatter, content] = file.split('\n---') 30 const meta = yaml.safeLoad(frontmatter) 31 32 // Ignore notes with 'private' tag and deleted ones. 33 if ((meta.tags && meta.tags.includes('private')) || meta.deleted) { 34 continue 35 } 36 37 meta.date = meta.modified 38 meta.publishDate = meta.created 39 40 delete meta.modified 41 delete meta.created 42 delete meta.pinned 43 44 content = content.trim() 45 46 // Remove the initial heading. 47 if (content[0] === '#') { 48 content = content.substring(content.indexOf('\n')).trim() 49 } 50 51 // Check if there's some LaTeX going on so I know whether to require 52 // Katex or not. You may not need this. 53 if (content.match(/(\$\$.*?\$\$|\$.*?\$)/g)) { 54 meta.math = true 55 } 56 57 // Check if there's some mermaid diagrams going on so I know whether to require 58 // Mermaid or not. You may not need this either. 59 if (content.includes('mermaid')) { 60 meta.mermaid = true 61 } 62 63 // Replace wiki links by true links that work with Hugo's. 64 content = content.replace(/$\[(.*?)$\]/g, (match, val) => [${val}](/kb/${slugify(val.toLowerCase())})) 65 66 // Outputs the final file! 67 await fs.outputFile( 68 join(dst, ${slugify(meta.title.toLowerCase())}.md),
69    ---\n${yaml.safeDump(meta, { sortKeys: true })}---\n\n${content.trim()}
70  )
71}
`

After running this quick script, the website gets regenerated through hugo’s commands. That’s it. It’s quite easy and the best part: I don’t need to do anything manually. It usually goes smoothly. Nevertheless, it is good to check the logs from time to time.

Next steps? You can see them on my knowledge base!

Picture Henrique Dias
Interactions (1)

Or…

said: s/single/simple/ s/lunchd/launchd/ (unless Apple stores now sell sandwiches, I guess...) Otherwise a great article though :) Have you ever considered something like org-mode in Emacs? There are a huge number of export options which could be used as the basis of a site generator (or just fed …06 Nov 2020 17:04