【JavaScript入門】JavaScriptを動かすための準備をしよう

はじめに

「JavaScript入門」は、プログラミングを始めたい方、JavaScriptを勉強したい方向けにJavaScriptの基礎と実践を学ぶシリーズです。

初めての方は、まずこちらからお読みください。

【JavaScript入門】はじめに

JavaScriptはウェブブラウザで動くプログラミング言語です。

ウェブブラウザとは、皆さんがインターネットで検索するときに使うSafari（サファリ）や、Chrome（クローム）、IE(インターネット・エクスプローラ)、Microsoft Edge(マイクロソフト・エッジ)などのツールのことを言います。

本章では、そのウェブブラウザのインストールとコードを書くためのテキストエディタのインストール方法を解説します。

Chromeをインストールしよう

「JavaScript入門」では、JavaScriptを動かすウェブブラウザとして、Googleが提供している「Chrome（クローム）」を使用します。

Chromeは、ウェブ開発をするためのツールや機能が充実しているため多くのウェブ開発の現場で使われています。

実際に、筆者もChromeを使って開発をしています。

詳しい使い方は、各章で解説をしていきます。

インストール

では、Chromeをインストールしましょう。

まずは、次のリンクからChrome公式サイトへアクセスしてください。

ダウンロードボタンがあるのでクリックしてください。

「ダウンロード」フォルダに、「googlechrome.dmg」というファイルがあるので、ダブルクリックして開きましょう。

開くと次のような画面が出てきます。

Chromeのアイコンをドラッグ&ドロップで、「アプリケーション」フォルダに移動させてください。

移動が完了したら、「アプリケーション」フォルダに「Google Chrome」がインストールされたのを確認してください。

テキストエディタをインストールしよう

次に、JavaScriptやHTML、CSSなどのプログラムを書くためのテキストエディタをインストールします。

テキストエディタってなに？

テキストエディタとは、テキストを編集するためのツールのことを言います。

プログラミングをするときはこのテキストエディタを使って、コードを書いていきます。

Wordやメモ帳との違いは？

テキストを書くだけなら、Wordやメモ帳アプリと何が違うのでしょうか。

Wordやメモ帳アプリとテキストエディタはその目的が違います。

Wordやメモ帳アプリはレポートや記事などの文章を書くことを目的としたツールです。

一方、テキストエディタはプログラミングのコードを書くことを目的としたツールです。

テキストエディタにはプログラミングをするための機能が豊富にあります。

「JavaScript入門」を通して、少しずつ使い方を覚えていきましょう。

Visual Studio Codeをインストールしよう

テキストエディタは次のようにたくさんの種類があります。

「JavaScript入門」では、Microsoft社が提供している Visual Studio Code を使用します。

Visual Studio Code は無料でありながら、非常に高品質な機能を提供しています。

実際に、多くのウェブプログラマの間で使われており、JavaScriptを書くためのテキストエディタとしては主流になりつつあります。

インストール

次のリンクで、Visual Studio Codeの公式サイトへアクセスしてください。

ダウンロードページがあるので、Macをお使いの方は「Mac」を選んでください。

ダウンロードすると、「ダウンロード」フォルダに「VSCode-darwin-stable.zip」というファイルがあります。それをダブルクリックして開きましょう。

ダブルクリックして開くと、「Visual Studio Code」というファイルが出てきます。

このファイルをドラッグ&ドロップで「アプリケーション」フォルダへ移動させましょう。

最後に、「アプリケーション」フォルダにある「Visual Studio Code」を起動させてみましょう。

次のように起動されたら、インストールは完了です。

まとめ

本章では、JavaScriptを動かすための準備を解説しました。

最後にもう一度、内容を確認しましょう。

次の章では、実際にJavaScriptを動かしてみましょう！