こわくないJavaScript

食べログ Advent Calendar 2019 23日目の記事です。

おはこんばんちは〜(なんかきいたことあるあいさつ)
食べログのフロントエンドチームにいる人です。

Advent Calenderも残すところ今日含めて3日となりました。
皆様、いかがお過ごしでしょうか。
私はいよいよ社会がクリスマスムードに包まれつつあるのを微笑ましく思っているふりをしています。
(予定がホワイトクリスマスとか言おうとしたけど滑るのでやめとく。雪だけに。)

それでは本編です。

JavaScript、好きですか

私は嫌いだよ(大嘘)

〜以下自分語り〜

社会人生活の半分ぐらいをC++, C#, Javaで過ごしてきた身からすると、なかなかつらいものがありました。
触り始めたときは基本的に迷子。
- 「型…どこ…？」
- (グローバルオブジェクトを見て)「お嬢ちゃん、迷子かい？」（迷子はお前や）
- (実行時エラーを見て)「フッ…」

JavaScriptこわい？

コワクナイヨ(暗黒微笑)
ちょっと自由奔放が過ぎたりするだけでかわいいよ
てなわけで、JavaScript触ってみたいって方はどんどんウェルカム

Q. JavaScript始めようと思うんだけど、何から勉強したら良いの？

A. TypeScriptをやれ(過激派)

嘘です。
あくまで個人の意見という予防線を張っておきますが、
ある程度JavaScriptに慣れてからTypeScript始めるのが良いと思っています。
一気に色々覚えるの大変ですもんね？

「よゆーだよ」って方はお好みでどうぞ。
こちらが沼の入り口です
よ　う　こ　そ

まあそれはそれとして、個人的にすごく役に立つと思っているドキュメントとかチュートリアル挙げておきますね。

• 現代の JavaScript チュートリアル
  • おすすめ
  • The Modern JavaScript Tutorialの日本語訳
  • 量は多いけど、これやると一通りJavaScriptで開発できるっていう自信がつくかもしれない
    • デバッグ方法、テスト方法とかも書いてあって親切
  • ぶっちゃけこれ紹介したらこの記事ほぼ終わり
  • コードを書く上での心がけ等も書いてあるので、プログラミング初心者にもおすすめしたい
• Web 入門 - ウェブ開発を学ぶ | MDN
  • Webガチ初心者ならまずこれを読むと良いと思います
• JavaScript - ウェブ開発を学ぶ | MDN
  • とにかくJavaScriptに触れてみたい人向け
  • ミニマムにJavaScriptを体験できる良いチュートリアルだと思う
• JavaScriptのコードのよくある問題を解決する - ウェブ開発を学ぶ | MDN
  • ユースケースは覚えておいて損はないです
  • とはいえ全部覚えるのは大変なのでブックマークしておきましょう

Q. JavaScriptの勉強始めたんだけど、リファレンスってどこにあるの？

A. みんな大好きMDNにあります。

JavaScript リファレンス - JavaScript | MDN
各ブラウザの対応状況も書いてあったりするので便利。
困ったらMDN、覚えておきましょう。

Q. 他の言語にある機能がJavaScriptにないんだけど💢

A. 落ち着いて…Calm down…そうだ…深呼吸して…オーケー、落ち着いたかい？

では聞いてくれ。
もしかしたらお望みの機能はBabelに実装されているかもしれない。
Babelっていうのは、ざっくりいうと、新しい機能を使って書かれたJavaScriptを古い環境でも動くよう変換してくれるツールだ。
詳しい導入方法や使用方法は割愛するが、これを使えばきっと幸せになれる。

え、Babelにも実装されていなかった…？
確かに、今はまだその機能は実装されていないかもしれない。
でも、もしかしたら、その機能は近い将来実装されるかもしれない。
ワクワクしてきたかい？そうだろう？
https://github.com/tc39/proposals
さあ、ここを見ると良い。

貴方の望んでいた機能はあったかな？

Q. そろそろ流行りのReactとかVueとかやってみたいんだけど

A. 公式のチュートリアルから手を付けるのが手っ取り早いと思います

• チュートリアル：React の導入 – React
• はじめに — Vue.js
• Angular - Angular入門： はじめてのアプリ

Q. どれ選べばいいの？

A. 価値観による(回答を放棄)

ぶっちゃけどれでも良いと思う。ビビッときたやつ選べば良いのでは。
趣味でやるなら失敗しても別のものに乗り換えられるし。
(プロダクトだと話は変わってくるので慎重になる必要はあるけど)

エンジニアとしての市場価値を高めたいのであれば、「react vs vue vs angular」とかでググれば潮流は見えるんじゃないでしょうか。
参考にこういうの置いときますね
Angular vs React vs Vue: Which Framework to Choose in 2020
どれ選んでも一定の需要はあるんじゃないですかね。

Q. ググったら出てくることしか書いてなくて全然役に立たないんだけど？

A. 最後まで読んでくださってありがとうございます。

おわり

私がJavaScript勉強し始めて困ったところをピックアップしてQ&A形式にしてみました。
まだ内容薄いのでひっそり更新するかもしれません。

皆様良いクリスマスを。

明日は @sn_____ さんの「Webpackerが提供しているコマンドの内部処理を追ってみた」です。お楽しみに。