1a:I[4594,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"BrandMark"] 1b:I[1566,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"ThemeToggle"] 1c:I[9718,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"AccountMenu"] 1d:I[4113,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"LeftNavigation"] 1e:I[5608,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"ResponsiveBannerAd"] 1f:I[8424,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"TopicFollowButton"] 20:I[1577,["1849","static/chunks/1849-0fc2bd73d6f2e163.js","6329","static/chunks/6329-deb7a466c19beaad.js","5687","static/chunks/5687-c1621349502ac098.js","7194","static/chunks/7194-92efb78e82eec78e.js","6384","static/chunks/app/t/%5Btag%5D/page-90992b381821f968.js"],"FeedView"] 21:T269f,{"content":[{"attrs":{"level":2},"content":[{"text":"\ud83d\udccc Why File Upload & Storage is Important","type":"text"}],"type":"heading"},{"content":[{"text":"Almost every web application requires ","type":"text"},{"marks":[{"type":"bold"}],"text":"file uploads","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"content":[{"content":[{"content":[{"text":"Profile pictures","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Documents","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Images or videos for blogs","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Reports for admin dashboards","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"content":[{"text":"Laravel makes ","type":"text"},{"marks":[{"type":"bold"}],"text":"file upload and storage","type":"text"},{"text":" easy and secure.","type":"text"}],"type":"paragraph"},{"attrs":{"level":2},"content":[{"text":"\u2699\ufe0f Step 1: Configure Filesystem","type":"text"}],"type":"heading"},{"content":[{"text":"Laravel uses ","type":"text"},{"marks":[{"type":"bold"}],"text":"Filesystem API","type":"text"},{"text":" to handle files. Default configuration is in:","type":"text"}],"type":"paragraph"},{"attrs":{"language":"plaintext"},"content":[{"text":"config/filesystems.php\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"text":"Common disks:","type":"text"}],"type":"paragraph"},{"content":[{"content":[{"content":[{"marks":[{"type":"code"}],"text":"local","type":"text"},{"text":" \u2192 storage/app","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"marks":[{"type":"code"}],"text":"public","type":"text"},{"text":" \u2192 storage/app/public (accessible via URL)","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"marks":[{"type":"code"}],"text":"s3","type":"text"},{"text":" \u2192 cloud storage","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"content":[{"text":"Create symbolic link to make ","type":"text"},{"marks":[{"type":"code"}],"text":"public","type":"text"},{"text":" files accessible:","type":"text"}],"type":"paragraph"},{"attrs":{"language":"plaintext"},"content":[{"text":"php artisan storage:link\r\n","type":"text"}],"type":"codeBlock"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udd39 Step 2: Create File Upload Form","type":"text"}],"type":"heading"},{"content":[{"text":"Example: Uploading images","type":"text"}],"type":"paragraph"},{"content":[{"marks":[{"type":"code"}],"text":"resources/views/upload.blade.php","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"attrs":{"language":"html"},"content":[{"text":"@extends('layouts.app')\r\n\r\n@section('content')\r\n

Upload Image

\r\n@if(session('success'))\r\n

\r\n@endif\r\n\r\n@endsection\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"marks":[{"type":"bold"}],"text":"Key Points:","type":"text"}],"type":"paragraph"},{"content":[{"content":[{"content":[{"marks":[{"type":"code"}],"text":"enctype=\"multipart/form-data\"","type":"text"},{"text":" \u2192 required for file uploads","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"marks":[{"type":"code"}],"text":"@csrf","type":"text"},{"text":" \u2192 security token","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udd39 Step 3: Create Route & Controller","type":"text"}],"type":"heading"},{"attrs":{"level":3},"content":[{"text":"Route","type":"text"}],"type":"heading"},{"content":[{"marks":[{"type":"code"}],"text":"routes/web.php","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"attrs":{"language":"php"},"content":[{"text":"use App\\Http\\Controllers\\UploadController;\r\n\r\nRoute::get('/upload', [UploadController::class,'create']);\r\nRoute::post('/upload', [UploadController::class,'store'])->name('upload.store');\r\n","type":"text"}],"type":"codeBlock"},{"attrs":{"level":3},"content":[{"text":"Controller","type":"text"}],"type":"heading"},{"attrs":{"language":"plaintext"},"content":[{"text":"php artisan make:controller UploadController\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"marks":[{"type":"code"}],"text":"app/Http/Controllers/UploadController.php","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"attrs":{"language":"php"},"content":[{"text":"validate([\r\n 'image' => 'required|image|mimes:jpeg,png,jpg,gif|max:2048'\r\n ]);\r\n\r\n $path = $request->file('image')->store('images','public');\r\n\r\n return back()->with('success','Image uploaded successfully! Path: '.$path);\r\n }\r\n}\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"content":[{"content":[{"marks":[{"type":"code"}],"text":"store('images', 'public')","type":"text"},{"text":" \u2192 stores in ","type":"text"},{"marks":[{"type":"code"}],"text":"storage/app/public/images","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Validation ensures ","type":"text"},{"marks":[{"type":"bold"}],"text":"file type and size","type":"text"},{"text":" restrictions","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udd39 Step 4: Display Uploaded Images","type":"text"}],"type":"heading"},{"attrs":{"language":"html"},"content":[{"text":" $\"Uploaded$ \r\n","type":"text"}],"type":"codeBlock"},{"content":[{"content":[{"content":[{"marks":[{"type":"code"}],"text":"asset('storage/...')","type":"text"},{"text":" \u2192 generates public URL","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udd39 Step 5: Handling File Deletion","type":"text"}],"type":"heading"},{"attrs":{"language":"php"},"content":[{"text":"Storage::disk('public')->delete($path);\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"content":[{"content":[{"text":"Removes the file from ","type":"text"},{"marks":[{"type":"code"}],"text":"storage/app/public","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udd39 Step 6: Advanced: Multiple File Uploads","type":"text"}],"type":"heading"},{"attrs":{"language":"html"},"content":[{"text":"\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"text":"Controller:","type":"text"}],"type":"paragraph"},{"attrs":{"language":"php"},"content":[{"text":"foreach($request->file('images') as $image) {\r\n $image->store('images','public');\r\n}\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"content":[{"content":[{"text":"Loops through files and stores each one","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udd39 Step 7: Storing Files in Cloud (S3 Example)","type":"text"}],"type":"heading"},{"content":[{"text":"Set up ","type":"text"},{"marks":[{"type":"code"}],"text":".env","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"attrs":{"language":"plaintext"},"content":[{"text":"FILESYSTEM_DRIVER=s3\r\nAWS_ACCESS_KEY_ID=your_key\r\nAWS_SECRET_ACCESS_KEY=your_secret\r\nAWS_DEFAULT_REGION=your_region\r\nAWS_BUCKET=your_bucket\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"text":"Then store:","type":"text"}],"type":"paragraph"},{"attrs":{"language":"php"},"content":[{"text":"$path = $request->file('image')->store('images', 's3');\r\n$url = Storage::disk('s3')->url($path);\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"content":[{"content":[{"text":"Generates public URL for cloud files","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"attrs":{"level":2},"content":[{"text":"\ud83d\udccc Key Takeaways","type":"text"}],"type":"heading"},{"content":[{"text":"This week you learned:","type":"text"}],"type":"paragraph"},{"content":[{"content":[{"content":[{"text":"How to ","type":"text"},{"marks":[{"type":"bold"}],"text":"configure Laravel filesystem","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"How to create ","type":"text"},{"marks":[{"type":"bold"}],"text":"file upload forms","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"How to ","type":"text"},{"marks":[{"type":"bold"}],"text":"validate uploaded files","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"How to ","type":"text"},{"marks":[{"type":"bold"}],"text":"store files locally or in public folder","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"How to ","type":"text"},{"marks":[{"type":"bold"}],"text":"handle multiple file uploads and deletion","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Optional: ","type":"text"},{"marks":[{"type":"bold"}],"text":"Store files in cloud storage (S3)","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"type":"paragraph"}],"type":"doc"}13:[["$","a",null,{"href":"#main-content","className":"bg-brand fixed top-3 left-3 z-[100] -translate-y-20 rounded-lg px-4 py-2 font-semibold text-white transition focus:translate-y-0 dark:text-slate-950","children":"Skip to content"}],["$","header",null,{"className":"border-border bg-canvas/92 sticky top-0 z-40 border-b backdrop-blur-xl","children":["$","div",null,{"className":"mx-auto flex h-16 max-w-[1440px] items-center gap-3 px-4 sm:px-6","children":[["$","$L1a",null,{}],["$","form",null,{"role":"search","action":"/search","className":"relative ml-3 hidden max-w-xl flex-1 md:block","children":[["$","label",null,{"htmlFor":"global-search","className":"sr-only","children":"Search articles, tags and people"}],["$","svg",null,{"aria-hidden":"true","viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"1.8","strokeLinecap":"round","strokeLinejoin":"round","className":"text-ink-muted pointer-events-none absolute top-1/2 left-3 size-5 -translate-y-1/2","children":[["$","circle",null,{"cx":"11","cy":"11","r":"7"}],["$","path",null,{"d":"m20 20-4-4"}]]}],["$","input",null,{"id":"global-search","name":"q","type":"search","placeholder":"Search articles, tags and people","className":"border-border bg-surface placeholder:text-ink-muted/75 h-11 w-full rounded-xl border pr-4 pl-10 text-sm"}]]}],["$","div",null,{"className":"ml-auto flex items-center gap-2","children":[["$","$Ld",null,{"href":"/search","aria-label":"Search","className":"hover:bg-brand-soft grid size-11 place-items-center rounded-xl md:hidden","children":["$","svg",null,{"aria-hidden":"true","viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"1.8","strokeLinecap":"round","strokeLinejoin":"round","className":"size-5","children":"$13:1:props:children:props:children:1:props:children:1:props:children"}]}],["$","$L1b",null,{}],["$","div",null,{"className":"hidden sm:block","children":["$","$Ld",null,{"href":"/dashboard/posts/new","className":"bg-brand hover:bg-brand-strong inline-flex min-h-11 items-center justify-center gap-2 rounded-xl px-4 py-2 text-sm font-semibold text-white transition dark:text-slate-950","children":[["$","svg",null,{"aria-hidden":"true","viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":"1.8","strokeLinecap":"round","strokeLinejoin":"round","className":"size-4","children":[["$","path",null,{"d":"m4 20 4.5-1 10-10-3.5-3.5-10 10L4 20Z"}],["$","path",null,{"d":"m13.5 7 3.5 3.5"}]]}],"Write"]}]}],["$","$L1c",null,{}]]}]]}]}],["$","div",null,{"className":"mx-auto grid max-w-[1460px] grid-cols-1 gap-6 px-4 pt-6 pb-24 sm:px-6 lg:grid-cols-[220px_minmax(0,760px)] lg:pb-10 xl:grid-cols-[220px_minmax(0,760px)_300px]","children":[["$","$L1d",null,{}],["$","main",null,{"id":"main-content","tabIndex":-1,"className":"min-w-0","children":[["$","$L1e",null,{}],[["$","section",null,{"className":"border-border bg-surface rounded-2xl border shadow-[0_1px_2px_rgb(15_23_42/0.03)] mb-6 p-6 sm:p-8","children":["$","div",null,{"className":"flex flex-col gap-5 sm:flex-row sm:items-center","children":[["$","div",null,{"className":"bg-brand-soft text-brand relative grid size-20 shrink-0 place-items-center overflow-hidden rounded-2xl text-3xl font-bold","children":["$","span",null,{"aria-hidden":"true","children":"#"}]}],["$","div",null,{"className":"min-w-0 flex-1","children":[["$","p",null,{"className":"text-brand text-sm font-semibold","children":"Topic"}],["$","h1",null,{"className":"mt-1 text-3xl font-bold tracking-tight break-words","children":["#","image-upload"]}],["$","p",null,{"className":"text-ink-muted mt-2 max-w-3xl leading-7","children":"Articles tagged image-upload."}],["$","p",null,{"className":"text-ink-muted mt-3 text-sm","children":["1"," ","article"]}]]}],["$","$L1f",null,{"topicId":988,"topicName":"image-upload","initialFollowing":false,"initialFollowerCount":0,"authenticated":false,"returnTo":"/t/image-upload"}]]}]}],["$","$L20",null,{"data":{"count":1,"next":null,"previous":null,"results":[{"id":281,"slug":"laravel-file-upload-storage-beginner-friendly","title":"Laravel File Upload & Storage (Beginner Friendly)","excerpt":"📌 Why File Upload & Storage is Important Almost every web application requires file uploads : Profile pictures Documents Images or videos for blogs Reports for admin dashboards La","content":[{"type":"richText","document":{"content":[{"attrs":{"level":2},"content":[{"text":"📌 Why File Upload & Storage is Important","type":"text"}],"type":"heading"},{"content":[{"text":"Almost every web application requires ","type":"text"},{"marks":[{"type":"bold"}],"text":"file uploads","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"content":[{"content":[{"content":[{"text":"Profile pictures","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Documents","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Images or videos for blogs","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"text":"Reports for admin dashboards","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"content":[{"text":"Laravel makes ","type":"text"},{"marks":[{"type":"bold"}],"text":"file upload and storage","type":"text"},{"text":" easy and secure.","type":"text"}],"type":"paragraph"},{"attrs":{"level":2},"content":[{"text":"⚙️ Step 1: Configure Filesystem","type":"text"}],"type":"heading"},{"content":[{"text":"Laravel uses ","type":"text"},{"marks":[{"type":"bold"}],"text":"Filesystem API","type":"text"},{"text":" to handle files. Default configuration is in:","type":"text"}],"type":"paragraph"},{"attrs":{"language":"plaintext"},"content":[{"text":"config/filesystems.php\r\n","type":"text"}],"type":"codeBlock"},{"content":[{"text":"Common disks:","type":"text"}],"type":"paragraph"},{"content":[{"content":[{"content":[{"marks":[{"type":"code"}],"text":"local","type":"text"},{"text":" → storage/app","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"marks":[{"type":"code"}],"text":"public","type":"text"},{"text":" → storage/app/public (accessible via URL)","type":"text"}],"type":"paragraph"}],"type":"listItem"},{"content":[{"content":[{"marks":[{"type":"code"}],"text":"s3","type":"text"},{"text":" → cloud storage","type":"text"}],"type":"paragraph"}],"type":"listItem"}],"type":"bulletList"},{"content":[{"text":"Create symbolic link to make ","type":"text"},{"marks":[{"type":"code"}],"text":"public","type":"text"},{"text":" files accessible:","type":"text"}],"type":"paragraph"},{"attrs":{"language":"plaintext"},"content":[{"text":"php artisan storage:link\r\n","type":"text"}],"type":"codeBlock"},{"attrs":{"level":2},"content":[{"text":"🔹 Step 2: Create File Upload Form","type":"text"}],"type":"heading"},{"content":[{"text":"Example: Uploading images","type":"text"}],"type":"paragraph"},{"content":[{"marks":[{"type":"code"}],"text":"resources/views/upload.blade.php","type":"text"},{"text":":","type":"text"}],"type":"paragraph"},{"attrs":{"language":"html"},"content":[{"text":"@extends('layouts.app')\r\n\r\n@section('content')\r\n

Upload Image

\r\n@if(session('success'))\r\n

#image-upload

Articles

Laravel File Upload & Storage (Beginner Friendly)