Posts Learn Components new Snippets new Categories Tags About Device Beast sponsor
/

How to make Livewire Component

Learn how to make Livewire Component easily using the command line and also the command to create Livewire Inline components.

Created on Jul 19, 2021

31 views

To create/make a Livewire component you can make use of the "livewire:make" command.

Make Livewire Command
To make a new component you can run the command below and replace the "<ComponentName>" with the component you want to create.
php artisan make:livewire <ComponentName>

Component Examples
Below are some of the components that you can come up with.
php artisan make:livewire PopularPosts
php artisan make:livewire ShowPosts
php artisan make:livewire AllComments
php artisan make:livewire LikeBox

Component Inside Sub-folder
If you plan to have the component inside a sub-folder then you can make use of "/" to separate it. 
php artisan make:livewire Post/Popular
php artisan make:livewire Post/Show
php artisan make:livewire Post/Likes

Livewire Inline Component
Sometimes you might need to create inline components which do not require separate views. To generate that you can pass on the "--inline" flag.
php artisan make:livewire PopularPosts --inline

The generate Livewire component should be as follows.
<?php
namespace App\Http\Livewire;

class PopularPosts extends Component
{
    public function render()
    {
        return <<<'blade'
            <div>Popular posts here</div>
        blade;
    }
}

Related Posts

Snippets by

PostSrc poster

PostSrc

Full stack developer mainly focusing on the front end side of the web. The main author of PostSrc and loves writing tutorial and guides online.

Load comments for How to make Livewire Component

new

PostSrc Code Components

Collection of Tailwind CSS components for everyone to use. Browse all of the components that are right for your project.

View Components

Other Code Snippets

More