Static Blog With Next.js and Markdown

Timestamps:
0:00 - Intro
7:10 - Header Component
9:08 - Create a Markdown File
11:44 - Fetch Markdown Files
14:56 - Get Slug & Frontmatter
19:50 - Displaying Posts
25:21 - Post Page & Generate Paths
34:50 - Displaying The Post
27:40 - Sort Posts By Date
39:50 - Exporting a Static Site
43:34 - Deploy to Vercel

[chrisbraun]

Yesterday I got my first job as a React developer thanks to your tutorials and courses, I have been following you for about one year and half and I can't thank you enough for how much you have contributed in my learning path, thank you again sir 🙏

[balajiravi]

One of the best instructor in the world🔥👍🙏

[narendrajoshi]

Just watched the next crash course and tada! here's the add on.Thank you brad for everything you have given to the web dev community.

[josephmxm]

FIX: TypeError: (0, is not a function ERROR
👇
For marked versions 4.0.0 up must import by:
import { marked } from 'marked'

[mootimadness]

bells and whistles x'D, i learn codding and English with brad

[austin]

Instead of typing dangerouslySetInnerHTML to display the post's content, just install react-markdown and type this:

Also, path.join() is not necessary in "const files =
Just do this instead to make it simpler to understand: const files = fs.readdirSync('posts')

[edgarsblog]

Thanks, Brad, all worked perfectly even 2 years later, only the import marked already we have to include marked inside curly brackets {marked}, otherwise we get an error

[RianYK]

Thank you for your tutorial Brad, great tutorial and to the point explanation about Next JS .

[jayrocks]

Thank you for your tutorials I'ved been watching your tutorial videos since 2016. The best tutorial in the industry.

[ELmarianchi]

Hey, just wanted to say you don't need an extension to preview markdown. Vscode has a builtin thing for that, and it's one of those icons with a magnifying glass, that you have two of them.

[llamafactorySA]

You can also deploy through the vercel CLI :)

[craiggazimbi]

Awesome video Brad, Thank you . Would love to see this same project done in Nextjs 13 as well. So please make a video if you ever get the chance.

[dammyola]

This looks familiar, your nextjs course on udemy.

[AdarlanTeixeira]

Thank you for this great tutorial! One issue with this approach is that the images can not be previewed on Markdown files, because from an HTML point of view, the images are in '/images/posts', but for Markdown's perspective, the images are in '../public/images/posts'

[mihirdharangaonkar]

Traversy media and Free coding camp puts the new videos at the same day same time ... This is 3rd time .. can not be coincidence 😄

[supercoolcat]

Never clicked a notification so fast before

[jasonshen]

Wonder who that champion bashed that unlike for this awesome tut, this is cool bro

[toanho]

Thanks, I will watch this video in the weekend

[maximk]

21:32 at this point something like infinite loop is going on in my browser.. But kinda slow.. Is it ok??

[gabrielmoraes]

Awesome tutorial! Thanks for sharing it! All the best!