Características de un proyecto Livewire: Livewire, volt, flux, Alpine...

Antes de comenzar a desarrollar en nuestra aplicación en lightware quiero hacer una pequeña pausa y comentarte un poco sobre qué es lo que tenemos en un proyecto en Livewire, en qué en pocas palabras podemos decir que el lare es básicamente componentes de Laravel vitaminizado es decir con estos componentes podemos hacer múltiples operaciones 2ué cosas te pudieras preguntar básicamente todo lo que que nosotros vamos a cubrir en este curso y unas cosas más que no vamos a cubrir como tal es decir que todavía pudiéramos explorar es lo que permite laward así que no me quiero adelantar mucho con eso porque va a ser demasiado técnico y es mejor verlo en la práctica pero es básicamente eso quédate con ese concepto de componentes de Laravel vitaminizado es decir con muchas cositas entonces con los componentes vamos a ver que vamos a poder hacer ruteos de vistas es decir poder devolver en vez de que un controlador devuelva una vista vamos a poder hacerlo mediante un componente mediante el uso de sus propiedades también vamos a poder hacer algunas ligas como lo que hacemos con Vue v-model vamos a poder hacer operaciones similares query String también tenemos la parte de carga de archivos y un largo etcétera 

Laravel volt

En proyectos recientementes de Laravel Livewire, a partir de la versión 12 de Laravel, al crear un proyecto en Laravel Livewire incluye otras tecnologías como:

Volt:

https://livewire.laravel.com/docs/volt

Con la cual, podemos crear tanto la lógica como la vista (blade) en un solo archivo:

<?php

use function Livewire\Volt\{state};

state(['count' => 0]);

$increment = fn () => $this->count++;

?>

<div>
   <h1>{{ $count }}</h1>
   <button wire:click="increment">+</button>
</div>

Laravel Flux

Tambien veremos que los componentes auxiliares que empleamos ahora no son los mismos que antes, ahora empleamos flux.

Flux, que no es más que una librería de componentes para Laravel Livewire ya listos para utilizar:

https://fluxui.dev/

<flux:input
   wire:model="email"
   :label="__('Email address')"
   type="email"
   required
   autocomplete="email"
   placeholder="email@example.com"
/>

Que puedes exponer para personalizar:

$ php artisan flux:publish

Tambien vemos una estructura más compleja como que en el composer.json no tenemos la dependencia a Livewire, si no, a los paquetes anteriores que importan Livewire como una dependencia.