By Hardik Savani October 13, 2020 Category : LaravelPlayUnmuteLoaded: 0.53%FullscreenHi Dev,
In this example, i will show you laravel livewire image upload example. i would like to share with you image upload with laravel livewire. you can understand a concept of laravel livewire store upload image. I’m going to show you about upload image in laravel livewire example. Alright, let’s dive into the steps.
In this tutorial, we will create simple image upload example using laravel livewire. you can use laravel livewire image upload with laravel 6, laravel 7, laravel 8 and laravel 9 version.
Here, i will give you very simple example to creating images upload form with title and name and i will store that data to database without refresh page and too many lines of code in blade file. we will use only livewire/livewire package.
So, let's follow bellow step and you will get bellow layout:
Step 1 : Install Laravel 8
first of all we need to get fresh Laravel 8 version application using bellow command, So open your terminal OR command prompt and run bellow command:
composer create-project --prefer-dist laravel/laravel blog
Step 2 : Create Migration and Model
Here, we need create database migration for files table and also we will create model for files table.
php artisan make:migration create_files_table
Migration:
<?php use Illuminate\Database\Migrations\Migration;use Illuminate\Database\Schema\Blueprint;use Illuminate\Support\Facades\Schema; class CreateFilesTable extends Migration{ /** * Run the migrations. * * @return void */ public function up() { Schema::create('files', function (Blueprint $table) { $table->id(); $table->string('title'); $table->string('name'); $table->timestamps(); }); } /** * Reverse the migrations. * * @return void */ public function down() { Schema::dropIfExists('files'); }}
php artisan migrate
now we will create File model by using following command:
php artisan make:model File
App/Models/File.php
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory;use Illuminate\Database\Eloquent\Model; class File extends Model{ use HasFactory; protected $fillable = [ 'title','name' ];}
now we will create one route for calling our example, so let's add new route to web.php file as bellow:
routes/web.php
Route::get('image-upload', function () { return view('default');});
Step 6: Create View File
here, we will create blade file for call form route. in this file we will use @livewireStyles, @livewireScripts and @livewire('contact-form'). so let's add it.