Added info on nesting functional components (#19131)

client/src/pages/guide/english/react-native/functional-vs-class-components/index.md

@@ -11,11 +11,11 @@ Class components are JavaScript ES2015 classes that extend a base class from Rea
 
 ```js
 class App extends Component {
-    render () {
+  render () {
-        return (
+    return (
-            <Text>Hello World!</Text>
+      <Text>Hello World!</Text>
-        )
+    )
-    }
+  }
 }
 ```
 
@@ -27,12 +27,40 @@ Functional components are simpler. They don't manage their own state or have acc
 
 ```js
 const PageOne = () => {
-    return (
+  return (
-        <h1>Page One</h1>
+    <Text>Page One</Text>
-    );
+  );
 }
 ```
 
+Note that its immediate parent doesn't necessarily have to be a Class component. It could just be another stateless one, which allows for better componentization. Here's an example.
+
+```js
+const SecondComponent = () => {
+  return <Text>Hello World</Text>
+}
+
+const FirstComponent = () => {
+  return (
+    <View>
+      <SecondComponent />
+    </View>
+  )
+}
+
+class App extends Component {
+  render () {
+    return <FirstComponent />
+  }
+}
+```
+
+We're not doing all that much here. `App` is a class component that renders `FirstComponent`, which is just a functional component that returns `SecondComponent` inside of a `View`. 
+
+Obviously, if the goal was just to render a `Text` component that said "Hello World", you wouldn't need `FirstComponent` nor `SecondComponent`. But the purpose of this example is to show how one might go about nesting functional components.
+
+Sometimes, a functional component may contain a lot of markup for its configuration. For example, the `TextInput` component can be customized with many attributes, so you may want to create custom components for different fields like email, password, username and so on. That is a powerful concept, as you're now able to reuse these custom components throughout your application.
+
 ### Summary
 
 Class components are used as container components to handle state management and wrap child components. Functional components generally are just used for display purposes - these components call functions from parent components to handle user interactions or state updates.