用 create-react-app 工具创建的项目，src 下面有个 App.js ，它是一个 React 组件 .. 先把它跟 App.css ，App.test.js 这几个文件一块儿删除掉 ..

在 src 下面创建一个新的 React 组件 .. 放在 components 下面，名字是 App.js

文件的一开始，先导入 React ..

React 组件可以是个类，也可以是个普通的函数 .. Redux 把 React 组件分成了两种类型 .. 一种叫 Container 组件，这种组件一般就是一个类组件，里面会有一些行为 .. 还有一种组件叫 Presentational 组件，表示展示组件 .. 这种组件一般是普通的函数 .. 它只负责展示内容 .. 要展示的数据一般会来自它的 props，就是从组件的爸爸那里传递过来的属性 ..

App

下面先去创建一个 App 组件 .. 它是一个普通的函数组件 .. 组件要 return 它要展示的东西 .. 一组 div .. 里面先添加一个大标题 .. 标题的文字是 App ..

在文件的底部再导出这个 App 组件 .. export default App ..

src/index.js

回到 src/index.js .. 在文件的一开始先导入 React .. 来自 react ..

再把 render 方法，从 react-dom 里面拿出来用一下 .. react 还有 react-dom 已经在项目里面安装好了 ..

下面再把刚才我们创建的 App 这个组件导入进来 .. import App from './components/App'

render

再用一下 react-dom 里的 render 方法 .. 要显示的组件就是 App 这个组件 .. 位置用一下 document.getElementById .. 找到页面上的 root 这个 id 元素 ..

在 public .. index.html 这个文件里 .. 你会看到有一个 id 是 root 的 div 元素 .. 我们的 React 应用会在这里显示 ..

回到浏览器 ...

页面上应该会显示一个大标题 .. 标题上的文字是 App ...