Тёмный

Storybook Crash Course: For React Devs And Storybook Beginners with Storybook Maintainer, Yann Braga 

newline
Подписаться 8 тыс.
Просмотров 41 тыс.
50% 1

Leverage everything Storybook offers to build your React components and apps better than ever before with Yann Braga, one of the core Storybook maintainers. Yann is a Senior Software Engineer at Chromatic, the leading Storybook cloud platform, and has developed and maintained products at Adtalem, Leaseplan, Rabobank and bol.com. His work on important packages in and around the Storybook ecosystem, allow Yann to uncover how to get the most out of working with Storybook in a stream-lined and practical approach. Integrate Storybook into any React project, with the complete course, Storybook for Building React Apps here, www.newline.co/courses/storyb....
In the complete course, Storybook for Building React Apps, Yann goes deep into the features and uses of Storybook that might otherwise take you months, if not years, of trial and error to implement. In the course, learn state of the art techniques that Yann has acquired through years of industry experience. Yann will go step-by-step through setting up Storybook and highlight key concepts like decorators and addons immediately in the first module. Later, he’ll dive into Atomic Design, Component Driven Development, adding Styled Component support, connecting Figma with Storybook, Conditional Logic, Mocking requests, integrating Storybook in a fully featured app, page components, testing and so much more.
This course is produced by
ewline; building courses for developers from software professionals. We democratize production-level details that you would have to spend years educating yourself by working at a Silicon Valley company. Get instant access to this course and other newline e-books, guides and courses by subscribing here: www.newline.co/pricing
Connect with
ewline Online!
Visit
ewline's Website: www.newline.co/
Find
ewline on Facebook: / newlinedotco
Follow
ewline on Twitter: / fullstackio
Follow
ewline on Instagram: / newlinedotco
Chat with
ewline on Discord: / discord
#newline #Storybook #React
Chapters
0:00 Course Intro
2:05 Storybook Basics
7:31 Key Concepts
9:53 Installing & Exploring Storybook
15:48 What Makes Up a Story
27:31 Decorators
34:00 Essential Addons
42:40 Theming the Storybook App

Опубликовано:

 

