使用create-react-app快速开发React应用

React是一个JavaScript语言的工具库,在这个JavaScript工具铺天盖地的时代,没有意外,首先需要安装Node.js和npm,React本身并不依赖Node.js,但是我们开发中用到的诸多工具需要Node.js的支持。在Node.js的官网(https://nodejs.org/)可以找到合适的安装方式,安装Node.js的同时也就安装了npm,npm是Node.js的安装包管理工具,因为我们不可能自己开发所有功能,会大量使用现有的安装包,就需要npm的帮助。
React技术依赖于一个很庞大的技术栈,比如,转译JavaScript代码需要使用Babel,模块打包工具又要使用Webpack,定制build过程需要grunt或者gulp。。这些技术栈都需要各自的配置文件,还没有开始写一行React相关代码,开发人员就已经被各种技术名词淹没。
庆幸的是Facebook提供了一个快速开发React应用的工具,名叫create-react-app
create-react-app是一个通过npm发布的安装包,在确认Node.js和npm安装好之后,命令行中执行以下命令进行安装:
npm install --global create-react-app
安装完之后,你的电脑中就会有一个create-react-app的执行命令。
接下来我们可以在任意一个想要创建项目的目录下通过cmd命令行创建第一个react项目,只需执行以下命令
create-react-app 20180420react
这个命令会在当前目录下创建一个名为20180420react的目录,在这个目录中会自动添加一个应用的框架,随后我们只需要在这个框架的基础上修改文件就可以开发React应用,避免了大量的手工配置工作。
在create-react-app命令一大段文字输出之后,根据提示,输入下面的命令:
cd 20180420react
npm start
这个命令会启动一个开发模式的服务器,同时也会让你的浏览器自动打开一个网页,指向本地地址http://localhost:3000/,显示界面如下所示:
我们可以通过修改src/App.js文件来修改网页内容:


恭喜你,你的第一个React应用就诞生了~接下来继续探索React的神奇世界吧,你会发现越来越有趣~
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值