allantatter / laravel-react
Render React.js components seemlessly on the server side within Laravel Blade views.
This package's canonical repository appears to be gone and the package has been frozen as a result. Email us for help if needed.
Installs: 1 503
Dependents: 0
Suggesters: 0
Security: 0
Stars: 51
Watchers: 5
Forks: 3
Open Issues: 0
pkg:composer/allantatter/laravel-react
Requires
- php: >=5.4.0
- illuminate/support: ~5.0
Requires (Dev)
- mockery/mockery: 0.9.4
- phpspec/phpspec: ~2.1
This package is auto-updated.
Last update: 2020-09-11 18:59:14 UTC
README
Laravel React
Add React.js support seamlessly for Laravel Blade templates.
Installation
Add this to your project's composer.json
"require": {
"allantatter/laravel-react": "0.1.*"
},
Then run
$ composer update
Service provider & alias
Add this to the providers array in config/app.php
'AllanTatter\React\ReactServiceProvider',
Add this to the aliases array in config/app.php
'React' => 'AllanTatter\React\Facades\React',
Setup server-rendering with Node.js application
In this repository, you'll find a directory named example and inside that is resources. Copy paste its content to your own project's resources directory and in addition to that merge the package.json file from example directory into your own project's package.json.
Then in your project's root dir, run
$ npm install -g nodemon
$ npm install
$ npm start
If you put server.js in another location, you may have to configure this line inside that file
require('dotenv').load({path: '../../.env'});
Usage
Inside your Blade view, you can render React component like this
{!! React::component('ComponentName', $props) !!}
To render react-router routes, you can use this
{!! React::router('routesFileName', $props) !!}
Configuration
If you're not happy with default configuration, you can manage a few variables through .env file, following are default values:
REACT_SERVER_URL=http://localhost
REACT_SERVER_PORT=3000
REACT_COMPONENTS_DIR=components
REACT_EXTENSION=jsx
Snippets that may come in handy
Handle 404 pages with react-router by rendering your react application with adding this snippet into app/Exceptions/Handler.php, method render()
if ($e instanceof \Symfony\Component\HttpKernel\Exception\NotFoundHttpException)
{
return response(view('react.app.view'));
}
