自分にとって未知の技術、なんだか怖い。
いずれ身に付けなければならないとは思いつつも、とても難しいものに思えてなかなか踏み出せなかったです。しかし考え方を変えてみたらあっさりとその壁を乗り越えて次の段階へと自分をステップアップさせることができました。
考え方の面から誰かの助けになればと思い、初投稿します。
この記事について
JavaScriptについてjQuery全盛期に学習した後、技術的に停滞していた自分がついにReactに触れて個人アプリを作るようにまでなったので、その体験を簡潔に書きます。同じような境遇の人にとって新しい一歩を踏み出せる助けになると嬉しいです。
想定している読者は「ある技術を過去に習得したがレガシーになりつつある人」や「新しい技術を学んだ人が羨ましいが尻込みしてしまっている人」など、新しいことに焦燥感を抱えている人です。
jQuery時代に取り残された焦燥感
jQueryが悪いという意図はありません
私は社会人となる前の「JavaScriptのライブラリといえばjQuery」という時代にJavaScriptを学びました。それから社会人となりSES系の企業に就職しましたが、幸か不幸かそこは既に習得している技術だけでほとんどの業務をこなせるような技術水準の環境でした。
時折目にする統計では既にAngularやReactといった次世代のライブラリが主流になりつつありましたが、JavaScriptを触る機会があっても採用されているライブラリはjQuery1.8などで、周りを見渡しても同じような状態で誰も次世代ライブラリを触っていません。
QiitaなどでJavaScriptに関する記事のトレンドを見かけることがあってもjQueryが登場することはなく、「新入社員がReactで何かを作ってみた」というような記事が目に飛び込んできては眩しい思いがしていました。
いずれ今の自分の技術が通用しなくなることが薄々理解していながらも、ちょろっと見るだけでは全く理解できそうになく見えた次世代ライブラリを避けるように現状に甘んじていました。
Angular/React/Vueの中でAngularの人気が落ちてきた、という記事を見ては「Angularの時代を乗り切ったのだからjQueryで繋ぎつつ次の時代から飛び級してやるぜ」という謎のスマートフォンの機種変更のような心境でいました。
それでも本当にこれでいいのか、将来の自分のキャリアに満足できているだろうかという不安を抱えていました。余談ですがこういった焦燥感を抱くことを「クオーターライフ・クライシス」と呼ぶそうです。
新しい考え方がひらめき一気に変わった
いささか乱暴です
そんなモヤモヤを抱えながらシャワーをしていたある日(といっても最近です)、自分の中に新しい考え方が水と一緒に降ってきて、一気に新しい技術(React)への恐怖心がなくなりサクサクと技術習得が進んでいくようになりました。
経験のなかった新人にできて自分に出来ないわけがない
言葉は悪いですがこの考えに至りました、私は根拠もなく自信が持てる人間ですので。
よくよく考えてみればプログラミングの世界において、人気で主流となる新技術というのは原則として従来のものよりも便利で簡単に扱えるからです。従来のモノ(jQuery)よりも便利で簡単な新しいモノ(React)が登場したから時代が変わったのです。
であればjQueryが扱えるようになった自分が、より楽に色々できるReactを扱えないはずがありません。自分より若く経験も浅いどころか、未経験だった新社会人が次々と習得できているのですから。
実際、Reactで何個か個人アプリを作ってみましたが完全に理解しました。
⇒もしかして：ダニング＝クルーガー効果
考え方に関してはここまで、いったんまとめ
要するに、同じような境遇の人に伝えたいことは以下です。
- 主流となる新技術は従来よりも便利で簡単だからこそ主流となった。だから従来のものを習得できたあなたに新しいものが習得できないはずがない。
- 未経験だった人でも習得して仕事に出来ています。
ここまで読んでくれた方、ありがとうございました、よければ最後まで。
次は簡潔にjQuery時代からReact時代にステップアップした手順を書いていきます。
jQueryからReactに行くためにやったこと
- Reactのチュートリアルを愚直にやる
- Next.jsでウェブサイトを作る
- Next.jsのブログテーマを作る
- npmへReactコンポーネントの公開もした
以上です。勉強するライブラリは悩みましたがReactが人気のようだったのでReactを勉強することに決めました。そしてせっかく勉強したのですからReactを使った作品を作ろうと思い、ReactをベースとしたフレームワークNext.jsを使用してアプリを作り実践としました。
React公式チュートリアル
Reactの公式チュートリアルは本当に優秀なチュートリアルです。
これまでの私はQiitaなどの入門記事を読んでは難しそう、で引き返していましたが大本であるReact公式のチュートリアルへアクセスし、そこに書かれている通りに簡単なゲームを作りました。手取り足取り説明が書かれているのでやることが明確にわかりました。
(実はこの時、英語表記でGoogle翻訳を有効にしながらやっていたのですが、公式に日本語表示があったようなので今からやる人は日本語表示が良いと思います)
なんとなくReactはコンポーネントという部品の組み合わせで表現する仕組みで、不変な引数Propsと可変な状態を表すStateであることが分かるようになりました。Stateの相互作用についてもドキュメントが非常に理解の助けになりました。
Next.jsでウェブサイトを作った
Reactで何か作りたいと思い探したところ、Next.jsというフレームワークが手軽に自分のウェブサイトをReactで作成して公開することが出来ることが分かりました。
私は趣味でアメリカ株への投資を行っているので、決算情報をグラフィカルに表示することのできるウェブサイトを作ってみることにしました。Next.jsのチュートリアルをやった後、作ってみました。このチュートリアルも非常に分かりやすかったです。
これでなんとなくコンポーネントの作り方が分かってきました。Atomic Designというデザインパターンにも出会いましたが、よく細分化の粒度が理解できず粗削りな状態ですが一旦形になったので満足しています。
Next.jsのブログテーマを作った
実は個人ブログを Infoseek ⇒ livedoor ⇒ WordPress ⇒ Hugo と渡り歩いてきた私です。いつもカスタマイズをせずにいられなかった私は身に付けたばかりのReactでオリジナルデザインなブログを作ることにしたく時を開けずにNext.jsでブログテーマを作ることにしました。
Reactコンポーネントをnpmパッケージとして公開した
せっかくなのでブログテーマを作る途上で作成したブログパーツをnpmパッケージとしても公開してみました。これも初めての体験でした。
まとめ
このように出来るはずだと思い立ち、チュートリアルで学んだことを何かしら自作アプリを作ってみることで、ある程度新しい技術を定着させることができたように思います。
学んでいる最中は久しく忘れていた未知のものに触れて扱えるようになっていくワクワク感がありました。(初めてHTMLにスタイルを付けて、文字色を変更できた時のことを思い出しました)
まだまだReactのstateのリフトアップやHookについての理解度が足りないという事が課題と感じていますが、明らかにjQueryしか扱えなかった頃の自分よりスキルアップすることができているのでモチベーションも高くなりました。(同じロジックでTypeScriptやWebPackの学習も始めました)
ぜひ同じように新しいことへの挑戦に尻込みしている人がいれば、新しい技術は怖くないよ、ということで一歩踏み出してみる助けになれたらと思います。読んでいただきありがとうございました。