Laravel Blade Storybook

Laravel Blade Storybook is a tool that allows you to create and manage components using Blade templates in Laravel. It provides a way to visually develop, test, and document your components.

This repository is a storybook for Huispedia design system.

Getting Started

Prerequisites

Before you begin, ensure you have met the following requirements:

• PHP >= 8.2
• Composer
• Node.js and npm

Installation

To get started with Laravel Blade Storybook, follow these steps:

1. Clone the repository:

   git clone <repository-url>
   cd huispedia-blast

2. Install npm dependencies:

   npm install

3. Require the Blast package via Composer:

   composer require area17/blast

4. Make sure your server is running:

   php artisan serve

   This command will return something like:

   INFO  Server running on [http://127.0.0.1:8000].

   Now you need to make sure that the port number for APP_URL in project's .env file corresponds to the port where server is running. For this example above, it should be:

   APP_URL=http://localhost:8000

5. Launch Blast (in a separate terminal tab, so the server work is not interrupted):

   php artisan blast:launch

This command will start the Storybook on an open port. You can access it in your browser to start working with your Laravel Blade components.

Troubleshooting

Wrong URL or storybook component not served

Try this command:

php artisan route:list

This should give you:

GET|HEAD       storybook_preview/{name?} .................................................................................................................. A17\Blast › StoryController

Now try running blast launch with a flag install:

php artisan blast:launch --install

Usage

Developing Components

With Blast, you can develop your Blade components in isolation. This helps you ensure that each component works correctly and can be reused throughout your application.

Documenting Components

Storybook allows you to document your components. You can write stories for each component to show different states and variations.

Testing Components

Blast integrates with your testing tools to ensure that your components are tested and behave as expected.

Further Reading

For more detailed instructions and advanced usage, please refer to the original article: Getting Started with Blast: Storybook for Laravel Blade

Contributing

Contributions are welcome! Please submit a pull request or open an issue to help improve this project.

License

This project is supposed to be only under private usage of Husipedia team.