Show HN: Minimal Next.js 15 Markdown Boilerplate
github.comJust write Markdown. Add React components whenever you want. I'm lazy, so I made this extremely simple.
- Render Markdown files as dynamic pages
- Add React components anywhere in your Markdown
- The folder structure becomes the URL path
- Global styles using Tailwind CSS and DaisyUI
I will try this out. I am on a hunt for a way to render markdown files into html code in a way that supports the existing structure of the webpage. For example, if I have a static webpage ready from scratch using HTML and CSS, would I be then able to post blogs using markdown to html in just a corner of the site?
Next.js is an all-encompassing framework, so your existing static site would need to be placed in its `public` directory. Even then, the React-based frontend will take dominance.
For your use case I'd recommend a command-line tool that converts Markdown files from a given folder and outputs it to a corner of your existing site. There are implementations in various languages, so you can choose according to preference.
Given you have an existing website, it might be easier for you to add Markdown support to your site through a static site generator or server-side conversion step.
Or you can even use a Markdown-to-HTML tool (I believe pandoc has this feature) to convert the pages yourself before posting. That's a bit more manual but wouldn't require changing your current structure.
Anyway, if you end up using boilerplate, let me know what you think!
Thanks for sharing. Can you say why you start with Next?
There are other tools that /just/ do Markdown builds like parceljs.org But with your approach you can actually be used to do more than that.
Three main reasons, two functional and one practical:
1. Built-in MDX support means you can seamlessly mix Markdown and React components. (I previously had some trouble with the @mdx-js/react library and was in the market for more native solutions.)
2. Next.js makes it pretty easy to do modern web stuff, like client/server components and Tailwind/DaisyUI styling.
3. With Vercel spending so much getting YouTubers to create general Next.js tutorials, I found it very easy to get this set up.
If you're dealing with purely static Markdown content, I would recommend something simpler.
(I work at Vercel) We spend $0 on YouTube, just FYI as I sometimes see this sentiment.