Aurora: The Hackable Note Taker

Evan Conrad
3 min readNov 18, 2017

--

For the past few months, my team and I have been working on an open source, free, cross-platform note taking app with first class support for extensions called Aurora. It’s built on web technologies which means the entire wealth of plugins and embedded content are available to you.

Imagine having a note taker that lets you create graphs with d3, write math symbols with MathJax, or hook into any API on the web with plain Javascript. Create the ultimate power tool or strip it all away for a minimalist editor.

Aurora’s plugin system lets you customize without compromising the ability for different extensions to work together.

Does this sound interesting to you?

Let us know. You can checkout the project on Github here. We welcome PR’s and issues!

Otherwise you can follow flaqueeau on Twitter to hear about other updates.

The Technical Details

Most existing plugin systems tend to either have a strict API that defines a valid set of (often limited) actions or just accept Javascript injected into the page. The former is often too limiting and leads to extensions fighting with the original app. The latter can lead to extensions failing to work together entirely.

We’ve decided to take a middle ground approach. Like Hyper, we let users write plugins as React HOC’s. Unlike Hyper, we let them write React HOC’s on essentially every component in the virtual DOM.

In other words, you can swap out or modify a node in the UI tree and leave the rest of the tree intact.

“Feed” is swapped out with “Plugin” without changing its parent or children

In practice, this looks like this:

function PluginCreator(Feed) {
return class extends React.Component {
render() {
return <Plugin {...this.props}/>
}
}
}

Our plugin can then choose to modify its subtrees or render them as is.

By asking our plugin writers to conform to the React ecosystem, we can give the end user a certain level of reliability when they install several different extensions. With prop-types, we get a bit of structure for free. We can also assume that plugins that modify different parts of the UI tree will not interfere with each other.

We’ve been calling our plugin-harness “react-mutate” and have open sourced our utilities if you’re curious. Instead of “plugins” or “extensions”, we often use the term “mutation” throughout our docs and code but the terms are interchangeable.

Possible Pathways

Aurora allows a wide variety of potential note taking styles and could evolve with a user’s usage. It’s quite possible to remove the majority of the base app and go in a wildly different direction. The following are some potential examples:

An incredibly stripped down editor for the minimalist
The minimalist editor with a sidebar
Modifying the sidebar minimalist editor to include rich text and photos
Notes in a policy debate style for competitive debaters
Embedding interaction within the editor using existing web technologies

--

--