Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

🚨 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 Aufrufe • vor 1 Jahr •via X (Twitter)

BildungWissenschaft & Technologie
LIVE

Anya Rossi• Live Now

Private livecam show

5 Kommentare

Profilbild von George Moller
George Mollervor 1 Jahr

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 ↓

Profilbild von glueckkanja
glueckkanjavor 4 Jahren

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

Profilbild von Ayuka
Ayukavor 1 Jahr

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

Profilbild von 🦜
🦜vor 1 Jahr

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

Profilbild von Stefan ⚛︎ 🎆
Stefan ⚛︎ 🎆vor 1 Jahr

COMPOUND 👏 COMPONENTS 👏 RULE 👏

Ähnliche Videos

❌ 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 Aufrufe • vor 1 Jahr

❌ 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 Aufrufe • vor 2 Jahren

❌ 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 Aufrufe • vor 4 Monaten

❌ 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 Aufrufe • vor 2 Jahren

❌ 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 Aufrufe • vor 2 Jahren

❌ 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,311 Aufrufe • vor 1 Jahr

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 Aufrufe • vor 1 Monat

❌ 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 Aufrufe • vor 1 Jahr

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 Aufrufe • vor 1 Jahr

"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 Aufrufe • vor 1 Jahr

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 Aufrufe • vor 3 Jahren

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 Aufrufe • vor 1 Jahr

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 Aufrufe • vor 9 Monaten

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 Aufrufe • vor 5 Monaten

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 Aufrufe • vor 11 Monaten

❌ 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 Aufrufe • vor 2 Jahren

🎓 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 Aufrufe • vor 25 Tagen

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 Aufrufe • vor 9 Monaten

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 Aufrufe • vor 2 Jahren

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.
1:01

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.

Michael Magán

65,473 Aufrufe • vor 1 Jahr