フロントエンドエンジニアになってからお世話になってる教材【Vue / Nuxt】

• フロントエンドの勉強で使えるいい学習本が知りたい
• 実務で実際に役に立つ本はないかな
• たくさん教材があってどれがいいのか選べない

今日はこんな悩みを解決していきます。

筆者である僕は未経験からフロントエンドエンジニアとして自社開発企業に転職しました。そんな僕が入ってから思う、この書籍はよかったな〜というものを一部ご紹介します。

もし教材選びで悩んでる人がいらっしゃいましたら参考にしてみてください。

先に結論：初心者フロントエンドエンジニアにおすすめの書籍【Vue.js / Nuxt.js 版】

それでは具体的にそれぞれ解説していきます

おすすめ書籍1つ目：JavaScript Primer

書籍といいながら早速Webサイトの紹介になりますが、、、

こちらのJavaScript PrimerはピュアのJavaScriptの記法を一から丁寧に教えてくれる教材になってます。

そもそもフロントエンド開発で使う主要な言語は

• HTML
• CSS
• JavaScript
  • TypeScript
  • React / Next
  • Vue.js / Nuxt

などになります。モダン開発だとReact, Vue.jsがよく現場では採用されてますが、そのどちらも元を辿るとJavaScriptになります。

JavaScriptの仕様や言語の理解があった上でこれらのモダンフレームワークを学習することでスキルの向上は格段によくなります。

僕は2022年6月にフロントエンドエンジニアとして未経験から転職しましたが、入社当初はまずJavaScript Primerの第一章をひたすら読んでコードを書くことをしました。

基本的な文法からよく丁寧に解説されているのでとてもおすすめです。目で見て読むだけでなく必ず出てきたコードは実際に手を動かして実装するのを推奨します。

プログラミングはいかにアウトプットの量と質を上げるかでその人のスキルが大きく左右されます。

何も考えずに書く作業は質が悪くなるので最初はインプットから入りますが、それも全て「いいアウトプットを出すため」と言う意識を持つようにしてます。

おすすめ書籍2つ目：CSS設計完全ガイド

こちらの本はCSS設計の有名な手法をたくさんのサンプルコード付きで解説してくれてるものです。

500ページととてもハードな内容になってますが、これらを踏襲することで格段とCSSの設計知識が増え、保守性の高いコードを書くことができます。

設計で重要なAtomic Designの話から、いいコードの定義を8つのポイントで解説されていて、どれもフロントエンド開発に必須の知識になっています。

Amazonでチェックする

3つ目：Vue.js&Nuxt.js超入門

JavaScriptのフレームワークで、より簡易にWebアプリケーションを実装できるために開発されたものがVue.jsです。

こちらの本は、Vueの基礎の基礎であるv-on, v-bind, v-if などのディレクティブ、基本概念であるコンポーネントの解説、それらを使ったアプリケーションの開発、さらにVueをより使いやすくしたNuxtやそこに付随するVuexといったライブラリも一通り学習することができます。

難しい技術書というよりはライターの方のわかりやすい解説がいい印象があるので初学者にとてもおすすめです。

現場の開発では、Vue単体で開発することはほとんどなく、Nuxt、Vuex、Routerなど周辺のライブラリも同時に実装されていることが多いためそれらをざっと学習する上でもとても役に立ちます。

Amazonでチェックする

4つ目：Vue.js入門

こちらの本は、3冊目を読み終わった人が次に読むといい本です。

より深く複雑な開発を実現させるために必要な知識を網羅することができます。

豊富なサンプルコードがあるので自分で実装しながら読み進めるのがおすすめです。

Amazonでチェックする

5つ目：プロを目指す人のためのTypeScript入門

JavaScriptのスーパーセットであるTypeScriptを学ぶのは現代のモダン開発ではほぼ必須となってます。

TypeScriptを導入することで型定義をし、保守性の高い規模の大きい開発ができるようになります。

この本は400ページと豊富な情報が詰まっており読むことで一通りのTypeScriptの知識を身に付けることができます。

Amazonでチェックする

6つ目：リーダブルコード

最後に、フロントエンド開発に関わらず必要な知識として「いいコードとは何か？」というものがあります。

このリーダブルコードは全エンジニアが1度は読んだことがあるというくらい教科書のようなもので、保守性に優れた堅牢なコードを書くために必要な知識を身に付けることができます。

開発は「まず動かす」ことが最優先ですが、長期的に考えた時に「保守性の高いコードを設計する」ことはとても重要になります。

誰が見てもわかりやすいコードを書くために一般的に最低限必要なコードを書く上でのお作法をこの本で身につけたいですね。

Amazonでチェックする

まとめ

いかがでしたでしょうか。僕自身まだまだ見習いの身分で大きな口では言えないですが、どれも現場で仕事をする上で役に立った本ばかりなのでぜひ一度拝読してみてはいかがでしょうか？

経験者になれば不要ですが、未経験の時は特にどの教材がいいのかといった判断から難しいと思うので参考にしていただけたら幸いです。

今回は以上です。