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
Смотрите видео Build A Responsive Sidebar using Next.js 14, React, shadcn/ui, and Tailwind CSS онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Max Programming 30 Март 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 13,378 раз и оно понравилось 228 людям.