Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

🚨 Avoid monolithic components that combine rendering, state management, and configuration (e.g., IDs, refs) into one unit, is harder to maintain, test, and reuse. ✅ Instead split functionality into composable components and use context to share configuration and state.

_georgemoller's profile picture

George Moller

119,093 subscribers

21,380 görüntüleme • 1 yıl önce •via X (Twitter)

EğitimBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

5 Yorum

George Moller profil fotoğrafı
George Moller1 yıl önce

I've been working professionally with React for more than 8 years and I compiled all my knowledge into 100+ infographics and 70+ video tutorials just like this one. Check them out ↓

glueckkanja profil fotoğrafı
glueckkanja4 yıl önce

Are you searching for a simple way to deploy device certificates with #Intune? Check out SCEPman at

Ayuka profil fotoğrafı
Ayuka1 yıl önce

ребята не слушайте его 🙏🙏🙏

🦜 profil fotoğrafı
🦜1 yıl önce

Provider value={{}} recreated Object on each state changes and rerenders all components down the tree which not consume context

Stefan ⚛︎ 🎆 profil fotoğrafı
Stefan ⚛︎ 🎆1 yıl önce

COMPOUND 👏 COMPONENTS 👏 RULE 👏

Benzer Videolar

❌ Avoid having components with too many props. ✅ Instead use the compound components pattern in React to embrace composition.
0:46

❌ Avoid having components with too many props. ✅ Instead use the compound components pattern in React to embrace composition.

George Moller

177,627 görüntüleme • 1 yıl önce

❌ Avoid having components with too many props. ✅ Instead use the compound components pattern in React to embrace composition.
1:00

❌ Avoid having components with too many props. ✅ Instead use the compound components pattern in React to embrace composition.

George Moller

130,061 görüntüleme • 2 yıl önce

❌ Avoid prop-drilling your components to extend them ✅ Instead use composition
0:31

❌ Avoid prop-drilling your components to extend them ✅ Instead use composition

George Moller

51,206 görüntüleme • 4 ay önce

❌ Don't pass props to multiple nested components in React. ✅ Instead use libraries like react-query to better handle server state.
0:34

❌ Don't pass props to multiple nested components in React. ✅ Instead use libraries like react-query to better handle server state.

George Moller

137,429 görüntüleme • 2 yıl önce

❌ Avoid using useState for more complex state management ✅ Instead use useReducer ↓
0:32

❌ Avoid using useState for more complex state management ✅ Instead use useReducer ↓

George Moller

124,069 görüntüleme • 2 yıl önce

❌ Avoid prop-drilling components in React ✅ Instead embrace the Provider/Consumer pattern using the Context API
1:02

❌ Avoid prop-drilling components in React ✅ Instead embrace the Provider/Consumer pattern using the Context API

George Moller

48,323 görüntüleme • 1 yıl önce

The Virginia Supreme Court has ruled that the Democratic effort to redraw the state’s congressional map into a 10–1 configuration is null and void.
1:14

The Virginia Supreme Court has ruled that the Democratic effort to redraw the state’s congressional map into a 10–1 configuration is null and void.

Breaking911

37,119 görüntüleme • 1 ay önce

❌ Avoid multiple state variables to track status. ✅ Instead use enums.
0:22

❌ Avoid multiple state variables to track status. ✅ Instead use enums.

George Moller

152,349 görüntüleme • 1 yıl önce

Radon IDE 1.0 is live! 🎉 Turn VSCode and Cursor into a fully-fledged IDE for React Native and Expo: ✅ Build & run RN and Expo apps in integrated panel w/o extra configuration ✅ Jump to code from inspector, view hierarchy or log console ✅ Use debugger effortlessly in your code
3:04

Radon IDE 1.0 is live! 🎉 Turn VSCode and Cursor into a fully-fledged IDE for React Native and Expo: ✅ Build & run RN and Expo apps in integrated panel w/o extra configuration ✅ Jump to code from inspector, view hierarchy or log console ✅ Use debugger effortlessly in your code

Software Mansion

41,263 görüntüleme • 1 yıl önce

"How to share state between React client components with a parent server component?" 👇
0:32

"How to share state between React client components with a parent server component?" 👇

Alex Sidorenko

50,550 görüntüleme • 1 yıl önce

It’s here. Beautifully designed components built with Radix UI and Tailwind CSS. A collection of accessible and customizable components that you can copy and paste into your apps. Free. Open Source. And Next.js 13 Ready.
0:29

