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