狗屎一样的React(第一节,怎么来搭建react demo更合适)

这一节,我们来说说怎么搭建react ,或者是更合适的方法。

一直以来,我们深深喜爱着的方式,也是习惯了的方式是需要哪个js,就在页面<script src="xx.js"></script>,然后需要把js引入到文档底部来加速渲染页面。

所以小伙伴们肯定希望学习react从引入react.js开始,然后自己写个index.js或者demo.js来引入。我们还得引入<script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>,但自己引入的index.js需要这么写<script type="text/babel" src="index.js">这么做是希望浏览器能够认识我们接下来要学习的react的狗屎一样的写法。他加入的jsx的语法糖,含有es6的招式,所以旧版本浏览器不认识。react没有ajax功能,所以我们想引入jquery.js,我们还想引入bootstrap.css。

         是不是发现学习react也挺简单的,其实不然。你会发现还是跑不起来,因为他需要服务器支撑,我们再把搭建好的react demo放到tomcat下面,然后就访问localhost:8080/reactdemo/index.html 然后就跑起来了。

虽然跑起来了,但我告诉你,以上的我们留恋的学习姿势是错误的,是不符合当下形式的。

        下面我来说更推荐的:

1、安装Nodejs

            地址: https://nodejs.org/en/download/

    来这里下载,然后安装。至于怎么下载,怎么安装,跟你安装QQ思路差不多,安装完了也不用配置环境变量。只需要打开cmd小黑窗,然后输入node -v  。如果刚才安装成功了,会显示一个nodejs的版本号

2、搭建react官方demo实例

    推荐安装学习地址: http://www.runoob.com/react/react-install.html

   推荐在C盘以外的盘符创建一个空文件夹,比如定义:ggReact ,然后通过cmd小黑窗定位到我们新建的ggReact文件夹再开始  npm 等一系列操作,操作步骤大概如下:

	npm install -g create-react-app
	create-react-app my-app
	cd my-app/
	npm start
当你npm start以后,demo实例会自动跳出来。这样证明你的环境已经搭建好了。


工欲善其事必先利其器,我们更推荐使用node  npm的方式来搭建自己的react工程,而不是再利用script页面引入的方式,因为目前的潮流就是Node  npm  ,我们必须紧跟着,还得跟的快。如果你不按潮流来,仍然很守旧,按我给你看个好玩的东西。

看过之后小伙伴们觉得自己属于哪个层级呢?

然后你可以看一下搭建好的react工程的目录结构,下一节我们来说一下,初次玩react的你该怎么整理一下这个目录结构从而使自己更适合继续玩下去,下一篇文章就叫:狗屎一样的React(第二节,让目录结构变得更易懂)

  • 5
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 5
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

经海路大白狗

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值