Photo Album Next.js Tutorial (with Server Actions, Cloudinary, Shadcn)

Be sure to checkout cloudinary: https://cld.media/wdcdevsphotoapp

Documentation: http://next.cloudinary.dev

Learn how to build a full stack app using cloudinary, next.js, and shadcn.  This entire project was build without using a database; instead, we use all of the built in cloudinary functionality for uploading images, tagging our images, editing images, creating albums, etc.

Link to code: https://github.com/webdevcody/cloudin...

Chapters:

00:00:00 - Intro
00:05:10 - Setup
00:07:03 - Cloudinary Next - Upload Component
00:13:02 - Image Component
00:17:35 - Cloudinary Transformations
00:19:46 - Shadcn/ui
00:24:47 - Side Navigation
00:29:48 - Gallery Page
00:35:39 - List Images
00:51:08 - Favorites
01:17:29 - Optimistic Updates
01:27:25 - Masonry Grid
01:37:56 - Albums
01:45:16 - Add to Album
01:59:13 - Albums Page
02:18:05 - Edit Images
02:31:15 - Fix Menu
02:32:58 - Search by Tags (Auto Tag)
02:44:49 - Sidenav Albums
02:49:15 - Generative Fill Prompts
02:54:02 - Finishing Touch
02:55:42 - Conclusion

📘 T3 Stack Tutorial: https://1017897100294.gumroad.com/l/j...
🤖 SaaS I'm Building: https://www.icongeneratorai.com/
✂️ Background Cutter: https://www.backgroundcutter.com/

💬 Discord: Discord: discord
🔔 Newsletter: https://newsletter.webdevcody.com/
📁 GitHub: https://github.com/webdevcody
📺 Twitch: Twitch: webdevcody
🤖 Website: https://webdevcody.com
🐦 Twitter: Twitter: webdevcody

• #education
• #web_development
• #programming
• #coding
• #code
• #learn_to_code
• #tutorial
• #software_engineering
• #nextjs
• #nextjs
• #cloudinary
• #web_app