This is the full frontend code for the Rumin web app, a visual canvas for connected ideas.

It provides a workspace to visually flesh out your ideas. Rearrange them. And connect them.

Rumin comes with a web clipper browser extension (also open source), for capturing learnings as you go.

Live demo link Demo video link

Visual Canvas/Explorer. The main part of the app. Use a canvas tab for each topic or work context. The canvas is built on top of Konva, a useful library for manipulating HTML Canvas. Most of the Canvas-related code is in src/components/ExplorerPage.tsx.

Rich Text Editor. The text editor in Rumin supports multiple media types, including images, YouTube embeds, and more. The editor is built using Slate, which provides block-level control and is easy to extend for additional commands and functionalities. But note that Slate does have its quirks, including not working well on mobile. The editor code is in src/components/BlockEditorSlate.js.

Detail Page. A page where the user can edit the body of a text/document, as well as its custom attributes. Think of this as a blend of a Word Processor and an object editor. The code is in src/components/SpacePage.js

Say hi on Twitter, and I'll see where I can help. I no longer plan on pursuing Rumin as a for-profit venture, and I would love to help where I can.