In this episode, we start by noticing that our author information is being used in more than one place in our blog app. Instead of repeating ourselves, we decide to refactor this author (or post meta) section into its own Blade component. This keeps our codebase DRY and assures consistent styling everywhere we display this info.
So, we go ahead and create a new Blade component called PostMeta
. Since the component is really simple and doesn't need any logic, we use the Blade view-only option instead of making a separate class. We then grab the markup for the author info and put it into our new component file.
From there, we update our index
and show
pages to use the new <x-post-meta :post="$post" />
component. With this refactor, nothing visibly changes in the browser, but we're now set up nicely for the next step—adding tags. When we do, we'll only have to update the PostMeta
component, and the changes will automatically show up everywhere it's used! Pretty neat for keeping things consistent and easy to maintain.