Livewire

https://livewire.laravel.com/docs/4.x/quickstart
Admin
Livewire is a full-stack framework for Laravel that allows developers to build dynamic, reactive...
Tokens:2,943
Snippets:33
Trust Score:9.9
Update:9 months ago
Show doc for...
Tokens:
Raw
### Production Save Method Example (PHP)

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

This is an example of a production-ready save method for a Livewire component. It validates the input, creates a new Post record in the database (assuming a Post model and table exist), and then redirects the user. This code requires Eloquent ORM and database setup.

```php
public function save()
{
    $validated = $this->validate([
        'title' => 'required|max:255',
        'content' => 'required',
    ]);

    Post::create($validated); // Assumes you have a Post model and database table

    return $this->redirect('/posts');
}
```

--------------------------------

### Start Laravel Development Server (Shell)

Source: https://livewire.laravel.com/docs/4.x/quickstart/docs

Command to start the built-in PHP development server for a Laravel application. This is used for local testing and development.

```shell
php artisan serve
```

--------------------------------

### Install Livewire with Composer

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

Installs the Livewire package into your Laravel project using Composer. This is a prerequisite for using Livewire's features.

```shell
composer require livewire/livewire
```

--------------------------------

### Livewire Component for Post Creation (Blade/PHP)

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

This snippet defines a Livewire component for creating a post. It includes public properties for title and content, a save method for validation and submission, and uses Livewire directives for two-way data binding and form submission handling. It requires Livewire to be installed and configured.

```blade
<?php

use Livewire\Component;

new class extends Component {
    public string $title = '';

    public string $content = '';

    public function save()
    {
        $this->validate([
            'title' => 'required|max:255',
            'content' => 'required',
        ]);

        dd($this->title, $this->content);
    }
};
?>

<form wire:submit="save">
    <label>
        Title
        <input type="text" wire:model="title">
        @error('title') <span style="color: red;">{{ $message }}</span> @enderror
    </label>

    <label>
        Content
        <textarea wire:model="content" rows="5"></textarea>
        @error('content') <span style="color: red;">{{ $message }}</span> @enderror
    </label>

    <button type="submit">Save Post</button>
</form>
```

--------------------------------

### Generate Livewire Layout

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

Creates a default layout file for Livewire components. This file includes necessary directives like @livewireStyles and @livewireScripts.

```shell
php artisan livewire:layout
```

--------------------------------

### Generate Livewire Page Component

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

Creates a new Livewire page component. The 'pages::' prefix helps organize components within the resources/views/pages directory.

```shell
php artisan make:livewire pages::post.create
```

--------------------------------

### Registering a Livewire Route (PHP)

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

This code snippet registers a new route for a Livewire component in Laravel. It maps the URL '/post/create' to the 'pages::post.create' Livewire component. This requires the Laravel routing system and Livewire to be set up.

```php
Route::livewire('/post/create', 'pages::post.create');
```

--------------------------------

### Livewire Blade Layout Structure

Source: https://livewire.laravel.com/docs/4.x/quickstart/index

The default layout file for Livewire components. It includes essential Blade directives for Livewire's CSS and JavaScript assets and a slot for component rendering.

```blade
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <title>{{ $title ?? config('app.name') }}</title>

        @vite(['resources/css/app.css', 'resources/js/app.js'])

        @livewireStyles
    </head>
    <body>
        {{ $slot }}

        @livewireScripts
    </body>
</html>
```
Tokens:
Raw