Storybook Tutorial in Next.js 14+ with Tailwindcss and Shadcn UI Components | Next.js 15

Programming with Umair
Programming with Umair
1.6 هزار بار بازدید - 3 ماه پیش - In this video, you will
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:
Facebook: 996305460498149

Contact us for development services:
LinkedIn: umair-jameel-24aa5368
3 ماه پیش در تاریخ 1403/03/14 منتشر شده است.
1,655 بـار بازدید شده
... بیشتر