front-matter VS marked

To set our metadata dynamically, we also imported the front-matter dependency.

front-matter parser

What we want is for our editor to take the combination of front-matter data and markup, then be able to extract the two before storing that data separately somewhere. We'll be using the front-matter module to extract the data we need from the text editor content.

it is trivially easy to create your own with libraries like this [0] (34k stars) or this one [1] (444 stars).

0: https://github.com/markedjs/marked

ADR-003 documented the choice of markdown-it over alternatives like marked, based on careful evaluation of edge cases and built-in features like URL linking.

Another option is to go with a purpose-built tool, like SlickPDF. I built slickpdf.com for the very purpose of going from Markdown to PDF. Give it a try!. It uses marked.js under the hood, and presents a live preview rendered on a Letter-size (8.5 in. x 11 in.) page.

If you are trying to render this in the browser, we can use the marked library in order to convert the markdown into HTML code.

The first step is to install marked. This is a markedown parser that will convert our markdown content into HTML. Run the command below to install marked.

I'm using @std/front-matter package along with marked as my blog runs on Deno, but FM would work with anything that has markdown files in folders.

To tackle this, I created an issue detailing my planned approach. I intended to use Marked to conditionally render certain markdown elements into HTML. After diving deep into Marked's documentation, I discovered this was indeed possible - you can simply disable the elements you don't want to render into HTML!

Now that I knew what I knew, it was time to start. Before I even began to consider how to solve this, I knew how these large projects feel about dependencies, so I went to the package.json file to check and see if there were things that I could work with. And what do you know? highlight.js was already included! What I immediately thought of was perhaps using the marked parser in addition to highlight.js to create and use my code blocks. But after quite a lot of time attempting this, I realized that hand-rolling this solution would not only take a lot of time but would also require a lot of code.

We'll start by initializing a Node project inside a chosen folder (nodejs-blog for me) with and installing a couple of dependencies that I feel like will make our lives easier, like Express, EJS, Marked, the good ol' body-parser and gray-matter.

Blog posts, as you've already noticed, are markdown files with attributes which are converted to static HTML on build using Marked and Front Matter.