CN

What are the 3 ways to build Laravel apps?

Explore 3 different ways of building apps with Laravel Framework: Blade, VILT (Vue, Inertia, Laravel, Tailwind) stack and TALL (Tailwind, Alpine, Laravel, Livewire) stack.

What are the 3 ways to build a Laravel app in 2024?

Laravel is a popular PHP framework. PHP runs server-side, and in 2024 that's barely enough. Sites and apps need to be interactive, and this means using JavaScript - directly or indirectly. Let's explore 3 ways of building Laravel Apps, their pros and cons.

We're going to cover:

  1. Laravel + Blade
  2. VILT Stack
  3. TALL Stack

If you need a quick introduction to the Laravel framework, read: Laravel 11 and MVC Fundamentals Tutorial.

Laravel with Blade templates

Laravel has a built-in powerful templating system called Blade.

What are the Blade features?

  • Components
  • Inheritance
  • Loops
  • Conditional Rendering

Seems like everything you need! And, it's a 1st party library. But, what's great for developers is not always best for the users.

What are the Blade limitations?

  • Blade is server side only
  • Once generated, page needs to reload for any changes
  • Much less interactive, feels like 2000s

When to choose Laravel with Blade?

  • Sites/apps that don't need to be interactive
    • Admin panels
    • Internal tools
    • Boring websites (government?)
  • When aiming for less complexity for developers
    • Blade has been around since time in memorial (proven, well known)
  • When the team only knows PHP
    • No JavaScript knowledge required

VILT Stack (using Laravel, Vue, Inertia and Tailwind CSS)

More power, but also more complexity. Laravel keeps all it's responsiblities except the views are now rendered using Vue (optionally using React as well).

This works exceptionally well thanks to Inertia.js, a tiny library that connects backend framework with frontend frameworks. Thanks to Inertia, you don't need to build 2 separate apps that communicate using an API, you can keep things simple.

You can read how up the VILT: How to Set Up a SPA with Laravel, Vue.js, and Inertia.js - Complete Guide. Also, read this Vue guide: Vue 3 Cheat Sheet with Composition API.

What are the VILT stack best features?

  • Using Vue framework with all it's power and ecosystem
  • Feels like Single Page Application thanks to Inertia.js
  • Super easy to do thanks to Inertia (avoid API building)
  • Everything else still build with Laravel

What are the VILT stack limitations?

  • Need to know and use JavaScript
  • Need to learn the Vue framework
  • Ineria.js has a tiny learning curve as well, not all things are obvious

When to choose the VILT Stack?

  • Sites/apps that need to be interactive
    • E-commerce
    • Booking websites
    • Media heavy
    • Data presentation (charts etc.)
  • Site needs to feel "quick" - instant user feedback
  • Team knows JavaScript/Vue (at least at a basic level)

TALL Stack (using Tailwind + Alpine.js + Laravel + Livewire)

Another popular option is the so called TALL Stack. This is the most recent way of building apps in Laravel, though has gained a lot of popularity.

Livewire is a magical library that let's you keep using Blade and PHP, and still have an interactive website that looks like a single page application. The magic and heavy lifting is handled by Livewire, which provides the necessary JavaScript to make it all happen.

For cases when this isn't enough, Alpine.js is a tiny JavaScript UI library, that can be considered slim version of Vue.js, it's really tiny and basic, but pretty powerful.

What are the TALL stack features?

  • Build (almost) everything with PHP and blade!
  • Site is interactive, does not need reloading
  • Filament!
    • This is huge, Filament is a Livewire based admin building framework. A real life changer!

Whaat are the TALL stack limitations?

  • Small and limited ecosystem
  • PHP just won't replace the JavaScript completely
  • Need to learn Livewire AND Alpine.js (when PHP/Livewire features just won't cut it)
  • Still, has a learning curve
    • And it's pretty steep to be honest

When to choose the TALL Stack?

  • Admin panels, Filament is godsend! It's the best admin panel builder you'll ever see!
  • Sites that need more interactive UI, but don't require the full power of Vue/React

Should you use Blade, VILT or TALL stack?

There are many options, and as a beginner it's probably hard to choose. If you're just starting with Laravel, just go with the default - Blade. It will take you places.

Helping select the way to build a Laravel app

When that's not enough, you really have 2 choices. While I personally feel Livewire is a great idea, only choose it if you plan to exclusively work with the Laravel ecosystem.

Use Vue instead, if you'd like to have a more universal skill-set (it's simple - as an employee, more different skills you have, more employable you are).

Want to read more articles like that?

Sign up to get notified when I publish more.

No spam. One click unsubscribe.

Read More on Fado Code Camp