Create Side Navbar in Next.js using shadcn Sheet 🚀 Real Use Cases Explained
🔗 Check CSS Course Details & Curriculum here: https://kodyfier.com/css-online-class.php
💳 Register Here: https://kodyfier.com/kodyfier-bootcamp-pay.php
Learn how to create and use the Sheet component in shadcn/ui with Next.js 🚀. In this video, we’ll explore the top use cases of sheets like navigation drawer, shopping cart, filters, forms, and more. We’ll also walk through the component code, available properties, and live examples to help you master it step by step.
Whether you’re building a modern dashboard, e-commerce site, or web app, this tutorial will give you the clarity and confidence to integrate sheets in your Next.js project. Don’t miss the LIVE CSS Class announcement at the end!
------------------------------------------------------------------------
🚀 Boost Your Skills with these Pre-Requisite Videos:
🔗 Best HTML Course - https://youtu.be/5ccq_nLHneE
🔗 Best CSS Course - https://youtu.be/MSICFljRcb4
🔗 JavaScript Basics Course Part 1 - https://youtu.be/13gLB6hDHR8
🔗 JavaScript Advanced Course Part 2 - https://youtu.be/YwsOCN8woA8
------------------------------------------------------------------------
💸 Build Your Own E-commerce Website for Free! - https://www.thapatechnical.com/2024/03/build-complete-ecommerce-website-using.html
------------------------------------------------------------------------
✌️ Join Us!
🚀 Become a Member: Unlock perks, free source code, and more Join Now : https://www.youtube.com/channel/UCwfaAHy4zQUb2APNOGXUCCA/join
📷 Connect on Instagram: https://www.instagram.com/thapatechnical
🗨️ Join Our Discord Server: Hang out with fellow programmers Discord Link: https://discord.gg/MdScmCsua6
------------------------------------------------------------------------
⌛TIMELINE⏳
0:00 – Create shadcn Sheet in Next.js
0:28 – Use cases of Sheet in Next.js (drawer, cart, filters, etc.)
0:58 – Live CSS Class announcement
1:30 – How to use Sheet in Next.js (setup & basic code)
3:15 – Understanding Sheet component code
4:25 – Looking at Sheet properties available
5:50 – Adding Button component inside Sheet
6:40 – Adding Navbar content in Sheet
7:30 – Adding Form in Sheet
9:30 – Live CSS Class reminder (Only 5 hrs left!)