1. React 是什么?
React 是一个采用声明式,高效而且灵活的用来构建用户界面的框架。
2. JSX简介
JSX就是Javascript和XML结合的一种格式。React发明了JSX,利用HTML语法来创建虚拟DOM。当遇到<,JSX就当HTML解析,遇到 { 就当JavaScript解析。
const element =Hello, world!
;
3. 本地搭建React的开发运行环境。
-
确保你电脑上安装了最新版本的 Node.js.
-
创建一个新的 React 项目。
是开始构建新的 React 单页面应用的最佳途径。 它可以帮你配置开发环境,以便你可以使用最新的 JavaScript 特性,还能提供很棒的开发体验,并为生产环境优化你的应用。
npm install -g create-react-app //第一步:全局安装reactcreate-react-app my-app //第二步:创建 项目cd my-app //第三步:切换到 项目中npm start //第四步:运行项目
Create React App 并不处理后端逻辑和数据库,它只会创建一个前端的构建管道,所以可以和任何后端搭配使用。它可以使用 Babel 和 Webpack 这样的配置工具,也可以零配置使用。
当你准备好将其部署到生产环境中时,运行 npm run build
将会在 build
文件夹中创建一个优化好的应用。你可以从 和 中了解更多信息。
4. Chrome中react的开发工具插件步骤
官网上有Chrome和Firefox的安装方法。如果你用的是Chrome浏览器开发,并且你不会翻墙的画,这里就是教你如何安装在Chrome中安装react的开发工具插件。
该插件唯一标识:fmkadmapgofadopljbjfkapdkoienihi
点击进入 ,复制上面标识输入文本框。然后点击下载,将下载的文件直接拖到Chrome开发工具一栏中。