DEV Community

Cover image for Laravel Views with React Components
Nilanth
Nilanth

Posted on • Edited on

1 1

Laravel Views with React Components

To Add React with Laravel from scratch, there are many important details you need to consider:

  1. Configuring React
  2. Adding State management systems like Redux and configuring store, actions and sagas for API calls
  3. Configuring Routes for React Components
  4. Authentication
  5. Configuring ESlint for effective code

These configurations might require more time. To avoid these and focus only on developing the App functionalities, You have laravel-react-boilerplate.

Laravel React Boilerplate

Laravel React Boilerplate helps to fasten your development, Instead of spending more time on configuring React and SPA Authentication.

It is Pre-Configured with

  • Laravel 8
  • Laravel Sanctum for SPA Auth
  • React 17
  • Redux
  • React Router
  • Axios
  • Ant Design
  • Redux-Saga
  • Sass
  • ESLint
  • Preconfigured redux store, actions and saga.

Pre-Configured Modules

  • User Login
  • User SignUp
  • Auth Routes

How to start with it?

Laravel Development Environment setup

You can choose either one for your development

  1. Laravel Homestead
  2. Laravel Sail

Basic needs

  1. Composer 2.
  2. Node stable version.

Usage

  1. Install using composer
composer create-project nilanth/laravel-react-boilerplate
Enter fullscreen mode Exit fullscreen mode
  1. cd laravel-react-boilerplate
  2. Run yarn install
  3. Create a Database
  4. Update the Database credential to .env file
  5. Run php artisan migrate -> To create needed tables.
  6. Run php artisan db:seed -> To seed some fake users.
  7. Run yarn run dev
  8. Update API HOST_URL in resources/js/config/constant.js file

Login

Login

SignUp

SignUp

Home Screen

Home Screen

Use Laravel React Boilerplate to fasten your development 🚀

Need to learn more? Feel free to connect on Twitter :)

You can support me by buying me a coffee ☕

Image of Timescale

Timescale – the developer's data platform for modern apps, built on PostgreSQL

Timescale Cloud is PostgreSQL optimized for speed, scale, and performance. Over 3 million IoT, AI, crypto, and dev tool apps are powered by Timescale. Try it free today! No credit card required.

Try free

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay