formattingmarkdownatom-editorliterate-programmingatom-beautify

Formatting (beautifying) code blocks inside makdown documents when using Atom


I’m beginning to explore literate programming, which involves embedding executable code blocks into markdown documents. My current working environment is Atom with a package called markdown-preview-enhanced – it supports live code chunk execution, which is exactly what I need. Here is an example of how things look like:

https://user-images.githubusercontent.com/1908863/28716704-4009d43a-7364-11e7-9e46-889f961e5afd.png (in real life, the code is surrounded with headers, images, etc.)

One thing I’m missing is the ability to auto-format code chunks inside markdown files just as I would achieve this in separate files (e.g. using Atom’s beautify package). Surprisingly, searching for a solution that would work in Atom did not bring me to anything.

My question is to those who’s been doing literate programming for some time. What tools would you recommend to achieve formatting for literate code blocks? If there’s no Atom package that would do this, what alternative environments could I try?

I’m planning to embed multiple languages into my literate programming documents in future, so feel free to share solutions not only for Python mentioned above.


Solution

  • After a few months of looking at various ways to solve code block formatting (which even included a PR to atom-beautify), I think the best option is to use Prettier.

    Prettier formats Markdown, JavaScript, TypeScript and a few other languages out of box, which includes fenced code blocks in Markdown such as starting with ```js. More languages can be added by means of Prettier plugins, which are still beta, but are quite promising.

    There also exists editor integrations for Prettier (e.g. for Atom and VSCode).