How to write a markdown file in CLI editor with live preview

How to write a markdown file in CLI editor with live preview

·

0 min read

Hi, this is my first post to Devblog.

Always I write code by vim, via logging in by ssh from local machine to server.

In such case, because of whole of editing are in CLI environment, it's a little troublesome to write .md file. The .md files is just a markup language file, so these have to written with well human readability. It often include (nested)lists, links, tables or images. So I want some preview tool before commit. And the preview tool should be updated as automatically as possible according to file fluctuations.

I will introduce the tools I have used for a long time.

1. grip to preview

grip is a localhost server application for previewing. Usage is here.

❯ grip README.md
  :
 * Running on http://localhost:6419/ (Press CTRL+C to quit)

And when you open presented URL in your browser it looks like this. スクリーンショット 2019-04-25 16.02.54.png

When overwrite README(dot)md, this page will update automatically.

2. Google Drive to store images

It is not necessary to explain.

3. draw.io to draw images

This is a web site and is drawing tool. All you need is a browser. スクリーンショット 2019-04-25 16.17.21.png This can export files to Google Drive. (Also able to choose OneDrive, Dropbox or GitHub)

4. skicka to fetch images from Google Drive

skicka is a CLI utility to use Google Drive. Here's how to download an image.

❯ ls
README.md
❯ skicka ls my_images
sample.png
❯ skicka download my_images/sample.png .
  :
❯ ls
README.md  sample.png

That's all

Everything is stable and of course free to use. It's easy because you can use your favorite browser and CLI editor as well. And you don't need storage on local device. There may be better tools these days.