Humanity

Edit the world by your favorite way

現代的な React の書き方へのリンク

React 初心者を対象とした記事です。昨日の記事からの続き。

ES6版React.jsチュートリアル - Qiita もオススメ。

差分で見る現代化のようす

Rewrite in ES6 style · tyru/hello-react@22d4e7e · GitHub

-const React = require('react');
-const ReactDOM = require('react-dom');
+import React from 'react'
+import ReactDOM from 'react-dom'
 
-const Hello = React.createClass({
-  render: function() {
+class App extends React.Component {
+  render() {
     return (
-      <div className="container">Hello {this.props.name}</div>
+      <div className="container">Hello React in ES6 style</div>
     );
   }
-})
+}
 
-ReactDOM.render(<Hello name="React" />, document.getElementById("app"));
+ReactDOM.render(
+  <App />,
+  document.getElementById("app")
+);