{"id":16485,"date":"2020-07-24T04:22:36","date_gmt":"2020-07-24T04:22:36","guid":{"rendered":"https:\/\/www.devopsschool.com\/blog\/?p=16485"},"modified":"2021-10-30T06:02:57","modified_gmt":"2021-10-30T06:02:57","slug":"how-to-upload-profile-image-of-users-in-laravel","status":"publish","type":"post","link":"https:\/\/www.devopsschool.com\/blog\/how-to-upload-profile-image-of-users-in-laravel\/","title":{"rendered":"How to Upload Profile Image of Users in LARAVEL?"},"content":{"rendered":"\n<p>How to Upload Profile Image of Users in LARAVEL?<\/p>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 1.<\/span><\/strong> <strong>Create<\/strong>&nbsp;a new Project in Laravel, so&nbsp;<strong>open<\/strong>&nbsp;git bash.&nbsp;<strong>Write<\/strong>&nbsp;down the following command:-<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript\">$ composer create-project --prefer-dist laravel\/laravel ProfileImage <span class=\"hljs-string\">\"5.8.*\"<\/span><\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-207-1024x576.png\" alt=\"\" class=\"wp-image-16486\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-207-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-207-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-207-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-207-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-207.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 2.<\/span><\/strong> &nbsp;Now,&nbsp;<strong>Move<\/strong>&nbsp;to project directory on git Bash, so&nbsp;<strong>write<\/strong>&nbsp;down the following command:-<\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs\">$ cd ProfileImage<\/code><\/span><\/pre>\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-209-1024x576.png\" alt=\"\" class=\"wp-image-16488\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-209-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-209-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-209-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-209-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-209.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h4 class=\"has-text-align-center wp-block-heading\"><strong><span class=\"has-inline-color has-vivid-cyan-blue-color\">Mysql Database connection Laravel<\/span><\/strong><\/h4>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 3.<\/span><\/strong> So,&nbsp;<strong><strong>Create<\/strong>&nbsp;<\/strong>a&nbsp;Database&nbsp;for this and<strong>&nbsp;<strong>Go&nbsp;<\/strong><\/strong>to<strong>&nbsp;<strong>XAMPP server-&gt;phpMyAdmin-&gt;Click New Database-<\/strong><\/strong>&gt;imagedatabase.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-208-1024x576.png\" alt=\"\" class=\"wp-image-16487\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-208-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-208-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-208-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-208-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-208.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 4.<\/span><\/strong> &nbsp;<strong>Go<\/strong>&nbsp;to&nbsp;<strong>.env file<\/strong>&nbsp;to set the project path and give the project&nbsp;<strong>DB_DATABASE name<\/strong>&nbsp;and&nbsp;<strong>DB_USERNAME name.<\/strong><\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs\">DB_CONNECTION=mysql\nDB_HOST=127.0.0.1\nDB_PORT=3306\nDB_DATABASE=imagedatabase\nDB_USERNAME=root\nDB_PASSWORD=<\/code><\/span><\/pre>\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 5.<\/span><\/strong> &nbsp;<strong>Create<\/strong>&nbsp;the&nbsp;<strong>user authentication scaffolding<\/strong>&nbsp;and&nbsp;<strong>write<\/strong>&nbsp;down this command:-<\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs\">$ php artisan make:auth<\/code><\/span><\/pre>\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-210-1024x576.png\" alt=\"\" class=\"wp-image-16489\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-210-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-210-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-210-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-210-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-210.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 6.<\/span><\/strong> <strong>Add <\/strong>image column with default value into <em><strong>database\/migrations\/create_users_table.php<\/strong><\/em><\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php\">   $table-&gt;string(<span class=\"hljs-string\">'image'<\/span>)-&gt;default(<span class=\"hljs-string\">'user.png'<\/span>);<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 7.<\/span><\/strong> <strong>Migrate&nbsp;<\/strong>the tables into the&nbsp;<strong>MySQL database<\/strong>.&nbsp;<strong>Write<\/strong>&nbsp;the following command in git Base.<\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs\">$ php artisan migrate<\/code><\/span><\/pre>\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-211-1024x576.png\" alt=\"\" class=\"wp-image-16490\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-211-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-211-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-211-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-211-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-211.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 8.<\/span><\/strong> <strong>Link <\/strong>the storage directory. Write the following command:-<\/p>\n\n\n<pre class=\"wp-block-code\"><span><code class=\"hljs\">$ php artisan storage:link<\/code><\/span><\/pre>\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-212-1024x576.png\" alt=\"\" class=\"wp-image-16491\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-212-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-212-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-212-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-212-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-212.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 9.<\/span><\/strong> <strong>Go<\/strong> to  <em><strong>resources\/views\/home.blade.php<\/strong><\/em> file.<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ushakiran27\/84a71f9bdb4c1342585236c983d9ad92.js\"><\/script>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 10.<\/span><\/strong> <strong>Go<\/strong> to <strong><em>User.php<\/em><\/strong> file and<strong> write<\/strong> down the following code:-<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ushakiran27\/4a708d3fcd6927926044ccb04f86ad20.js\"><\/script>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 11.<\/span><\/strong> <strong>Go <\/strong>to <strong><em>layouts\/app.blade.php<\/em><\/strong> file and<strong> write<\/strong> down the following code:-<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ushakiran27\/ba716a0a668d81ad45828103220c88ca.js\"><\/script>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 12.<\/span><\/strong> Now,<strong> Go<\/strong> to <strong><em>app\/Http\/Controllers\/HomeController.php<\/em><\/strong> file<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ushakiran27\/d56b74118c91481e86a36565bbf9409c.js\"><\/script>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-213-1024x576.png\" alt=\"\" class=\"wp-image-16494\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-213-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-213-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-213-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-213-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-213.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 13.<\/span><\/strong> Then,&nbsp;<strong>go&nbsp;<\/strong>to&nbsp;<strong>routes\/web.php<\/strong>&nbsp;file and&nbsp;<strong>define&nbsp;<\/strong>the route.<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ushakiran27\/4e013aac39fa7093ba8066b5de113016.js\"><\/script>\n\n\n\n<p><strong><span class=\"has-inline-color has-vivid-red-color\">Step 14.<\/span><\/strong> After that, <strong>Use<\/strong> these classes into <strong>routes\/web.php<\/strong>&nbsp;file<\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/ushakiran27\/33dadffe5989e85f504202074e317be8.js\"><\/script>\n\n\n\n<h5 class=\"has-text-align-center wp-block-heading\"><strong><span class=\"has-inline-color has-vivid-red-color\">Upload Profile Image<\/span><\/strong><\/h5>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-214-1024x576.png\" alt=\"\" class=\"wp-image-16495\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-214-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-214-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-214-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-214-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-214.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-215-1024x576.png\" alt=\"\" class=\"wp-image-16496\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-215-1024x576.png 1024w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-215-300x169.png 300w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-215-768x432.png 768w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-215-355x199.png 355w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2020\/07\/image-215.png 1366w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Thanks<\/p>\n\n\n<div class=\"epyt-gallery\" data-currpage=\"1\" id=\"epyt_gallery_14705\"><figure class=\"wp-block-embed wp-block-embed-youtube is-type-video is-provider-youtube epyt-figure\"><div class=\"wp-block-embed__wrapper\"><iframe loading=\"lazy\"  id=\"_ytid_21381\"  width=\"760\" height=\"427\"  data-origwidth=\"760\" data-origheight=\"427\" src=\"https:\/\/www.youtube.com\/embed\/?enablejsapi=1&#038;autoplay=0&#038;cc_load_policy=0&#038;cc_lang_pref=&#038;iv_load_policy=1&#038;loop=0&#038;rel=1&#038;fs=1&#038;playsinline=0&#038;autohide=2&#038;theme=dark&#038;color=red&#038;controls=1&#038;disablekb=0&#038;\" class=\"__youtube_prefs__  no-lazyload\" title=\"YouTube player\"  data-epytgalleryid=\"epyt_gallery_14705\"  allow=\"fullscreen; accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen data-no-lazy=\"1\" data-skipgform_ajax_framebjll=\"\"><\/iframe><\/div><\/figure><div class=\"epyt-gallery-list\"><div>Sorry, there was a YouTube error.<\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>How to Upload Profile Image of Users in LARAVEL? Step 1. Create&nbsp;a new Project in Laravel, so&nbsp;open&nbsp;git bash.&nbsp;Write&nbsp;down the following command:- Step 2. &nbsp;Now,&nbsp;Move&nbsp;to project directory on git Bash, so&nbsp;write&nbsp;down the following command:- Mysql Database connection Laravel Step 3. So,&nbsp;Create&nbsp;a&nbsp;Database&nbsp;for this and&nbsp;Go&nbsp;to&nbsp;XAMPP server-&gt;phpMyAdmin-&gt;Click New Database-&gt;imagedatabase. Step 4. &nbsp;Go&nbsp;to&nbsp;.env file&nbsp;to set the project path and give&#8230;<\/p>\n","protected":false},"author":29,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","_joinchat":[],"footnotes":""},"categories":[5201],"tags":[],"class_list":["post-16485","post","type-post","status-publish","format-standard","hentry","category-laravel"],"_links":{"self":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/16485","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/users\/29"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/comments?post=16485"}],"version-history":[{"count":5,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/16485\/revisions"}],"predecessor-version":[{"id":24651,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/16485\/revisions\/24651"}],"wp:attachment":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/media?parent=16485"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/categories?post=16485"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/tags?post=16485"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}