Reactマスターへの道、1日目

最近新しいWEBアプリを開発する必要がありフロントエンドをReactで開発することが決定した。

Reactができるフロントエンジニアがいないので、自分がやるしかないため、急ぎReactを勉強し始めたわけだが、、

うむ

さっぱりわからん。

とりあえず、得意のドットインストールで全体像を掴む。

やはりわからん。

qiitaの記事を見てみる。

出来る限り短く説明するReact.js入門

ふむ、さっぱりわからん。

なんか効率的にUI設計ができるらしいが、どう見ても複雑に書いているようにしか見えない。。。。

次にこの記事を見てみた。

Facebookが作ったJavaScriptライブラリ、Reactの威力を体感する

とりあえずlocalserverで動かしてみる。

<!DOCTYPE html>
<head>
  <meta charset="UTF-8" />
  <title>Hello, React!</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script>
</head>
<body>
  <div id="content"></div>
  <script type="text/jsx">
 
// コンポーネントを定義
var Hello = React.createClass({
    render: function() {
        return (
            <h1>Hello, React!</h1>
        );
    },
});
// コンポーネントを描画
React.render(<Hello />, document.getElementById('content'));
 
  </script>
</body>

これをreact.htmlとして保存。

実行結果は、、、