Storybook Tutorial in Next.js 14+ with Tailwindcss and Shadcn UI Components | Next.js 15
In this video, you will learn about configuring storybook with next.js 15 project to create UI components docs. You will also learn how to write stories with storybook for some shadcn components. Along with this, we will learn how to run storybook on localhost to test all stories. Finally, we will talk about adding icons, typography and colors to be shown for whole project.
00:05 Overview
01:45 Create next.js 14 project
02:58 Build a button component
04:40 Configure storybook in next.js 14 project
08:50 Run storybook locally
13:30 Create stories for button component
23:00 Fix tailwindcss not working in storybook and next.js 14
27:30 Add argTypes in stories
31:00 Add color pallets in storybook
34:05 Add typography in storybook
35:30 Add icons in storybook
#storybook #nextjs14 #tailwindcss #shadcn #reactjs
Docs:
https://storybook.js.org/docs/get-sta...
Follow Whatsapp Channel:
https://whatsapp.com/channel/0029Va7y...
React tutorials:
• React.js Tutorials
JavaScript Tutorials and Projects:
• JavaScript Tutorial and Projects
Angular Tutorials:
• Angular 16 Life Cycle Hooks - Explain...
Docker Tutorials & CI/CD:
• Docker Tutorials & CI/CD
Angular 16 Crash Course For Beginners:
• Angular 16 Crash Course
Tech Tutorials - Random:
• Postman Tutorial - Testing APIs and B...
Complete Next.js 13 Tutorials: • Next.js 13 Tutorials - App Directory
Next.js 14 Tutorials:
• Next.js 14 Tutorials - App Directory
Node Express MongoDB Bootcamp: • Build REST API with Node Express MongoDB
ChatGPT Tutorials: • ChatGPT
Join our facebook group:
/ 996305460498149
Contact us for development services:
/ umair-jameel-24aa5368
