読者です 読者をやめる 読者になる 読者になる

Develop and Design Note

フロントエンドなデザイナーの覚書

JavaScriptの修行・中間報告

JavaScript

去年10月、プロジェクトマネージャーからコーダーに戻り、JavaScriptの習得を第一の課題として、修行を積み重ねてきました。
11月にはこんな記事も書きました。

それから5ヶ月が経過し、宣言したカリキュラムは実施できたのでしょうか。スキルは上達したのでしょうか。

5ヶ月の修行で手応えを感じたこと

まずは、結論から伝えたいと思います。
学び得たこと、わかるようになったこと、手応えを感じたことです。

  1. DOM操作を生のJSで書けるようになった(実際にJS案件をスムーズに担当できた)
  2. JSの初級にあたるのは「DOM操作」で、中級にあたるには「OOP*1」「Ajax」というJSのレベル感がわかった
  3. 次世代Web技術「Web Components」の話や仕組みがわかるようになった

本当は中級のOOPができるとこまで行きたかったのですが、そこまで行けなかったのは残念。
ですが、「JSできない」から、「DOM操作ならできる」と言えるようになったのは、前を向ける一つの成果だと思ってます。

また、jQueryに頼らない生のJSで書けるようになったのも大きいと思います。
今は便利なライブラリやフレームワークが溢れていますが、それを極めることは、基礎を知らずに応用に走っているようなもので、デバッグ力や応用力など、いざという時に力を発揮できない人になってしまうと思ってます。

DOM操作を生のJSで書けるようになったことで、Web Componentsの理解も深まりました。
Web Componentsはhtmlを部品に分ける次世代の技術ですが、部品にしたhtmlをつなぎ合わせるのは、JSのDOM操作で行います。
サンプルコードなど見て、「そういうことか〜」と思えたのは嬉しかったですね。

実際にやったこと

この記事でも書いていたのですが、当初立てていた修行プランがこちら。

  1. Javaを勉強する
    • ドットインストールから始め、最終的には簡単なアプリを作る
  2. 片手間でCodeIQとCodinGameをやる

これに対して、実際やったことがこちら。

  1. Javaを勉強する
  2. JavaScriptを勉強する

Javaで簡単なアプリを作ることや、CodeIQとCodinGameはやりませんでした> < ;
実はこの修行のせいなのか、腰痛で1週間ほど歩けなくなったり、喉に潰瘍ができてしまったりと、体調をぶっこわす時期があって、1ヶ月ほど修行を休んでいた時期がありました。

効率的な学習にシフト→mixiのJSトレーニング教材

なので、もうちょっと効率的にやらないとダメだなと思いました。
そこで、Javaの深い学習は止め、また、ゲームだと「ゲームしながら」なので、どうしても余計に時間がかかってしまうということで、ストレートにJavaScriptを学べるmixiのJSトレーニングGitHubで公開されている)をやりました。

この教材の存在は、こちらのブログで知りました。

全部で7ステージあり、各ステージごとに、簡単なJSの解説のあと、テスト形式でJSを実際に書いていきます。

DOM操作が中心の内容ですが、最後の方にOOPっぽい記法だったり、他言語にはないJS特有の仕様にも触れることができるので、僕にとってはちょうど良い難易度の教材でした(もちろん最後の方はほぼお手上げ^ ^;)。
また、常に最新の仕様に沿って刷新されるているようなので、古い仕様かどうか意識しなくて良いので、その点も効率的でした。

今後の学習予定

もちろんJSの中級「OOP」の修行に移行したいと思います。できれば「Ajax」も。

今回実施したJavaの学習はOOPを学ぶためにやったので、mixiトレーニングを最初にやって、そのあとJavaの学習、という順でも良かったかもしれません。

取り組む予定の教材はこちら。

いろいろ教材を探していて気付いたのですが、もしかしたら、OOPは有料じゃないと学べないんじゃないかと思うようになりました。
いずれの学習サイトも最初は無料で使えるのですが、ある程度まで達成すると、そこから先は有料になります。

今までは有料の世界に踏み込みませんでしたが、そこには一つ壁を越えた世界、つまり、中級の世界があるんじゃないかと予想しています。

ということで、今まで非課金ユーザーとして修行してきましたが、課金ユーザー、つまり、本物の自己投資で修行を続けていくことになりそうです。
また、ここまでの学習は基本一人でやっていたので、今後は仲間を数人集めて一緒に勉強でも良いかもしれません。

目指せJSマスター!

*1:オブジェクト指向プログラミング。JavaPHPなど他のプログラミング言語で使う記法で、コードをよりメンテナブルにできる。