How To Create a Dashboard using Nextjs 14 & Shadcn UI Tutorial

In this video, I will show you how to create a dashboard on Nextjs.

[congoleseculture]

Thank you very much bro, I remember I asked for this on Twitter and you delivered.

God bless bro .

[KyTechInc]

Fire as always! 🔥

One tip for the nav route highlighting. I do like using clsx for most cases but there is a simpler pattern that doesn't require writing the tailwind classes twice for each case.

Still uses usePathName like you have but instead of clsx just use a template literal so that you only need to place the difference tailwind values:

<Link className={`text-neutral-900 ${
pathName === link.href ? 'font-bold' : ' '
}`}

And i stick my nav in an array and map over the values so that i can cut down on the code/styles length. Might be good for a dashboard as the side nav can grow and get sub-nav items too!

[mahiyordanos]

Amazing! 🙌🏽 You explained this so well :)

[FROMJASP]

I'm sure you have 48 hours in a day. Good stuff man!

[markovvoz]

Can you do a vid on creating a form builder, not ui page or block builder but actual form that can be build with drag and drop and then filled out by

[ahmedahmedx]

Thank you bro I have 2 questions,

1. Can you make video of entire sidebar using shadcn ?
2. What browser you are using ?

[shayannadeem]

Don't () are used for group routes, for these types of components you can use _components folder so it doesn't interfere with groups