見ながらやるから分かる！英語のJavaScriptチュートリアルビデオでプログラミングを学ぶ！【概要編】

プログラミングを勉強しようとしてまず手始めにやるのは参考書を読むかYouTubeのビデオを手あたり次第見ることです。もちろん日本人によるコンテンツはたくさんあるのですが、もし英語を理解できたら何百倍もの優良なコンテンツから知識を吸収できます。

良質なプログラミングのチュートリアルビデオは具体的な操作手順や図解で概念を解説したりと、英語があまりわからなくてもある程度はついていけるコンテンツが多いのです。つまり、目で見るものと耳で聞くものを関連させて理解できるので、英語に関して言うと単にフレーズを覚えるよりはるかに効率的です。ましてやプログラミングも理解できるならまさに一石二鳥！

そこで、実際のビデオチュートリアルの中身を解説しながら、

✅ 英語のコンテンツをどう聞いていけばよいか
✅プログラミング英語に使われる表現

について解説していきます。もちらろんJavaScriptについても説明します。

今回取り上げるのはProgramming with Moshというチュートリアルを作っているMoshさんのJavaScript in 1 Hour（１時間で理解するJavaScript)です。

Moshさんのプログラミングチュートリアルは様々な言語（Java, JavaScript、C#、Pythong, Node.js、Reactなど）を有償・無償で紹介していますが、何と言っても彼の英語がとても聞きやすいのが特徴。内容や解説もシンプルで、ほとんどのビデオがミリオンビューになっていることからも品質の良さがわかると思います。

ここでは１分以内の短いセクションに分けていきます。皆さんは次のステップで取り組んでみて下さい。

❶ まずはセクションのビデオを自分で聞いてみる
     ✓各セクションでリンクされたビデオは該当箇所からスタートします。
❷ まずは英語を気にせず、話のポイントをつかむ
❸ ここでの解説を読んで細かい英語の表現を理解する
❹ もう一度セクションを聞き直して確認する

セクション１：チュートリアル概要

まず冒頭の20秒ほど、次の画面が出てくるところまで聞いてください。

ここはこれが聞けたらOKです。

four frequently asked questions (４つのよく聞かれれる質問)

frequentlyは「頻繁に、よく」という意味です。

例：Do you go to the restaurant frequently?
   そのレストランはよく行くの？

聞き逃したとしても、画面で四つのポイントを表示してくれているので、なんとなく「四つの項目について話すんだな」というのは理解できます。

この概要部分ではJavaScriptについてよく聞かれるポイント４つを解説しています。

１．What is JavaScript?（JavaScriptって何？）
２．What can you do with it？（それで何ができるの？）
３．Where does JavaScript code run?
    （JavaScriptのコードはどこで実行される？）
４．What is the difference between JavaScript and ECMAScript 
    （JavaScriptとECMAScriptの違いは何か）

What can you do with itのwithは「いっしょに」ではなく「それでもって」という意味。

例：What are you going to do with it?
それで何をしようっていうんだい？

runは「走る」ですが、プログラミングコードが「走る」というのは「実行される」ということです。

例：My code doesn't run on Mac.
   僕が書いたコードはMacでは走らないよ。

differenceは「違い、差」のこと。

例： I can't tell the difference between programming and coding.
プログラミングとコーディングの違いがよくわからないよ。

そこでこう締めくくっています。

Let's start with the first question, "What is JavaScript?"
では最初の質問、「JavaScriptって何？」から始めましょう

セクション２：JavaScriptって何？

What is JavaScript?の解説部分です。次のリンクをクリックするとその場面からスタートします。

ここは次の画面での解説が終わるところまでです。

ここで聞いてほしいポイントは、

1.  ...one of the most popular, widely used programming languages
2.  ...growing faster than any other languages
3. ... an average salary of JavaScript developers in the United States 

widely usedは「広く使われている」の意味。

例：It's widely known that you can't make money out of gambling.
   ギャンブルでお金を稼げないということは広く知られていることだ。

grow fastは「急成長する」。

例：This new business is growing very fast!
   この新しい商売はものすごく急成長している！

ここでプログラミング言語のランキングが出てきて、図を見るとJavaScriptがトップです。そこで使われている表現が、most popular, widely usedとかgrowing fasterというものです。話の中身とビジュアルと英語表現がつながって頭に入ってきませんか？

