这里主要使用的都是ES6的语法(阮一峰的<a href="http://es6.ruanyifeng.com">ES6入门</a>)，我自己也在摸索中，在这个项目中会带一些关于语法的解释。可能有错误，如果有发现错误，欢迎指错，谢谢。
现在的前端主要流行工程化，模块化。react就是这样一个框架。框架主要是编程思想的体现。
react的主要的思想就是组件化，模块化。整个项目在之前也说过会使用react和react-reflux来做项目。react充当的是view层的作用，实现view的模块化。react-reflux 来实现代码的解耦，或者说是一个mvc的框架吧。
对于react的学习资源主要是看<a href="http://www.ruanyifeng.com/blog/">阮一峰</a>的文字,这里是<a href="http://www.ruanyifeng.com/blog/2015/03/react.html">react入门实例教程</a>
我这里直接从一个小的项目开始，会涵盖一些react的知识点，碰到了再单独解释。
一、 helloworld
coding的过程都是从helloworld开始的。我们也从helloworld开始。
react component 的class 要大写开头，所以注意要HelloWorld
1、 创建一个名字叫HelloWorld.js 代码
import React from 'react'
export class HelloWorld extends React.Component {
constructor(props){
super(props);
}
render(){
return <h1>hello world {this.props.name}</h1>;
}
};
2、在Main.js
import {HelloWorld} from './HelloWorld.js'
class AppComponent extends React.Component {
render() {
return (
<div className="index">
<img src={yeomanImage} alt="Yeoman Generator" />
<HelloWorld/>
</div>
);
}}
3、查看运行效果
helloworld.png
4、语法解析
// es6 总共有6种创建变量的命令
//如下：
// let 命令 const 命令 var 命令 function 命令
// import命令 和 export 命令
// import {} export{} 导入接口和导出接口的意思，能够很好的实现模块化
import React from 'react'
export class HelloWorld extends React.Component {
// constructor 就是react的初始化函数
constructor(props){
super(props);
}
// render就是讲 下面return的模板转换成 HTML语言，把并插入节点，这个例子就是讲先的<h1>标签插入到Main.js的节点下
render(){
return <h1>hello world {this.props.name}</h1>;
}
};
这样我们就可以最简单的使用了react 创建了一个react 组件并且使用了。
