33.react入门

就是一个简单的web项目

react.js 文件下载地址https://github.com/facebook/react/releases

我下载的是最新的15.6

另外还需要安装jsx语法的tranformer,sx文件转换为js文件

具体步骤如下

1. 安装node.js (为了使用npm包管理器);
2. 命令行cd进入项目目录;
3.安装 jsx语法tranformer
    npm install --global babel-cli
    npm install babel-preset-react
4.在项目目录下执行 transformer
    babel --presets react jsx --watch --out-dir funcjs
    最好做成windows批处理文件。
    该命令是持续性的批处理,jsx目录中任何js文件的修改,就会立即transform到指定的funcjs目录中

build.bat(转译命令,双击运行)

index.jsx

效果

时间: 2024-08-04 01:06:16

33.react入门的相关文章

React 入门实例教程

React 入门实例教程 作者: 阮一峰 日期: 2015年3月31日 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西很好用,就在2013年5月开源了. 由于 React 的

(转)React 入门实例教程

作者: 阮一峰 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西很好用,就在2013年5月开源了. 由于 React 的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却非

学习react入门demo的总结。

在github上找到react入门学习比较好的demo,下面是那个链接: https://github.com/ruanyf/react-demos 然后接下来是每个demo的学习笔记: demo1: <body> <div id="example"></div> <script type="text/jsx"> //jsx类型可html和javasript一起写,遇到 HTML 标签,就用 HTML 规则解析:遇到代

react入门(5)

对前面四篇内容进行简单的回顾: react入门(1):jsx,组件,css写法 react入门(2):事件,this.props.children,props,...other react入门(3):jsx/html/css分开写(分成三个文件),state,onChange事件,refs react入门(4):props和state的混搭使用,state与props的对比,生命周期(挂载.更新.移除) 今天要讲的是组件之间的通信,会结合前面学的一些内容,主要以实例为主来进行讲解. 一.父组件向

react入门之使用webpack搭配环境(一)

react入门之搭配环境(一) 如果你想直接上手开发,而跳过这些搭配环境的繁琐过程,推荐你使用官方的create-react-app命令 npm install -g create-react-app //安装create-react-app脚手架 npm为node.js的包管理工具,请确保你已经安装了node.js create-react-app my-app //使用create-react-app创建,my-app为项目名称 cd my-app/ //进入my-app目录 npm sta

【转】react入门实例教程

作者: 阮一峰 日期: 2015年3月31日 写在前面:原文链接http://www.ruanyifeng.com/blog/2015/03/react.html    github地址https://github.com/ruanyf/react-demos 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Facebook 的内部项目,因为该公司对市场

React入门资源整理

另外,附上我搜集的一些比较实用的学习资料,建议先看这些撸起来,再看什么乱七八糟的awsome系列. React入门资源整理 孔明前端团队React项目新手指南:http://www.07net01.com/2015/09/920779.html

包建强的培训课程(15):React入门与提高

v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VML);} .shape {behavior:url(#default#VML);} Normal 0 false 10 pt 0 2 false false false EN-US ZH-CN X-NONE $([{£¥·‘“〈<「『[[[〝﹙﹛﹝$(.[{£¥ !%),.:;>?]}¢¨°·ˇˉ

React入门实例教程

文章转自:阮一峰 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西很好用,就在2013年5月开源了. 由于 React 的设计思想极其独特,属于革命性创新,性能出众,代码逻辑却