Laravel Packages

Blast — Storybook UI Development for Laravel Blade

Published
Blast — Storybook UI Development for Laravel Blade image

Storybook for Laravel Blade is a package to build component libraries using Laravel. Blast lets you render examples of your app's components using the blade templating engine and Storybook Server within your Laravel app.

You can think of Storybook server as a UI development environment for your blade templates rendered by Laravel. This package makes it easy to iterate on components using Storybook:

@storybook([
'args' => [
'label' => 'Button',
'href' => '#',
'icon' => 'menu-24',
'iconPosition' => 'after',
]
])
 
<x-button.primary
:href="$href ?? null"
:icon="$icon ?? null"
:iconPosition="$iconPosition ?? null"
>
{{ $label ?? null }}
</x-button.primary>

As you make changes to components, Blast will watch changes and automatically regenerate the stories and update Storybook. Once you get Blast installed in a new or existing Laravel app, the package provides various configuration options:

  • Storybook Server URL
  • Storybook Theme
  • Canvas Background Color
  • Configurable asset autoloading
  • And more

While Blast will help you get started quickly with Blade and Storybook, I'd recommend reading Getting Started with Blast – Storybook for Laravel Blade as well as the Storybook official docs.

You can learn more about this package, get full installation instructions, and view the source code on GitHub.

Paul Redmond photo

Staff writer at Laravel News. Full stack web developer and author.

Sponsored

laravelcloud logo
Laravel Cloud

Easily create and manage your servers and deploy your Laravel applications in seconds.

Visit Laravel Cloud

The latest

View all →
CPX: The Composer Package Executor for PHP image

CPX: The Composer Package Executor for PHP

Read article
Laravel AI SDK Adds Human-in-the-Loop Tool Approval image

Laravel AI SDK Adds Human-in-the-Loop Tool Approval

Read article
Pest 5 Released With Test Impact Analysis, Agent Verification, and Evals image

Pest 5 Released With Test Impact Analysis, Agent Verification, and Evals

Read article
Queue-SQL: Run Mass Deletes and Updates Across Parallel Queue Jobs image

Queue-SQL: Run Mass Deletes and Updates Across Parallel Queue Jobs

Read article
Blade Formatting in Laravel Pint image

Blade Formatting in Laravel Pint

Read article
Inertia DevTools Is Now on the Chrome Web Store image

Inertia DevTools Is Now on the Chrome Web Store

Read article