This article will pick up from this code. Children props are used to output whatever is passed between what is passed between the opening and closing tags of our custom component. Here a simple sentence is added to the second place where the car component is used.

import './App.css';
import Car from "./Car/Car"

const App = () => {
  return (
    <div className="App">
      <h1>Hi, I'm a react App</h1>
      <p>This is really working!</p>
      <Car brand="Junsa" year="2019" />
      <Car brand="Apple Car" year="2021">Brand surprised the world</Person>
      <Car brand="Tesla" year="2020" />
    </div>
  ); 
}
export default App;

To output what is passed in between a component's tags one adds another element as shown below. The element can be a paragraph or h1 etc. In this case we add a second paragraph. Inside the paragraph one uses calri braces since it will be dynamic and then adds the name children. (<p>{children}</p>)

const Car = ({brand, year}) => {
  return(
    <>
      <p>The {brand} vehicle brand was first manufactured in the year {year}.</p>
      <p>{children}</p>
    </>
  );
}
export default Car;