React 是什么？

网络上的解释很多。。。我这里把他定义为 通过javascript 的形式组件化 html的框架。。。

React 仅仅是 VIEW 层。

React 提供了模板语法以及一些函数钩子用于基本的 HTML 渲染。这就是 React 全部的输出——HTML。你把 HTML / JavaScript 合到一起，被称为“组件”，允许把它们自己内部的状态存到内存中（比如在一个选项卡中哪个被选中），不过最后你只是吐出 HTML。

React 的安装？

首先是下载 reactjs的文件包。。http://www.reactjs.cn/react/downloads.html 下载react 使用需要的文件包。。

下载完成后 我们打开压缩包里面的bulid文件夹

JSXTransformer.js这个文件主要用来解析 react 自定义的jsx 语法解析器。

react.js和react.min.js 这2个文件就是react 的核心文件。其中一个是压缩过的。

react-with-addons.js 和 react-with-addons.min.js 这2个文件里存放了一些react 的插件。

第一个React 的示例

<!DOCTYPE html>

<html>

  <head>

    <meta http-equiv='Content-type' content='text/html; charset=utf-8'>

    <title>holle,world</title>

    <link rel="stylesheet" href="../shared/css/base.css" />

  </head>

  <body>

    <div id="container">

    </div>

    <script src="../../build/react.js"></script>

    <script src="../../build/JSXTransformer.js"></script>

    <script type="text/jsx">

      var HolleWorld = React.createClass({

        render: function() {

          return <p>holle  world</p>;

        }

      });

        React.render(

          <HolleWorld  />,

          container

        );

    </script>

  </body>

</html>

总结

总体来说 起步还是挺顺利的。。我们下节再见吧

react.js 从零开始（一）的更多相关文章

  1. react.js 从零开始（四）React 属性和状态详解

    属性的含义和用法: 1.属性的含义. props=properties 属性:一个事物的性质和关系. 属性往往与生俱来,不可以修改. 2. 属性的用法. <Helloworld name=??? ...

  2. react.js 从零开始（三）JSX 语法及特点介绍

    什么是jsx? jsx = JavaScript + xml jsx 是一种 Ecmascript 的一种新标准. jsx 是一种 带有结构性的语法. jsx 的特点: 1.类xml语法易于理解. 2 ...

  3. react.js 从零开始（七）React （虚拟）DOM

    React 元素 React 中最主要的类型就是 ReactElement.它有四个属性:type,props,key 和ref.它没有方法,并且原型上什么都没有. 可以通过 React.create ...

  4. react.js 从零开始（六）Reconciliation

    Reconciliation   React 的关键设计目标是使 API 看起来就像每一次有数据更新的时候,整个应用重新渲染了一样.这就极大地简化了应用的编写,但是同时使 React 易于驾驭,也是一 ...

  5. react.js 从零开始（五）React 中事件的用法

    事件系统   虚拟事件对象 事件处理器将会传入虚拟事件对象的实例,一个对浏览器本地事件的跨浏览器封装.它有和浏览器本地事件相同的属性和方法,包括 stopPropagation() 和 prevent ...

  6. react.js 从零开始（二）组件的生命周期

    什么是生命周期? 组件本质上是一个状态机,输入确定,输出一定确定. 当状态改变的时候 会触发不同的钩子函数,可以让开发者做出响应.. 一个组件的生命周期可以概括为 初始化:状态下 可以自定义的函数 g ...

  7. React.js 小书介绍

    React.js 小书 Github 关于作者 这是一本关于 React.js 的小书. 因为工作中一直在使用 React.js,也一直以来想总结一下自己关于 React.js 的一些知识.经验.于是 ...

  8. 28个漂亮的React.js后台管理模板

    React管理模板 为您的React Web应用程序开发一个管理区域可能非常耗时.它与设计所有前端页面一样重要. 这是2020年设计出色的顶级React.js后台管理模板的列表. 这些模板确实有价值, ...

  9. 13个精选的React JS框架

    如果你正在使用 React.js 或 React Native 创建用户界面,可以试一试本文推荐的这些框架. React.js 和 React Native 是流行的用户界面(UI)开发平台,且都是开 ...

随机推荐

  1. Cstyle的UEFI导读：第20.0篇 IGD OpRegion interface &amp;&amp; IGD OpRegion PROTOCOL

        ACPI IGD OpRegion interface是用SCI来实现IGD driver,OS,BIOS之间沟通的桥梁,IGD OpRegion PROTOCOL是UEFI BIOS构建桥梁 ...

  2. WPF 3D: MeshGeometry3D纹理坐标的正确定义

    原文 WPF 3D: MeshGeometry3D纹理坐标的正确定义 为了使基于2D的纹理显示在3D对象中,我们必须定义3D Mesh对象的纹理贴图坐标.在WPF中,此项功能则通过MeshGeomet ...

  3. centos7 设备 mariadb-10

    下载地址: http://mirrors.ustc.edu.cn/mariadb/mariadb-10.0.19/source/mariadb-10.0.19.tar.gz 由于用cmake所以线安装 ...

  4. VMware vSphere 服务器虚拟化之十六 桌面虚拟化之VMware Horizon View

       VMware vSphere服务器虚拟化之十六 桌面虚拟化之VMware Horizon View  VMware Horizon View (原VMware View的升级版现在版本5.2)是 ...

  5. MySql之ALTER命令用法详细解读（转）

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 本文详细解读了MySql语法中Alter命令的用法,这是一个用法比较多的语法,而且功能还是很强 ...

  6. Apache与Tomcat整合（转）

    一 Apache与Tomcat比较联系 apache支持静态页,tomcat支持动态的,比如servlet等. 一般使用apache+tomcat的话,apache只是作为一个转发,对jsp的处理是由 ...

  7. 程序猿学英语—In July the English learning summary

    七月的英语学习更加曲折,七月初.查看更多,周六和周日可以保证每天两小时的英语教室学习.周一到周 五一般是上完晚自习九点多来机房学习英语,学习一个小时十点多再回宿舍. 考完试,回家待了五天,不好意思的说 ...

  8. 文件翻译002片：Process Monitor帮助文档（Part 2）

    [筛选亮点] Process Monitor提供了一些方式来配置筛选器和高亮显示.         筛选器的包括与排除 您能够在筛选器中指定事件的属性,这样就能够令Process Monitor仅显示 ...

  9. hdu4288 Coder（段树+分离）

    主题链接: huangjing 题意: 题目中给了三个操作 1:add x 就是把x插进去  2:delete x 就是把x删除 3:sum 就是求下标%5=3的元素的和. 另一个条件是插入和删除最后 ...

  10. 【转】java JTable排序和过滤

    JTable排序 在Java SE 6中除了java.awt被更新外,javax.swing同时也有了很大的改进.在C/S程序中我们会经常使 用到"表".如我们可以在查询数据库后将 ...