0.触ろうと思ったキッカケ

ササっと説明すると…

同期「React触ってんだよね」
→Vue.jsかReactが結構、話題に上がるよな
→なんか理解できた方が可能性、広がりそう（フレームワーク未経験）
→環境どうすっかな
→CodePenで書けるやんけ！勉強しよ！

この時は、まだ知らなかったんです。
「初心者にReact進める人はドS」ってことに…

1.序盤は、まぁ…普通かな？

早速、Hellow Worldで入学式を開いてみました。
まぁ…こんな感じかっといった雰囲気でした。
表示までなら、そこまで複雑じゃなかったからね（フラグ）

次に何やろか考えた時に
「昔つくったサンプル、これReactで書いたらどうなるんだ？」
そう思って色々いじることにしました。

（ここから初心者殺しだと理解し始める）

昔、DOM操作の例で作ったサンプル
チェックボックスの状態でテキストの色が切り替わる

See the Pen textID by DoNotPrayDebug (@DoNotPrayDebug) on CodePen.

流石に無策でいきなり書き始めるのはムリがある…
そう思い、今回の実装に使いそうな要素を色々、調べてみましたが…
「え、難易度…上げ過ぎじゃないですか？」

そう思わずにはいられませんでした。
まず、値の保持にはクラスを使わなきゃいけない（ここで難易度あがる）
そのために、クラスを継承しましょう（初心者バイバイやんけ）

「初心者にクラスは早い」

ある程度、理解した人なら問題なく開発できると思います。
実際、私も数時間で「心で理解できたので」
だけど、新人さんには優しくないと思いました。

こんなもんを未経験者に触らせたら
キライになるじゃんと思いましたね。

そんなことを思いながら

調べる
→動かす
→デバッグ
→調べる

この流れで何とか過去に作ったサンプルと同じ動きをする
コードがかけました（React歴、約半日の作品）

See the Pen ReactTest1 by DoNotPrayDebug (@DoNotPrayDebug) on CodePen.

…書けはしましたが、いくつかツッコミたいことあると思います。
私も色々言いたいですから。
（恥ずかしいけど、記録として、そのままを残しておきます）

もし、この記事を新人プログラマが見てましたら一言
「基本を押さえてからReactは触りなさい」

クラスまでを一通り理解できたなら、ネットの記事見ながら
開発はできると思います。
（私も自分を実験体にしてレポート出していくので）