NextJS Parallel Routes Explained with a Simple Example

Рет қаралды 10,640

Dave Gray

Күн бұрын

Пікірлер: 51

@sunstar8417 2 ай бұрын

sir, you don't know, but many students in india are watching your html and css tutorial thank you for it sir ,

@user-qj4rr1rm8i 2 ай бұрын

Next.js is getting harder every day. I bet it will be even more challenging tomorrow.

@DaveGrayTeachesCode 2 ай бұрын

I hope I'm helping make it easier for everyone 🙂. This is a good feature for some use cases. I'll be showing one combined with Intercepted routes next week.

@jaatjii7823 2 ай бұрын

You spent lots of hours to build this functionality, and NextJS gives it out of the box. It’s not challenging; it’s developer-friendly day by day.

@soumadip_skyy_banerjee 2 ай бұрын

Congratulations 🎉 on your son's achievement Mr.Gray! Lots of love from the city of joy, Kolkata, India. He has done a remarkable job inspite of all the hurdles. Kudos to him! ❤ Definitely inspired me, to never give up, even in the murkiest times of my life 😊 🇮🇳💖🇺🇸

@DaveGrayTeachesCode 2 ай бұрын

Thank you!

@MrAlao675 2 ай бұрын

This concept is exhausting. Will stick with the components for now 😅

@jfhandfield 2 ай бұрын

Can't wait for the modal video. Thank you for your time!

@marcinzale 2 ай бұрын

Another good explanation. Thanks!

@DaveGrayTeachesCode 2 ай бұрын

You're welcome!

@VIIITTTTTAAA 2 ай бұрын

I'm just liking the great man's videos.

@DaveGrayTeachesCode 2 ай бұрын

Thank you!

@irfansaeedkhan7242 2 ай бұрын

we need a production grade project from you sir

@jaatjii7823 2 ай бұрын

Hi dave Thank you for all these beautiful videos. Thanks a million❤️

@rammehar5531 2 ай бұрын

Wow great features please create a one more video on it with the use cases of this parallel routing. Thank you

@voidmind 2 ай бұрын

I second that. The feature looks awesome, but I'd like to see it used in more real world scenarios

@MangoFlamingo Ай бұрын

My man. Thnaks

@Beast80K 2 ай бұрын

Respected Sir, *Thankyou* for this simplified example ! Sir if possible, can you please make a video on how to optimize NextJS 14 project to get good Lighthouse score, what web vitals should be focused, what things affect scores etc.

@staticwasabi 2 ай бұрын

Thanks! Could you show a tab groups example?

@emmanueljulius1827 2 ай бұрын

In my usecase, I have an a dashboard with different user roles being returned on logging in, and I have to render a different dashboard view per role. So I'm leveraging nextjs parallel routes to implement this.

@DaveGrayTeachesCode 2 ай бұрын

Great example use case!

@odogwu-1918 Ай бұрын

How does parallel route come into play here, I don't seem to get it

@podoprigoraisv 2 ай бұрын

Thank for the video. As for me it is very controversial feature. I've tried to implement kind of "master detail" layout but faced with drawbacks for "not found" routes and with dynamic parameters for a slot nested routes. I've rejected from this feature in favor to conditional rendering that depending upon route parameters.

@DaveGrayTeachesCode 2 ай бұрын

Interesting! I use both route parameters and search parameters frequently.

@aurobindobhuyan2107 2 ай бұрын

3:36 Feeling great to be a part of 27.1%

@yarapolana 2 ай бұрын

What would you use the “default” for I am having a hard time understanding its use. Great video overall.

@DaveGrayTeachesCode 2 ай бұрын

Thanks - I show one example in this video where the default is rendered. It is a fallback.

@togya4 2 ай бұрын

Dave we want a new videoor whole full project with yhe new nextjs 15rc futures. Is that possible?

@DaveGrayTeachesCode 2 ай бұрын

Let's wait until it's a stable release 🙂

@togya4 2 ай бұрын

@@DaveGrayTeachesCode yeah totally right

@joe_j 2 ай бұрын

Can you do one on how I can use nextjs 15? Thankyou

@o.j1398 2 ай бұрын

Thanks for a great tutorial, just have a question: is it possible to make parallel routing with diffrerent nextjs projects for example localhost:3000 and localhost:3001, localhost:3000 has sidebar of dashboard and localhost:3001 apper in dashboard if we navigate to it but sidebar stays from localhost:3000.

@DaveGrayTeachesCode 2 ай бұрын

No, the parallel routes must be within the same project.

@yashchauhan5710 2 ай бұрын

what if you want to have an entirely different ui for settings page? for this do i have to have conditional rendering in layout file?

@DaveGrayTeachesCode 2 ай бұрын

I would need to understand your structure better, but yes, you could take that approach.

@BilalAulakh23 2 ай бұрын

Sir i subscribed your channel

@DaveGrayTeachesCode 2 ай бұрын

Welcome!

@cb73 2 ай бұрын

Great to know how it works but what problem does it actually solve? I’ve yet to see anyone make the case.

@sarthakagarwal8521 2 ай бұрын

Hi Dave, What are benefits of using different routes here instead of having lets say two server components wrapped in suspense. Then also they will work independently and have separate loading states.

@DaveGrayTeachesCode 2 ай бұрын

Yes, it's basically the same thing. Next.js offloads suspense to the loading UI file. Using the router instead of code to apply both suspense and error boundaries.

@aliksargsyan2782 2 ай бұрын

Is parallel routes similar to computer architecture like multy core parallelism?

@DaveGrayTeachesCode 2 ай бұрын

Probably only in the way they both do something in parallel

@alirezatt4457 2 ай бұрын

❤

@tonystank8105 2 ай бұрын

the default part got me confused honestly.

@EverydayBeing-de1qu 2 ай бұрын

I feel like this is just over complicating things for no reason... What is the advantage of this compared to using standard suspense boundaries?

@DaveGrayTeachesCode 2 ай бұрын

It's also an error boundary and uses the Next.js router. You *may* consider those advantages or not. All frameworks are opinionated in some ways. This is simply the Next.js way.

@EverydayBeing-de1qu 2 ай бұрын

@@DaveGrayTeachesCode Okay thank you for the reply