そして次に出てくるのがこのスライド。average salaryというのが聞き取れましたか？

average salaryは「平均の給与」。そう、アメリカでのJavaScript開発者の平均年収は7万2千ドル、およそ800万円ということです。もちろんこれは都市によって異なるので、多いところは１千万以上（ドルでは10万どるなのでsix digits【６桁】と言うこともあります）。

そして最後のスライドでは、JavaScriptを習得すると様々な役割をカバーできるという話。ここは技術用語が出てきますが、プログラミングをやるなら理解しておかなければならない概念です。

✅ Front-end （フロントエンド）というのはユーザーと接する部分のことで、アプリの画面デザイン（UI:ユーザーインターフェース）やWebサイトなどのことを指します。
✅ Back-end（バックエンド）というのはユーザーが見えないサーバー側のデータベースや仕組み、データの流れなどを指します。
✅ Full-stack（フルスタック）のスタックとはシステムのデザインのレイヤー（層）のこと。料理も仕込み、調理、盛り付けなど役割が分かれることがありますが、それと同様で、それぞれをStackと表現します。Full-stackというのはどこでも対応できる開発者のことを言います。

このセクションでは次のポイントがざっとつかめれば十分です。

✓ JavaScriptは最も需要のあるプログラミング言語
✓ NetflixやWalmartなど大企業もシステム開発で使っている
✓ JavaScript開発者の稼ぎがいい
✓ すべてのスタックに対応した言語

セクション３：JavaScriptでできること

次にWhat can you do with JavaScript?のセクション。次のリンクをクリックするとその場面からスタートします。

前半のポイントはなかなか難しいですが、ポイントとなるフレーズが聞ければよく理解できます。まず、

JavaScript was only used in browsers to build interactive web pages.
JavaScriptはインターアクティブなWebページを作るのに、ブラウザの中だけで使われていた。

このonly（～だけ、のみ）というのは強調したい時だけに使うもの。つまりonlyという言葉自体が重要なのです。Only周辺は聞き逃せない箇所であることが多いので覚えておいてください。

ここはかつてのJavaScriptはWebサイトに動きを入れるためだけに使われていたちっぽけなもの（a toy language = おもちゃみたいな言語という表現も出てきます）だったということです。そうなると「ところが今は…」という話が続くはずですよね。案の定こう言っています。

...but those days are gone
でもそんな時代は終わった

those days are goneはそのままだと「日々が行ってしまった」ということですが、
つまりは「そんな日々は過ぎ去った」ということです。

例：We went on a trip every month. Those days are over.
   かつては毎月旅行に行っていた。そんな日々はもう終わりだ。

では一体何が起きたのかというと、

... huge community support and investments by large companies
大きなコミュニティーのサポートと大企業の投資

日本語で「コミュニティーサポート」というと、どうも近所のおじさんやおばさんか何かしてくれるみたいなイメージが出てきますが、ここでは”開発者のコミュニティー”、つまりJavaScriptを使う開発者が様々なスタックで使えるようなプラットフォームやライブラリなどを作り出してくれたという背景があります。そんな事実をここでは指しています。

