DEV Community

websilvercraft
websilvercraft

Posted on • Edited on

Using Helper Functions to Convert Markdown to HTML in Laravel 11

In this tutorial, we'll create a helper function in a Laravel application to convert Markdown content to HTML using the league/commonmark library. We'll cover the steps to create a helper file, include it in our Laravel project, and use it in a Blade template. This mechanism is used in Laravel 11 to make functions globally available.

Optional: Handling Markdown Conversion in Controller

The alternative is to handle the Markdown conversion in controller before passing the data to the view, so we no longer need to create a helper file:

use League\CommonMark\CommonMarkConverter;

public function show($id)
{
    $course = Course::find($id);
    $converter = new CommonMarkConverter();

    $post->description = $converter->convertToHtml($post->description);

    return view('post.show', compact('post'));
}
Enter fullscreen mode Exit fullscreen mode

Creating a Helper File to Make the Conversion Function Available in the Blade Template

Step 1: Install league/commonmark

First, we install league/commonmark library via Composer:

composer require league/commonmark
Enter fullscreen mode Exit fullscreen mode

Step 2: Create the helpers.php File

Next, we'll create a helpers.php file to define our helper function. This file can be placed in the app directory or any other preferred location.

touch app/helpers.php
Enter fullscreen mode Exit fullscreen mode

Open app/helpers.php and add the following content:

<?php

use League\CommonMark\CommonMarkConverter;

if (! function_exists('markdownToHtml')) {
    function markdownToHtml($markdown) {
        $converter = new CommonMarkConverter();
        return $converter->convertToHtml($markdown);
    }
}
Enter fullscreen mode Exit fullscreen mode

Step 3: Including the Helper File in Composer

To ensure Laravel automatically loads the helpers.php file, we need to modify the composer.json file to add the path to helpers.php under the autoload section:

"autoload": {
    "files": [
        "app/helpers.php"
    ]
}
Enter fullscreen mode Exit fullscreen mode

Step 4: Regenerate Composer Autoload Files

After modifying composer.json, regenerate the Composer autoload files by running:

composer dump-autoload
Enter fullscreen mode Exit fullscreen mode

Step 5: Use the Helper Function in Blade Templates

With the helper function defined and loaded, we can now use it in the Blade templates to convert Markdown to HTML:

<div>
    {!! markdownToHtml($post->description) !!}
</div>
Enter fullscreen mode Exit fullscreen mode

This tutorial is provided to show how we can make custom functions available in blade templates.

🚀 Interested to learn more 🛠️🤖💻? Then don't forget to 📬✉️, 👇

🚀 If you are interested in learning more about programming, 🛠️ building applications, or in general about AI 🤖 and tech 💻, you can subscribe to my newsletter at websilvercraft.substack.com ✉️ to get the posts delivered directly to you as soon as I publish them! 📬
⠀⠀⠀ ⠀⠀⠀⠀ ⠀⠀ ⠀👆👆👆👆
⠀⠀⠀⠀⠀⠀⠀⠀ 👆👆👆👆👆👆👆👆👆👆👆
⠀ ⠀ 👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆
👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆👆

Top comments (0)