15 июн 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 44   
@luxxart
@luxxart Год назад
Fantastic introduction to storybook! Thank you
@newlinedotco
@newlinedotco Год назад
Awesome! We are glad to hear that you found this valuable.
@danieltkach2330
@danieltkach2330 Год назад
Such a great tutorial. Please do more!
@newlinedotco
@newlinedotco Год назад
Awesome! So glad you enjoyed this.
@Brocollipy
@Brocollipy Год назад
Awesome thank you so much for doing this course. I'm just refreshing on React and every time I try and get started with it for larger apps it feels overwhelming. This really helps!
@newlinedotco
@newlinedotco Год назад
You're very welcome! Glad to hear this course helped.
@YassineOmrani
@YassineOmrani Год назад
Great content, well explained and the order of going through stuff is excellent
@newlinedotco
@newlinedotco Год назад
Glad you enjoyed it!
@felipe4181
@felipe4181 5 месяцев назад
Best video of storybook I've seen!
@newlinedotco
@newlinedotco 4 месяца назад
Awesome to hear this!
@SergiyAntonyuk_PhD
@SergiyAntonyuk_PhD Год назад
In my opinion, it was a very useful video. Having looked through the first time, I caught the entire concept of the storybook. After that, I went through the official material. It has deepened my knowledge. Finally, I looked at this video once more. Now I'm sure it can benefit from Storybook on my business project. Thanks a lot to the author for that.
@newlinedotco
@newlinedotco Год назад
Great! We love to hear this.
@mumk
@mumk 2 года назад
Lovely sharing. Learned a bunch, thanks Yann and newline!
@Yannbf
@Yannbf 2 года назад
Thanks for watching!
@mumk
@mumk 2 года назад
@@Yannbf Really appreciate it ☺
@nurulahsan7471
@nurulahsan7471 Год назад
@@Yannbf Can you give me this project's GitHub link?
@newlinedotco
@newlinedotco Год назад
This is a paid course, you can purchase it here: www.newline.co/courses/storybook-for-react-apps/installing-storybook
@edu_amr
@edu_amr 10 месяцев назад
CARA OTIMO VIDEO :)
@carefree_ladka
@carefree_ladka Год назад
Trust me this has been super helpful to me as I had to use Storybook with TurboRepo in my project. Thank you . I have a question. Can you also make a video on state management in Storybook like useState or other hooks inside of stories.
@newlinedotco
@newlinedotco Год назад
great will take into consideration.
@RajabNatshah
@RajabNatshah Год назад
Thank you :)
@newlinedotco
@newlinedotco Год назад
You're welcome!
@matiasromera330
@matiasromera330 Год назад
Perfect
@newlinedotco
@newlinedotco Год назад
Great! We are glad to hear that you enjoyed this.
@vidyasagar08
@vidyasagar08 Месяц назад
please make a video with redux state and react-router-dom nu using moc data API data
@dovenobertinca4029
@dovenobertinca4029 Год назад
Hey, first of all it was a great presentation, and a great explanation. But how did I understand that part of it was also the part of integration in REAL and BIG APPLICATION?
@newlinedotco
@newlinedotco Год назад
It's great to hear that you enjoyed this tutorial! It looks like you had a question, let us know if we can help further. Feel free to send us an email too, us@fullstack.io
@8koi245
@8koi245 Год назад
the what??
@S1L3NT_AU
@S1L3NT_AU Год назад
Is it possible to run a nextjs storybook as a component library through GitHub Packages or NPM? I've been having a rough time trying to set this up. Thanks in advance :)
@newlinedotco
@newlinedotco Год назад
Hey there! I'm not sure we totally understood the questions. However, Storybook helps developers work on their components in isolation as a workshop environment, but it does not help with publishing your code to a registry like GH or NPM. I'd suggest you do to things: 1. Check a tutorial on how to publish a component library to NPM: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-XHQi5a0TmMc.html 2. Check this blog post regarding using Storybook and Next.js: storybook.js.org/blog/integrate-nextjs-and-storybook-automatically/
@ABCshake
@ABCshake 3 месяца назад
He has really nice hair
@tarek_maza
@tarek_maza 10 месяцев назад
You don't need a course for storybook the documentation is more than enough
@sergeystroitelev1964
@sergeystroitelev1964 2 года назад
what is the name of your terminal?
@Yannbf
@Yannbf 2 года назад
Hey Sergey! It's called iTerm. I will add a section in my course that provides all my configuration for the ones interested. Thanks for watching!
@samuelmorkbednarzkepler
@samuelmorkbednarzkepler Год назад
Is this using CSF 3.0?
@newlinedotco
@newlinedotco Год назад
Hey Samuel! No, the whole course uses CSF 2 which is the default format in Storybook 6. In Storybook 7, CSF3 will become the new standard format, and I'm planning to release a video (once Storybook 7 gets to stable) explaining the differences and how to migrate. For now, please refer to this resource for reference: storybook.js.org/blog/storybook-csf3-is-here/
@yogi2983
@yogi2983 Год назад
Storybook doesn't reload after changes. I have to manually restart the server. Any help?
@newlinedotco
@newlinedotco Год назад
Thanks. Can you join the discord server. Yann is there and can follow up with questions. discord.com/invite/D88ppSb
@johnconnor9787
@johnconnor9787 Год назад
23:45
@io1921
@io1921 Год назад
Is this version 6.5 ?
@Yannbf
@Yannbf Год назад
Hey @IO yes you're right! Storybook 7 is currently in alpha version, so the course uses latest, which is 6.5.
@nurulahsan7471
@nurulahsan7471 Год назад
Such a great tutorial. Please do more!
@newlinedotco
@newlinedotco Год назад
Awesome! Thanks for the compliment.
@nurulahsan7471
@nurulahsan7471 Год назад
@@newlinedotco Can you give me this project's GitHub link?
Далее
Storybook 7 Crash Course - React Typescript
28:23
Просмотров 40 тыс.
Я ТВОЙ ОТЕЦ #большоешоу
01:01
Просмотров 266 тыс.
React Storybook Crash Course
17:28
Просмотров 331 тыс.
How to connect props with Storybook controls
9:16
Просмотров 21 тыс.
How to Test UI AUTOMATICALLY - Storybook and Chromatic
10:54
Build And Publish A React Component Library
24:02
Просмотров 98 тыс.
Why Storybook React Makes Building UI Components Easy
6:19
10 React Antipatterns to Avoid - Code This, Not That!
8:55
Я ТВОЙ ОТЕЦ #большоешоу
01:01
Просмотров 266 тыс.