How to install React Js to Laravel 8

React is an open-source front-end JavaScript library for building user interfaces or UI components. In this blog, we will learn how to install React JS in Laravel 8. Make sure you have Node Js installed on your machine before starting this tutorial.

Step 1. Create Laravel project

composer create-project --prefer-dist laravel/laravel laravel-react

Step 2. Install the Laravel UI package

This is an easier way to get react in Laravel.

run this command:

composer require laravel/ui

Step 3. Install React by running command

php artisan ui react

Step 4. Get all the packages

run this command:

npm install

Step 5. add React to webpack.mix.js

Check to make sure React is added to webpack.mix.js as well as sass for styling

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .react()
    .version();

You might be promted to install additional packages in order for react to install successfully. So, go ahead and install what you have been instructed.

Now you should be able to use React in your Laravel project.

If you go to webpack.mix.js located at the root of the project, you will see API.react.

There is an Example.js demo file in resources/js/components. This is where you will put your react files.