{"id":58126,"date":"2025-10-17T08:06:22","date_gmt":"2025-10-17T01:06:22","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=58126"},"modified":"2026-02-16T10:12:00","modified_gmt":"2026-02-16T03:12:00","slug":"belajar-laravel-bagian-24","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/belajar-laravel-bagian-24\/","title":{"rendered":"Belajar Laravel Bagian 24: Cara Membuat Fitur Upload File"},"content":{"rendered":"\n

Pada seri Belajar Laravel Bagian 23<\/strong><\/a>, kita telah mempelajari cara menggunakan Bootstrap di Laravel untuk mempercantik tampilan aplikasi atau website. Nah, pada lanjutan Belajar Laravel Bagian 24 ini, kita akan membahas cara membuat fitur upload file di Laravel secara praktis dan aman.<\/p>\n\n\n\n

Seperti yang telah kita pahami dalam proses pengembangan aplikasi berbasis web, fitur upload file merupakan komponen penting yang tidak boleh diabaikan. Mulai dari kebutuhan untuk mengunggah foto profil, dokumen, hingga berbagai file pendukung lainnya, fitur ini hampir selalu dibutuhkan. <\/p>\n\n\n\n

Laravel, sebagai framework <\/em>PHP yang powerful, menyediakan cara yang sederhana, aman, dan efisien untuk menangani proses upload <\/em>tersebut. <\/p>\n\n\n\n

Cara Membuat Fitur Upload File<\/h2>\n\n\n\n

Berikut langkah demi langkah untuk membuat fitur upload file di Laravel secara mudah dan aman.<\/p>\n\n\n\n

Step 1. Persiapan Project<\/h3>\n\n\n\n

Bila sebelumnya Anda sudah mengikuti series tutorial laravel dari kami, Anda dapat melanjutkan dengan projek tersebut. Namun, bila belum mengikutinya, silakan Anda buat projek baru dan install laravel.<\/p>\n\n\n\n

composer create-project --prefer-dist laravel\/laravel .<\/code><\/pre>\n\n\n\n
Jalankan server:<\/p>\n\n\n\n
php artisan serve<\/code><\/pre>\n\n\n\n
Selanjutnya akses file laravel yang Anda install melalui browser di alamat http:\/\/127.0.0.1:8000<\/code>.<\/p>\n\n\n\n
Step 2. Buat Route<\/h3>\n\n\n\n
Selanjutnya, edit file routes\/web.php<\/strong> menjadi berikut:<\/p>\n\n\n\n
use Illuminate\\Http\\Request;\nuse Illuminate\\Support\\Facades\\Storage;\n\nRoute::get('\/upload', function () {\n    return view('upload');\n});\n\nRoute::post('\/upload', function (Request $request) {\n    \/\/ Validasi file\n    $request->validate([\n        'file' => 'required|mimes:jpg,jpeg,png,pdf|max:2048'\n    ]);\n\n    \/\/ Simpan file ke storage\/app\/public\/uploads\n    $path = $request->file('file')->store('uploads', 'public');\n\n    return back()->with('success', 'File berhasil diupload!')->with('file', $path);\n});\n<\/code><\/pre>\n\n\n\n
Step 3.<\/strong> Buat View menggunakan (Bootstrap<\/em>)<\/h3>\n\n\n\n
Kemudian, buat file untuk menampilkan form upload di  resources\/views\/upload.blade.php<\/em> dengan script <\/em>berikut.<\/p>\n\n\n\n
<!DOCTYPE html>\n<html>\n<head>\n    <title>Upload File Laravel<\/title>\n    <!-- Bootstrap CDN -->\n    <link href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.3\/dist\/css\/bootstrap.min.css\" rel=\"stylesheet\">\n<\/head>\n<body>\n<div class=\"container mt-5\">\n    <h2 class=\"mb-4\">Upload File dengan Laravel<\/h2>\n\n    {{-- Tampilkan pesan sukses --}}\n    @if(session('success'))\n        <div class=\"alert alert-success\">\n            {{ session('success') }}\n            <br>\n            <strong>Path:<\/strong> {{ session('file') }}\n        <\/div>\n    @endif\n\n    {{-- Tampilkan error --}}\n    @if($errors->any())\n        <div class=\"alert alert-danger\">\n            <ul class=\"mb-0\">\n                @foreach ($errors->all() as $err)\n                    <li>{{ $err }}<\/li>\n                @endforeach\n            <\/ul>\n        <\/div>\n    @endif\n\n    <!-- Form Upload -->\n    <div class=\"card shadow\">\n        <div class=\"card-body\">\n            <form action=\"\/upload\" method=\"POST\" enctype=\"multipart\/form-data\">\n                @csrf\n                <div class=\"mb-3\">\n                    <label class=\"form-label\">Pilih File<\/label>\n                    <input type=\"file\" name=\"file\" class=\"form-control\">\n                <\/div>\n                <button type=\"submit\" class=\"btn btn-primary\">Upload<\/button>\n            <\/form>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- Bootstrap JS -->\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.3\/dist\/js\/bootstrap.bundle.min.js\"><\/script>\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n
Step 4. Atur Storage Link<\/h3>\n\n\n\n
Agar file dapat diakses melalui browser<\/em>, silakan buat symlink <\/em>ke folder public\/storage<\/code> gunakan perintah berikut:<\/p>\n\n\n\n
php artisan storage:link<\/code><\/pre>\n\n\n\n
\"membuat<\/a><\/figure>\n\n\n\n
Dengan melakukan symlink<\/em>, maka file yang diupload akan tersimpan di direktori:
storage\/app\/public\/uploads\/<\/code><\/p>\n\n\n\n
Lalu, Anda dapat mengecek file yang baru saja di upload melalui url http:\/\/127.0.0.1:8000\/storage\/uploads\/namafile.png<\/code><\/p>\n\n\n\n
Step 5. Pengujian<\/h3>\n\n\n\n
Terakhir, mari kita lakukan pengujian fitur upload di Laravel. Caranya, silakan buka halaman http:\/\/127.0.0.1:8000\/upload<\/code><\/p>\n\n\n\n
Pilih file yang akan Anda upload (misalnya file gambar atau file PDF), kemudian klik Upload<\/strong>.<\/p>\n\n\n\n
\"upload<\/a><\/figure>\n\n\n\n
Bila sukses, maka akan tampil alert sukses + path file seperti gambar berikut.<\/p>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n
Silakan masuk ke folder storage\/upload<\/code> untuk cek file yang baru saja Anda upload.<\/p>\n\n\n\n
\"cek<\/a><\/figure>\n\n\n\n
Penutup<\/h2>\n\n\n\n
Selamat! Hingga tahap ini, Anda telah berhasil membuat fitur upload <\/em>file di Laravel dengan mudah. Dengan memahami langkah-langkah yang telah dibahas, kini Anda dapat mengimplementasikan fitur ini ke dalam berbagai proyek web yang sedang dikembangkan.<\/p>\n\n\n\n
Ke depannya, Anda bisa terus bereksplorasi dengan menambahkan validasi yang lebih kompleks, mengintegrasikan penyimpanan ke layanan cloud server, atau meningkatkan aspek keamanan agar sistem upload <\/em>semakin optimal dan profesional.<\/p>\n\n\n\n
Demikian seri belajar Laravel bagian 24 tentang membuat fitur upload file di Laravel. Dalam seri belajar Laravel selanjutnya, kita akan belajar cara upload file ke database Laravel. Ikuti terus tutorial belajar Laravel dari Rumahweb, untuk meningkatkan kemampuan Anda dalam membuat aplikasi berbasis Laravel. Semoga bermanfaat.<\/p>\n\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
Pada seri Belajar Laravel Bagian 23, kita telah mempelajari cara menggunakan Bootstrap di Laravel untuk mempercantik tampilan aplikasi atau website. Nah, pada lanjutan Belajar Laravel Bagian 24 ini, kita akan membahas cara membuat fitur upload file di Laravel secara praktis dan aman. Seperti yang telah kita pahami dalam proses pengembangan aplikasi berbasis web, fitur upload […]<\/p>\n","protected":false},"author":319,"featured_media":58353,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[7],"tags":[1587,796,1497],"class_list":{"0":"post-58126","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-web-programming","8":"tag-belajar-laravel","9":"tag-laravel","10":"tag-tutorial-laravel"},"aioseo_notices":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2025\/10\/banner-belajar-laravel-bagian-24.png","jetpack_shortlink":"https:\/\/wp.me\/p8n3G7-f7w","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/58126","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/319"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=58126"}],"version-history":[{"count":9,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/58126\/revisions"}],"predecessor-version":[{"id":61821,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/58126\/revisions\/61821"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/58353"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=58126"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=58126"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=58126"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}