Compound Components - React Design Patterns | Tab Component

Veröffentlicht am: 14 August 2022
auf dem Kanal: Oğuz Ergül
1,282
62

Bu videoda, React Compound Component Design Pattern kullanarak bir Tab Componenti oluşturuyorum.

Compound Componentler, Frontend mimarileri oluştururken yaşanan kod karmaşıklığını azaltır. Bunun yanında stateleri alt bileşenler arasında esnek ve doğru bir şekilde paylaşmamıza da olanak tanır.

Videoyu izleyerek bunu nasıl yaptığımızı hemen öğrenebilir ve daha sağlam bileşenler oluşturabilirsiniz.

--

In this tutorial, I am creating a Tab Component using React Compound Component Design Pattern.

Compound Components reduce the code complexity experienced when creating front-end architectures. In addition, it also allows us to flexibly and accurately share states between child components. By watching the video, you can immediately learn how we do this and create more robust components.

--
Timeline:
00:00 - Intro and Quick Overview
00:22 - Subscribe to Channel!
00:30 - What is Compound Component?
04:05 - Overview of Tab Component Schema
06:50 - Project Setup (Next.js. + Tailwind CSS )
08:02 - Context API - State Provider
10:50 - Creation of Tab Component Elements
16:05 - Using Tab Component on page
17:49 - Make Tab Dynamic
22:40 - Keyboard Accessibility
29:04 - Pros of Compound Component Pattern
30:02 - Thanks for watching!

SUBSCRIBE TO THE CHANNEL!


Auf dieser Seite können Sie das Online-Video Compound Components - React Design Patterns | Tab Component mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Oğuz Ergül 14 August 2022 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 1,282 Mal angesehen und es wurde von 62 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!