title
Laravel From Scratch [Part 12] - File Uploading & Finishing Up
description
In this video we will wrap up our application and add file uploading for blog posts. I hope you guys enjoyed this Laravel series. I will look into deployment soon!
CODE: Complete Code For This Series
https://github.com/bradtraversy/lsapp
10 PROJECT LARAVEL COURSE: Please use affiliate link below
https://www.eduonix.com/affiliates/id/16-10485
50% OFF: Use special code "traversy"
SUPPORT: We spend massive amounts of time creating these free videos, please donate to show your support:
http://www.paypal.me/traversymedia
http://www.patreon.com/traversymedia
FOLLOW TRAVERSY MEDIA:
http://www.facebook.com/traversymedia
http://www.twitter.com/traversymedia
http://www.linkedin.com/in/bradtraversy
detail
{'title': 'Laravel From Scratch [Part 12] - File Uploading & Finishing Up', 'heatmap': [{'end': 709.221, 'start': 671.87, 'weight': 0.754}, {'end': 1031.078, 'start': 1004.664, 'weight': 0.891}, {'end': 1347.081, 'start': 1325.643, 'weight': 1}], 'summary': "Tutorial series 'laravel from scratch [part 12]' covers adding file upload functionality to post creation form, creating migration for cover image column in post table, adding validation for image uploads, handling file uploads, file management in laravel including unique file names with timestamps, displaying and updating images in post index and show view, managing image upload, deletion, and troubleshooting errors, emphasizing engagement with the series.", 'chapters': [{'end': 228.111, 'segs': [{'end': 56.478, 'src': 'embed', 'start': 26.132, 'weight': 0, 'content': [{'end': 35.849, 'text': "which is create.blade, and we're going to go right right above the submit here and let's create a div, create a form,", 'start': 26.132, 'duration': 9.717}, {'end': 43.941, 'text': 'group div and we want a file field here.', 'start': 35.849, 'duration': 8.092}, {'end': 51.592, 'text': "so we're going to use our laravel collective package here and say form file,", 'start': 43.941, 'duration': 7.651}, {'end': 56.478, 'text': "and then just we just need the name and we're going to call it cover image, cover underscore image.", 'start': 51.592, 'duration': 4.886}], 'summary': 'Using laravel collective package to create a file field named cover_image.', 'duration': 30.346, 'max_score': 26.132, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c426132.jpg'}, {'end': 125.56, 'src': 'embed', 'start': 89.506, 'weight': 1, 'content': [{'end': 92.527, 'text': "Now if we submit it, it's not going to do anything.", 'start': 89.506, 'duration': 3.021}, {'end': 93.527, 'text': "It's just the UI.", 'start': 92.567, 'duration': 0.96}, {'end': 94.708, 'text': 'So we need to handle this.', 'start': 93.607, 'duration': 1.101}, {'end': 101.109, 'text': 'Now before we get into that, we need to add another column to the post table.', 'start': 95.248, 'duration': 5.861}, {'end': 103.83, 'text': 'So we need a cover image column.', 'start': 102.089, 'duration': 1.741}, {'end': 106.05, 'text': "So we're going to create another migration.", 'start': 104.37, 'duration': 1.68}, {'end': 111.972, 'text': "So let's go to, let's see, I'm just going to open up the terminal here.", 'start': 107.631, 'duration': 4.341}, {'end': 125.56, 'text': "and let's say php artisan and we're going to do make migration and then we're going to call it add.", 'start': 113.968, 'duration': 11.592}], 'summary': 'Adding a cover image column to the post table by creating a new migration.', 'duration': 36.054, 'max_score': 89.506, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c489506.jpg'}, {'end': 231.755, 'src': 'embed', 'start': 204.278, 'weight': 2, 'content': [{'end': 206.878, 'text': "So I'm just going to do that from here just to make it easier.", 'start': 204.278, 'duration': 2.6}, {'end': 208.899, 'text': "So we'll just say delete.", 'start': 206.898, 'duration': 2.001}, {'end': 213.28, 'text': "Yes, and now we shouldn't have any posts for anybody.", 'start': 210.539, 'duration': 2.741}, {'end': 215.241, 'text': "So if we go to blog, there's no posts found.", 'start': 213.36, 'duration': 1.881}, {'end': 218.383, 'text': "Alright, now let's handle the actual uploads.", 'start': 216.281, 'duration': 2.102}, {'end': 228.111, 'text': "So we're going to get out of the migration files here and we're going to go to the controller, post controller and you know that it submits to store.", 'start': 218.423, 'duration': 9.688}, {'end': 231.755, 'text': 'So right here, this is where the form submits to.', 'start': 229.693, 'duration': 2.062}], 'summary': 'Deleting all posts from the blog and handling uploads in the post controller.', 'duration': 27.477, 'max_score': 204.278, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4204278.jpg'}], 'start': 0.717, 'title': 'Laravel post modifications', 'summary': 'Covers adding file upload functionality to post creation form, creating migration for cover image column in post table, and executing migration to delete previous posts, resulting in an empty post table for the blog.', 'chapters': [{'end': 88.646, 'start': 0.717, 'title': 'Adding file upload to posts', 'summary': 'Covers the process of adding file uploading functionality to a post creation form using laravel collective package, highlighting the steps of modifying the create form, setting the file field, and adding the required multipart form data attribute.', 'duration': 87.929, 'highlights': ['The process involves modifying the create form (create.blade) by adding a file upload field using Laravel Collective package.', "The file upload field is added by creating a div and using 'form file' with the name attribute set to 'cover_image'.", "To enable file submission, the form requires the 'enctype' attribute set to 'multipart/form-data' after the 'post' method."]}, {'end': 173.273, 'start': 89.506, 'title': 'Adding cover image to post table', 'summary': 'Involves creating a migration to add a cover image column to the post table, specifying the need for the column, and explaining the process of modifying the migration file to include the new column.', 'duration': 83.767, 'highlights': ['We need to add another column to the post table, specifically a cover image column, by creating a new migration. This involves modifying the migration file to include the new column, specifying its data type as a string instead of an integer, and explaining the purpose of saving the image name to the database and uploading the actual file.', 'The process of modifying the migration file to include the new column involves adding the schema table for the cover image, specifying its data type as a string, and explaining the significance of saving the image name to the database and uploading the actual file.']}, {'end': 228.111, 'start': 173.273, 'title': 'Database migration and post deletion', 'summary': 'Covers the process of adding a cover image to the post table, running the migration, and deleting all previous posts using php artisan migrate, resulting in an empty post table for the blog.', 'duration': 54.838, 'highlights': ['Adding a cover image to the post table and running the migration using PHP artisan migrate.', 'Deleting all previous posts to result in an empty post table for the blog.']}], 'duration': 227.394, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4717.jpg', 'highlights': ['Creating a file upload field in the create form using Laravel Collective package.', 'Adding a cover image column to the post table by modifying the migration file.', 'Running the migration to delete previous posts, resulting in an empty post table.']}, {'end': 517.347, 'segs': [{'end': 283.128, 'src': 'embed', 'start': 229.693, 'weight': 0, 'content': [{'end': 231.755, 'text': 'So right here, this is where the form submits to.', 'start': 229.693, 'duration': 2.062}, {'end': 237.68, 'text': 'And we can actually add some validation for our image.', 'start': 233.416, 'duration': 4.264}, {'end': 246.787, 'text': "So we call the cover image and we're going to set this to image, meaning that it has to it.", 'start': 238.54, 'duration': 8.247}, {'end': 253.031, 'text': 'the file has to be an image, it has to be a JPEG or a PNG or a GIF, whatever the hell.', 'start': 246.787, 'duration': 6.244}, {'end': 255.532, 'text': 'but we also want it to be optional.', 'start': 253.031, 'duration': 2.501}, {'end': 258.012, 'text': "we don't want the user to have to be able to upload the image.", 'start': 255.532, 'duration': 2.48}, {'end': 261.555, 'text': "so we're also going to add nullable, all right.", 'start': 258.012, 'duration': 3.543}, {'end': 270.44, 'text': "and then we also want to max size, and I'm going to set this to 1999, and the reason for that is With a lot of Apache servers,", 'start': 261.555, 'duration': 8.885}, {'end': 273.302, 'text': 'the default upload size is 2MB.', 'start': 270.44, 'duration': 2.862}, {'end': 283.128, 'text': "So if we don't set this, there's a good chance that they'll try to upload a bigger image and it's going to just throw an error.", 'start': 274.423, 'duration': 8.705}], 'summary': 'Adding image validation to form submission, setting max size to 1999 to avoid errors', 'duration': 53.435, 'max_score': 229.693, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4229693.jpg'}, {'end': 367.854, 'src': 'embed', 'start': 339.759, 'weight': 2, 'content': [{'end': 344.8, 'text': "So basically if they don't upload an image it's going to look at this default image and use that in the posts.", 'start': 339.759, 'duration': 5.041}, {'end': 349.662, 'text': "Okay and you can set this up differently if you don't want to have an image or something like that.", 'start': 345.461, 'duration': 4.201}, {'end': 353.764, 'text': "Now, if they do submit it, there's quite a bit we need to do.", 'start': 350.782, 'duration': 2.982}, {'end': 360.669, 'text': "And I'm going to show you how to get the file name with the extension.", 'start': 353.784, 'duration': 6.885}, {'end': 367.854, 'text': "So let's create a variable called file name with ext.", 'start': 363.251, 'duration': 4.603}], 'summary': 'System defaults to a default image if no upload; process for file name extraction explained.', 'duration': 28.095, 'max_score': 339.759, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4339759.jpg'}], 'start': 229.693, 'title': 'File upload validation and handling', 'summary': 'Covers adding validation for image uploads, setting a max size of 1999 for images, and handling file uploads by checking if an image was uploaded and creating a default image if not.', 'chapters': [{'end': 517.347, 'start': 229.693, 'title': 'File upload validation and handling', 'summary': 'Covers adding validation for image uploads, setting a max size of 1999 for images to prevent errors, and handling file uploads by checking if an image was uploaded and creating a default image if not.', 'duration': 287.654, 'highlights': ['Setting a max size of 1999 for images to prevent errors The code sets a max size of 1999 for images to prevent errors, considering that the default upload size for many Apache servers is 2MB.', 'Adding validation for image uploads The chapter discusses adding validation for image uploads, requiring the file to be an image (JPEG, PNG, or GIF) and making it optional for users.', "Handling file uploads by checking if an image was uploaded and creating a default image if not The code handles file uploads by checking if an image was uploaded and creating a variable to store a static title called 'no image.jpeg' if no image was uploaded."]}], 'duration': 287.654, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4229693.jpg', 'highlights': ['Setting a max size of 1999 for images to prevent errors', 'Adding validation for image uploads', 'Handling file uploads by checking if an image was uploaded and creating a default image if not']}, {'end': 895.416, 'segs': [{'end': 592.685, 'src': 'embed', 'start': 540.817, 'weight': 0, 'content': [{'end': 549.579, 'text': "okay, so we use the time function and then we're going to concatenate onto that a dot And then the extension.", 'start': 540.817, 'duration': 8.762}, {'end': 553.3, 'text': 'So we have to say .extension.', 'start': 550.179, 'duration': 3.121}, {'end': 561.362, 'text': 'So what this will do is it will call it the original file name, underscore, and then a timestamp, which makes the file name completely unique.', 'start': 553.92, 'duration': 7.442}, {'end': 567.864, 'text': "So that if someone else uploads one with the same name, it's not going to overwrite anything or anything like that.", 'start': 561.762, 'duration': 6.102}, {'end': 570.736, 'text': 'All right, hopefully that makes sense.', 'start': 569.315, 'duration': 1.421}, {'end': 574.477, 'text': 'And then finally, we just want to upload the image.', 'start': 572.456, 'duration': 2.021}, {'end': 584.502, 'text': "So to do that, we're going to set a variable called path to request file cover image.", 'start': 575.978, 'duration': 8.524}, {'end': 592.685, 'text': "And then we're going to say store as.", 'start': 589.744, 'duration': 2.941}], 'summary': 'Using time function and concatenation to create unique file names for uploads.', 'duration': 51.868, 'max_score': 540.817, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4540817.jpg'}, {'end': 731.955, 'src': 'heatmap', 'start': 671.87, 'weight': 2, 'content': [{'end': 682.92, 'text': "and all we have to do is say php, artisan storage, colon link, and it says it's been linked.", 'start': 671.87, 'duration': 11.05}, {'end': 686.303, 'text': "and now, if you look in public, there's actually a folder called storage.", 'start': 682.92, 'duration': 3.383}, {'end': 694.049, 'text': 'so whatever we put into the, the, the storage here, is actually going to show up there as well for us to use in our website.', 'start': 686.303, 'duration': 7.746}, {'end': 695.911, 'text': 'Hopefully that makes sense.', 'start': 694.87, 'duration': 1.041}, {'end': 709.221, 'text': "Now down here, when we actually save to the database, we want to add post cover image, and we're going to set that equal to file name to store.", 'start': 696.691, 'duration': 12.53}, {'end': 715.386, 'text': "So it's either going to be no image, or it's going to be the image with the timestamp.", 'start': 709.621, 'duration': 5.765}, {'end': 718.608, 'text': "So let's actually try this out.", 'start': 717.207, 'duration': 1.401}, {'end': 719.229, 'text': "We'll save it.", 'start': 718.628, 'duration': 0.601}, {'end': 727.173, 'text': "and let's go to dashboard, create post and let's call this post one.", 'start': 721.229, 'duration': 5.944}, {'end': 731.955, 'text': "we'll say this is post one.", 'start': 727.173, 'duration': 4.782}], 'summary': "Using 'php artisan storage:link' creates a linked storage folder in public, enabling files to be accessed on the website. the script sets post cover image to file name to store, allowing for easy image management.", 'duration': 85.751, 'max_score': 671.87, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4671870.jpg'}], 'start': 517.506, 'title': 'File management in laravel', 'summary': 'Covers creating unique file names with timestamps and storing images in laravel. it includes concatenating file names with timestamps for uniqueness, uploading and storing images, setting up symlinks, and troubleshooting errors.', 'chapters': [{'end': 561.362, 'start': 517.506, 'title': 'Creating unique file names with timestamps', 'summary': 'Discusses the process of creating unique file names by concatenating the original file name with a timestamp using a time function and an extension, ensuring each file name is completely unique.', 'duration': 43.856, 'highlights': ['Concatenating the original file name with a timestamp using a time function and an extension ensures each file name is completely unique.', 'Using the time function to generate the timestamp for the file name.']}, {'end': 895.416, 'start': 561.762, 'title': 'Uploading and storing images in laravel', 'summary': 'Explains the process of uploading and storing images in laravel, including creating a folder for images, setting up symlinks, and saving the image to the database, with a demonstration of troubleshooting and resolution of errors.', 'duration': 333.654, 'highlights': ['The process of uploading and storing images in Laravel involves creating a folder for images and setting up symlinks to make the images accessible through the browser.', 'Demonstration of troubleshooting and resolution of errors when encountering issues with file upload and form data in Laravel.', "Setting a variable called path to request file cover image and using 'store as' to upload the image in Laravel.", "Explanation of the path for storing images in Laravel, including the creation of a folder called 'cover_images' and the use of a symlink to make the images accessible through the browser.", "Saving the image to the database in Laravel involves setting post cover image equal to the file name to store, either as 'no image' or with a timestamp."]}], 'duration': 377.91, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4517506.jpg', 'highlights': ['Concatenating the original file name with a timestamp ensures uniqueness.', 'Using the time function to generate the timestamp for the file name.', 'Demonstration of troubleshooting and resolution of errors in Laravel.', 'Setting up symlinks to make the images accessible through the browser.', "Setting a variable called path to request file cover image and using 'store as' to upload the image in Laravel.", 'Saving the image to the database in Laravel involves setting post cover image equal to the file name.']}, {'end': 1102.197, 'segs': [{'end': 960.597, 'src': 'embed', 'start': 895.916, 'weight': 0, 'content': [{'end': 897.837, 'text': "So now let's go into the database and look.", 'start': 895.916, 'duration': 1.921}, {'end': 901.639, 'text': 'And you can see we have angular2 underscore timestamp.jpg.', 'start': 897.857, 'duration': 3.782}, {'end': 902.32, 'text': "So that's good.", 'start': 901.659, 'duration': 0.661}, {'end': 908.783, 'text': 'And then if we look in our storage folder, we have public, cover images, and there it is.', 'start': 902.84, 'duration': 5.943}, {'end': 913.742, 'text': 'And if we look in the public folder, Right here, cover images.', 'start': 909.244, 'duration': 4.498}, {'end': 914.443, 'text': 'There it is.', 'start': 914.083, 'duration': 0.36}, {'end': 918.284, 'text': 'So that works great.', 'start': 915.903, 'duration': 2.381}, {'end': 922.947, 'text': 'So now what we need to do is display it in our post, which is really easy.', 'start': 918.405, 'duration': 4.542}, {'end': 925.988, 'text': "So let's go back to VS Code.", 'start': 923.047, 'duration': 2.941}, {'end': 933.111, 'text': "And we're going to go to the index view, post index view.", 'start': 926.848, 'duration': 6.263}, {'end': 938.029, 'text': 'And I want to have the image on one side and then this stuff on the other.', 'start': 934.668, 'duration': 3.361}, {'end': 943.531, 'text': "So inside this well, let's actually create a div with the class of row.", 'start': 938.109, 'duration': 5.422}, {'end': 947.212, 'text': 'This is just bootstrap markup.', 'start': 945.672, 'duration': 1.54}, {'end': 956.195, 'text': "And then we'll have a div with the class of call MD4 and call SM4.", 'start': 947.993, 'duration': 8.202}, {'end': 959.456, 'text': 'All right.', 'start': 956.475, 'duration': 2.981}, {'end': 960.597, 'text': "And then I'm going to copy that.", 'start': 959.516, 'duration': 1.081}], 'summary': 'Successfully located and displayed image file in the post index view using bootstrap markup.', 'duration': 64.681, 'max_score': 895.916, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4895916.jpg'}, {'end': 1031.078, 'src': 'heatmap', 'start': 1004.664, 'weight': 0.891, 'content': [{'end': 1017.452, 'text': "Let's also add a style here, and I just want to say width will be 100%.", 'start': 1004.664, 'duration': 12.788}, {'end': 1017.852, 'text': 'There we go.', 'start': 1017.452, 'duration': 0.4}, {'end': 1019.973, 'text': 'So now we can upload an image.', 'start': 1018.753, 'duration': 1.22}, {'end': 1021.974, 'text': 'Now we also want it on the show page.', 'start': 1020.193, 'duration': 1.781}, {'end': 1024.595, 'text': "So I'm actually going to just copy this right here.", 'start': 1022.534, 'duration': 2.061}, {'end': 1027.656, 'text': "And we'll go to our show view.", 'start': 1026.276, 'duration': 1.38}, {'end': 1031.078, 'text': "And let's just put this right below the H1.", 'start': 1028.916, 'duration': 2.162}], 'summary': 'Adding style with 100% width and uploading image to show page.', 'duration': 26.414, 'max_score': 1004.664, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41004664.jpg'}, {'end': 1102.197, 'src': 'embed', 'start': 1066.443, 'weight': 3, 'content': [{'end': 1073.449, 'text': "we're going to grab the, the file field right here and we're going to go to edit blade.", 'start': 1066.443, 'duration': 7.006}, {'end': 1079.133, 'text': 'put that in right there and we also need to add the ink type.', 'start': 1073.449, 'duration': 5.684}, {'end': 1086.367, 'text': 'copy that comma, paste that in save and that should give us the file upload.', 'start': 1079.133, 'duration': 7.234}, {'end': 1093.511, 'text': 'Oops What did I do? Oh, this is, I get two brackets here.', 'start': 1086.387, 'duration': 7.124}, {'end': 1099.115, 'text': 'Okay, so now we need to handle the update function.', 'start': 1096.293, 'duration': 2.822}, {'end': 1102.197, 'text': "So let's go back to the post controller and go to update.", 'start': 1099.155, 'duration': 3.042}], 'summary': 'The transcript discusses editing a file field and adding ink type, followed by handling the update function in the post controller.', 'duration': 35.754, 'max_score': 1066.443, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41066443.jpg'}], 'start': 895.916, 'title': 'Displaying and updating images', 'summary': 'Covers displaying images in post index and show view, using bootstrap markup and specifying image source. it also discusses updating the web page by adding a file upload field and handling edit forms, focusing on correct element placement and error resolution.', 'chapters': [{'end': 1027.656, 'start': 895.916, 'title': 'Displaying images in post view', 'summary': 'Covers the process of displaying images in the post index view and show view, including the use of bootstrap markup and specifying image source from the database, making it easy to implement.', 'duration': 131.74, 'highlights': ['The process of displaying images in the post index view and show view is covered. The chapter explains the steps to display images in the post index view and show view.', 'The use of bootstrap markup for structuring the layout is demonstrated. The author shows the implementation of bootstrap markup for structuring the layout of the post view.', 'Specifying the image source from the database is explained. The process of specifying the image source from the database is detailed, making it easy to implement.']}, {'end': 1102.197, 'start': 1028.916, 'title': 'Updating file and image in web page', 'summary': 'Discusses updating the web page by adding a file upload field and handling the edit form, with a focus on ensuring the correct placement of elements and resolving errors.', 'duration': 73.281, 'highlights': ['Resolving errors and ensuring correct placement of elements', 'Adding a file upload field in the edit form', 'Handling the update function in the post controller']}], 'duration': 206.281, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c4895916.jpg', 'highlights': ['The process of displaying images in the post index view and show view is covered.', 'The use of bootstrap markup for structuring the layout is demonstrated.', 'Specifying the image source from the database is explained.', 'Adding a file upload field in the edit form', 'Handling the update function in the post controller', 'Resolving errors and ensuring correct placement of elements']}, {'end': 1446.31, 'segs': [{'end': 1136.166, 'src': 'embed', 'start': 1107.728, 'weight': 2, 'content': [{'end': 1110.83, 'text': "And you know what? I'm actually going to copy everything we did in the store.", 'start': 1107.728, 'duration': 3.102}, {'end': 1111.991, 'text': "So let's grab this.", 'start': 1110.95, 'duration': 1.041}, {'end': 1117.474, 'text': 'Copy Go to update.', 'start': 1113.772, 'duration': 3.702}, {'end': 1120.056, 'text': 'Go right here and paste it in.', 'start': 1118.795, 'duration': 1.261}, {'end': 1128.001, 'text': "Now this is going to work a little different because if they don't upload an image, we don't want to replace it with no image like they are here.", 'start': 1121.997, 'duration': 6.004}, {'end': 1129.562, 'text': "So I'm going to get rid of the else.", 'start': 1128.021, 'duration': 1.541}, {'end': 1130.662, 'text': 'All right.', 'start': 1130.362, 'duration': 0.3}, {'end': 1136.166, 'text': 'And then down here, we only want it to add if they actually created an image.', 'start': 1130.783, 'duration': 5.383}], 'summary': 'Copying store data to update, handling images differently', 'duration': 28.438, 'max_score': 1107.728, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41107728.jpg'}, {'end': 1203.505, 'src': 'embed', 'start': 1167.11, 'weight': 4, 'content': [{'end': 1172.813, 'text': "And then we should be able to, if we submit and we don't upload an image, it's not going to change.", 'start': 1167.11, 'duration': 5.703}, {'end': 1182.319, 'text': "If we do, wait a minute, why can't I see the edit and delete buttons here? That's not right.", 'start': 1172.913, 'duration': 9.406}, {'end': 1187.134, 'text': 'Let me just check this real quick.', 'start': 1185.313, 'duration': 1.821}, {'end': 1193.579, 'text': 'User ID 2.', 'start': 1187.254, 'duration': 6.325}, {'end': 1194.479, 'text': "That's really weird.", 'start': 1193.579, 'duration': 0.9}, {'end': 1199.002, 'text': "Oh, I just didn't scroll down far enough.", 'start': 1195.78, 'duration': 3.222}, {'end': 1203.505, 'text': "Alright, so let's go Edit and then we will change the image.", 'start': 1200.163, 'duration': 3.342}], 'summary': 'User encounters issue with missing edit and delete buttons, resolves by scrolling down and changing image.', 'duration': 36.395, 'max_score': 1167.11, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41167110.jpg'}, {'end': 1303.582, 'src': 'embed', 'start': 1232.43, 'weight': 0, 'content': [{'end': 1240.44, 'text': "And we only want to delete it if it's not noimage.jpg, which I guess we have to look at that as well.", 'start': 1232.43, 'duration': 8.01}, {'end': 1246.07, 'text': "Let's see right here.", 'start': 1245.029, 'duration': 1.041}, {'end': 1246.99, 'text': "It's getting late.", 'start': 1246.33, 'duration': 0.66}, {'end': 1254.534, 'text': "Right here we're going to say if, because we don't want the no image to disappear,", 'start': 1247.79, 'duration': 6.744}, {'end': 1259.697, 'text': "because we're going to need that in case someone uploads a new post without an image.", 'start': 1254.534, 'duration': 5.163}, {'end': 1261.758, 'text': "So that's why we're checking for that here.", 'start': 1259.777, 'duration': 1.981}, {'end': 1277.749, 'text': 'So if post cover image is not equal to no image dot jpeg, then we want to delete the image.', 'start': 1262.518, 'duration': 15.231}, {'end': 1280.893, 'text': 'so to do that we actually have to bring in the storage library.', 'start': 1277.749, 'duration': 3.144}, {'end': 1296.82, 'text': "so up at the top here we're gonna say use illuminate, slash, support slash facades, slash storage,", 'start': 1280.893, 'duration': 15.927}, {'end': 1303.582, 'text': 'and if you ever want to check out the different libraries and all that with Laravel, you can easily look at the documentation it should.', 'start': 1296.82, 'duration': 6.762}], 'summary': "Check post cover image; if not 'noimage.jpg', delete using storage library", 'duration': 71.152, 'max_score': 1232.43, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41232430.jpg'}, {'end': 1368.149, 'src': 'heatmap', 'start': 1325.643, 'weight': 1, 'content': [{'end': 1333.049, 'text': 'slash cover images, slash, and then we want the the image name.', 'start': 1325.643, 'duration': 7.406}, {'end': 1339.915, 'text': "so we're going to concatenate post cover image and that'll delete it.", 'start': 1333.049, 'duration': 6.866}, {'end': 1342.157, 'text': "so let's try it out.", 'start': 1339.915, 'duration': 2.242}, {'end': 1347.081, 'text': "we're going to go over here and click delete, post removed, and you can see the image actually got deleted.", 'start': 1342.157, 'duration': 4.924}, {'end': 1356.817, 'text': 'So the last thing we want to do here is make sure that if we create a post without an image, that it actually uses noimage.jpg,', 'start': 1348.328, 'duration': 8.489}, {'end': 1359.36, 'text': "which all you have to do is upload and it'll use it.", 'start': 1356.817, 'duration': 2.543}, {'end': 1361.162, 'text': "So for instance, let's say post 1.", 'start': 1359.48, 'duration': 1.682}, {'end': 1366.668, 'text': 'This is post 1.', 'start': 1361.162, 'duration': 5.506}, {'end': 1368.149, 'text': "And no image, we'll save.", 'start': 1366.668, 'duration': 1.481}], 'summary': 'Demonstrating image handling: concatenating, deleting, and default image usage.', 'duration': 25.992, 'max_score': 1325.643, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41325643.jpg'}, {'end': 1446.31, 'src': 'embed', 'start': 1431.335, 'weight': 5, 'content': [{'end': 1433.377, 'text': 'I will look into a deployment video as well.', 'start': 1431.335, 'duration': 2.042}, {'end': 1438.122, 'text': 'So please share this series, like it, comment on it.', 'start': 1433.918, 'duration': 4.204}, {'end': 1440.304, 'text': 'Anything you can do helps a lot.', 'start': 1438.542, 'duration': 1.762}, {'end': 1441.725, 'text': 'So thanks for watching, guys.', 'start': 1440.444, 'duration': 1.281}, {'end': 1444.168, 'text': 'Thanks for sticking with me through this long series.', 'start': 1441.745, 'duration': 2.423}, {'end': 1446.31, 'text': 'And I will see you in the next video.', 'start': 1444.788, 'duration': 1.522}], 'summary': 'Encourages audience engagement and shares gratitude. promotes series and asks for support.', 'duration': 14.975, 'max_score': 1431.335, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41431335.jpg'}], 'start': 1107.728, 'title': 'Managing image upload and deletion in laravel', 'summary': "Covers implementing image upload functionality, discussing the process of copying and updating a store's image functionality, including conditions for image replacement and troubleshooting. it also demonstrates deleting images when deleting a post in a laravel application, ensuring use of a default 'noimage.jpg' when a post is created without an image, and provides insights into managing uploaded images and encouraging engagement with the series.", 'chapters': [{'end': 1203.505, 'start': 1107.728, 'title': 'Implementing image upload functionality', 'summary': "Discusses the process of copying and updating a store's image functionality, including the conditions for image replacement and troubleshooting the display of edit and delete buttons.", 'duration': 95.777, 'highlights': ["The process involves copying and updating the store's image functionality, ensuring that if no image is uploaded, it is not replaced, and adding the image only if it has been created.", 'The code is modified to handle the scenario where no image is uploaded and to add the new image if it has been created.', 'Troubleshooting is done to address the issue of edit and delete buttons not being displayed, which is found to be due to a scrolling issue.']}, {'end': 1446.31, 'start': 1203.525, 'title': 'Deleting images and handling no image in laravel', 'summary': "Demonstrates how to delete images when deleting a post in a laravel application, and also ensures that a default 'noimage.jpg' is used when a post is created without an image. additionally, it provides insights into managing uploaded images and encourages engagement with the series.", 'duration': 242.785, 'highlights': ["The chapter demonstrates how to delete images when deleting a post in a Laravel application It includes adding a condition to only delete the image if it's not 'noimage.jpg', and utilizing the storage library to delete the image, showcasing practical implementation in the tutorial.", "Ensuring a default 'noimage.jpg' is used when a post is created without an image The tutorial depicts the process of ensuring that if no image is uploaded for a post, it automatically uses 'noimage.jpg', providing a seamless user experience and efficient management of post images.", 'Encouraging engagement with the series The chapter concludes with a call to action, urging viewers to share, like, and comment on the series, emphasizing the importance of viewer participation and feedback.']}], 'duration': 338.582, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/AL8PCThJ9c4/pics/AL8PCThJ9c41107728.jpg', 'highlights': ["The chapter demonstrates how to delete images when deleting a post in a Laravel application, including adding a condition to only delete the image if it's not 'noimage.jpg', and utilizing the storage library to delete the image.", "Ensuring a default 'noimage.jpg' is used when a post is created without an image, providing a seamless user experience and efficient management of post images.", "The process involves copying and updating the store's image functionality, ensuring that if no image is uploaded, it is not replaced, and adding the image only if it has been created.", 'The code is modified to handle the scenario where no image is uploaded and to add the new image if it has been created.', 'Troubleshooting is done to address the issue of edit and delete buttons not being displayed, which is found to be due to a scrolling issue.', 'Encouraging engagement with the series by urging viewers to share, like, and comment on the series, emphasizing the importance of viewer participation and feedback.']}], 'highlights': ['The process of displaying images in the post index view and show view is covered.', "The chapter demonstrates how to delete images when deleting a post in a Laravel application, including adding a condition to only delete the image if it's not 'noimage.jpg', and utilizing the storage library to delete the image.", 'Adding a cover image column to the post table by modifying the migration file.', 'Setting a max size of 1999 for images to prevent errors', 'The use of bootstrap markup for structuring the layout is demonstrated.', 'Concatenating the original file name with a timestamp ensures uniqueness.', 'Adding validation for image uploads', 'Running the migration to delete previous posts, resulting in an empty post table.', "Ensuring a default 'noimage.jpg' is used when a post is created without an image, providing a seamless user experience and efficient management of post images.", 'Encouraging engagement with the series by urging viewers to share, like, and comment on the series, emphasizing the importance of viewer participation and feedback.']}