Olá, nesse pequeno post eu quero compartilhar como organizo a criação dos componentes livewire nos meus projetos.

Se você não conhece o Livewire, basicamente, ele faz parte do ecossistema Laravel e serve para criar componentes reativos sem precisar usar (ou muito pouco) javascript, dando "super-poderes" a classe em PHP. Você pode dar uma lida na documentação para entender melhor.

Bom, já faz quase dois anos que trabalho diretamente com aplicações Laravel que utilizam o Livewire para construir monolitos. O Livewire ajuda a criar toda a reatividade no front-end sem sairmos do bom e velho PHP.

A criação de um componente Livewire é fácil, após termos instalado ele no projeto, conseguimos fazê-lo por um comando do artisan.

php artisan make:livewire CreatePost

O resultado será uma classe do nosso componente e uma view.blade.php correspondente a essa classe.

Eis que chegamos no ponto central deste post ...

Diferentemente dos _Controllers _"normais" do Laravel, a documentação do Livewire não adota, ou melhor, não oferece nenhum padrão arquitetural para organizarmos nossos componentes. Na documentação do Laravel, por exemplo, nós conseguimos ver as sugestões dos Resource Controllers que nos guiam em como nomear nossos métodos e organizar nossas rotas.

Foi a partir desse modelo que comecei a padronizar a criação dos meus componentes conforme os resource controllers. Deixando claro, que isso é uma sugestão. Caso você adote algo diferente ou não concorde, tudo bem!

Voltando ao exemplo do Post, eu o faria da seguinte maneira:

php artisan make:livewire Post\Create

O resultado seria:

app/Livewire/Post/Create.php

<?php

namespace App\Livewire\Post;

use Livewire\Component;

class Create extends Component
{
    public function render()
    {
        return view('livewire.post.create');
    }
}

resources/views/livewire/post/create.blade.php

<div>
    <h1> My Component! </h1>
</div>

E seguiria o mesmo raciocínio para os outros recursos, por exemplo show ** e **index.

php artisan make:livewire Post\Show
php artisan make:livewire Post\Index

Isso me ajudou a organizar melhor a estrutura do meu projeto já que já era familiarizado com os trabalhos dos resource controllers e espero que possa ser interessante para você também. Deixa nos comentários se você concorda ou não e me da sugestões de organização do código.

Um abraço!