そこでJavaScript Today(今日のJavaScript）というスライドに入り、そこではJavaScriptがこんなものに使われているという例を挙げています。

✅ Full-blown web and mobile apps: 

Full-blownは「本格的な」という意味。Full-scaleなども同じ意味で使います。

例：I'll come up with a full-blown project plan by next week.
   来週までに完全なプロジェクトプランを立てるよ。

✅ Real-time networking apps: リアルタイムネットワークアプリとはチャットなどのこと。ちなみにアプリケーションの省略は日本語は「アプリ」、英語は"apps"です。
✅ Command-line tools:は文字通りコマンドラインツール
✅ Game：そしてGame

セクション４：JavaScriptはどこで走る？

ここもちょっと技術的な話なので難しいですががんばって聞いてみてください。これまで同様、次のリンクをクリックすると該当箇所からスタートします。

まずは図解の左側、JavaScriptがブラウザ内だけで走るものだったという話です。

ここでこの説明が理解できましたか？

..every browser has what we call JavaScript Engine that can execute JavaScript code.
すべてのブラウザはいわゆるJavaScriptエンジンというものを持っていて、JavaScriptコードを実行することができます。

what we callは「いわゆる」で、so calledも使いますが、単にcalledと言うこともあります。

例：I write code with a famous tool, called Visual Studio Code.
   Visual Studio Codeという有名なツールを使ってコードを書いています。

一方、executeはrunと同様「実行する」という意味です。

そのエンジンとして例に挙げているのがSpiderMonkeyやV8です。こうしたJavaScriptを走らせるエンジンが各ブラウザにあるという話です。

その次に図解の右側の解説に移ります。Ryan Dahlという開発者が作ったNode.という仕組みで、JavaScriptがどこでも走るようになったという話。

Now we can run JavaScript code outside of a browser.
そこでJavaScriptがブラウザの外で走らせることができりょうになった。

So, in a nutshell, JavaScript code can be run inside of a browser or in Node.
要は、JavaScriptはブラウザ内でもNodeでも走らせることができる。

in a nutshellは「要するに」「簡潔に言えば」という表現で日常会話でよ～く使います。
特にプレゼンなどでいろんな複雑なことを説明した後で、「まあ要するにですね…」などと言いたい
場合にこの表現が使えます。

ということで、このセクションは、JavaScriptがブラウザ内だけではなく、Nodeによってどこでも通常のプログラミング言語として使えるようになったというポイントが理解できればOKです。

セクション５：JavaScriptとECMAScript

内容的にここは重要ではありませんがいくつか表現を拾っていきます。そもそもECMAScript（エクマ スクリプトと読みます）を知らない人がほとんどでしょう。次のリンクをクリックして聞いてみて下さい。

ここはこのグラフが出てくるところまでです。

まず最初にECMAScriptの説明をこうしているのが分かりましたか？

ECMAScript is just "a" specification.
ECMAScriptは単なる仕様にすぎない。

この"a"をアではなくエイと発音しているのに気がづきましたか？ これは「一つの」ということを強調して言う場合はこういいます。

例：Hi is just "a” player in the team. Nothing special.
   彼はチームでは一人の選手に過ぎない。何も特別ではない。

​発音は、「ヒー イズ ジャスト エイ プレイヤー…」となります。

specificationは「仕様書」の仕様です。略してスペック（spec）とも言います。口語では動詞「スペックを書く」をspecing（スペッキング）とまで言います。

例： Just specing would take a couple of weeks. 
    スペックを書くだけでも数週間はかかるよ。

それに比べてJavaScriptはその仕様を”実装”したものだと言っています。

JavaScritp is a programming language that confirms to this specification.
JavaScriptはその仕様に準拠したプログラミング言語だ。

confirmは「確認する」という意味ですが、「仕様に対して確認する」というのは「準拠した」「従った」という意味になります。

例： I need to confirm if the data is available.
    データが使えるのかどうか確認しないといけない。

ここはECMAScriptがどのような変遷をたどってきたのかという話なので、つまらない内容です。そこでMoshさんも、

Alright, enough theory?
もうお話しは十分だよね。

enoughは「十分だ」ということ。That's enough!は「もううんざりた」という表現。

例：Oh, enough meat!
   うわー、肉はもう十分だよ！

焼き肉の食べ放題に行って最後にこう言えるかもしれませんね。

いかがでしたか？

このセクションのまとめ

このセクションを見て次の２点を掴むことができれば十分です。

✅ JavaScriptはさまざまなアプリやシステム開発で幅広く利用されているプログラミング言語である。
✅ 数ある言語の中でもトップの人気と注目を集めている。

多少英語に不安があってもこの程度なら理解できたのではないでしょうか。もちろんこうした英語のビデオ解説を聞くのも慣れが必要なので最初は大変ですが、数をこなしていくと思ったよりもずっと理解できることに気が付くと思います。

今回はJavaScriptの”お話”が中心だったので、プログラミング的にはあまり面白くなかったかもしれませんが、この冒頭の短いセクションでもいろいろと勉強できる英語表現がたくさん出てきました。JavaScriptの概要が理解できると同時に、様々な表現に文脈の中で触れることができるので、とても覚えやすいのではないでしょうか。

次のセクションでは実際のJavaScriptのコーディング作業に入っていきます。