#ReactJS #TailwindCSS #WebDevelopment #nextjs #tailwindcss #reactjs #frontenddevelopment #reactwithukarsh
My Channel - https://www.youtube.com/@reactwithutkarsh/
Live Demo - https://shadcn-dashboard-red.vercel.app/
Code Repo - https://github.com/whoisseth/shadcn-dashboard
Learn to make a Responsive dashboard using Next.js and Shadcn UI components. This tutorial guides you through creating an easy-to-use interface for your web projects."
Social Details
Discord - https://discord.gg/CQMSSbG3TX
Instagram - https://www.instagram.com/reactwithutkarsh/
LinkedIn - https://www.linkedin.com/in/utkarshseth2019/
GitHub - https://github.com/whoisseth
Timestamps
0:00 - Introduction to the dashboard project
3:02 - Installing dependencies for Next.js setup
8:27 - Configuring UI layout using set Shadcn UI
13:11 - Creating a collapsible sidebar component
17:24 - Implementing icons, buttons, and tooltips
20:55 - Managing active page indication in the sidebar
24:28 - Creating user, orders, and settings pages
25:18 - Configuring the sidebar for mobile compatibility
27:22 - Implementing responsive sidebar collapse
28:49 - Shifting focus to dashboard creation
43:05 - Initiating bar chart creation with Recharts
50:26 - Creating the recent sales section
51:09 - Developing the sales card component
57:03 - Rendering sales card data using mapping
1:00:45 - Installing and implementing a data table for users
1:11:07 - Deploying the application on GitHub and Vercel