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. 导出MNIST的数据集

    在TensorFlow的官方入门课程中,多次用到mnist数据集. mnist数据集是一个数字手写体图片库,但它的存储格式并非常见的图片格式,所有的图片都集中保存在四个扩展名为idx3-ubyte的二 ...

  2. 数据库优化一般思路(PLSQL、Navicat)

    SQL执行过程: 1.执行SQL时,sql解析引擎会被启动 2.数据类型和数据库表定义的数据类型不一致,数据库引擎会自动转化 3.数据库表定义了多个索引,sql引擎会帮你选择最优的一个 4.数据库引擎 ...

  3. K - The Unique MST

    K - The Unique MST #include<iostream> #include<cstdio> #include<cstring> #include& ...

  4. 推荐几款VisualStudio的插件

    继前几天推荐了一款转换vs插件的插件后,借着安装VS2013之际,把我比较喜欢的几个插件继续推荐一下. C# Outline 2013 2013 C#的代码折叠最小只能到函数级,不像C++那样可以折叠 ...

  5. hdu 3177 Crixalis&#39;s Equipment

    Crixalis's Equipment Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...

  6. 《coredump问题原理探究》Linux x86版7.8节vector相关的iterator对象

    在前面看过了一个vectorcoredump的样例,接触了vector的iterator,能够知道vector的iterator仅仅有一个成员_M_current指向vector某一个元素. 先看一个 ...

  7. Llama-impala on yarn的中间协调服务

    本文基于CDH发行版下的Hadoop Yarn和Impala 早期的Impala版本号中.为了使用Impala.我们一般会在以Client/Server的结构在各个集群节点启动impala-serve ...

  8. 朴素贝叶斯python实现

    概率论是非常多机器学习算法基础,朴素贝叶斯分类器之所以称为朴素,是由于整个形式化过程中仅仅做最原始.简单的如果. (这个如果:问题中有非常多特征,我们简单如果一个个特征是独立的.该如果称做条件独立性, ...

  9. MVC发送邮件

    <> 发送邮件报错说明 发送邮件 假设发送人的邮箱username与邮箱password都没有填写错误:假设报:參数或变量中有语法错误. server响应为:mail from addre ...

  10. kentico中的page template的使用

    父页面使用自己的template 子页面,也使用自己的template. 然后父页面中需要添加一个place holder. 子页面的继承,选择inherit only master page. 这样 ...