01. react 初次见面---本地准备React的开发运行环境

摘要: 这是本人通过官网自学react的记录与总结。

1. React 是什么？

React 是一个采用声明式，高效而且灵活的用来构建用户界面的框架。

2. JSX简介

JSX就是Javascript和XML结合的一种格式。React发明了JSX，利用HTML语法来创建虚拟DOM。当遇到<，JSX就当HTML解析，遇到 { 就当JavaScript解析。

const element = <h1>Hello, world!</h1>;

3. 本地搭建React的开发运行环境。

确保你电脑上安装了最新版本的 Node.js.

创建一个新的 React 项目。

Create React App 是开始构建新的 React 单页面应用的最佳途径。 它可以帮你配置开发环境，以便你可以使用最新的 JavaScript 特性，还能提供很棒的开发体验，并为生产环境优化你的应用。

npm install -g create-react-app //第一步：全局安装react
create-react-app my-app //第二步：创建 项目

cd my-app //第三步：切换到 项目中
npm start //第四步：运行项目

Create React App 并不处理后端逻辑和数据库，它只会创建一个前端的构建管道，所以可以和任何后端搭配使用。它可以使用 Babel 和 Webpack 这样的配置工具，也可以零配置使用。

当你准备好将其部署到生产环境中时，运行

npm run build

将会在

build

文件夹中创建一个优化好的应用。你可以从 README 和 用户指南 中了解更多信息。

4. Chrome中react的开发工具插件步骤

官网上有Chrome和Firefox的安装方法。如果你用的是Chrome浏览器开发，并且你不会翻墙的画，这里就是教你如何安装在Chrome中安装react的开发工具插件。

该插件唯一标识：fmkadmapgofadopljbjfkapdkoienihi

点击进入 2333实验室 ，复制上面标识输入文本框。然后点击下载，将下载的文件直接拖到Chrome开发工具一栏中。