How To Use Laravel 12 New Starter Kit (React)

How To Use Laravel 12 New Starter Kit (React)

Introduction:

Laravel 12 brings brand-new starter kits aimed at simplifying the development process for applications built with React, Vue, or Livewire. These kits come preloaded with essential features like built-in authentication, user registration, and settings management, allowing developers to focus on core functionality without worrying about boilerplate setup. Each starter kit also includes modern UI components and supports features such as social authentication, passkeys, and Single Sign-On (SSO) via WorkOS AuthKit. Getting started is simple—install the Laravel installer with Composer, create a new project, and choose your preferred starter kit during setup. This streamlined process gives you a solid foundation to launch your project quickly and efficiently.

In this tutorial, we will be using react as the starter kit.

Tutorial Video:

Prerequisite:

Before we proceed we must update the composer, laravel installer, node, and npm on our local environment:

  • PHP >= 8.2
  • Node >= 18.18.2
  • NPM >= 9.8.1
  • Composer >= 2.8.6
  • Laravel Installer >= 5.12.2

If you are having trouble updating the Composer follow these steps:

composer self-update

If you are having trouble updating the Laravel Installer follow these steps:

composer global remove laravel/installer
composer global update
composer global require laravel/installer

Step 1: Install Laravel

Run this command on Terminal or CMD to install Laravel:

laravel new laravel-12-start-kit-react

Follow these choices:

image 76 Binarybox Tutorials
image 77 Binarybox Tutorials

Step 2: Run the Laravel App

After successfully creating a new laravel project, run these commands:

cd laravel-12-start-kit-react
composer run dev

Open this URL and test the app:

http://127.0.0.1:8000/

Screenshots

image 78 Binarybox Tutorials
image 79 Binarybox Tutorials
image 80 Binarybox Tutorials
image 81 Binarybox Tutorials

Leave a Reply

Your email address will not be published. Required fields are marked *