<section id="description"> <p>Прошлая задача показала простой способ составления двух компонентов, но есть много разных способов компоновки компонентов с помощью React. Компонентный состав является одной из мощных возможностей React. Когда вы работаете с React, важно начать думать о своем пользовательском интерфейсе с точки зрения таких компонентов, как пример приложения в последнем вызове. Вы разбиваете свой пользовательский интерфейс на свои основные строительные блоки, и эти части становятся компонентами. Это помогает отделить код, отвечающий за пользовательский интерфейс, от кода, ответственного за обработку вашей логики приложения. Это может значительно упростить разработку и сопровождение сложных проектов.</p></section>

<section id="instructions"> <p>В редакторе кода есть два функциональных компонента, называемых <code>TypesOfFruit</code> и <code>Fruits</code> . Возьмите <code>TypesOfFruit</code> компонент и скомпонуйте его, или <em>вложите</em> его, в пределах компонента <code>Fruits</code>. Затем возьмите компонент <code>Fruits</code> и выведите его в компоненте <code>TypesOfFood</code> . Результатом должен быть дочерний компонент, вложенный в родительский компонент, который вложен в собственный родительский компонент.</p></section>