Introducing Premarkable: A Simple Markdown Previewer

brunoc

Hello Zettelkasten Community!

I'm excited to announce the release of Premarkable, a lightweight and efficient Markdown previewer designed to enhance your writing experience. Inspired by the popular Marked App, Premarkable provides a straightforward interface for viewing your Markdown documents in real time.

Key Features:

• Real-Time Preview: See changes as you edit your Markdown files, making it easier to format text and check your work.
• Customizable Styling: Specify your own CSS stylesheet to customize the look of your previews, ensuring your content always looks great.
• Flexible Processor Options: Easily configure the command and options for processing Markdown files. By default, it uses Pandoc, but you can set it to any processor of your choice.
• Local Server Hosting: Run a simple local web server to access your previews from any browser, making it easy to work on the go.
• File Monitoring: Automatic updates when your input file is modified, so you never miss a change.

Getting Started:

To run Premarkable, you'll need Babashka and Pandoc installed on your system. Simply clone the repository, customize the options using command-line flags, and you’re ready to preview your Markdown!

Whether you’re a seasoned Markdown user or just starting, we believe Premarkable will serve as a valuable tool in your writing workflow. Check it out on GitHub and let us know what you think!

Happy writing!

Best,
BC

amahabal

Thanks, Bruno!

Is this something that can be used with The Archive today as a replacement for an automatically refreshing Markdown viewer? The invocation options today for premarked seem to require a file name and I am not sure whether this is already easily usable through The Archive (perhaps because in streaming mode it writes to a particular file?)

Also, does the HTML view refresh every 5 seconds as well? This would doubtless need caching of various preprocessors to work efficiently. For instance, my markdown often includes both mermaid and argdown. If there are several such blocks in a single file (not atypical for me) then rendering would take a fair amount of time unless whatever has not changed has been properly cached.Is this something that is currently handled? (This should not be an issue for folks who do not use markdown that is somewhat expensive to render.)

One tool that seems to do caching well is Typora, but as far as I know, it does not today handle argdown.

--Abhijit

brunoc

@amahabal thanks for the interest. The processed content is cached, so it may be instantly served to the browser after processing. The content is then automatically updated (reprocessed) if and only if the source file's modification time changes -- the file is checked for changes each 5 seconds. I invite
you to pull the latest version I committed this weekend, which also implements communication with the browser to trigger a hot reload when needed.

One way of using premarkable with The Archive would be to wrap it in an Automator app to execute an AppleScript, and invoke it with "Open with External Editor":

Assuming you cloned the repository to ~/src/premarkable, this will run the script in a Terminal window (so that you can control what's happening) and open the preview page in your browser. Save the Premarkable Automator app in your Applications folder and be sure to add it to The Archive's list of External Editors in the Advanced settings.

Myself, I handle some kinds of complex products (articles, a book) using separate files/notes and this other script I described a couple of years a go in the forum, the Zettel Composer. This is the primary use I have for this new script: as a previewer for my compiled notes on non-MacOS platforms. See if that could also be useful for you.

A note about your use of mermaid: because the script won't serve any file directly, you should encode the diagram images inline in the HTML code (which I think is the default mermaid filter behaviour). I believe that the caching mechanism provided should be enough, in principle. But in case the processing of the mermaid diagrams is really slow, you would have to cache the images. If there's a mechanism to do this, it could be used with the script because you can call whatever command/script to process the content, as long as it outputs HTML. But then the script would have to be changed to serve the image files.

Edit: added the processor argument to use the mermaid filter. I copy the full AppleScript below:

on run {input, parameters}
    set sourceFile to POSIX path of (item 1 of input)
    set homePath to POSIX path of (path to home folder)
    set cssFile to homePath & "/src/premarkable/css/amblin II.css"
    set processorCmd to "pandoc -F mermaid-filter -f markdown"
    set scriptCommand to "/usr/local/bin/bb ${HOME}/src/premarkable/premarkable.clj --css  " & quoted form of cssFile & " " & "-P " & quoted form of processorCmd & " " & quoted form of sourceFile
    tell application "Terminal"
        activate
        do script scriptCommand
    end tell
    open location "http://localhost:8082"
end run