正式学习React之前，通过一个简单的Hello Word程序来感受一下。

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="UTF-8">

     <title>Hello World</title>

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

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

     <script type="text/jsx">

         var Hello = React.createClass({

             render: function () {

                 return <p>Hello, World</p>

             }

         });

         React.render(<Hello></Hello>,document.body);

     </script>

 </head>

 <body>

 </body>

 </html>

备注：

(1) 引入React的核心JS文件react.js。

(2) 引入JSX的解析器JSXTransformer.js文件。

(3) React代码写在script标签中，但是注意 type="text/jsx"。

继续学习，加油~~~

初识React：使用React完成Hello World程序的更多相关文章

  1. react native与现有的应用程序集成

    (1)通过cocopods 集成 ,以下内容 参考 http://wiki.jikexueyuan.com/project/react-native/integration-existing.html ...

  2. 使用 React.js 的渐进式 Web 应用程序：第 1 部分 - 介绍

      使用 React.js 的渐进式 Web 应用程序:第 1 部分 - 介绍 使用 React.js 的渐进式 Web 应用程序:第 1 部分 - 介绍 来自译者 markzhai:大家也知道最近 ...

  3. [RN] React Native代码转换成微信小程序代码的转换引擎工具

    React Native代码转换成微信小程序代码的转换引擎工具 https://github.com/areslabs/alita

  4. React学习笔记-1-什么是react，react环境搭建以及第一个react实例

    什么是react?react的官方网站:https://facebook.github.io/react/下图这个就是就是react的标志,非常巧合的是他和我们的github的编辑器Atom非常相似. ...

  5. React的React Native

    React的React Native React无疑是今年最火的前端框架,github上的star直逼30,000,基于React的React Native的star也直逼20,000.有了React ...

  6. 重谈react优势——react技术栈回顾

    react刚刚推出的时候,讲react优势搜索结果是几十页. 现在,react已经慢慢退火,该用用react技术栈的已经使用上,填过多少坑,加过多少班,血泪控诉也不下千文. 今天,再谈一遍react优 ...

  7. 《React Native 精解与实战》书籍连载「React 与 React Native 简介」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

  8. 小谈React、React Native、React Web

    React有三个东西,React JS 前端Web框架,React Native 移动终端Hybrid框架,React Web是一个源码转换工具(React Native 转 Web,并之所以特别提出 ...

  9. React Navigation & React Native & React Native Navigation

    React Navigation & React Native & React Native Navigation React Navigation https://facebook. ...

  10. React 与 React Native 底层共识：React 是什么

    此系列文章将整合我的 React 视频教程与 React Native 书籍中的精华部分,给大家介绍 React 与 React Native 结合学习的方法,此小节主要介绍 React 的底层原理与 ...

随机推荐

  1. Python学习笔记第三周

    目录 一.基础概念 1.集合 集合方法 a.设置集合 b.取交集 c.取并集 d.取差集 e.判断子集 f.判断父集 g.对称差集 基本操作: a.添加 b.删除 c.discard删除 d.长度 e ...

  2. hint不当索引，影响多表连接方式，最终导致SQL执行缓慢

    需求:一个SQL执行特别慢,无法返回结果,需要进行优化,最终返回结果即可. 一.SQL分析 二.尝试执行,观测执行计划 三.修改SQL 四.问题总结 一.SQL分析 )SQL文本,执行时间,执行用户 ...

  3. RAC环境修改参数生效测试

    本篇文档--目的:实验测试在RAC环境下,修改数据库参数与单实例相比,需要注意的地方 --举例说明,在实际生产环境下,以下参数很可能会需要修改 --在安装数据库完成后,很可能没有标准化,初始化文档,没 ...

  4. python基于并发与socket实现远程文件传输程序

    FTP程序 Client: * bin/start.py 程序入口 * conf/配置文件存放 * core/ * auth.py 登陆,注册以及上传下载查看当前文件夹下文件以及删除功能存放 * cl ...

  5. php curl 传输是url中带有空格的处理方法

    在crul中,应该用%20代替空格,否则,空格以后的数据将get不到.

  6. lesson3-神经序列模型I-小象

    优化目标函数: batch gradient descent:必须便利all训练数据 -->随机梯度下降,但不稳定~一个数据点就更新,快但不稳定-->minibatch,取m个随机数据点, ...

  7. hdu3488 Tour 拆点+二分图最佳匹配

    In the kingdom of Henryy, there are N (2 <= N <= 200) cities, with M (M <= 30000) one-way r ...

  8. loopback 代码解析

    loopback-boot boot(app, __dirname);//server.js var instructions = compile(options); execute(app, ins ...

  9. Centos7禁止或者允许开机启动服务

    [root@bogon rsyslog.d]# systemctl is-enabled httpd disabled [root@bogon rsyslog.d]# systemctl status ...

  10. ESB雏形 -- 项目企业服务总线初始

    今天要厚着脸皮给大家推荐一个自己做的通信中间件——ServiceAnt,目前已经在我们团队的两个产品线上投入了使用. ServiceAnt是什么 它最初的定位是ESB(企业服务总线),但目前还没有达到 ...