Preview your markdown with GitHub API in real time

saltyshiomix profile image Shiono Yoshihide ใƒป1 min read

Hello, I'm a TypeScript lover in Japan but in this article I'll show you how to preview markdown (as is, GitHub flavored markdown(GFM)) at my workspace.


# install gfm-preview
$ npm install --global gfm-preview

# preview your markdown
$ preview file.md

Then you'll see a preview in your default browser like this:



When writing markdown, I always concern about the result of GitHub markdown rendering. So I often copy markdown and paste it to GitHub Gist then I see some typos and rewrite and copy-paste it...damn!

So I wrote gfm-preview today :)

My Writing markdown life CHANGE

A preview command automatically do this:

  • Launch a local preview server
  • Open a preview in your default browser
  • Render markdown by GitHub API
  • Watch changes and reload the preview
  • Close the local preview server when the preview is closed

Then my writing markdown scenario goes to:

$ touch file.md
$ preview file.md

So fun! No stuff!

Support GitHub Enterprise

My workspace uses GitHub Enterprise, so I preview like this:

$ preview file.md --github-api-url https://ghe-host:port/api/v3

Add an alias to ~./bashrc:

alias preview='preview --github-api-url https://ghe-host:port/api/v3'


$ preview file.md # uses GHE API by alias

Easy enough?

PRs are welcome

I'm new to OSS and want to communicate with contributors!


Thank you for your reading my article!

Posted on by:


markdown guide

This is great! I've been in the same situation way too many times!


Glad to hear that!
If you have any ideas, please contact me anytime!