Power your Blog Post with Markdown āš”ļø

Hey friend,

I'm excited to announce that I've started a Youtube channel and recorded two exciting videos. It is currently being edited, but you can subscribe here to be the first to know when it's out. šŸ„³

Alright, moving on to our weekly Snack. šŸæ

Generating a Blog Post using Markdown

Are you interested in creating a blog? Let me show you my process to get some inspiration.

Let's use React Server vs Client components blogpost šŸ‘‡ as an example.

Currently, I'm storing all my blog posts on my file system in the repo directly. I am okay with this for now but have considered switching to Sanity CMS in the future. I have a folder called posts and store my blog post in a markdown format.ā€‹

This works great for my workflow as I am parsing the markdown content and converting it into HTML elements. A single "#" turns into an h1, whereas a "##" transforms into an h2, and so on.

Here is a quick diagram,

Let's review the code for the same, šŸ‘©šŸ½ā€šŸ’»

Latest Frontend Gossip/News šŸ¤«

ā€‹Storybook v7 is here: The highlight from this update is that it has zero config setup for Vite, but it's coming soon for other languages such as Next.js and others.

Frontend Developers Toolbox šŸ§°

  • ā€‹uiGradients: Generate cool gradients for your apps.
  • ā€‹Generate Snow Effect: Using this simple script, you can embed snow effect in your app just like I have done here. I would recommend copying the code and giving credit to the site to do this, as you don't want to depend on a 3rd party script.

That's all from me. Have a great day!

A Frontend Newsletter that you'll love! šŸ’–