1-react概念:

React是一个用于构建用户界面的JavaScript库。React主要用于构建UI,很多人认为React是MVC中的V(视图)。React起源于Facebook的内部项目。React 拥有较高的性能,代码逻辑非常简单。

2-react特点:

  • 声明式设计−React采用声明范式,可以轻松描述应用。
  • 高效 −React通过对DOM的模拟,最大限度地减少与DOM的交互。
  • 灵活 −React可以与已知的库或框架很好地配合。
  • JSX − JSX是 JavaScript语法的扩展。React开发不一定使用JSX,但建议使用。
  • 组件 − 通过React构建组件,使得代码更加容易得到复用,能够很好的应用在大项目的开发中。
  • 单向响应的数据流 − React 实现了单向响应的数据流,从而减少了重复代码,这也是它为什么比传统数据绑定更简单。
<!DOCTYPE html>
<html>
<head>
<script src="../build/react.js"></script>
<script src="../build/react-dom.js"></script>
<script src="../build/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel"> </script>
</body>
</html>

模板中代码一共用了三个库: react.js 、react-dom.js 和 Browser.js
需要注意的是,它们必须首先加载。
1)react.js是React的核心库。
2)react-dom.js是提供与DOM相关的功能。
3)Browser.js的作用是将JSX语法转为JavaScript语法,这一步很消耗时间,实际上线时,应将它放到服务器完成。
$ babel src --out-dir build
这个命令可以将src子目录的js文件进行语法转换,转码后的文件全部放在build子目录。

3-通过npm使用React

执行以下命令创建项目(支持node.js和npm):

$ npm install -g create-react-app

$ create-react-app my-app

$ cd my-app/

$ npm start

React入门基础的更多相关文章

  1. React入门---基础知识-大纲-1

    -----------------在慕课网学习react入门笔记-------------- ---------博主边学边记录,手把手进行学习及记录---------- --------------- ...

  2. Flux --> Redux --> Redux React 入门 基础实例使用

    本文的目的很简单,介绍Redux相关概念用法 及其在React项目中的基本使用 假设你会一些ES6.会一些React.有看过Redux相关的文章,这篇入门小文应该能帮助你理一下相关的知识 一般来说,推 ...

  3. React入门基础(学习笔记)

    这篇博客是我通过阅读React官方文档的教程总结的学习笔记,翻译可能存在误差,如有疑问请参见http://reactjs.cn/react/docs/tutorial.html . 一.所需文件 在编 ...

  4. react入门----基础语法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. React入门----基础篇

    React 背景介绍 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做 ...

  6. React Native基础&入门教程:初步使用Flexbox布局

    在上篇中,笔者分享了部分安装并调试React Native应用过程里的一点经验,如果还没有看过的同学请点击<React Native基础&入门教程:调试React Native应用的一小 ...

  7. React Native 入门基础知识总结

    中秋在家闲得无事,想着做点啥,后来想想,为啥不学学 react native.在学习 React Native 时, 需要对前端(HTML,CSS,JavaScript)知识有所了解.对于JS,可以看 ...

  8. react native基础与入门

    react native基础与入门 一.react native 的优点 1.跨平台(一才两用) 2.低投入高回报 (开发成本低.代码复用率高) 3.性能高:拥有独立的js渲染引擎,比传统的h5+ w ...

  9. React入门介绍(1)-ReactDOM.render()等基础

    React入门介绍-ReactDOM.render()等基础 首先,React是一个用于构建用户界面的Javascript库,但Peact并不是一套完整的MVC或MVVM的框架,它仅涵盖V-view视 ...

随机推荐

  1. Elasticsearch 入门 - 基本概念

    NRT Elasticsearch 是一个 接近实时 的搜索平台.这意味着从你索引文档到其可以被搜索中间存在着一个轻微的延迟(通常为1秒钟). Cluster 一个或多个节点的完整数据.聚合索引和搜索 ...

  2. 邓_ php SESSION

    学会php session可以在很多地方使用,比如做一个后台登录的功能,要让程序记住用户的session,其实很简单,看了下面的文章你就明白了. PHP session用法其实很简单它可以把用户提交的 ...

  3. swiper.js在隐藏/显示切换时,轮播出现bug的解决办法

    swiper在 swiper-container正常状态下显示,轮播是没有问题,但是当 swiper-container由隐藏切换至显示时(比如做图片查看时)会出现滑动bug,滑动卡顿而且最后一张可以 ...

  4. 使用gson进行数据(集合数据)的转换 并且返回给前端 进行动态解析 并添加

    后台使用gson转换工具把list集合数据 以json字符串的方式返回给前台 解压: 加入到工程中 前台页面进行数据解析时  需要把得到的字符串  转换为object数组 -------------- ...

  5. ES scroll(ES游标) 解决深分页

    ES scroll(ES游标) 解决深分页. Why 当Elasticsearch响应请求时,它必须确定docs的顺序,排列响应结果.如果请求的页数较少(假设每页20个docs), Elasticse ...

  6. HDU 5171

    这道题本来很水,以前做过一样的,斐波那契数列,用矩阵快速幂的方法求,本来很水,以前做过很多次,为毛做的时候没想到T_T #include <iostream> #include <c ...

  7. linux驱动之poll操作

    POLL操作 1.POLL运行过程: poll是一个系统调用,其内核入口函数为sys_poll,sys_poll差点儿不做不论什么处理直接调用do_sys_poll,do_sys_poll的运行过程能 ...

  8. [Java开发之路](7)RandomAccessFile类具体解释

    RandomAccessFile适用于大小已知的记录组成的文件.提供的对文件訪问.既能够读文件.也能够写文件,而且支持随机訪问文件.能够訪问文件的任何位置. 文件里记录的大小不一定都同样.仅仅要我们知 ...

  9. EasyUI----动态拼接EasyUI控件

    近期在做的项目中.依据查询到的数据,然后动态的拼接easyUI的控件显示到界面上. 在数据库中,有一个命令的表,另一个參数的表,先到命令的表中去查询这一个设备有哪些命令,比方说.摄像头有一个转动的命令 ...

  10. UITableView属性 自己定义UITableViewCell

    UITableView的属性全齐.供大家參考 附:http://www.bubuko.com/infodetail-561085.html //曾经在使用UITableView的时候,总是在cell上 ...