In this episode, we dive into using Blade components to streamline how you build page layouts in your Laravel apps — specifically focusing on handling page titles more cleanly.
We start by taking a look at the traditional way: using Blade's @extends
and @section
directives to create layouts and yield dynamic content like the page title. You’ll see how this can get a bit messy and repetitive, especially as your app grows and you find yourself duplicating boilerplate, or dealing with less-than-ideal ways of injecting page-specific information, like the title.
Next, we switch things up and migrate to using Blade components for layouts. You'll learn how to create a component (using php artisan make:component
) and use it as a wrapper — almost like a reusable HTML tag — for your pages. The really neat part is how we pass data, like the page title, directly as props to the component, making everything feel much cleaner and more intuitive.
We’ll walk through making the component accept props (like title
), handle defaults, and conditionally display things. Plus, we’ll see how to define slots for other areas, like a sidebar, and only display content if it’s provided.
By the end, you’ll have a tidy, flexible way to organize your layouts and page titles using modern Blade component features, which will help keep your templates easy to read and maintain as your app grows.