Sebagaimana kita telah ketahui bahwa fitur upload file pada sebuah aplikasi merupakan fitur wajib yang harus ada. Ya, pasalnya setiap membuat aplikasi berbasis web pasti selalu melakukan upload file, seperti dapat kita temukan pada menu profile yang menyertakan foto user, menu berita, menu data produk, upload berkas, dan mungkin menu lainnya yang membutuhkan file.

Dari alasan tersebut maka pada tutorial kali ini kami akan menyuguhkan sebuah tutorial yang membahas langkah demi langkah atau step by step melakukan upload image ataupun file pada framework Laravel.

Tutorial upload file pada Laravel kali ini akan dibahas secara simple, sehingga secara step by step untuk melakukan upload image ataupun file adalah seperti berikut.

Step 1 Install Laravel Project

Lamgkah pertama dari semua langkah ketika kita ingin menggunakan framework PHP Laravel adalah terlebih dahulu meng-installnya ke laptop ataupun PC. Jalankan composer berikut pada jendela Terminal/ Command Prompt untuk melakukan instalasi project Laravel.

composer create-project Laravel/Laravel blog

Untuk menggunakan versi tertentu saat meng-install Laravel dapat menjalankan command composer berikut.

composer create-project Laravel/Laravel
blog"x.*"

Step 2 Setup Database

Tahap selanjutnya adalah menghubungkan project Laravel ke database baik MySQL, MariaDB, ataupun database lainnya.

Untuk melakukan setup database pada project development Laravel dapat disetting melalui file environment (.env) seperti berikut.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3307
DB_DATABASE=Laravelbasic
DB_USERNAME=root
DB_PASSWORD=

Jangan lupa untuk membuatkan satu buah tabel pada database untuk menampung upload file. Berikut Struktur tabel yang saya buat di migration.

public function up()
    {
       
Schema::create('blogs', function (Blueprint $table) {
           
$table->id();
           
$table->text('img');
           
$table->timestamps();
       
});
    }

Jika belum mengetahui bagaimana cara membuat migration, silahkan cek tutorial yang sebelumnya saya buat.

Step 3 Create Routes

Pada tahap ini kita akan membuatkan routes, untuk menambahkan routes pada Laravel dapat dilakukan dengan meletakkan potongan code routes pada file web.php pada folder “routes” Laravel.

Adapun Kebutuhan akan routes pada tutorial upload image ataupun file pada tutorial Laravel kali ini adalah seperti berikut.

Route::resource('blogs', BlogController::class);

Step 4 Create Image Upload Controller dan Model

Langkah selanjutnya adalah membuatkan controller upload file beserta file modelnya. Pada Laravel sebuah controller dapat digunakan untuk mengambil permintaan, memparsing permintaan, menginisialisasi, memanggil model yang dibutuhkan, mengambil respon dan mengirimkannya ke view.

Untuk membuat controller sekaligus model pada Laravel dapat kita lakukan dengan menjalankan perintah artisan melalui jendela Terminal/ Command Prompt. Jalankan perintah artisan berikut.

php artisan make:model Blog  -mcr

Berikut isi dari file Controller yang telah di buat tadi.

public function index()
    {
       
return view('upload');
    }
 
public function store(Request $request)
    {
       
$messages=[
           
'img.required' => 'Image Harus di isi',
        ];
 
       
$request->validate([
           
'img' => 'required',
       
], $messages
       
);
 
       
$data = Blog::create($request->all());
       
if($request->hasFile('img')){
           
$request->file('img')->move(blog/', $request->file('img')->getclientOriginalName());
           
$data->img = $request->file('img')->getclientOriginalName();
           
$data->save();
       
}
       
return redirect('/blogs)->with('pesan', 'Data Anda Berhasil diTambahkan');
    }

Lalu di Bagian Model ikuti code di bawah ini.

<?php
 
namespace App\Models;
 
use
Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
 
class Blog extends Model
{
   
use HasFactory;
   
protected $guarded = [];
}

Step 5 Create Blade File to Upload

Pada tahap ini kita akan membuat file blade, file ini terletak pada folder “resources/views” pada Laravel.

Buatlah sebuah file blade dengan nama upload.blade.php, sehingga terlihat seperti berikut.

@extends('layouts.app')
@section('content')
   
<div class="col-12 grid-margin">
       
<div class="card" style="border-radius: 25px;">
       
<div class="card-body">
           
@if(session()->has('pesan'))
                <div class="alert alert-light-success color-success alert-dismissible fade show"><i class="bi bi-check-circle"></i>     {{ session('pesan')}}</div>
           
@endif
           
<h4 class="card-title">Form Tambah Data Blog</h4>
           
<form action="{{ url('blogs') }}" method="POST" enctype="multipart/form-data">
                @csrf
                <div class="form-body">
                    <div class="row">
 
                        <div class="col-md-6">
                          <div class="form-group row">
                            <label class="col-sm-3 col-form-label" for="img">Img </label>
                            <div class="col-sm-9">
                                <input type="file" name="img" id="img" class="form-control @error('img') is-invalid @enderror" value="{{ old('img') }}">
                                <img src="" width="100px" class="mt-2" alt="img" id="gambar-preview">
                                @error('img')
                                    <div class="invalid invalid-feedback">{{$message}}</div>
                                @enderror
                            </div>
                          </div>
                        </div>
                    </div>
                </div>
                <button type="submit" class=" btn btn-primary" style="border-radius: 25px;">Submit</button>
           
</form>
       
</div>
       
</div>
   
</div>
 
@endsection

Tahap final adalah melakukan running tes aplikasi, apakah berjalan dengan yang diharapkan atau tidak. Untuk melakukan testing kita dapat menjalankan Laravel server development dengan menjalankan perintah artisan seperti berikut.

php artisan serve

Kemudian kita dapat mengakses project melalui browser dengan menjalankan url localhost:8000/uploads, jika semua berjalan dengan baik maka kita akan disambut oleh halaman upload file dan images.

Lalu disaat berhasil mengupload file ataupun images maka akan ditampilkan pesan 'Data Anda Berhasil di Tambahkan'.

Akhirnya sampai disini kita telah berhasil membuat fitur Upload Image atau File ke Database MySQL pada framework Laravel, akhirnya saya mengucapkan banyak terimakasih telah menyempatkan berkunjung di tutorial.wanteknologi.com, semoga tutorial yang singkat ini dapat menambah wawasan serta memberi manfaat, terimakasih and happy coding.