序:
前端框架这么火,怎么能过错过我。(哈哈---其实是因为不想学习,就来实践一下)
一 介绍
React是一个js库,最初是facebook内部使用的,2013年开源以后,由于其较高的性能和简单的代码逻辑被广泛应用。但是据说Facebook官方要求凡是用react实现的前端项目,其专利是归facebook的,然后百度还因此和Facebook产生了纠纷。弃用react,连夜修改框架。(这是趣谈)
二 安装node.js
node.js是基于chrome 引擎的js运行环境。它衍生出的npm(包管理工具)可以简化我们的开发流程。
1. 官网下载安装包:https://nodejs.org/en/download/
2. 然后一路next安装。(现在的node.js一般都包含npm)
3. 完成后测试是否安装成功:
cmd进入命令行,分别键入以下两个命令,出现版本号表明安装成功。
node -v
npm -v
三 创建项目
1. 使用npm全局安装create-react-app工具:
npm install -g create-react-app
2. 创建react工具安装完成以后,用其命令创建项目。(默认在系统盘用户目录下安装,可以切换命令行当前目录,以选择安装路径)
d: //到D盘安装
create-react-app react-demo-name //后者是你创建的项目名称
3.安装成功后,目录结构如下:
node_modules用于存放项目的依赖包
public文件夹中是 根页面index.html所在目录
src中用于存放js文件,也就是项目开发中的主要区域
package.json用于记录项目信息,以及外部依赖包的导入信息等
4.命令行部署npm及导入react-dom依赖包.
npm init //初始化工作,本地项目的话一路回车就好
npm install --save react react-dom //导入react和react-dom依赖
npm install --save react-router-dom // 导入react路由
5.启动react项目
项目所在路径下键入命令:
npm start
浏览器自动打开:
6.关闭项目
关闭命令行即可。