Skip to content

Commit 1d1eaaa

Browse files
Extract articles doing comparisons to its own sub-category
1 parent a943248 commit 1d1eaaa

File tree

1 file changed

+21
-13
lines changed

1 file changed

+21
-13
lines changed

react-component-composition.md

Lines changed: 21 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -43,10 +43,6 @@
4343
http://rea.tech/reactjs-real-world-examples-of-higher-order-components/
4444
Explanations and examples of HOCs and their uses
4545

46-
- **Functions as Child Components and Higher Order Components**
47-
http://rea.tech/functions-as-child-components-and-higher-order-components/
48-
Comparisons and examples for these two component patterns
49-
5046
- **ReactCasts: Higher Order Components**
5147
https://youtu.be/LTunyI2Oyzw
5248
A screencast that walks through the idea and usage of Higher Order Components
@@ -71,10 +67,6 @@
7167
https://daveceddia.com/extract-state-with-higher-order-components/
7268
An easy-to-read explanation of how HOCs work, and examples of how to extract common logic into a reusable HOC
7369

74-
- **Simplifying life with React render callbacks**
75-
https://medium.com/@adamrackis/simplifying-life-with-react-render-callbacks-cb37d58e55
76-
An overview of several different ways to wrap up components, including cloning children, HOCs, and render callbacks.
77-
7870
- **Why you should keep your React components pure by using HOCs**
7971
https://medium.com/@DjamelH/why-you-should-keep-your-react-components-pure-by-using-hocs-67e5c7f80c81
8072
Walks through extracting stateful behavior into an HOC so that it's more reusable and the wrapped components are simpler.
@@ -91,11 +83,6 @@
9183
http://blog.jakoblind.no/simple-explanation-of-higher-order-components-hoc/
9284
A short, easy-to-read explanation of the basic concepts and examples of HOCs.
9385

94-
- **"HOCs vs render callbacks / function-as-child"**
95-
https://twitter.com/mjackson/status/890725796117176321
96-
https://twitter.com/acdlite/status/890727843302301700
97-
A short but interesting Twitter thread with some comments from Michael Jackson, Andrew Clark, and others, on the mental differences between using HOCs and render callbacks.
98-
9986
- **Real World Higher-Order Components**
10087
http://blog.jakoblind.no/real-world-higher-order-components-hocs/
10188
Several useful examples of actual HOCs, such as adding a hidden prop, providing toggle functionality, and only showing a component if a feature flag is turned on.
@@ -154,3 +141,24 @@
154141
- **Destroy All Classes: Turn React Components Inside Out with Functional Programming**
155142
https://www.bignerdranch.com/blog/destroy-all-classes-turn-react-components-inside-out-with-functional-programming/
156143
Demonstrates progressively refactoring a class component with logic into separate functional components, and then tying them together with Recompose
144+
145+
146+
#### Comparing Composition Approaches
147+
148+
- **Functions as Child Components and Higher Order Components**
149+
http://rea.tech/functions-as-child-components-and-higher-order-components/
150+
Comparisons and examples for these two component patterns
151+
152+
- **Simplifying life with React render callbacks**
153+
https://medium.com/@adamrackis/simplifying-life-with-react-render-callbacks-cb37d58e55
154+
An overview of several different ways to wrap up components, including cloning children, HOCs, and render callbacks.
155+
156+
- **"HOCs vs render callbacks / function-as-child"**
157+
https://twitter.com/mjackson/status/890725796117176321
158+
https://twitter.com/acdlite/status/890727843302301700
159+
A short but interesting Twitter thread with some comments from Michael Jackson, Andrew Clark, and others, on the mental differences between using HOCs and render callbacks.
160+
161+
- **Never Write Another HoC**
162+
https://youtu.be/BcVAq3YFiuc
163+
Michael Jackson demonstrating that a component with render prop can do anything a HOC can do, and more.
164+

0 commit comments

Comments
 (0)