Next-Level S3 File Management: The Ultimate Guide to Handling Files in Next.js 14

Published: 14 November 2023
on channel: Sam Meech-Ward
32,231
1.1k

Use server actions to generate a signed url, then upload your image straight to s3 from the front-end to avoid overloading your serverless functions.

This is a complete tutorial on how to use S3 to Get, Put, and Delete files in your Next.js 14 applications. I'll show you how to make this work with images and videos, but these techniques will work with any file type.

Code and references: https://www.nexttonone.lol/upload-s3

Join this channel to help me make more videos and get access to some videos early:
   / @sammeechward  

Chapters:
0:00​ Intro
1:08 Referencing the file
2:31 File Preview
4:35 Create S3 Bucket
8:25 IAM Credentials
12:24 Next Server Action
15:28 Signed URL & Upload
21:27 File Requirements & Restrictions
26:08 Unique File Names
28:45 Save to Database
42:51 SQL Queries
44:19 Delete File
49:16 Summary

🔗Moar Links
My Website: https://www.sammeechward.com
Instagram:   / meech_ward  
Twitter:   / meech_ward  
Github: https://github.com/orgs/Sam-Meech-Ward


Watch video Next-Level S3 File Management: The Ultimate Guide to Handling Files in Next.js 14 online, duration hours minute second in high quality that is uploaded to the channel Sam Meech-Ward 14 November 2023. Share the link to the video on social media so that your subscribers and friends will also watch this video. This video clip has been viewed 32,231 times and liked it 1.1 thousand visitors.