Laravel Image Upload with Spatie's Media Library Example
By Hardik Savani July 22, 2021 Category : LaravelPlayUnmuteLoaded: 1.17%FullscreenHello,
I am going to show you example of laravel image upload with spatie media library. We will use laravel spatie media library tutorial. let’s discuss about laravel spatie media library. you'll learn laravel image upload spatie media library. Alright, let’s dive into the steps.
In this example we will do image upload using spatie/laravel-medialibrary composer package. Spatie Media Library provide easily image uploading with laravel eloquent model. using this package you can easily store image, get image, generate thumbnail image. you can use this example with laravel 6, laravel 7, laravel 8 and laravel 9 version.
Here, we will create posts table and we will add images of each post using spatie/laravel-medialibrary library and listing of posts with image.
Just let's follow bellow step and see preview as bellow:
Preview:
Step 1: Create Laravel Project
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:
<?php use Illuminate\Database\Migrations\Migration;use Illuminate\Database\Schema\Blueprint;use Illuminate\Support\Facades\Schema; class CreatePostsTable extends Migration{ /** * Run the migrations. * * @return void */ public function up() { Schema::create('posts', function (Blueprint $table) { $table->id(); $table->string('title'); $table->string('body'); $table->timestamps(); }); } /** * Reverse the migrations. * * @return void */ public function down() { Schema::dropIfExists('posts'); }}
now let's run migration command:
php artisan migrate
now, just create post model and add code as like bellow:
app/Models/Post.php
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory;use Illuminate\Database\Eloquent\Model;use Spatie\MediaLibrary\InteractsWithMedia;use Spatie\MediaLibrary\HasMedia; class Post extends Model implements HasMedia{ use HasFactory, InteractsWithMedia; protected $fillable = [ 'title', 'body', ];}
Step 4: Create Route
In this is step we need to create some routes for listing posts and creating post.
routes/web.php
<?php use Illuminate\Support\Facades\Route; use App\Http\Controllers\PostController; /*|--------------------------------------------------------------------------| Web Routes|--------------------------------------------------------------------------|| Here is where you can register web routes for your application. These| routes are loaded by the RouteServiceProvider within a group which| contains the "web" middleware group. Now create something great!|*/Route::get('posts',[PostController::class,'index'])->name('posts.index');Route::get('posts/create',[PostController::class,'create'])->name('posts.create');Route::post('posts/store',[PostController::class,'store'])->name('posts.store');
Step 5: Create Controller
in this step, we need to create PostController and add following code on that file:
app/Http/Controllers/PostController.php
<?php namespace App\Http\Controllers; use Illuminate\Http\Request;use App\Models\Post; class PostController extends Controller{ /** * Write code on Method * * @return response() */ public function index() { $posts = Post::latest()->get(); return view('posts.index', compact('posts')); } /** * Write code on Method * * @return response() */ public function create() { return view('posts.create'); } /** * Write code on Method * * @return response() */ public function store(Request $request) { $valiator = $request->validate([ 'title' => 'required', 'body' => 'required', 'image' => 'required', ]); $post = Post::create($request->all()); if($request->hasFile('image') && $request->file('image')->isValid()){ $post->addMediaFromRequest('image')->toMediaCollection('images'); } return redirect()->route('posts.index'); }}
Step 6: Create Blade Files
here, we need to create blade files for index and create. so let's create one by one files:
PlayUnmuteLoaded: 1.17%Fullscreen
Hello,