我们学习react首先是要了解react是什么,以及他的特点。
React 是一个用于构建用户界面的 JAVASCRIPT 库,起源于 Facebook 的内部项目,用来架设 Instagram 的网站,
拥有较高的性能,代码逻辑非常简单,React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。
React的特点有:1.声明式设计 −React采用声明范式,可以轻松描述应用。
2.高效 −React通过对DOM的模拟,最大限度地减少与DOM的交互。
3.灵活 −React可以与已知的库或框架很好地配合。
4.JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ,但我们建议使用它。
5.组件 − 通过 React 构建组件,使得代码更加容易得到复用,能够很好的应用在大项目的开发中。
6.单向响应的数据流 − React 实现了单向响应的数据流,从而减少了重复代码,这也是它为什么比传统数据绑定更简单。
使用 create-react-app 快速构建 React 开发环境

在浏览器中我们就可以看见

我们修改app.js里面文件如下

我们再看看浏览器会出现什么

我们还可以通过直接引用cdn的方式来进行开发
其中react.min.js - React 的核心库,react-dom.min.js - 提供与 DOM 相关的功能,babel.min.js - Babel 可以将 ES6 代码转为 ES5 代码,这样我
们就能在目前不支持 ES6 浏览器上执行 React 代码。Babel 内嵌了对 JSX 的支持。通过将 Babel 和 babel-sublime 包(package)一同使用可以
让源码的语法渲染上升到一个全新的水平。

但是需要注意的是
在浏览器中使用 Babel 来编译 JSX 效率是非常低的。我们需要使用 JSX,则 标签的 type 属性需要设置为 text/babel

初探react(一)的更多相关文章

  1. 初探React,将我们的View标签化

    前言 我之前喜欢玩一款游戏:全民飞机大战,而且有点痴迷其中,如果你想站在游戏的第一阶梯,便需要不断的练技术练装备,但是腾讯的游戏一般而言是有点恶心的,他会不断的出新飞机.新装备.新宠物,所以,很多时候 ...

  2. 初探react

    知道这个框架有一段时间了,可是项目中没有用到,也懒得整理,最近两天比较清闲,又想起了它.好了,废话不多说了,都是干货. react是个什么框架? 为什么用react? react 的原理 react有 ...

  3. 初探React与D3的结合-或许是visualization的新突破?

    自诞生之初截止目前(2016年初),React可以说是前端界最流行的话题,如果你还不知道React是何物,你就该需要充充电了. d3是由纽约时报工程师开源的一个绘制基于svg的数据可视化工具,是近几年 ...

  4. 初探React Hooks & SSR改造

    Hooks React v16.8 发布了 Hooks,其主要是解决跨组件.组件复用的状态管理问题. 在 class 中组件的状态封装在对象中,然后通过单向数据流来组织组件间的状态交互.这种模式下,跨 ...

  5. React事件初探

    作者:朱灵子 React 是一个 Facebook 和 Instagram 用来创建用户界面的 JavaScript 库.创造 React 是为了解决一个问题:构建随着时间数据不断变化的大规模应用程序 ...

  6. React源码剖析系列 - 生命周期的管理艺术

    目前,前端领域中 React 势头正盛,很少能够深入剖析内部实现机制和原理.本系列文章希望通过剖析 React 源码,理解其内部的实现原理,知其然更要知其所以然. 对于 React,其组件生命周期(C ...

  7. React 源码剖析系列 - 生命周期的管理艺术

    目前,前端领域中 React 势头正盛,很少能够深入剖析内部实现机制和原理. 本系列文章 希望通过剖析 React 源码,理解其内部的实现原理,知其然更要知其所以然. 对于 React,其组件生命周期 ...

  8. React+DvaJS 之 hook 路由权限控制

    博客 学院 下载 GitChat TinyMind 论坛 APP 问答 商城 VIP 活动 招聘 ITeye 写博客 发Chat 登录注册 原 React+DvaJS 之 hook 路由权限控制 20 ...

  9. Python爬取CSDN博客文章

    0 url :http://blog.csdn.net/youyou1543724847/article/details/52818339Redis一点基础的东西目录 1.基础底层数据结构 2.win ...

随机推荐

  1. linux-RPM安装

    vh可写可不写

  2. Linux内核分析(第九周)

    第一周总结1.存储程序计算机 + 函数调用堆栈 + 中断机制 2.堆栈:C语言程序运行时候必须的一个记录调用路径和参数的空间(函数调用框架/提供局部变量/传递参数/保存返回地址) 不同指令可能实现相同 ...

  3. PHP使用Redis实现消息队列

    消息队列可以使用MySQL来实现,可以参考博客PHP使用MySQL实现消息队列,虽然用MySQL可以实现,但是一般不这么用,因为MySQL的数据都存在硬盘中,而从硬盘中对MySQL的操作,I/O花费的 ...

  4. springframework内BeanUtils源码使用记录一

    package org.springframework.beans; public abstract class BeanUtils /** * Copy the property values of ...

  5. [转帖]简析数据中心三大Overlay技术

    简析数据中心三大Overlay技术 http://www.jifang360.com/news/20161010/n225987768.html 搭建大规模的云计算环境需要数据中心突破多种技术难题,其 ...

  6. 小项目分析之C++ 实现模拟银行排队

      一.问题定义与分析 问题定义 •要解决的问题——银行一天之内的: 1.总客户数 2.客户总逗留时间 3.客户平均逗留时间 问题分析 •新来的人找个短的队伍,站在队尾开始排队 •排在队头的人可以办理 ...

  7. FOJ有奖月赛-2016年8月(daxia专场之过四题方有奖)

    http://acm.fzu.edu.cn/contest/list.php?cid=152 主要是a题, lucas定理, 就这一版能过..  记录一下代码, 另外两个最短路  一个模拟,没什么记录 ...

  8. mysql 由decimal 引起的 Warning: Data truncated for column

    今天在使用python 库mysqldb的rawsql的时候遇到一个问题(其实并不是mysqlbean引起的) cls.raw_sql('update {table} set available_am ...

  9. 自动化运维python学习笔记一

    Python简介 python是吉多·范罗苏姆发明的一种面向对象的脚本语言,可能有些人不知道面向对象和脚本具体是什么意思,但是对于一个初学者来说,现在并不需要明白.大家都知道,当下全栈工程师的概念很火 ...

  10. 同步工具:CountDownLatch、CyclicBarrier和Semaphore

    1. CountDownLatch 1.1 功能及使用场景 一个同步工具,使得一个或多个线程等待一组线程执行完成后再执行. 使用场景:等待一些前置任务执行完成后,再执行特定的功能.比如,系统启动时,各 ...