Загрузка видео...

Не удалось загрузить видео

На главную

🚨 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 просмотров • 1 год назад •via X (Twitter)

ОбразованиеНаука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 5

Фото профиля George Moller
George Moller1 год назад

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
glueckkanja4 лет назад

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

Фото профиля Ayuka
Ayuka1 год назад

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

Фото профиля 🦜
🦜1 год назад

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

Фото профиля Stefan ⚛︎ 🎆
Stefan ⚛︎ 🎆1 год назад

COMPOUND 👏 COMPONENTS 👏 RULE 👏

Похожие видео

❌ Avoid difficult-to-read conditionals to render elements in react. ✅ Instead use utility components for conditional rendering.
0:40

❌ Avoid difficult-to-read conditionals to render elements in react. ✅ Instead use utility components for conditional rendering.

George Moller

301,101 просмотров • 2 лет назад

❌ 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 просмотров • 1 год назад

❌ 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 просмотров • 2 лет назад

❌ 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 просмотров • 4 месяцев назад

❌ 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 просмотров • 2 лет назад

❌ 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 просмотров • 2 лет назад

❌ 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 просмотров • 1 год назад

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 просмотров • 1 месяц назад

❌ 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 просмотров • 1 год назад

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 просмотров • 1 год назад

"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 просмотров • 1 год назад

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 просмотров • 3 лет назад

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 просмотров • 1 год назад

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 просмотров • 10 месяцев назад

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 просмотров • 5 месяцев назад

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 просмотров • 11 месяцев назад

❌ 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 просмотров • 2 лет назад

🎓 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 просмотров • 27 дней назад

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 просмотров • 9 месяцев назад

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 просмотров • 2 лет назад