esign/laravel-react-components
Use react components within laravel
This packages allows you to register react components within your laravel application.
Installation
You can install the package via composer:
composer require esign/laravel-react-components
The package will automatically register a service provider.
Usage
To register the container for a react component a @reactComponent directive has been included. Props may be passed as the second parameter:
@reactComponent('article-card')
@reactComponent('article-card', ['article' => $article])
In case you want some more customization you may always use the anonymous component. This component allows you to pass additional attributes and define as what HTML tag the component should be rendered:
<x-react-component
component="article-card"
:props="['article' => $article]"
as="span"
class="container"
/>
To register the components in your frontend build, you may use the registerReactComponents function included in this package. This can be published using the following command:
php artisan react-components:install
The file will be copied to resources/assets/js/utils/registerReactComponents.js but may be moved to any other location.
import { ArticleCard } from "./Components/ArticleCard";
import { registerReactComponents } from "./utils/registerReactComponents";
registerReactComponents({
'article-card': ArticleCard,
});
Testing
composer test
License
The MIT License (MIT). Please see License File for more information.
Related Packages
A multi-framework UI component library for Laravel. Supports Tailwind CSS, Boots...
Reactive Blade templates with Vue, React, Svelte, Angular, or vanilla JavaScript
React component integration system for FilamentPHP applications
Render React.js components seemlessly on the server side within Laravel Blade vi...
Inotify bindings for ReactPHP (forked from mkraemer/react-inotify)