April 30, 2021 · 3 min read · 4,506 views
When embarking on a new Laravel project, leveraging starter kits can be instrumental in accelerating the development process. Laravel offers two official starter kits, each with its own set of features designed to cater to different project requirements.
Jetstream is Laravel's comprehensive starter kit, equipped with a suite of functionalities to jumpstart your application. It includes essential features such as login, registration, email verification, and two-factor authentication. Additionally, it provides robust session management and API support through Laravel Sanctum. For those building collaborative platforms, Jetstream offers an optional team management feature. You can find more information in the official Jetstream documentation.
For developers seeking a more streamlined approach, Laravel Breeze offers a focused set of authentication features. It covers the basics like login, registration, password reset, email verification, and password confirmation. Breeze is the go-to choice for simplicity and ease of use, as detailed in the Breeze documentation.
Both Jetstream and Breeze support Blade and Inertia views, catering to different front-end preferences. However, it's important to note that Inertia's integration in these starter kits is currently limited to Vue.js support. At Lucky Media, we predominantly utilize Breeze for our internal projects, pairing it with React to capitalize on Inertia's ability to provide a single-page application (SPA) experience.
The repetitive task of converting Vue components to React with each new Laravel Breeze project prompted us to create a solution. We developed a custom package that is essentially a fork of Laravel Breeze, with a key modification: we've stripped away the default Blade views. Our package, by default, installs the Inertia package with React components, streamlining the setup process for React developers.
This custom React package for Laravel Breeze simplifies the initial setup for our projects and could be a valuable asset to any development team looking to work with Laravel and React in tandem.
To get started its very simple, we create a fresh Laravel installation with the following command:
composer create-project laravel/laravel breeze-demo
Once the project finishes the installation, we need to access the working directory:
cd breeze-demo
We require our package from Packagist with the following command:
composer require lucky-media/breeze-react --dev
The dev
flag is required as this package is only used in Development.
After it has finished installing, run the following command:
php artisan breeze:install
# After it has finished installing
# run the following command
npm install && npm run dev
Now if you did everything correctly, visit your website at http://breeze-demo.test.
If you are using Valet you should see the Breeze app scaffolding, but instead of Vue you have React pre-packaged.
If you want to check the source code or you have an idea how we can improve this package, PR-s are welcomed in our official repo.
If you need help with a Laravel project let's get in touch.
Lucky Media is proud to be recognized as a Top Laravel Development Agency
Technologies:
Related Posts
Stay up to date
Be updated with all news, products and tips we share!