Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

Build your UI Component Library in React & Next.js with this ShadCN UI for Beginners tutorial. Shadcn ui is a collection of reusable components that you can use as a reference to build your own component library.

Support me on Patreon ➜   / davegray  

⭐ Become a fullstack web dev with Zero To Mastery Courses:
Complete Next.js Developer: https://bit.ly/CompNextJSDev
Advanced React: https://bit.ly/AdvReactDev
Junior to Senior Dev Roadmap: https://bit.ly/WebDevRoadmapJrtoSr

Subscribe ➜ https://bit.ly/3nGHmNn

Course Updates ➜ https://courses.davegray.codes/

❓ Questions Please post them to my Discord ➜   / discord  

☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray

Source Code Example: https://github.com/gitdagray/shadcnu...

My Next.js Videos:    • Next.js Tutorials for Beginners  

Follow Me On Social Media:
GitHub: https://github.com/gitdagray
Twitter:   / yesdavidgray  
LinkedIn:   / davidagray  

Build Your UI Component Library in React & Next.js | ShadCN UI for Beginners

(00:00) Intro
(00:11) Welcome
(00:34) What is shadcn/ui?
(02:04) Suggested Prerequisites
(02:50) Installing shadcn/ui
(07:57) Adding Your First Component
(13:45) Quick View of Dark Mode
(14:47) Building a Custom Component

Tutorial References:
shadcn/ui: https://ui.shadcn.com/
Next.js: https://nextjs.org
Next.js Light & Dark Modes: https://www.davegray.codes/posts/ligh...

Was this tutorial about building your own UI component library with shadcn/ui helpful? If so, please share. Let me know your thoughts in the comments.

#shadcn #ui #component