Developer Roadmap 2020が公開されましたので、眺めながら今年の目標をぼやきます。
量が多いのでとりあえずFrontendから。
Table of Contents
- 2020のRoadmap Frontendの特徴
- React
- TypeScript
- Web Security Knowledge
- CSS in JS
- Web Components
- CSS Framework
- SSR
- Static Site Generators
- 結論
2020のRoadmap Frontendの特徴
Web Developer Roadmap 2020版が出ていたので2019版と比較でご紹介があるとおり、今回のRoadmapはフロントエンドの変化が大きかったと思います。
まぁ、フロントエンド技術はラットレースとか言われてますよね。
（失礼な表現だと思いますが、そう揶揄されるだけの技術の陳腐化が早い側面は間違いなくあると思います。）
さて、今年は何を勉強しますかね？
React
React勉強しておけばええんやで～感すごいっすね。
VueやAngularもオプションとしてはあるみたいですが、初学者はReactでええと。
個人的にはVueはComposition APIが正式採用されるまで新しい技術の修得は待ちかと思ってますが、日本では一休.comさんがNuxt.jsを採用したこともあり、Nuxt.jsのイケイケ度が上がっている気がします。
Vue.js・Nuxt.jsを導入している企業・サービス一覧
すっごーい！Nuxt.jsが好きなフレンズなんだね！
（なぜ今、2020年にけものフレンズなのか、それは私にもわからない。思い出してしまったので・・・。）
しかしながらNuxt.js人気は世界を見通したらNext.jsと比べるとでもないというのが下記リンクから読みとれます。
Backend Frameworks JavaScript on the server.
小規模案件はVue、大規模案件はReact、なんて分け方はもはや古いのかもしれませんね。
Angularは触ったことがないのでよくわかりません…。
とりあえずReact勉強します。
Reduxも健在ですが、Hooksのほうが私は好きです。
TypeScript
ReactといえばTypeScript、と田舎のおばあちゃんも言うくらい、TypeScriptが来てます。
TypeScriptの恩恵が受けたいからReactという人もたくさんいるくらいです。
VueでTypeScriptってデコレーターバンバカでなんちゃって感ありますから、こちらもComposition APIの正式採用まで導入は控えてもいいかもです。
Flow
FlowなんてFacebookさん以外使ってるのみたことないので非推奨はまぁそうなのかもしれません。
Proptypes
Reactで型チェックといえばProptypesと田舎のおばあちゃんが言ってた時代もありましたが、そんなもの使ってると都会っ子に笑われるぞ！
ちなみにこのブログはJS＆Proptypesです。ゴミです。
Web Security Knowledge
今年からの追加らしいです。
フロントエンドのエンジニアたるもの、当たり前ですよね!?
といいながら案外詳しくない人も多いのも実状。
インフラエンジニア上がりの私的には知ってて当然、なんですがセキュリティに限らずサーバー技術やネットワークに弱いエンジニアは多い気がします。
昔、BBSとかにポップアップばっか出すへんなJS埋め込んだ遊びとか知らないんですかね…。
つくづくおじさんになったと感じます。
CSS in JS
こちらも流行っていますねー。
Styled-componentsが個人的にはおすすめだと思ってますが、ちゃんと触っていないのでここはほとんど未知の領域です。
BEMでSassがスタイルの王道だと思っているおじさんはいまでもSassです。このブログもそうです。
ブログからStyled Componentsに切り替えますかね・・。
(CSSはCSSで分かれていたほうがわかりやすいと思うのは私だけでしょうか・・・。)
Web Components
こちらも完全未知領域です。
そもそもどんな技術かもよくわかってません。勉強不足です。
CSS Framework
Tailwind CSSは気になってましたが触ったことないです。流行ると思ってましたがオプションになっていました。
Material UIは別のフロントエンジニアとお話ししたときに、めっちゃ言っていたのでこれで作ってみるかな？
ちなみにこのブログはBootstrapでできてます。古参な技術ですがなんだかんだこれなんだよなぁ感あり。ブログの技術スタックの詳細も別記事でまとめています。
Bulmaは個人的に好き。
SSR
やっぱジャイアンツ Next.js
Reactの進行は止められない!?
まぁ、SSR自体には私懐疑的なので勉強しませんがね。
（SEOに役立つといわれているがGoogleのボットJS読めますし）
SSRは必要？Javascriptで構築したSPAサイトのSEOを考える
Static Site Generators
来ました!!Gatsby.js!!このブログの技術です!!
引き続き勉強します!!!
Vuepressもドキュメントサイトを作るなら個人的にはおすすめです。
結論
今年はフロント技術は以下を学びます!!
- Reactをしっかり理解する
- Reduxはちょっと否定派なので嗜み程度でHookで実装する
- CSS Frameworkは勉強する
- Styled componentsを使いこなせるようになる
tubone24にラーメンを食べさせよう！
ぽちっとな↓
