Using Laravel Inertia or creating an app in Laravel Rest Api Vue/React

▶

I wanted to quickly comment on a question I received about Laravel Inertia.

Remember that, in case you are not familiar, Laravel Inertia is a way to integrate Vue directly with Laravel, meaning there is no need to use a Rest API for communication. In other words, instead of returning a Blade file, as is typical, Laravel returns a Vue component. Thanks to this, all the parameter passing we do is received via props in Vue.

Practical Example

For example, in a project I have with Laravel Inertia, on the detail view, we receive `contact_general_id` as a prop. If we look at the controller, we'll see that this data is sent directly to Inertia, without needing to query a Rest API to populate the information. This works the same whether it's a prop or a variable defined in the data section; the important thing is that the data reaches the component.

A very common question is: "If I want to make a request to get certain information, must I use Axios or a Rest API?" The answer is: not necessarily.

Inertia vs. Axios

When we use Inertia, it's not necessary to make additional requests with Axios or fetch. For example, if we are building a listing component, we can populate the information directly with the props sent from Laravel. This saves time and simplifies the communication between the backend and Vue.

The response we get when sending data via Inertia may be more limited than an Axios response; we don't have, for example, a complete list of form errors. But this is fine, because Inertia's goal is to avoid implementing a complete Rest API and making multiple requests from the frontend.

router.post('/users', form)

When to use Inertia and when a Rest API?

Another important point is deciding whether to use Inertia or create a Rest API directly. My personal opinion is that it depends on the future of the application:

• If the application will migrate to another technology, such as a mobile or desktop application, it is advisable to create a Rest API.
• If the application will only remain a web application, Inertia is sufficient and saves us a lot of work.

For example, in my Academy project, which is developed in Laravel with Vue, I chose to create a Rest API. This later allowed me to migrate the application to Flutter and saved me at least 40% of the work.

• I already had the Rest API structure and could reuse the resources.
• I could easily check the format of the queries using the Network tab in the browser.
• It allowed me to quickly build new screens in Flutter, without needing to replicate the Vue logic with Inertia.

If I had used Inertia, I would have had more work:

• Create the application in Vue with Inertia.
• Create the Rest API to migrate to Flutter.
• Replicate components and methods, leading to redundancy and more maintenance.

That's why, in cases where migration or having multiple platforms is planned, I believe it's better to create a Rest API from the start.

If, on the other hand, you don't plan to migrate the application and just want direct communication between Laravel and Vue, using Inertia is sufficient and avoids making unnecessary Axios requests.