A Flat File Blog with Laravel Folio and Markdown

March 9, 2025

That's right, in this article I'm going to show you how I built this blog. I'm going to assume that you have a new laravel project setup and ready to go.

I need to give credit where credit is due. After reading an article from Aaron Francis and Jason Beggs to use Laravel Sushi as the driver for the articles, I decided to go that route. I did put a twist on it though, I wanted to use the filesystem to store them as markdown files.

The first step is to install Laravel Folio and Sushi. You can do this by running the following command:

1composer require laravel/folio calebporzio/sushi

After that, we need to create the article model and configure it to use the Sushi driver.

1class Article extends Model
2{
3    use Sushi;
4 
5    // ...
6}

Next, we need to instruct Sushi to retrieve the rows from the filesystem, I store the files in the resources/views/pages/articles directory. Override the getRows method to be the following:

 1public function getRows()
 2{
 3    $files = Finder::create()
 4        ->in(resource_path('views/pages/articles'))
 5        ->files();
 6 
 7    return Collection::make($files)
 8        ->filter(fn (SplFileInfo $file) => Str::endsWith($file->getFilename(), '.md'))
 9        ->transform(function (SplFileInfo $file) {
10            $object = YamlFrontMatter::parseFile($file->getRealPath());
11 
12            $title = $object->matter('title');
13            $slug = Str::slug($title);
14 
15            return [
16                'title' => $title,
17                'slug' => $slug,
18                'date' => date('F j, Y', $object->matter('date')),
19                'url' => url('/articles/' . $slug),
20                'summary' => $object->matter('summary'),
21                'body' => $object->body(),
22            ];
23        })
24        ->values()
25        ->toArray();
26}

Let me explain what this is doing. First, it's using the Symfony Finder component to get all the files and then filtering out any files that aren't markdown files. Then, it's transforming the Front Matter (by using spatie/yaml-front-matter to help with this) into an array that we can use later.

Now onto displaying the articles, Spatie (who else!?) has made a really nice package for this exact purpose. It's called Laravel Markdown, and it includes a blade component! Thankfully Folio has a really nice route model binding feature, so we're going to utilize that! Let's create the new page.

1php artisan folio:page "articles/[Article:slug]"

This will create a new view file resources/views/pages/articles/[Article:slug].blade.php that will be used to display the article. Here's a starting point for you to use:

1<x-layout>
2    <article>
3        <x-markdown class="prose">{!! $article->body !!}</x-markdown>
4    </article>
5</x-layout>

That's it! Now when you go to a specific article it will be displayed on the page. You can customize the layout to your liking, but this is a good starting point.

We're not done yet! Let's create an example article to see that everything is working as intended. Make a new file called first-post.md in the resources/views/pages/articles directory. Now let's add some content to it:

 1 
 2---
 3 
 4title: My First Post
 5summary: My first post on my blog!
 6date: 2025-03-01
 7 
 8---
 9 
10# My First Post
11Hello there! This is my first post on my blog. I hope you enjoy it!

For some reason the syntax highlighting adds extra lines for the YAML/Front Matter, those empty lines are not needed and can be removed.

This it! Now if you head to http://your-site.test/articles/first-post you should see the article displayed on the page.