WebDevEducation
WebDevEducation
  • Видео 62
  • Просмотров 424 983
Simple way to validate search params in Next 15
⭐️ webdeveducation.com
🎓 The simple approach I'm taking moving forward with Next JS 15 to validate search params.
vasepa npm package I created / am using:
www.npmjs.com/package/vasepa
THE TANSTACK START COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW!
www.udemy.com/course/tanstack-start/?referralCode=6B535F36A18C81060E91
🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation
#zod #nextjs15 #nextjs
Просмотров: 487

Видео

Shadcn datepicker - add "close on date select" functionality
Просмотров 70928 дней назад
⭐️ webdeveducation.com 🎓 Improve the shadcn date picker component by adding functionality to close the date picker when a new date is selected THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #shadcn #nextjs15 #nextjs
GitHub Copilot is now FREE*
Просмотров 2,4 тыс.Месяц назад
⭐️ webdeveducation.com 🎓 GitHub Copilot is now FREE* (with limitations) 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation
5 underrated webdev channels to follow in 2025
Просмотров 583Месяц назад
WebDev Cody's list: ruclips.net/video/E2UscGfpic0/видео.html My list of underrated webdev channels to follow in 2025: @coderyan @Kulkarniankita @CandDev @DevLeonardo @rasmic
Tailwind CSS V4: What To Expect?
Просмотров 11 тыс.2 месяца назад
⭐️ webdeveducation.com 🎓 Check out the new features of Tailwind CSS v4! THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #tailwindcss #shadcn #nextjs
The shadcn AI tool you've (probably) never heard of.
Просмотров 12 тыс.6 месяцев назад
⭐️ webdeveducation.com 🎓 Easily generate color palettes for shadcn ui using the design gui ai tool. THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #shadcn #nextjs15 #nextjs
Silky Smooth Animations in Next JS is EASY 🪄
Просмотров 2,1 тыс.7 месяцев назад
⭐️ webdeveducation.com 🎓 Creating silky smooth transitions in Next JS is EASY with the help of Framer Motion. THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #cssanimation #nextjs15 #nextjstutorial
Shadcn ui dialog is BROKEN! .. Let's fix it! 🔨
Просмотров 14 тыс.7 месяцев назад
⭐️ webdeveducation.com 🎓 Shadcn ui dialog component improvements tutorial with next js 15. Fix: github.com/shadcn-ui/ui/issues/16#issuecomment-1621383437 THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #shadcn #nextjs15 #nextjstuto...
2 minute Gradient Text in Tailwind CSS ✅
Просмотров 2,3 тыс.8 месяцев назад
⭐️ webdeveducation.com 🎓 Create gradient text colors in tailwind css in 2 minutes! THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 Tailwind CSS Zero to Hero course for just $12.99: www.udemy.com/course/tailwind-css-zero-to-hero/?couponCode=24PROMO5 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/use...
FFS (in CSS) - Fluid Font Sizes 😏
Просмотров 7768 месяцев назад
⭐️ webdeveducation.com 🎓 Create responsive / fluid font sizes in CSS in 2 simple steps! THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #css #responsivedesign #ffs
STOP choosing between shadcn ui & next ui (use BOTH)
Просмотров 8 тыс.11 месяцев назад
⭐️ webdeveducation.com 🎓 Combine shadcn ui forms with next ui components. THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #nextjs14 #nextjs #shadcn
React Recursive Components - a PRACTICAL example
Просмотров 90011 месяцев назад
⭐️ webdeveducation.com 🎓 React recursive components a practical example of rendering a react component within itself i.e. componentception 👀 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #reactjs #recursion #reacttutorial
Shadcn ui calendar is BROKEN.. let's fix it!
Просмотров 11 тыс.11 месяцев назад
⭐️ webdeveducation.com 🎓 Shadcn ui calendar component improvements tutorial with react day picker, react hooks and next js 14. THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation #shadcn #nextjs14 #reacthooks
Shadcn UI mobile menu (the PROPER way)
Просмотров 23 тыс.Год назад
⭐️ webdeveducation.com 🎓 Shadcn ui mobile menu component tutorial with react hooks and next js 14. THE SHADCN UI COURSE IS NOW AVAILABLE - GET IT FOR JUST $12.99 BELOW! www.udemy.com/course/shadcn-ui/?couponCode=24PROMO7 You can see an example of this implementation in the github repo for the shadcn course: github.com/tomphill/support-me-course 🔔 Subscribe if you want more free tutorials like t...
When to use server actions in Next JS 14
Просмотров 11 тыс.Год назад
⭐️ webdeveducation.com 🎓 When to use api route / route handlers or server actions in Next JS 14 app router. 🔔 Subscribe if you want more free tutorials like this one! ruclips.net/user/webdeveducation Vercel's video on 10 mistakes developers make when using the app router: ruclips.net/video/RBM03RihZVs/видео.htmlsi=6adwKIEahSTkQv6x #nextjs14 #serveractions #nextjstutorial
Shadcn UI password input toggle in Next JS 14 (the PROPER way)
Просмотров 8 тыс.Год назад
Shadcn UI password input toggle in Next JS 14 (the PROPER way)
Next JS 14 UI streaming and partial prerendering (INSANELY easy to set up!)
Просмотров 7 тыс.Год назад
Next JS 14 UI streaming and partial prerendering (INSANELY easy to set up!)
EASIEST auth in Next JS 14.
Просмотров 3,8 тыс.Год назад
EASIEST auth in Next JS 14.
Next JS forms with Shadcn UI (the EASY way)
Просмотров 52 тыс.Год назад
Next JS forms with Shadcn UI (the EASY way)
React JS crash course 2024 for beginners
Просмотров 9 тыс.Год назад
React JS crash course 2024 for beginners
CSS light-dark() function tutorial (CSS dark mode & CSS light mode tutorial)
Просмотров 1,1 тыс.Год назад
CSS light-dark() function tutorial (CSS dark mode & CSS light mode tutorial)
WHY is Next JS cache so CONFUSING??
Просмотров 4,3 тыс.Год назад
WHY is Next JS cache so CONFUSING??
How to create an npm package with typescript (in less than 3 mins)
Просмотров 3,1 тыс.Год назад
How to create an npm package with typescript (in less than 3 mins)
File uploads in Next JS 14 just got SO MUCH EASIER!!
Просмотров 20 тыс.Год назад
File uploads in Next JS 14 just got SO MUCH EASIER!!
The BEST tailwind css feature that you're probably not using (tailwind CSS tutorial)
Просмотров 2,2 тыс.Год назад
The BEST tailwind css feature that you're probably not using (tailwind CSS tutorial)
Should we stop using "&&" for conditional rendering in React? 🤔 (my reaction)
Просмотров 3,3 тыс.Год назад
Should we stop using "&&" for conditional rendering in React? 🤔 (my reaction)
Astro JS tutorial (view transitions API)
Просмотров 1,3 тыс.Год назад
Astro JS tutorial (view transitions API)
Next JS 13.5 server actions are EASY
Просмотров 7 тыс.Год назад
Next JS 13.5 server actions are EASY
STOP using useState for React forms (there's an alternative method)
Просмотров 12 тыс.Год назад
STOP using useState for React forms (there's an alternative method)
Next JS 13.5 - why is NOBODY talking about this??
Просмотров 8 тыс.Год назад
Next JS 13.5 - why is NOBODY talking about this??

Комментарии

  • @joshuasineta5756
    @joshuasineta5756 2 дня назад

    what if i need to use useActionState hook for my form? how do i go about that?

  • @omar_rwemi
    @omar_rwemi 5 дней назад

    Thank you dude. You saved me a good chunk of time.

  • @liu-river
    @liu-river 8 дней назад

    But there are flickers, how do you deal with that?

    • @WebDevEducation
      @WebDevEducation 8 дней назад

      What do you mean?

    • @liu-river
      @liu-river 8 дней назад

      @@WebDevEducation where you click the date, it flickers as it closes, looks like it's doing multiple state changes for some reason

  • @edini-amare
    @edini-amare 10 дней назад

    thank you for this video

  • @Dot_97
    @Dot_97 13 дней назад

    Thank you, very helpful!

  • @usmansbk
    @usmansbk 23 дня назад

    Phew! Finally 100% useful walkthrough

  • @trifke027
    @trifke027 24 дня назад

    So basically you just advertise your package here, instead of showing how to truly do it in Next

  • @tauhid97k
    @tauhid97k 25 дней назад

    Thanks. This is amazing. Can we do the same with "nuqs" library somehow? I have no idea.

    • @WebDevEducation
      @WebDevEducation 25 дней назад

      I don't think nuqs validates the params within a server components

  • @WebDevEducation
    @WebDevEducation 25 дней назад

    NOTE: In this scenario it's better to not actually include the .optional(), that way cfyear will always have a value and not potentially be undefined.

  • @darawan_omar
    @darawan_omar 29 дней назад

    When we have a dropdown and inside od it we have the dialog how we can open the dialog because automatically closed the dialog when click it to open it, can you video on it please or tell me on the reply step by step ❤

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

    keep it going! you're growing! 🎉

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

    Are you editing / adding custom functionality to shadcn components?

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

    I really enjoy @rasmic as well, btw any chance you're from London?

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

    Hi - thank you for the video. Quick question: the fetchData call is executed twice. It is in your video (ruclips.net/video/HVFSgIVXcD4/видео.html) as well as locally when I followed the course. Why is that?

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

      You can read more about why this happens here: react.dev/reference/react/useEffect#my-effect-runs-twice-when-the-component-mounts

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

    I use amazon Q which free and working great

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

    Either their funding increased or maybe they are short on training data...

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

    Hi, thanks. Another 2 to the list would be Juxtopposed and Concept Central. It's for inspiration and ideas I'd say. I feel this is also an underrated channel :) Subbed, please continue with more great content.

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

    Best video in youtube about form validation of shadcn.

  • @Code-sz9db
    @Code-sz9db Месяц назад

    Thanks for sharing!

  • @SajidMunawar-u3w
    @SajidMunawar-u3w Месяц назад

    sir what is your opinion on supermaven and cursor?

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

      I don't use either of them, I like to keep my AI workflow minimal and for the most part all I use is the GitHub Copilot code completions. I don't use much of the other features anymore I find everything else too intrusive. 100% personal preference though :)

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

    Do you use GitHub Copilot?

    • @SajidMunawar-u3w
      @SajidMunawar-u3w Месяц назад

      i use codeium. It is better than copilot.

    • @SajidMunawar-u3w
      @SajidMunawar-u3w Месяц назад

      sir why you upload video after 6 months. 😐

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

      Do you pay for codeium or use the free version?

    • @SajidMunawar-u3w
      @SajidMunawar-u3w Месяц назад

      @@WebDevEducation free version is more than enough.

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

      I use free version of Codeium, it's good on quality in both chat and autocomplete

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

    Thank you so much for the mention! ❤ There's a lot of value in supporting each other, as each one talks about tech with their own style and people can discover and follow who they resonate more with, it's a win for everyone :D

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

    thank u for the shoutout my g i really appreciate it

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

    Thanks, Tom! I joined three of the RUclips channels you suggested. This is going to be really useful.

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

    Which underrated channels would you add to this list?

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

      Not just dev Code with Beto Hamad Bahram Frontend Tribe Becodemy

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

      Awesome! Thanks for sharing!

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

    how about the theme?

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

    doesn't work for me , i don't know why

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

    SUPER UNDERRATED! also the light-dark function is officially supported in all major modern browsers

  • @UwU-dx5hu
    @UwU-dx5hu Месяц назад

    Thank you so much. you saved my time. thank you

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

    i wasted two days then thought there is you tube not just chatgpt

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

    Any possibility of a free coupon for udemy Next.js 15 & Firebase course?

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

    btw the form input styling has been rolled back. i think adam changed his mind about doing it

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

    awesom explanation

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

    Im not so sure bout how much i like the move from js config to css config. I really liked the theme() function as it was "type"-safe. with the tailwind plugin installed in ur ide it told u when using a wrong variable. now this wont be possible anymore. I also dont like the @config js in css approach. I think this update makes tailwind easier to go into. But especially for custom plugins this is a big downgrade imo

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

      losing type safety is a good point not sure why you think the Tailwind extension won't warn when using a wrong variable. adam wathan recently did a live demo with sam selikoff and the extension works just the same as before also not sure why you think custom plugins won't work. they're trying to get custom plugins to work in a similar way as before for backward compatibility

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

    Thanks, its useful

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

    Thanks for useful info 👍

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

    All looks good, sensible changes and some good new features. A lot of changes though though , a V3-> V4 utility looks essential!

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

    Thank you Tom for the informative v4 overview

  • @masar-at
    @masar-at 2 месяца назад

    Web Dev these days is over hyped, millions of things to learn to almost switch career.

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

    Are you a fan of these updates in v4?

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

    shadcn have abusive relationship with relative and absolute lol

  • @kiranravi-k9p
    @kiranravi-k9p 2 месяца назад

    If the validation values come from an API .? At that time how can we write this Form Validation? At that time the client and server were confused and I can't do that... Give us a video for that one... I have to know

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

      In your response from API, likely within handleSubmit: form.setError("fieldNameHere", { message: "Message from api here", });

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

    Thank you 🙏

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

    Typescript just gets in the way

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

    thanks.

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

    Thank you so much for the explanation! Now it’s clear

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

    This thumbnail cracked me up. The sweating guy accurately described me when faced with this decision.

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

    Saved me!! Thank you

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

    i find a better solution, i put forms in the dialog so i put this : ' z-50 max-h-[90vh] overflow-auto in dialog content and this 'fixed py-10 grid place-items-center in dialog overlay

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

    This was amazing man, im.half asleep and still understand your explanation! Thanks for the great video and sweet dreams