フロントエンドエンジニア初心者に送る、とりあえずこれ読んどけってドキュメント

2021-09-14

今回は React に限らず、フロントエンドエンジニア初心者の方向けのドキュメントを紹介していこうと思います。

The State of JavaScript Survey

世界中のフロントエンドエンジニアに対し、JavaScript に関するアンケートを取った結果を報告してくれるサイト。

毎年更新されており、フロントエンドに関する技術の移り変わりの早さが確認できると思います。

ただ全体的にハイクラスなエンジニアがアンケートに答えているようで、結構レベルが高めな印象を受けます。

メジャーさとモダンさの両方を兼ね備えた結果ではあるのですが、ちょっとモダンよりな回答もちらほら見受けられます。

トップページ以降は有志の方により日本語化されているので読みやすいと思います。

ちなみに去年は自分も参加しました。

上記の CSS 版です、こっちのほうが歴は浅いのかな？

CSS も日々アップデートされているのですが、JavaScript と比べて日本語による最新の情報を見つけるのはかなり厳しい印象があるので、こういったサイトはありがたいです。

ただしこちらはウェブデザイナーや UI / UX デザイナーも参加しているため、回答についてはモダン全振りという印象は受けないです。

ただ一方でまったく知らない CSS の知識がバンバン出てくるので結構面食らったり、日本の CSS がいかに遅れているかがわかります。

各用語に関する説明は乗っていないので、1 つ 1 つ調べて理解を進めていけば、かなりモダンな知識が得られそうな感じです。

ちなみにこっちも参加してたり。

フロントエンドディベロッパーになるためのロードマップです、スター数は現時点で驚異の 17 万超え。

フロントエンドエンジニアになりたければ、このロードマップの上から下に向けて、推奨されているものを 1 つずつ勉強していけば大丈夫です。

本当に推奨している技術のチョイスが良いので、このロードマップ以外何も信用しなくても良いほどです。

ちなみに React 版もあるので、React を用いたエンジニアになりたい場合はそちらもぜひ。

HTML や CSS に関するコーディング規約ってあまり目にしないのですが、Google は公式のものが公開されています。

かなり昔から存在しているので内容が新しいかわからないのですが、全体的にかなり良い規約にまとまっている印象です。

Google の規約に共通している思想として、とにかくまよわない設計というものがありまして。

プロパティはアルファベット順で書くなど、誰が見てもぱっと理解できるようになっているのは本当に良いことだなぁと。

一応 Stylelint にも上記の規約に則ったメジャーなものが存在しますが、使い勝手はそこそこといった印象でした。

よく初心者エンジニアの方と話をすると、エビデンスに Qiita や Zenn、個人ブログなどを挙げられる方が多いですが。

個人の書いたドキュメントが正しい保証なんてどこにも存在しないので、エビデンスとして挙げるのはやめましょう。

いずれの技術であったとしても、まずは公式サイトを参照するクセをつけることがとても大切です。

HTML や CSS に始まり、フロントの技術についてわからないことがあれば MDN で調べるのが個人的には 1 番オススメかなーと。

パッケージレベルであれば npm や GitHub を参照するようにしましょう。

とくに日本語の Google は公式サイトにたどりにくい印象があるので、英語の Google で調べると良いと思います。

そんな感じです。

他にもオススメのドキュメントがあったら追記しようと思います。