Build A Responsive Sidebar using Next.js 14, React, shadcn/ui, and Tailwind CSS
Hello, my friends and fellow developers!
In this video, we cover how you can build a Responsive Sidebar using Next.js 14 app router, React, shadcn/ui, and Tailwind CSS! This is the continuation of the previous video on how to build a sidebar using Next.js and shadcn/ui
Previous video: • Build A Twitter Sidebar using Next.js...
Let me know in the comments below if you want more Next.js content or something else.
GitHub Repo: https://github.com/max-programming/sh...
00:00 - Introduction & Setup
01:39 - Using Media Query in React
03:32 - Sidebar Mobile Component
05:31 - Fixing Hydration Error in Next.js
08:15 - Continue Sidebar Mobile
08:38 - Hide Close Button in Sheet
10:45 - Sheet Header and some styles
13:35 - Icon button to open sidebar
14:44 - Fix margins on mobile view
15:51 - Displaying links in sidebar content
19:53 - Sidebar bottom items in a Drawer
24:05 - Conclusion
Other Tutorials:
⚛️ React and Material UI Todo App: https://bit.ly/reactmattodo
🟨 Other JavaScript videos: https://bit.ly/jstutorials
📘 Visual Studio Code videos: https://bit.ly/vscodevids
🔋 Build a Battery App in JS: • 🔋 Build a Battery Info app with JavaS...
Connect 🔗 :
Twitter: / maxprogramming1
Facebook: / max-programming-103081931147293
Github: https://github.com/max-programming/
Suggest, ask doubts in the comments and share these videos to help!
Thanks for Watching!
#nextjs14 #reactjs #javascript
Watch video Build A Responsive Sidebar using Next.js 14, React, shadcn/ui, and Tailwind CSS online without registration, duration hours minute second in high quality. This video was added by user Max Programming 30 March 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 13,378 once and liked it 228 people.