In the lesson we have create our Person component. The question is what is the big advantage of this.
组件很棒，因为我们可以将代码集中在每个文件中，从而使代码更具可维护性。没有把一切都放进去 src / App.js file which can really get crowded for bigger apps and the Person component s also reusable and configurable.

可重复使用的组件

现在回到配置零件重用非常简单。我们可以根据需要简单地多次复制和粘贴组件。
例：

import 湖北福彩, { Component } from 'react';
import './App.css';
import Person from './Person/Person';
class App extends Component {
	render() {
		return (
			<div className="App">
				<h1> Heading</h1>
				<p> Paragraph </p>
				{/* Reusing the same component Multiple time. */}
				<Person />
				<Person />
				<Person />
			</div>
		);
	}
}
export  默认  App;

在浏览器中，我们多次获得输出，这是在应用程序中任何地方重用它的超级简单方法。如果我们的应用程序包含越来越多的组件，那么使用所有这些组件进行构建就非常容易，并且可以在我们需要在应用程序中使用的任何地方使用它们。
<Person /> ：这实际上是我们的自定义HTML元素。我们还可以配置它，尽管在执行此操作之前，让我们在湖北福彩代码中进行其他更改，因为现在所有内容都是静态的，仍然有我们的自定义组件，但是最后我们仍然使用一些静态HTML。

import 反应from 'react';
const person = () => {
	return <p> I am a Person</p>;
};
export  默认  person;

现在，通常我们的模板，即我们的JSX代码应该是动态的。根据您的应用程序状态或某些用户输入，它应该输出不同的内容。我们将在本课程中做很多工作，但让我们在下一课中介绍其基础。

反应introduction
反应Component