# Использование компонентов в React

Каждому подключенному компоненту соответствует свой JSX тег. К примеру, у нас есть компонент `Product`, а значит ему соответствует тег `<Product />`.

Название тега компонента обязательно следует писать с большой буквы, чтобы React мог отличить вызов компонента от использования тега HTML.

Итак, давайте внутри компонента `App` используем компонент `Product`, написав соответствующий ему тег:

`import React from 'react'; import Product from './Product'; function App() { return <div> <Product /> </div>; } export default App;`

В результате после рендиренга получится следующее:

`<div> <p> product </p> </div>`

Сделайте компонент `User`, который будет выводить данные юзеров. Пусть сейчас этот компонент просто выводит какой-нибудь текст. Используйте этот компонент в компоненте `App`.

← →
↑