Learn Search Params in Next.js 14 by building a project! React | Tailwind | shadcn/ui
Hello, my friends and fellow developers!
In this video, we cover how you can use query search params effectively in the Next.js 14 app router by building a little project! We also use Tailwind CSS, shadcn/ui, and TypeScript!
Let me know in the comments below if you want more Next.js content or something else.
🔗 Links in the video
Source Code: https://github.com/max-programming/sh...
Shadcn UI: https://ui.shadcn.com
Usehooks TS: https://usehooks-ts.com
Timestamps:
00:00 - Introduction & Demo
01:12 - Next.js and shadcn/ui components
02:00 - Adding Tabs
04:36 - Search param for the active tab
11:52 - Adding the search bar input
12:57 - Using hooks by Next.js
15:11 - Changing search params with input
21:09 - Deleting a search param
22:15 - Setting a default value for input
23:15 - BONUS - Debouncing
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!
#reactjs #nextjs14 #nextjs13 #javascript
Смотрите видео Learn Search Params in Next.js 14 by building a project! React | Tailwind | shadcn/ui онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Max Programming 15 Февраль 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 5,306 раз и оно понравилось 180 людям.