正式学习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 base64 编解码，转换成Opencv，PIL.Image图片格式

    二进制打开图片文件,base64编解码,转成Opencv格式: # coding: utf-8 import base64 import numpy as np import cv2 img_file ...

  2. v$、v_$、gv$之间的关系

    本次实验测试,oracle数据库视图中v$,v_$,gv$之间的关系 总结: v_$是动态性能视图,通过sql查询数据库基表返回记录.例如,v_$database对象是视图类型,可对其它用户授权访问: ...

  3. MySQL中INFORMATION_SCHEMA

    select database();  获取当前连接的数据库name 来源:http://www.cnblogs.com/drake-guo/p/6099436.html select auto_in ...

  4. Go Example--接口

    package main import ( "math" "fmt" ) type geometry interface { area() float64 pe ...

  5. redis源码之压缩列表ziplist

    压缩列表ziplist1.简介连续,无序的数据结构.压缩列表是 Redis 为了节约内存而开发的, 由一系列特殊编码的连续内存块组成的顺序型(sequential)数据结构. 2.组成 属性 类型 长 ...

  6. mysql中文编码问题

    我比较推荐的方法是在创建数据库时便设置中文编码 create database bp default character set utf8; #注意是utf8不是utf-8 以下方法只适用于mysql ...

  7. 几个方便进行micro frontend 开发的工具&&类库

    nodejs 类库 从当前来说nodejs 的npm 偏多,因为毕竟面向的是web 编程 tailor 一个layout 服务(基于fragment 的开发方式)https://github.com/ ...

  8. supervisor使用总结

    简介: Supervisor是一个进程控制系统. 它是一个C/S系统(注意: 其提供WEB接口给用户查询和控制). 它允许用户去监控和控制在类UNIX系统的进程. 它的目标与launchd.daemo ...

  9. Lua 程序设计 (Roberto,Ierusalimschy 著)

    1 开始 2 类型与值 3 表达式 4 语句 5 函数 6 深入函数 7 迭代器与泛型for 8 编译,执行与错误 9 协同程序(coroutine) 10 完整的示例 11 数据结构 12 数据文件 ...

  10. java int and Integer

    本文转自:https://www.cnblogs.com/guodongdidi/p/6953217.html int和Integer的区别 1.Integer是int的包装类,int则是java的一 ...