Tools

In my previous posts, I discussed creating a Markdown renderer with code highlighting and basic charts. Now, let’s talk about custom formatting of string interpolation using backticks in JavaScript. By creating a function, you can render Markdown-formatted strings using the MD`# Hello world` syntax. This approach offers endless possibilities for custom rendering.

So, in the second part of Make Your Mark(Down), we added charts/graphs and syntax highlighting to our Markdown control using Mermaid and highlight.js. We created a custom renderer for code to ensure expected behavior. By modifying the code, we achieved the desired formatting. The full snippet is available with additional details.

So, I made this cool tool based on another one I found online. It’s a simple text area with a Markdown preview. Just use Yarn to install marked and its types, and then create a component for the Markdown code. The code does the rest – easy peasy! Let me know if you have any…