So, we created this FirstPostPage,
but we also mentioned that
it would be better to write
our blog posts in Markdown format.
So let's open a new editor tab,
and set the file type to "Markdown".
In Markdown we can write a header
by starting the line with a hash mark
so we could use this for the title.
And then we can write a paragraph
simply as normal text, without special tags.
Let's also note that this post
was written using Markdown.
Now, in Visual Studio Code
we can also preview it,
if we open the "Command Palette",
by pressing Command+Shift+P,
or Control+Shift+P
if you're not on macOS,
here you can search all available commands,
and there is one called
"Markdown: Open Preview to the Side"
So if I press enter,
we can see the rendered Markdown on the right.
And we can keep adding content on the left,
like some bold text for example.
Or we could add a list,
starting each line with an asterisk,
that will be displayed as a bullet point.
So this is a much better way
to write an article
compared to writing it
directly inside a React component.
Now, let's save this Markdown file.
And I'll create a new folder
called "content",
just to keep it separate
from the rest of our code.
Inside content we could have
another folder called "posts",
and this is where
we want to save this file.
I'll have to find that folder
in this dialog now.
Ok, and we can call this file
"first-post.md".
There you go.
So our challenge now is
how do we take this Markdown file
and display it as the content
of our "FirstPostPage"?
This will require
quite a few separate steps,
We need to read that file,
parse the Markdown
and render it to HTML,
but also see how we can load data
in a Next.js page.
We'll cover all of this
in the next few videos.