It’s here. Beautifully designed components built with Radix UI and Tailwind CSS. A collection of accessible and customizable components that you can copy and paste into your apps. Free. Open Source. And Next.js 13 Ready.

shadcn

666,954 görüntüleme • 3 yıl önce

Calendar built from scratch ↓ → Next.js hosted on Vercel → Tailwind CSS for styling → shadcn for beautiful and accessible components → nuqs for URL-based state management
0:26

Calendar built from scratch ↓ → Next.js hosted on Vercel → Tailwind CSS for styling → shadcn for beautiful and accessible components → nuqs for URL-based state management

João Melo

16,531 görüntüleme • 1 yıl önce

The Svelte 5 guide has everything from reactivity and how it works, when to use and avoid effects, events, bindings, components and composition, transitions and animations to using third party libraries and making external systems reactive. 🔥
1:04

The Svelte 5 guide has everything from reactivity and how it works, when to use and avoid effects, events, bindings, components and composition, transitions and animations to using third party libraries and making external systems reactive. 🔥

matia 🇭🇷

10,805 görüntüleme • 9 ay önce

Three Framer components using its Data() API. They’re self contained code components sharing a single state to sync SoundCloud playback, live ticker data, and a fully interactive record player. Sound on 🔊 The video shows various states from staggered first time track use (compensated for arm position), play and pause in one component and affecting another one, arm drag to scrub a track on the vinyl, and a ticker that takes data depending on states.
1:17

Three Framer components using its Data() API. They’re self contained code components sharing a single state to sync SoundCloud playback, live ticker data, and a fully interactive record player. Sound on 🔊 The video shows various states from staggered first time track use (compensated for arm position), play and pause in one component and affecting another one, arm drag to scrub a track on the vinyl, and a ticker that takes data depending on states.

Lee Black

15,998 görüntüleme • 5 ay önce

People of Namibia 🇳🇦 This is to INFORM you that the Minister of Industry and Deputy Prime Minister will meet with the Board and Management of NIDA to DISCUSS and AVOID state Assets being Privatised and Auctioned to Foreigners.
3:34

People of Namibia 🇳🇦 This is to INFORM you that the Minister of Industry and Deputy Prime Minister will meet with the Board and Management of NIDA to DISCUSS and AVOID state Assets being Privatised and Auctioned to Foreigners.

Prof. Job Shipululo AMUPANDA

11,730 görüntüleme • 11 ay önce

❌ Avoid mixing business logic with your React components. ✅ Instead create abstraction layers that communicate with them.
0:51

❌ Avoid mixing business logic with your React components. ✅ Instead create abstraction layers that communicate with them.

George Moller

214,951 görüntüleme • 2 yıl önce

🎓 Stateful Components tutorial A new way to reuse components in Rive without wiring up a separate view model instance for each one. Override properties directly in the inspector for faster iteration. Significantly reduces complexity and enables quick design iteration.
8:26

🎓 Stateful Components tutorial A new way to reuse components in Rive without wiring up a separate view model instance for each one. Override properties directly in the inspector for faster iteration. Significantly reduces complexity and enables quick design iteration.

Rive

18,233 görüntüleme • 26 gün önce

While hot fire tests may be the crowd pleasers, our team at Test Stand 3 works diligently to test and qualify the internal components of our rockets and spacecraft. This crew tests valves, composite pressure tanks, and other components daily to ensure everything flows smoothly.
6:33

While hot fire tests may be the crowd pleasers, our team at Test Stand 3 works diligently to test and qualify the internal components of our rockets and spacecraft. This crew tests valves, composite pressure tanks, and other components daily to ensure everything flows smoothly.

Firefly Aerospace

38,290 görüntüleme • 9 ay önce

You can now create component property groups — which means you can more easily reuse components throughout your site 🖥️ Easier-to-use components, more design consistency, stunning sites.
0:34

You can now create component property groups — which means you can more easily reuse components throughout your site 🖥️ Easier-to-use components, more design consistency, stunning sites.

Webflow

20,742 görüntüleme • 2 yıl önce

⚛️ Use TypeScript utility types like Omit to create more reusable and adaptable components ↓
0:24

⚛️ Use TypeScript utility types like Omit to create more reusable and adaptable components ↓

George Moller

50,210 görüntüleme • 1 yıl önce