React入门基础
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入门基础的更多相关文章
- React入门---基础知识-大纲-1
-----------------在慕课网学习react入门笔记-------------- ---------博主边学边记录,手把手进行学习及记录---------- --------------- ...
- Flux --> Redux --> Redux React 入门 基础实例使用
本文的目的很简单,介绍Redux相关概念用法 及其在React项目中的基本使用 假设你会一些ES6.会一些React.有看过Redux相关的文章,这篇入门小文应该能帮助你理一下相关的知识 一般来说,推 ...
- React入门基础(学习笔记)
这篇博客是我通过阅读React官方文档的教程总结的学习笔记,翻译可能存在误差,如有疑问请参见http://reactjs.cn/react/docs/tutorial.html . 一.所需文件 在编 ...
- react入门----基础语法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- React入门----基础篇
React 背景介绍 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做 ...
- React Native基础&入门教程:初步使用Flexbox布局
在上篇中,笔者分享了部分安装并调试React Native应用过程里的一点经验,如果还没有看过的同学请点击<React Native基础&入门教程:调试React Native应用的一小 ...
- React Native 入门基础知识总结
中秋在家闲得无事,想着做点啥,后来想想,为啥不学学 react native.在学习 React Native 时, 需要对前端(HTML,CSS,JavaScript)知识有所了解.对于JS,可以看 ...
- react native基础与入门
react native基础与入门 一.react native 的优点 1.跨平台(一才两用) 2.低投入高回报 (开发成本低.代码复用率高) 3.性能高:拥有独立的js渲染引擎,比传统的h5+ w ...
- React入门介绍(1)-ReactDOM.render()等基础
React入门介绍-ReactDOM.render()等基础 首先,React是一个用于构建用户界面的Javascript库,但Peact并不是一套完整的MVC或MVVM的框架,它仅涵盖V-view视 ...
随机推荐
- 导出MNIST的数据集
在TensorFlow的官方入门课程中,多次用到mnist数据集. mnist数据集是一个数字手写体图片库,但它的存储格式并非常见的图片格式,所有的图片都集中保存在四个扩展名为idx3-ubyte的二 ...
- 数据库优化一般思路(PLSQL、Navicat)
SQL执行过程: 1.执行SQL时,sql解析引擎会被启动 2.数据类型和数据库表定义的数据类型不一致,数据库引擎会自动转化 3.数据库表定义了多个索引,sql引擎会帮你选择最优的一个 4.数据库引擎 ...
- K - The Unique MST
K - The Unique MST #include<iostream> #include<cstdio> #include<cstring> #include& ...
- 推荐几款VisualStudio的插件
继前几天推荐了一款转换vs插件的插件后,借着安装VS2013之际,把我比较喜欢的几个插件继续推荐一下. C# Outline 2013 2013 C#的代码折叠最小只能到函数级,不像C++那样可以折叠 ...
- hdu 3177 Crixalis's Equipment
Crixalis's Equipment Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Oth ...
- 《coredump问题原理探究》Linux x86版7.8节vector相关的iterator对象
在前面看过了一个vectorcoredump的样例,接触了vector的iterator,能够知道vector的iterator仅仅有一个成员_M_current指向vector某一个元素. 先看一个 ...
- Llama-impala on yarn的中间协调服务
本文基于CDH发行版下的Hadoop Yarn和Impala 早期的Impala版本号中.为了使用Impala.我们一般会在以Client/Server的结构在各个集群节点启动impala-serve ...
- 朴素贝叶斯python实现
概率论是非常多机器学习算法基础,朴素贝叶斯分类器之所以称为朴素,是由于整个形式化过程中仅仅做最原始.简单的如果. (这个如果:问题中有非常多特征,我们简单如果一个个特征是独立的.该如果称做条件独立性, ...
- MVC发送邮件
<> 发送邮件报错说明 发送邮件 假设发送人的邮箱username与邮箱password都没有填写错误:假设报:參数或变量中有语法错误. server响应为:mail from addre ...
- kentico中的page template的使用
父页面使用自己的template 子页面,也使用自己的template. 然后父页面中需要添加一个place holder. 子页面的继承,选择inherit only master page. 这样 ...