The Laravel team has been very busy this year. The popular open source PHP web framework raised $57 million from Venture Capitalist back in December.
Since then, in February, Laravel has launched a new cloud hosting platform for Laravel applications. The team also updated application starter kits for React, Vue and Livewire that “feel very JavaScript-y,” according to Bytes.dev.
And last month, the Laravel team took responsibility for Inertia, which bills itself as “a new approach to building classic server-driven web apps.”
Laravel Adopts Inertia
Laravel took on Inertia with the permission of its creator and Tailwind CSS co-author, Jonathan Reinink, a full-time partner at Tailwind Labs. The Laravel team had asked if they could take over maintaining the Inertia project.
“We’ve been heavily involved with the project for a long time because it is something we’ve adopted as a pretty critical piece of our stack,” said Joe Tannenbaum, a Laravel senior software engineer. “Jonathan is a partner at Tailwind Labs. I don’t know if you’ve heard of them — they’re doing pretty well for themselves, so we offered to take it over from him in order to push it forward, give it the maintenance that it deserves, and he was amenable to that.”
The team adopted Inertia in early February, announcing the news at Laracon EU in Amsterdam.
“For developers using Inertia, this means the library will keep getting better, now with Laravel’s full team behind it,” wrote web developer Vincent Schmalbach about the news. “The code stays free and open source — it’s just officially part of Laravel now. For anyone building Laravel apps, Inertia remains a solid choice for adding a modern frontend to your application.”
Inertia Brings JavaScript Frontends to Laravel Backend
Inertia is a protocol that allows developers to build single-page applications (SPAs) with traditional server-side routing. Essentially, it bridges the gap between server-side frameworks like Laravel and client-side JavaScript frameworks like React, Vue or Svelte, by offering supporting libraries or adapters for those frameworks — as well as PHP and Ruby on Rails.
“The problem that Inertia is solving is that if you like everything Laravel has to offer — like the queues and all of the database connections and the whole package that it offers — but what you want to write on your frontend is Vue or React or Svelte, then you can use Inertia,” Tannenbaum said.
Inertia acts as the glue between your view layer (frontend) and your backend, he explained. In a SPA, the View layer is the component that takes data and translates it into what the user sees on the screen. As you navigate around a web app, requests are made through Inertia.
“You can essentially write what feels like a classically server rendered app using PHP and whatever frontend technology of your choice as the view layer; you just put Inertia in-between and it silently sits there and negotiates between the two and creates a single page app experience between those technologies,” Tannenbaum told The New Stack.
Most SPAs have a server behind the scenes, he explained. And the whole point is that you’re not doing a full page refresh between visits or between form submits — you’re getting chunks of the information you need back from the server. The client handles what components should be loaded next.
“…you get all of the incredible React power and Vue power and Svelte power with snappy reactive apps on the frontend, with all of the power of Laravel behind the scenes, and Inertia is just negotiating between the two of them.”
– Joe Tannenbaum, Laravel senior software engineer
“Prior to adapting Inertia as a more formal part of our stack, you basically had to negotiate between them manually,” he said.
Without Inertia, the developer had to send JSON back and forth. The client would then have to interpret what that meant and figure out what goes next, he explained. With Inertia, all of the routes are defined on your server-side stack, which in this scenario is Laravel.
“That’s what makes it feel like a classic server rendered app,” he said. “But then you get all of the incredible React power and Vue power and Svelte power with snappy reactive apps on the frontend, with all of the power of Laravel behind the scenes, and Inertia is just negotiating between the two of them.”
Obviously, developers do need to know how to use PHP to use Laravel, but Tannenbaum said the Laravel team’s documentation is very good and most developers will find what they need to know there.
The Best of Two Worlds
Inertia and Laravel together offer the best of two worlds, according to Tannenbaum.
“For my money, if what you want to use on the frontend is something like a React, Vue or a Svelte, there’s no easier way to do it than to just plug Inertia in,” he said. “It’s really seamless and it gets you everything you want on the frontend — like if you’re used to writing React, but you just want a more powerful backend solution, such as Laravel, this is a no-brainer.”
Another popular option for Laravel is Livewire, which was released in 2019 by creator Caleb Porzio. Livewire is an extension of Laravel’s existing templating system that simplifies the process of building dynamic, interactive user interfaces. It allows developers to handle frontend interactions with PHP code instead of JavaScript (JavaScript is still involved behind the scenes for the AJAX requests). Porzio still maintains Livewire.
The post Laravel Adds Inertia To Stack and Offers React Starter Kit appeared first on The New Stack.