はじめに
この記事は、2023年下期に自己研鑽として取り組んだことをまとめた記事です。
2023年11月時点の自分のスキル
フロントエンドエンジニアのロードマップを元に自分のスキル分析を行いました。
分析結果の概要
- インターネット関連
- 全体的に知識が不足している
- HTML
- 実務経験ありだが、アクセシビリティ/フォーム&バリデーションの知識はない
- CSS
- 全体的に実務レベルで問題なさそう
- Javascript
- 重点的な学習が必要
- Git
- 全体的に実務レベルで問題なさそう
- Package Maneger
- 業務で使っているけど実はあまりわかっていない
その他画像でグレーアウトしている部分も現状のスキル感を洗い出したが、全体的に「足りていない」の一言だったため省略
スキル分析を元に設定した学習テーマ
足りていないスキルと自分の業務内容から優先順位が高いものから取り組むことにしました。
優先順位①：コードレビュー力の向上
- Javascript
- 毎月プチ制作物を作成
- JS基礎力を磨く
- 可能であればレビューしてもらい、レビュー観点も学ぶ
- Udemyの動画を視聴
- 【JS】ガチで学びたい人のためのJavaScriptメカニズムを視聴し、JSの基礎知識を身につける
- 毎月プチ制作物を作成
- HTML/CSS
- チームメンバーとコード談義をする
優先順位②：基礎知識を身につける
- インターネット
- インターネットがどのようにして動いているのか
- ブラウザの仕組み/レンダリングの仕組み
- HTML
- フォーム&バリデーション
- アクセシビリティ
- package manager
- npm/yarnとは
実際に実施したこと
優先順位①：コードレビュー力の向上
Javascript-毎月プチ制作物を作成する
12月：ToDoリストを作成
1月：非同期処理のアウトプットでくじ機能を実装
2月：クラス構文のアウトプットでイーブイ育成機能を実装
3月：フォーム&バリデーションのアウトプットでフォーム機能を実装
最終的な成果物
※3/19現在、フォーム&バリデーションはレビュー対応中のため未マージ
プレビュー環境はこちら
Javascript-Udemyの動画を視聴
入社後3ヶ月程度で視聴したことがあり、その時は途中で挫折してしまっていたが今回は【おまけ】Vueのメカニズム以外のセクションを全て視聴することができた
HTML/CSS-チームメンバーとコード談義をする
3月末から実施することとなった
優先順位②：基礎知識を身につける
インターネット
インターネットがどのようにして動いているのか
ブラウザの仕組み/レンダリングの仕組み
3月末までに対応したい 4/14(日)に無事公開
HTML
フォーム&バリデーション
アクセシビリティ
アクセシビリティはMDNの記事を途中まで読んだが力尽きた。
package manager
npm/yarnとは
半年間の自己研鑽を通して学んだこと
総評
- 学んだことを実装で試してみようという気持ちになれた
- 学ぶ→使ってみる→実際に使えた！楽しい→もっと学びたくなる、の循環が回せたのはよかった
コードレビュー力向上-Javascript
Udemyの動画で仕様を理解しつつ、制作物でアウトプットし、先輩メンバーにレビューいただくことでより理解が深まったと思います。
一つずつ書き出すとキリがないのでパッと思いつくことのみ記述しました。
- 今まで「なんとなく書ける」状態だったところから、Udemyの動画視聴を通して「このような仕様になっているからこの書き方をすれば良い」と理屈が理解できるようになった
- 繰り返し処理の内部で
const宣言している変数ってletじゃなくてもいいんだな〜
→そもそもブロックスコープが違うから干渉しない - etc…
- 繰り返し処理の内部で
- コンストラクタ関数、反復処理、非同期処理、オブジェクト操作など「よくわからないな〜」と思っていたものの仕組みを理解できた
- 分割代入を完璧に使いこなせるようになった
- マインド・姿勢
- JS Docで型を書くことに慣れた
- 似ている機能は共通化しようとする姿勢が身についた
- 関数は外部変数を使わず、引数のみを利用しようとする姿勢が身についた
基礎知識を身につける
実は気になっているけどわざわざ調べていないことも勉強してみることで知識の幅が広がると感じました。
- 何わからない、知識が足りていないという焦りがあったが、インターネットの概要は元から知っていたり、実は意識していないだけで土台部分は積み重なっていることに気づけた
- フォーム&バリデーションについては初めて学ぶことばかりでかなり勉強になった
- MDNに載っているコードを模写するのも効果があったと思う
半年間自己研鑽を行った結果
- インターネット関連
- インターネットとは done
- ブラウザの仕組み 3月末までに取り組む
- HTML
- フォーム&バリデーション done
- アクセシビリティ 今期できなかったので来期取り組む
- マークアップのコードレビュー
- 3月末からチームでコード談義を行う 継続して取り組む
- Javascript
- 予定していた取り組み done
- Package Maneger
- npm/yarn done
まとめ
半年やったことを書き出してみると思ったよりいろんなことをやっていて「がんばってきたな」と思えました。
社内のSlackに進捗をこまめに報告するようにしていたのですが、それに対してスタンプ等で反応をいただけることが自分のモチベーションにつながっていたと思います。温かく見守ってくださった方々に感謝の気持ちです。
特にコードレビューでコメントしてくださった方のおかげでかなりJS力が身についたかなと思います。本当にありがとうございました！！
余談：2024年上期にやること
- インターネット関連
- HTTPとは
- ドメインネームとは
- ホスティングとは
- DNSとは
- HTML
- アクセシビリティ （2023年下期から後ろ倒し）
- パフォーマンス
- CSS
- コンテンツモデルについて
- マークアップレビュー力向上 （2023年下期から継続）
- Javascript
- DOMとは
- ECMA Scriptの仕様周り（2023年下期から継続）
