Build a Full-Stack Filtering System with Next.js 14, Tailwind, Upstash (2024)

Поделиться
HTML-код
  • Опубликовано: 18 ноя 2024

Комментарии • 86

  • @nidhi2731
    @nidhi2731 7 месяцев назад +11

    Damn you are literally serving us man. Appreciate you alot josh.

  • @carvierdotdev
    @carvierdotdev 7 месяцев назад +2

    Thanks a lot! It's great to see that your new role at Upstash is benefiting both you and us. Your in-depth videos really showcase how it works and the advantages it brings.

  • @404-not-found-service
    @404-not-found-service 7 месяцев назад +3

    wow, thank you, I was waiting for your next project on this channel, a hug!

  • @emilzonjeronimo8898
    @emilzonjeronimo8898 7 месяцев назад +6

    Thanks for this content! It would be interesting that filters and sorting preferences are saved in the route with query params and to use the hook useSearchParams, not to use the hook useState and to make the component SSR and if the user shared the url with someone else, the filters and sorting are maintained.

    • @youneshenni5417
      @youneshenni5417 7 месяцев назад

      ByteGrad has an awesome video about that.

    • @ahmedlekan5457
      @ahmedlekan5457 7 месяцев назад

      ​@youneshenni5417, please, how can I get it, please

  • @BeyondLegendary
    @BeyondLegendary 7 месяцев назад +6

    Impressive, very nice. Let's see Paul Allen's full-stack filtering system.

    • @Joshtriedupstash
      @Joshtriedupstash  7 месяцев назад +2

      dude hahaha nice to see you here, appreciate ya a ton

  • @mistersir3185
    @mistersir3185 7 месяцев назад +4

    Thanks man! I would've love to see those time stamps though

  • @mohdali-yq8gq
    @mohdali-yq8gq 7 месяцев назад +1

    This is really one of the best tutorial I have seen and please take this to more net level by incorporating the following things like of use drizzle ORM, PostgreSQL and make the product component with more fields and this will be really more and more batter and comprehensive.

  • @NazimLeulmi
    @NazimLeulmi 6 месяцев назад

    Thank you It was a pleasure watching you handle these problems. adding the filters to the tan-stack useQuery ( queryKey ) will automatically refetch and cache these requests

  • @gabrielpaor8211
    @gabrielpaor8211 6 месяцев назад

    I've learned a lot from this tutorial. Thanks for making this helpful content for the future developers like me.

  • @igorcastilhos
    @igorcastilhos 5 месяцев назад

    Great video! Learning a lot and will definetly use it in my next projects for the org and for my side projects (26:55 just saving my time, around 3:50am around here 😅)

  • @cadserg6648
    @cadserg6648 7 месяцев назад

    Thank you very much. I just received a task today to make a product filter. I'm sure your decision will help me a lot.

  • @MarloweRamirez-e3q
    @MarloweRamirez-e3q 7 месяцев назад

    you've just earned a new subscriber that will watch your every video(just nextJs :>) keep it up bro!

  • @markus_dev_cwb
    @markus_dev_cwb 7 месяцев назад +1

    Amazing project Josh! Tks to share.

  • @uminhtetoo
    @uminhtetoo 7 месяцев назад

    Thank you so much for sharing your experience and knowledge, Sir.

  • @bbrainttech
    @bbrainttech 7 месяцев назад

    You are really good at what you do, i love your videos so much....😊

  • @Peshak2008
    @Peshak2008 6 месяцев назад

    Awesome video...here I am scratching my head how come I did not subscribe to your channel; but hold on, I am sure I subscribed before, and then puzzled how come this channel only has 5k subscribers; then realized this is not your original channel. Subscribed again. Love your content....

  • @nxthing______
    @nxthing______ 7 месяцев назад

    Thank you, great explanation! Hope with the new knowledges from your videos I will find a new job in the nearest future😅

  • @johnchristiancabrera6472
    @johnchristiancabrera6472 7 месяцев назад +1

    I just noticed that this was a different account! Subbed! 😁

  • @mohdali-yq8gq
    @mohdali-yq8gq 7 месяцев назад

    Wonderful explanation of filtering.

  • @wonganitembo5521
    @wonganitembo5521 7 месяцев назад

    Thanks for the awesome content josh. Please create a video on kafka.

  • @sajithdilshan2936
    @sajithdilshan2936 7 месяцев назад

    superb bro !!

  • @smotch7533
    @smotch7533 7 месяцев назад +3

    I'm very confused/curious why you would use a vector database? are the costs the same as a SQL? future proofing for AI?

  • @me-yn1mn
    @me-yn1mn 7 месяцев назад

    Geeat video as always josh! Could you create a video showing how you come up with those tailwind style? Like the process you think about the design to tailwind classes. Thanks

  • @gamingwolf3385
    @gamingwolf3385 7 месяцев назад

    I was having problem with this , thank you a lot josh

    • @IrfanIk1218
      @IrfanIk1218 3 месяца назад

      wat problem brother let me know

  • @premsingh6967
    @premsingh6967 2 месяца назад

    Appreciate for this...

  • @shubhamkakad10x
    @shubhamkakad10x 7 месяцев назад

    thank you josh it was really helpful

  • @aleksandr04635
    @aleksandr04635 7 месяцев назад +1

    Your tutorials are really good, you explain all that's necessary, but with a more popular DB or ORM it would be much better

  • @JasonAngel-o1b
    @JasonAngel-o1b 7 месяцев назад

    Please! You're the one that explain the code and make it clearly for me. But please, can you make a tuto about zod react hook form and prisma?
    I mean, how to put the data of a form or a blog for example in a database with prisma.

  • @adeyusuf9641
    @adeyusuf9641 7 месяцев назад

    bro, you can open 2 terminal in your vs code. One for running server and one for installing any package. its very simple and can make you more than faster to developing you apps
    NiceTutorial....👍

  • @dededemahendra
    @dededemahendra 7 месяцев назад

    Thanks Josh

  • @joeydante2409
    @joeydante2409 5 месяцев назад

    Thank you so much bro

  • @Fresco7
    @Fresco7 7 месяцев назад

    great video

  • @nihalahmad1145
    @nihalahmad1145 4 месяца назад

    @josh could you let us know when deploying this to vercel ,how could we take care of api route as in this post request route is for local host

  • @felixkiptoo421
    @felixkiptoo421 7 месяцев назад

    Awesome content Josh, a quick one. Lets say you are using npm how do we seed data to Upstash?

  • @tariqahmed2526
    @tariqahmed2526 7 месяцев назад +1

    I don't know any backend Can I follow this tutorial?

  • @Farruh_13
    @Farruh_13 2 месяца назад +1

    I don't got it, why everything is 'use client'

  • @fikreterkara3234
    @fikreterkara3234 7 месяцев назад

    Even though I activate the subtitles, the subtitles do not appear. Does anyone know why?

  • @smartdriver2990
    @smartdriver2990 7 месяцев назад

    Wow great🎉🎉

  • @kubilaybzk
    @kubilaybzk 7 месяцев назад +5

    Isn't this solution bad for SEO?

  • @frontend_ko
    @frontend_ko 7 месяцев назад

    is there any alternative to tailwind family in next.js? i really dont wanna see lengthy classnames

  • @Deus-lo-Vuilt
    @Deus-lo-Vuilt 7 месяцев назад

    Thaaaaanks ❤

  • @kianooshsoleimani5472
    @kianooshsoleimani5472 4 месяца назад

    how about server side filtering , we need to handle that on SEO

  • @martapfahl940
    @martapfahl940 7 месяцев назад

    How do you stand towards Angular actually? I've noticed that especially in Germany most big corpates which pay very good are using Angular and after trying it, I actually really like it. I think OOP brings a lot of structure and stability into the code base, what are your thoughts on that?
    Grüße aus Deutschland

  • @vibewithkrishna4754
    @vibewithkrishna4754 7 месяцев назад

    i have a problem npm didn't have a command called seed i am having thouble in it

  • @Gangbuster74
    @Gangbuster74 7 месяцев назад +1

    Josh, but lucide-react already got installed with shad-cn?

  • @kamleshpaul414
    @kamleshpaul414 7 месяцев назад

    why you use REACT Query with nextjs SWR should use ? no or i m worng please correct me

    • @Joshtriedupstash
      @Joshtriedupstash  7 месяцев назад +4

      both are good, its mostly personal preference

  • @avinavkashyap8802
    @avinavkashyap8802 7 месяцев назад

    please show us the deployment part also,please please

  • @ebubekiryazgan
    @ebubekiryazgan 4 месяца назад

    Is there a special reason why you don't use 'bun'? why do you use yarn pnpm or npm npx etc?

  • @avinavkashyap8802
    @avinavkashyap8802 7 месяцев назад

    Josh please ,teach us how to deploy our website also
    will be very greatful to you

  • @4ware
    @4ware 7 месяцев назад

    Why don't you use trpc?

  • @cescfabregas0004
    @cescfabregas0004 7 месяцев назад

    does anyone know why we use reactnode?

  • @Abo.kifahe_dziri
    @Abo.kifahe_dziri 7 месяцев назад

    why i don't find the old videos o the channel ?

  • @dev-akeel
    @dev-akeel 7 месяцев назад

    10:27 No no that must be pnpm dlx .....
    I feel we lost all the benefits of nextjs server components @ "use client" on top of the whole file, we could separate out the client components.
    1:09:20 Better to turn on slow 3G throttling.

  • @codeAllTheTime
    @codeAllTheTime 7 месяцев назад

    maybe make this as a fullstack ecommerce app josh

  • @QaLove
    @QaLove 7 месяцев назад

    it's have infinite scroll or pagination?

  • @GreenMerlin
    @GreenMerlin 5 месяцев назад

    Not synced with url :/

  • @alexandermediantsev6354
    @alexandermediantsev6354 6 месяцев назад

    is this video about TypeScript or about product filters? 2 hours 40 minutes - TypeScript , 10 minutes - product filters.

  • @samialvi4226
    @samialvi4226 7 месяцев назад

    we want upstansh course from begginers to advanced

  • @samialvi4226
    @samialvi4226 7 месяцев назад +1

    wth is upstash is it redis ? how can i learn it pls suggest something

    • @carvierdotdev
      @carvierdotdev 7 месяцев назад +1

      yes the same here!!. thanks in advance..

  • @dreamsachiever212
    @dreamsachiever212 4 месяца назад

    I wanted to like multiple times. sadly yt only allows once.

  • @alexanderpoker6655
    @alexanderpoker6655 7 месяцев назад

  • @RudreshCodes
    @RudreshCodes 6 месяцев назад

    28:26 Taking A Break

    • @victormayowa7989
      @victormayowa7989 4 месяца назад

      I dont know whether its making a filter that is not easy or maybe I am The one or maybe its the tutorial

    • @codemonik
      @codemonik 2 месяца назад

      Taking one at 35:10

  • @papa_aashik
    @papa_aashik 7 месяцев назад

    is this ssr

  • @victormayowa7989
    @victormayowa7989 4 месяца назад

    I dont know whether its making a filter that is not easy or maybe I am The one or maybe its the tutorial

  • @aditya-d-
    @aditya-d- 7 месяцев назад

    you video is 3 hourse but no timestamps

  • @antoncigur2724
    @antoncigur2724 Месяц назад

    Another video where only UI libraries are used.

    • @Uzair57
      @Uzair57 Месяц назад +1

      Nobody is here for the css. If you are here for it. Go watch some html css tutorials.

  • @codewpcom
    @codewpcom 5 месяцев назад

    Nice

  • @prithwishbiswas3993
    @prithwishbiswas3993 2 месяца назад

    40:14 Was facing error while running seed script, was using npm, figured out my mistake. yarn -> npm.
    "script": {"seed": "tsx .src/db/seed.ts"}
    In CLI run: npm run seed