少し前にオライリーの入門Reactを買って、読んでは止め読んでは止めの繰り返しだったのですがようやく取り掛かりました。

仕事ではjQueryでオラオラって感じなのでReact.jsを使うことはまず無さそうですが、仕事外の趣味のプログラミングでなんか作る時に使おうかなーとぼんやり考えています。

某岡本さんみたく、WP REST APIを叩いて云々とか、React Nativeでアプリ作ったりとか。

とりあえず、やったのは以下

• 入門Reactをざっくり読む
• React.jsのチュートリアルを読みつつ書く
• チュートリアルのコードを元にAPI叩く

入門Reactをざっくり読む

見出しの通り、入門Reactをざっと読みました。

とりあえず、サーバーサイドレンダリングとかテストとかその辺りはガッツリ組み始めてからで良いかなと思ったのでその辺はサラッとですが。

どんな風に組むかといった部分だけじゃなく、要素を増やすときのアニメーションについてとか、テストの方法なんかまで色々と載っていました。

とりあえず読んでみて知識を入れた上でチュートリアルっていうのはアリな気がします。

ただ、書籍が出てからバージョンが上がっていたと思うのでざっくり読むくらいがいいのかな。

React.jsのチュートリアルを読みつつ書く

やっぱ書籍読むだけだと理解は出来ないなーと思ったので、チュートリアルをやってみました。

https://github.com/d-kusk/react-tutorial

あれです。写経です。

個人的に引っかかっていたのは .props でした。

Vue.jsのときはデータはそこに有ったので、ああこれねってなったのですが、React.jsではコンポーネント自体が情報を保たない設計にするものらしく、親のコンポーネントから子コンポーネントに付ける事で渡して渡して…って感じのイメージなので、「今コレ何持ってるっけ？」とちょくちょく追えなくなってました。

多分書いてたら理解したり慣れるんだろうなぁ。

チュートリアルのコードを元にAPI叩く

以前参加したWordBench京都で、岡本さんが「React.jsのチュートリアルのコードはちょっと変えるとWP REST API叩くのにも使えます」って仰っていたのを思い出して、チュートリアル終わった勢いでそのまま組み替えてみました。

下記を叩いて返ってきたコメントを出力するというものになりました。

http://api.wp-app.org/wp-json/wp/v2/comments

まとめ

新しいものに触れるのはまだまだJS初心者の粋を出ない僕には色々と刺激になったので良かったです。

ただ、ES201xの記法がまだ理解出来てなくて、アロー関数とか使ったら躓いたのでとりあえずそっちからかな…。