defwd-sample

Development Environments for Web
Designers
Web サイト 制 作 の 時 流 に 乗 り 遅 れないために、 覚 えておきたい 開 発 環 境
の 作 り 方
MASAAKI KOMORI
This book is for sale at http://leanpub.com/defwd
This version was published on 2015-02-01
This is a Leanpub book. Leanpub empowers authors and publishers with the Lean
Publishing process. Lean Publishing is the act of publishing an in-progress ebook using
lightweight tools and many iterations to get reader feedback, pivot until you have the right
book and build traction once you do.
©2014 - 2015 MASAAKI KOMORI

Contents
はじめに 1
いまどきのサイト 制 作 とは 3
変 わり 続 ける Web サイト 制 作 4
閲 覧 環 境 が 変 わるということ 4
コンテンツの 作 り 方 ですら 多 様 化 4
Web が Web サイトでなくなる? 7
最 新 の 制 作 ツールはコマンドラインから 8
GUI だけではどうにもならない 時 代 に 8
ライブラリのダウンロードもコマンドライン 10
コマンド 操 作 だけができれば 解 決 10
ローカルで Web サイトを 動 かすには? 12
OS X なら 実 は 簡 単 !? 12
MAMP や XAMMP の 問 題 12
新 しい 時 代 に 対 応 するには 14
ターミナルの 操 作 に 慣 れよう 15
シェル? 16
主 なシェル 16
覚 えておきたいシェルのコマンド 20
自 分 の 居 場 所 を 表 示 する 20
ディレクトリの 内 容 をリストする 21
コマンドのオプションを 指 定 する 22
作 業 ディレクトリを 移 動 する 23
入 力 補 完 を 利 用 する 25
ヒストリー( 入 力 履 歴 )を 利 用 する 26
コマンド 行 のキャレットの 移 動 26
Finder でディレクトリを 開 く 28
ファイルの 内 容 を 表 示 する(テキストファイル) 28

CONTENTS
画 面 の 内 容 をクリアする 29
新 規 テキストファイルを 作 成 する 30
新 規 ディレクトリを 作 成 する 30
ファイルやディレクトリを 移 動 する(リネームする) 31
ファイルやディレクトリをコピーする 32
ファイルやディレクトリを 消 去 する 33
複 数 のファイルやディレクトリをまとめて 操 作 する 35
複 数 のファイルを 結 合 する 35
ファイルやディレクトリの 所 有 者 やパーミッションを 変 更 する 36
管 理 者 としてコマンドを 実 行 する 38
覚 えておくと 便 利 なコマンド 40
コマンドの 場 所 を 確 認 する 40
ファイルやディレクトリを 圧 縮 (アーカイブ) ・ 解 凍 する 41
SSH の 鍵 の 作 成 43
SSH(SFTP)でリモートのサーバにログインする 44
シンボリックリンクの 作 成 47
現 在 の 日 時 を 表 示 する 48
カレンダーを 表 示 する 48
英 語 の 発 音 を 確 認 する 48
コマンドの 実 行 結 果 を 他 のプログラムに 渡 す 48
複 数 のコマンドを 一 度 に 実 行 するには? 49
ターミナルでテキストを 編 集 する 51
Vim(Vi) 51
nano 54
制 作 環 境 構 築 の 下 準 備 56
Xcode とコマンドラインツールのインストール 57
Xcode のダウンロード 57
コマンドラインツールのインストール 58
回 線 環 境 をシミュレートする 設 定 のインストール 60
JRE(Java Runtime Environment)のインストール 61
Homebrew のインストール 64
Yosemite にインストール 済 みのソフトウェア 64
Homebrew とは 65
Homebrew のインストール 66
パスを 通 す? 環 境 変 数 に 追 加 する? 72
Homebrew のアンインストール 75
Homebrew によるツールのインストールと 管 理 76

CONTENTS
tree のインストールと 実 行 76
OS X のソフトウェアを Homebrew でインストール 77
公 式 リポジトリ 以 外 からソフトウェアをインストール 80
インストール 済 みのソフトウェアのアップデート 82
覚 えておきたい Homebrew のコマンド 86
Android SDK Tools のインストール 89
Android SDK Tools のダウンロード 89
Android SDK Tools のセットアップ 91
Android SDK Manager の 起 動 93
HAXM と Apache Ant のインストール 95
Android デバイスのセットアップ 96

はじめに
この 数 年 のデバイスの 多 様 化 にともなって Web 制 作 の 手 法 も 大 きな 転 換 期 を 迎 えようと
しています。Web サイトの 配 信 対 象 が 増 えると 言 うことは 多 くの 環 境 をサポートしていく 必
要 があり、その 答 えのひとつとして Responsive Web Design のような 手 法 も 登 場 しました。
Web 制 作 の 主 にフロント 側 を 担 当 する 人 たちは、これまで 以 上 に 頭 で 考 えることも 手 を 動
かすことも 増 えているのが 現 状 ではないでしょうか。 閲 覧 対 象 が 増 えるだけであればまだ
しも、 環 境 変 化 の 速 さに 足 並 みを 揃 えるかのようにビジネススピードも 増 すばかりです。
コンピュータが 得 意 な 仕 事 はコンピュータに 任 せて、 人 間 でしかできないことに 注 力 しな
ければ 終 わる 仕 事 も 終 わりません。 数 年 前 から CSS プリプロセッサなどのツールの 利 用
者 も 増 えているようです。しかし、GUI のツールのバージョンアップは 既 にその 流 れについ
ていけていないのが 現 状 で、 便 利 な 機 能 を 享 受 したければコマンドラインでの 操 作 は 必
須 です。その 一 方 ではその 波 に 乗 り 切 れない 方 も 多 く 見 受 けられ、それらを 使 える 人 と 使
えない 人 の 差 が 出 てきていると 感 じます。
「 自 分 に 合 わない、もしくは 必 要 ないから 使 わない」というのと、 「わからない、 使 えない」
というのでは 大 きな 違 いがあります。いまどきの Web 制 作 はフロントエンドとバックエンド
の 境 界 線 も 曖 昧 になりつつあります。ひとつの 仕 事 は 個 人 だけで 完 結 するものの 方 が 少
なく、 多 くの 場 合 はプログラマやエンジニアの 方 との 協 業 になるでしょう。そういうところで
共 通 言 語 ですら 話 せないのでは 仕 事 はどんどんできる 人 の 方 に 流 れていくかもしれませ
ん。
本 書 はそんなこれからの 新 しい 時 代 に 乗 り 遅 れないようにするため、コマンドライン 操 作
の 基 本 から 制 作 環 境 の 作 り 方 、フロントエンド 系 のツールのインストールや 管 理 方 法 など
を 紹 介 する 書 籍 です。なにもバリバリとコマンドラインだけを 使 って 制 作 を 進 めるわけでは
ありません。 作 業 をスムーズに 進 めるため、また 仕 事 を 早 く 終 わらせるためにも、 道 具 は 適
材 適 所 で 使 えるようにした 方 が 良 いでしょう。 技 術 やツールの 進 化 によって Web サイト 制
作 はこれまで 以 上 に 簡 単 にもなっているのです。
主 に Web のフロントエンドを 担 当 する 皆 さんは、これまでコマンドラインの 操 作 が 難 しく 感
じていた 方 が 多 いかもしれません。コマンドライン 操 作 は 基 本 さえ 覚 えて 慣 れればさほど
難 しいものではなく、いろいろな 場 面 で 応 用 が 効 くということに 気 付 いていただけたら。 本
書 がそんな 皆 さんの 一 助 になれば 幸 いです。
こもりまさあき
1

はじめに 2
.
本 書 籍 は「ePub/mobi/PDF」の 3 種 類 のファイル 形 式 で 提 供 していますが、LeanPub の
自 動 生 成 システムを 使 用 しているため、その 体 裁 は 基 本 リフロー 型 のレイアウトになっ
ています。17.8cm x 23.1cm の PDF 換 算 で 現 在 300P 程 度 ありますが、 若 干 レイアウト 面
において 空 白 などが 目 に 付 く 部 分 もあるかもしれません。その 点 あらかじめご 了 承 い
ただきたく 思 います。
変 更 履 歴
• 2015.02.01: 誤 字 脱 字 の 修 正 。Chapter 7 の 内 容 を 追 加 (Ver. 0.4.0)
• 2015.01.15: 誤 字 脱 字 の 修 正 。Chapter 5、6 の 内 容 を 追 加 (Ver. 0.3.0)
• 2015.01.09: Homebrew のアップデート 方 法 、Chapter 4 の 内 容 を 追 加 (Ver. 0.2.0)
• 2015.01.05: 「Early Release」として 初 版 発 行 (Chapter 1、2、3 収 録 ) (Ver. 0.1.0)
謝 辞
• コマンド 入 力 に 関 する「Undo/Redo の 方 法 」をひらいさだあき 氏 にいただきました。
ありがとうございました。
• コマンド 入 力 に 関 する「&& と;」の 違 いを 詳 しく 追 記 しました。@ryumu 氏 、ありがとう
ございました。
※ 本 書 に 掲 載 した 会 社 名 、プログラム 名 、システム 名 、サービス 名 などは 一 般 に 各 社 の 商
標 または 登 録 商 標 です。 本 文 中 において TM 、® は 必 ずしも 明 記 していません。

いまどきのサイト 制 作 とは
Web サイト 制 作 、それもフロントエンド 側 にあたる 作 業 はデバイスの 多 様 化 とともに 複 雑
化 しています。この 数 年 で 制 作 時 に 使 うツールは、 人 によって 組 織 によって、また 担 当 す
る 案 件 やプロジェクトの 内 容 によっても 変 わってきていることでしょう。これまでのように
Dreamweaver やテキストエディタだけがあればどうにかなる、という 時 代 ではなくなってき
たことを 痛 感 している 人 も 多 いのではないでしょうか。これからの Web 制 作 が 少 し 楽 にな
るよう、そして 次 の 時 流 に 乗 り 遅 れないためにも 比 較 的 新 しめなサイト 制 作 環 境 を 紹 介 し
ていきましょう。
3

いまどきのサイト 制 作 とは 4
変 わり 続 ける Web サイト 制 作
Web サイト 制 作 を 取 り 巻 く 環 境 がこの 数 年 で 大 きく 変 わり 始 めています。 「 世 界 と 日 本
では Web サイトが 全 然 違 う」とよく 言 われますが、それは 単 純 な 見 た 目 だけの 話 ではあり
ません。コンテンツ 配 信 に 対 する 考 え 方 や 作 り 方 も 次 の 時 代 を 見 据 えてるように 思 えます。
デバイスの 多 様 化 にあわせて Web サイト 制 作 を 取 り 巻 くいろいろな 環 境 が 変 わりつつあ
ることを 認 識 しておく 方 が 良 いでしょう。
閲 覧 環 境 が 変 わるということ
iPhone や Android デバイスの 登 場 以 来 、これまで 主 にデスクトップ PC だけを 対 象 に 考 え
ていればよかった 時 代 は 終 わりました。ご 存 知 のようにこの 数 年 のスマートデバイスの 普
及 は 目 を 見 張 るものがあります。これまでデスクトップ PC だけを 対 象 としてきた 制 作 会 社
や 個 人 であっても、その 普 及 率 にもう 目 を 背 けることはできません。これまでデスクトップ
PC だけのことを 考 えていればよかったのに、 一 気 にコンテンツの 配 信 対 象 が 増 えたも 同
然 です。
これまでは Dreamweaver やお 気 に 入 りのテキストエディタ、それにグラフィックソフトがあ
ればどうにかなりました。しかし、さまざまな 閲 覧 デバイスでコンテンツを 使 う 人 たちが 増 え
ています。 回 線 環 境 はバラバラになり、 画 面 サイズもバラバラ、そんな 対 象 に 向 けていかに
ストレスなくコンテンツを 配 信 するか。ビジネススピードも 早 くなっていて、これまでのよう
なやり 方 を 続 けていては 到 底 太 刀 打 ちできないばかりか、 時 間 ばかりが 無 駄 に 過 ぎてい
くことにもなりかねません。
コンテンツの 作 り 方 ですら 多 様 化
日 本 においては、MovableType や WordPress などの CMS を 使 ったサイトの 作 り 方 、CSS に
よる 見 た 目 の 実 装 をどうすればいいか、jQuery を 使 った 視 覚 的 な 表 現 としてのインタラク
ションの 付 け 方 など、 主 にフロント 側 で Web 制 作 に 関 わる 人 たちの 興 味 の 対 象 はまだま
だそういったところに 重 きがあるようにも 見 えます(ニーズの 問 題 でそれが 悪 いわけでは
ありません) 。
Web サイトのコンテンツが 静 的 なものから 動 的 な 要 素 を 含 み、デバイスの 多 様 化 にあわ
せるかのように 人 々の 行 動 までもが 変 化 してくるようになってくると、 閲 覧 する 人 のコン
テキストに 合 わせた 情 報 配 信 やリアルタイムコンテンツのニーズも 出 てくるでしょう。も
う jQuery とそのプラグインを 使 って 動 きをつける 程 度 の 知 識 では 無 理 があり、より 深 い
JavaScript の 知 識 が 必 要 になっています。コンテンツを 構 成 するのに 必 要 な HTML や CSS
ですら 素 の 状 態 では 書 かなくなりつつあるのです。

いまどきのサイト 制 作 とは 5
CMS にしても「Craft」や「Webhook」の 方 がカスタムフィールドベースでサイト 制 作 ができ
るだけでなく、 「Twig」や「Swig」のテンプレート 言 語 と HTML を 使 って 見 た 目 をコントロー
ルがしやすいかもしれません。また 場 合 によっては、CMS をがんばって 使 うよりは Static
Site Generator の 方 が 都 合 が 良 いこともあるでしょう。
バックエンドを 含 んだ Web サイト 制 作 においては、 長 い 間 「LAMP(Linux / Apache / MySQL
/ PHP) 」の 構 成 がもてはやされているようにも 見 えますが、Web サイトや Web アプリケー
ションを 作 る 環 境 はそれだけではありません。Ruby を 使 ったフレームワークの「Ruby On
Rails」など 有 名 ですが、 近 頃 では NodeJS をバックエンドとして 動 かす「MEAN(MongoDB
/ Express / Angular / Node) 」のような 構 成 での 運 用 事 例 も 出 てきています。
PHP で 動 作 する CraftCMS

いまどきのサイト 制 作 とは 6
node.js で 動 作 する Webhook
mean.io は、MEAN で 作 り 始 めるためのフレームワーク

いまどきのサイト 制 作 とは 7
Web が Web サイトでなくなる?
さらにこの 数 年 で REST (Representational State Transfer) インターフェイスを 介 して、HTTP
の URI ベースでデータをやりとりすることも 増 えているようです。 従 来 の CMS であって
もこの REST を 介 してデータをやりとりできるようになりつつあります。 極 端 な 話 をすれば、
CMS は 完 全 にコンテンツ 管 理 だけをおこなうだけでよく、URL の 書 き 換 えを 含 めたフロン
ト 側 は JavaScript のフレームワークでコントロールすることもできます。
REST のような API(Application Programing Interface)によるデータのやりとりが 理 解 でき
ると、いざ 自 分 が 何 か 作 る 際 もバックエンドのシステムを 自 分 で 用 意 する 必 要 もありませ
ん。 「BaaS(Backend as a Servive) 」を 使 えば、データベースや 認 証 の 仕 組 みなどもそれを
利 用 すれば 終 わりです。ホスティングも 含 めていろいろな 取 り 巻 く 環 境 が 大 きく 変 化 して
いることを 認 識 しておいた 方 が 良 いですね。
Firebase や Parse のような BaaS を 使 えばバックエンドはおまかせ
いまはまだこれまで 通 りのやり 方 で 良 いでしょうが、 今 後 は 主 に Web サイトのフロント 側
を 担 当 すると 言 ってもさまざまな 環 境 下 でのサイト 制 作 をおこなう 機 会 が 増 えるかもしれ
ません。これまでのやり 方 を 続 けていくか、 少 し 先 を 見 ながらのんびりでも 対 応 できる 術 を
身 につけるか、それは 皆 さん 次 第 です。

いまどきのサイト 制 作 とは 8
最 新 の 制 作 ツールはコマンドラインから
いまどきの Web 制 作 ではフロント 側 の 実 装 に 関 係 することだけに 絞 っても、 規 模 の 大 小
にかかわらず 実 装 に 関 わる 負 荷 が 増 えています。やることが 増 えた 分 、コンピュータが 得
意 なことは 任 せた 方 が 楽 になります。しかし、そういったツールはコマンドラインでしか 使 え
ないことが 多 いのです。
GUI だけではどうにもならない 時 代 に
より 直 感 的 に 操 作 できるようにと 登 場 したはずの GUI ですが、 今 の 時 代 それに 逆 行 する
かのように 制 作 ツールに 関 しては CUI での 動 作 が 中 心 になっています。これまでは GUI
の 制 作 ツールの 年 に 一 回 のアップデートでどうにかなったのかもしれません。 新 しい 技 術
への 対 応 などもそうですが、もはや 日 進 月 歩 どころの 進 化 ではなく 常 に 新 しいバージョン
が 提 供 されるような 時 間 軸 で 動 いてます。 知 らなければいつまでもその 便 利 さを 享 受 でき
ません。
まだまだ 日 本 での 注 目 度 は 低 いようですが、 「Meteor」はリアルタイムで 動 作 する Web
アプリケーションを 簡 単 に 作 るためのフレームワークです。コマンド 操 作 で 必 要 な 機 能 や
パーツを 追 加 して HTML や CSS、JavaScript を 書 いていけば、Web とネイティブで 動 くハイ
ブリッドなアプリケーションをも 作 ることができます。 「そんな 便 利 なものがあるのならこれ
を 使 おう」と 考 えても、これを 動 作 させるにはやはり node.js の 環 境 が 必 要 となり、デモアプ
リはおろかサンプルのチュートリアルですら 動 かすことはできないのです。

いまどきのサイト 制 作 とは 9
リアルタイム Web のためのフレームワーク、Meteor
コマンド 操 作 ができなければデモすら 動 かせない

いまどきのサイト 制 作 とは 10
ライブラリのダウンロードもコマンドライン
JavaScript のライブラリなどはこれまで.zip などでファイル 一 式 が 提 供 されていることが 多
かったので、それをダウンロードしてきて 任 意 の 場 所 に 保 存 すれば 使 うことができました。
しかし、ここ 最 近 ではコマンドラインでのインストール 方 法 や GitHub のリポジトリへのリン
クだけしか 書 いてないこともあります。
いざサイト 制 作 に 必 要 な 道 具 一 式 を 揃 えて 作 り 始 めようにも、サイトを 駆 けずり 回 ってか
き 集 める 人 とコマンドラインで 一 瞬 で 手 元 に 用 意 できる 人 ではそのスタート 地 点 からして
違 ってきています。たとえば、 以 下 はフレームワークの Bootstrap を 手 元 に 用 意 するコマン
ドです。これを 実 行 すればほんの 数 秒 で Bootstrap だけでなく、その 動 作 に 必 要 な jQuery
までも 含 めてダウンロードが 終 わります。
$ bower install bootstrap
次 のコマンドは、WordPress の 最 新 版 のファイル 一 式 をダウンロードできます。わざわざサ
イトに 行 く 必 要 もないだけではなく、 設 定 からデータベースの 作 成 まであとひとつふたつ
のコマンドを 打 つだけで WordPress のサイトを 立 ち 上 げることができるのです。
$ wp core download --locale=ja
これだけでは 一 見 ほんの 些 細 なことのようにも 思 えます。しかし、コマンドで 操 作 できるも
のは 自 動 化 の 対 象 になります。 使 えるかどうかは 仕 事 全 体 の 生 産 性 にも 影 響 を 与 えるで
しょう。ある 人 は 3 日 かかってサイトを 作 る、しかしある 人 は 1 日 もあればできるとなれば
雲 泥 の 差 です。 仮 に 個 人 事 業 主 のような 立 場 であれば 時 間 単 価 が 大 きく 変 わってきま
す。
コマンド 操 作 だけができれば 解 決
数 年 前 から「 深 く 使 うことはなくても、せめて node.js と Ruby ぐらいは 入 れておきましょう」
と 言 い 続 けてきましたが、いまどきの Web 制 作 をよりスムーズにおこなうためにはもうコマ
ンドラインの 操 作 は 必 須 です。 今 さら 時 代 に 逆 行 していると 言 われればそうですが、 便 利
なツールが GUI では 提 供 されることの 方 が 少 ないのですから 仕 方 ありません。
CSS プリプロセッサやタスクランナーのようなものは GUI のソフトウェアから 実 行 すること
ができます。しかし、これらのツールのバージョンアップもまた 異 様 なほどの 速 さです。CSS
プリプロセッサの「Sass」の 利 用 者 が 多 いようですが、Sass はバージョンや 変 換 エンジンに

いまどきのサイト 制 作 とは 11
よって 使 える 機 能 が 異 なります。GUI のソフトウェアのバージョンに 左 右 されてしまうと、い
つまでも 便 利 な 機 能 が 使 えないかもしれません。
Sass はバージョンやエンジンで 使 える 機 能 が 違 う
今 後 何 かを 始 めるにあたっては、コマンドラインからしかインストールできないソフトウェア
を 使 わなければならないこともあるでしょう。フロントエンドとバックエンドの 境 界 線 があい
まいになりつつある 中 、その 基 本 操 作 と 簡 単 な 仕 組 みさえ 覚 えておけばいろいろなシーン
で 応 用 が 効 きます。 「それ 知 らないです」 「 使 っていません」では、 仕 事 そのものがなくな
るかもしれません。 仕 事 はできる 人 の 方 に 流 れるものです。

いまどきのサイト 制 作 とは 12
ローカルで Web サイトを 動 かすには?
HTML と CSS、jQuery でのインタラクションが 付 与 された 静 的 なページであれば、ローカ
ルで 制 作 中 の「〜.html」のファイルを Web ブラウザで 開 けば 動 作 しているかどうかを 確 認
できます。しかし、 動 的 に 外 部 のリソースを 取 得 するタイプのサイトを 作 るとなるとそうはい
きません。 時 には「file://〜」ではじまるアドレスでは 表 示 確 認 ができないこともあるでしょ
う。 当 然 、Ruby や PHP のようなプログラムが 介 在 する Web サイトでも 同 様 です。
OS X なら 実 は 簡 単 !?
たとえば、CMS を 使 おうとすればそれを 動 作 させるためのサーバ 環 境 が 必 要 です。OS X
にはあらかじめ Web(HTTPD)サーバとして 有 名 な「Apache」 、プログラムの 実 行 に 必 要
な「PHP」 「Ruby」などが 含 まれており、それらを 有 効 化 するだけで 新 たにテスト 環 境 を 用
意 せずに 利 用 できます。しかし、それらを 動 かしたくても 仕 組 みがわからないことにはでき
ません。わからないからといって、 簡 単 にローカルのテスト 環 境 が 用 意 できるオールインワ
ンパッケージになったソフトウェアが 良 いかというとそうでもないのです。
MAMP や XAMMP の 問 題
バックエンドの 仕 組 みに 詳 しくない 方 は「MAMP」や「XAMPP」のように、あらかじめ Web
サーバと Perl、PHP、MySQL などがひとつのパッケージとなったソフトウェアを 使 っている
でしょう。 必 要 なものがパッケージされたこれらは 簡 単 に 導 入 できて 大 変 便 利 な 反 面 、 実
際 に 動 作 するサーバの 構 成 とは 異 なるがゆえの 問 題 も 出 てきます。
Web サーバにも PHP にも MySQL にもそれぞれ 設 定 があります。エラーが 出 た 場 合 、OS
側 の 問 題 なのかアプリケーションの 問 題 なのか 切 り 分 けができなくなり 問 題 の 解 決 に 時
間 がかかってしまう 事 にもなりかねません。MAMP は OS X Yosemite へのアップグレード
によって 正 常 に 起 動 できないという 問 題 が 起 きた 方 もいらっしゃるようですが、 特 殊 な 環
境 であることがむしろ 困 る 場 合 もあるのです。
最 近 では Web サーバも「nginx(エンジンエックス) 」の 人 気 が 高 まっています。こういった
Web サーバの 特 徴 や 仕 様 ・ 設 定 方 法 を 知 らないままでいては、ホスティングされたサイ
トの 動 作 設 定 の 変 更 はもちろんのこと、テスト 環 境 をあわせて 作 ることもできません。 組 織
の 一 員 であれば 誰 かがやってくれるでしょうが、 個 人 事 業 主 などで 受 託 をしている 場 合 で
は 困 ります。HTML5 のアプリケーションなどバックエンドのシステムがローカルに 不 要 な
サイトは、JavaScript のツールを 使 ってローカルサーバを 立 ち 上 げる 方 が 簡 単 です(いざと
なったらそのまま 外 部 公 開 もできます) 。

いまどきのサイト 制 作 とは 13
$ ss
ツールのインストールは 必 要 ですが、このたった 2 文 字 のコマンドを 入 力 するだけで SPA
(シングル ・ ページ ・ アプリケーション)にも 対 応 可 能 なサーバを 起 動 できます。
新 しい 技 術 に 対 応 した 環 境 を GUI で 用 意 するなら「Bitnami Stacks」を 使 えば 簡 単 です。
静 的 なサイトの 確 認 程 度 なら「Anvil」を 使 えば、ディレクトリがどこだろうがそこをルート
ディレクトリとしてローカルサーバを 起 動 できます。
Bitnami であれば 最 新 の 環 境 も GUI で

いまどきのサイト 制 作 とは 14
任 意 のディレクトリをルートにするなら Anvil
新 しい 時 代 に 対 応 するには
このように 本 書 の Chapter 07 では、フロントエンド 側 の 制 作 に 役 立 つツールだけでなく、
JavaScript を 使 ったローカルサーバの 起 動 方 法 、ローカルマシンの 制 作 サイトの 状 態 を 一
時 的 に 外 部 に 公 開 する 方 法 や PaaS(Platform as a Service)を 使 ったテスト 環 境 の 公 開 も
紹 介 します。 本 書 の 後 半 では 仮 想 環 境 をサーバの OS から 選 択 して 構 築 できる「Vagrant」
というソフトウェアを 使 い、OS の 中 を 極 力 汚 さないで 済 むような 開 発 ・ テスト 環 境 を 動 か
してみましょう。
仮 にきっちりと 分 業 体 制 が 敷 かれていたとしても、 制 作 するコンテンツによってはフロント
エンドとバックエンドの 境 界 線 は 曖 昧 になっています。そういった 時 流 に 逆 らうことなく 新
たな 潮 流 にも 少 しずつでも 対 応 できるよう、いまどきのサイト 制 作 をおこなうための 環 境 を
少 しは 理 解 しておいた 方 が 良 いでしょう。 本 書 は、ターミナルを 使 ってコマンド 操 作 を 極 め
るのではなく、コマンド 操 作 の 基 本 を 覚 えながらさまざまなツールをすんなり 導 入 し 使 える
ようになることを 目 的 としています。

ターミナルの 操 作 に 慣 れよう
CUI(Character User Interface)/ CLI(Command Line Interface)は、テキストでコマンドの 文
字 列 を 入 力 して 実 行 します。 一 見 難 しそうに 感 じますが、 日 常 的 に 使 うコマンドは 限 られ
ています。GUI の 画 面 でボタンを 押 す 代 わりに、テキストで 命 令 を 与 えてるだけだと 考 え
れば 決 して 怖 いものではありません。いまどきの Web 制 作 のワークフローを 効 率 化 する
には、この CUI でしか 使 えないソフトウェアが 必 要 なのです。いまのうちからターミナル
(Terminal.app)の 操 作 に 慣 れておきましょう。
15

ターミナルの 操 作 に 慣 れよう 16
シェル?
ターミナルを 起 動 すると OS X では「bash(バッシュ ) 」と 呼 ばれるシェルプログラムが 起
動 します。このシェル(Shell)の 基 本 的 な 仕 事 は、 他 のプログラムを 起 動 することです。
主 なシェル
UNIX 系 の OS の 標 準 のシェル(ログインしたときに 起 動 されるシェル)は bash であること
がほとんどのようです。 実 はシェルにはいくつかの 種 類 があり、 自 分 の 好 きなシェルを 指
定 して 使 うことができます。それぞれのシェルは 独 自 に 備 えた 機 能 であったりコマンドの
補 完 のような 使 い 勝 手 が 異 なるため、エディタと 同 じように 人 によって 使 うシェルの 好 み
があります。
• sh(Bourne shell)
• bash(Bourne-Again shell)
• csh(C Shell)
• tcsh(TENEX C shell)
• zsh(Z Shell)
コマンドの 説 明 は 後 ほどおこないますので、まずは Finder からターミナル(Terminal.app)
を 起 動 し、 表 示 されてる「$」のあとに 下 記 のコマンドを 入 力 してリターンキーを 入 力 してみ
ましょう。 「cat」と「/etc/shells」の 間 には「( 半 角 スペース) 」を 入 れてください。
> cat コマンドを 実 行
$ cat /etc/shells(リターンキー)

ターミナルの 操 作 に 慣 れよう 17
ターミナルを 起 動 してコマンドを 入 力
コマンドを 実 行 すると 以 下 の 内 容 が 表 示 されるでしょう。
> cat コマンドの 実 行 結 果
/bin/bash
/bin/csh
/bin/ksh
/bin/sh
/bin/tcsh
/bin/zsh
コマンドを 実 行 した 結 果 として、ディスクの「/etc」の 中 にある「shells」ファイルの 内 容 が
画 面 上 に 出 力 されたのです。ここにリストされたシェルは、あらかじめ OS X にインストー
ル 済 みのものです。シェルは「 他 のプログラムを 起 動 すること」が 仕 事 ですから、 標 準 の
シェルである bash からこれらを 起 動 することもできます。bash から「zsh」と 打 ってリターン
キーを 押 すと zsh が 起 動 します。

ターミナルの 操 作 に 慣 れよう 18
> zsh を 起 動
$ zsh(リターンキー)
コマンドを 実 行 すると、zsh が 起 動 して 以 下 のようにターミナルの 表 示 が 変 わります。
> zsh のプロンプトの 表 示
マシン 名 %
これは「bash が 起 動 しているうえにさらに zsh が 起 動 している」 状 態 です。
【zsh】
【bash】
続 けて「ps」コマンドを 実 行 してみましょう。 自 分 自 身 が 起 動 しているプロセスが 表 示 され
て bash と zsh が 同 時 に 起 動 していることがわかります。
> ps コマンドの 実 行
% ps
> 起 動 中 のプロセス
PID TTY
TIME CMD
9782 ttys000 0:00.01 -bash
9867 ttys000 0:00.02 zsh
起 動 した zsh を 終 了 するには「control + d」のショートカットを 入 力 します。ターミナルでプ
ログラムを 実 行 したり、リモートのサーバに SSH(Secure SHell)でログインしたりするように
なると、いたるところで 以 下 の 2 つのショートカットを 使 います。いまのうちに 覚 えておきま
しょう。
• control + D: ログアウト(シェルの 終 了 、リモートサーバからログアウト)
• control + C: プログラムを 終 了 する
本 書 は OS X の 標 準 シェルである「bash」を 使 って 解 説 を 進 めます。

ターミナルの 操 作 に 慣 れよう 19
.
シェルの 概 念 や 機 能 について 深 く 知 りたい 場 合 は、 以 下 の 記 事 をご 覧 ください。
( 参 考 資 料 )シェルの 概 念 と 機 能

ターミナルの 操 作 に 慣 れよう 20
覚 えておきたいシェルのコマンド
ここからは 実 際 にコマンドを 入 力 ・ 実 行 して、ターミナルの 操 作 に 慣 れていきましょう。 各
コマンドを 入 力 した 後 は「リターンキー」で 実 行 します。
.
注 意 本 ページ 以 降 コマンドの 実 行 文 が 多 く 含 まれますが、ところどころ 現 れる「\(バッ
クスラッシュ ) 」は 通 常 記 述 できない 文 字 を 表 記 する 際 に 用 いられます( 参 考 : バック
スラッシュ) 。 本 文 のコードやコマンド 中 でバックスラッシュが 含 まれている 場 合 は、そ
の 直 後 の 半 角 スペースなどをエスケープしているか、 折 り 返 しの 含 まれる 長 い 行 のコ
マンドをその 部 分 で 改 行 していることを 表 します。 本 書 は Leanpub による 電 子 書 籍 を 自
動 生 成 しているためフォーマットによって 任 意 の 場 所 でエスケープされています。
自 分 の 居 場 所 を 表 示 する
まずは 基 本 中 の 基 本 のコマンドを 使 って、 自 分 の 現 在 の 居 場 所 ( 現 在 の 作 業 ディレクトリ)
を 表 示 してみましょう。
> 現 在 のディレクトリを 表 示
$ pwd
ターミナルの 起 動 直 後 は 自 分 のホームディレクトリにいますので、コマンドを 実 行 すると
ターミナルの 画 面 には 自 分 のホームディレクトリのパス(ローカルマシン 内 での 位 置 )が
表 示 されます。
> pwd の 実 行 結 果
/Users/ 自 分 のアカウント 名
「pwd」は「Print Working Directory」の 略 です。ターミナルで 実 行 するコマンドの 名 前 は、こ
れからおこないたい 処 理 内 容 の 頭 文 字 を 取 った 略 語 がほとんどです。グラフィカル ・ ユー
ザー・ インターフェイスの 画 面 でいえば「pwd」と 書 かれたボタンを 押 してると 考 えてくださ
い。

ターミナルの 操 作 に 慣 れよう 21
ディレクトリの 内 容 をリストする
自 分 がいるディレクトリにあるディレクトリやファイルをリストしてみましょう。 現 在 の 作
業 ディレクトリは、さきほど「pwd」で 表 示 された 自 分 のアカウントのホームディレクトリで
す。 「ls( 小 文 字 の L と s) 」と 入 力 してください。
> ls コマンドの 実 行
$ ls
ルートディレクトリにあるディレクトリやファイルがリストされましたか?
> ls の 実 行 結 果
Applications Downloads Music
Dropbox Pictures Desktop
Public Library Documents Movies
任 意 の 場 所 をリストするには、 以 下 のように ls の 後 に 半 角 スペースをいれて 場 所 (パス)
を 入 力 します。
> 場 所 を 指 定 してリスト
$ ls 表 示 したい 場 所
たとえば、システムのルートディレクトリ「/」にあるものを 見 る 場 合 はこうなります。
> ‘/’ の 内 容 をリスト
$ ls /
OS X でルートディレクトリをリスト 表 示 するとこのような 感 じになっているのではないでしょ
うか。

ターミナルの 操 作 に 慣 れよう 22
> ‘ls /’ の 実 行 結 果
Applications Users dev private
Library Volumes etc sbin
Network bin home tmp
System cores net usr
TSSleepHandlerHelp opt
var
日 頃 使 っている GUI の Finder からは 見 えてない 領 域 が 多 いことがわかります。このディ
レクトリ 構 成 は、UNIX 系 のマシンでは 大 体 似 たり 寄 ったりでおなじみのものです。この 先
リモートにある Linux サーバなどにログインする 機 会 もあるでしょうから、これらのディレク
トリがどのような 役 割 になっているか 簡 単 ですが 紹 介 しておきます。
• /bin ( 基 本 コマンドが 入 っている)
• /etc ( 設 定 ファイルの 多 くは 基 本 的 にここに)
• /home (ユーザーのホーム。OS X では /Users なのでここは 空 )
• /sbin (システムの 管 理 コマンドなど)
• /tmp ( 一 時 領 域 )
• /usr ( 各 種 コマンド、プログラムなどが 入 っている)
• /var (ログや Web サイトのデータなど、 変 更 されるデータの 格 納 領 域 )
コマンドのオプションを 指 定 する
ターミナルから 実 行 できる 各 種 コマンドは、 「-(ハイフン) 」や「--(ハイフン ×2) 」で 始 ま
るオプション 指 定 が 用 意 されているものがあります。 以 下 のように 半 角 スペースに 続 けて
「-l( 小 文 字 の L) 」を 加 えて「ls」コマンドを 実 行 してみましょう。
> ‘-l’ を 付 けて ls コマンドを 実 行
$ ls -l
先 ほどのように 単 純 に「ls」を 実 行 しただけではディレクトリやファイル 名 が 羅 列 されただ
けだったものが、この「ls -l」のように「-l」オプションを 付 けることでパーミッションや 所 有
者 とグループも 一 緒 に 画 面 内 にリスト 表 示 することができます。
「-a」オプションを 付 ければ、 不 可 視 ファイルも 表 示 します。

ターミナルの 操 作 に 慣 れよう 23
> ‘-a’ を 付 けて ls コマンドを 実 行
$ ls -a
オプションはまとめてすることもできます(ls -l -a でも 可 ) 。
> 複 数 のオプションを 指 定 して 実 行
$ ls -la
冒 頭 で 紹 介 した「ps」コマンドもオプションを 付 けて 実 行 すれば、 起 動 中 のプロセスをさま
ざまな 形 で 閲 覧 できます。 次 のコマンドを 実 行 すると、システムが 実 行 しているプロセスを
はじめとして 起 動 中 のプロセスがすべて 確 認 できるでしょう。
> プロセスの 表 示
$ ps -ax
どうでしょうか?GUI で PC を 操 作 していると 表 向 きには 見 えないだけで、 実 は 裏 側 ではこ
のように 多 くのプロセスが 起 動 して 動 いているのです。 本 書 を 読 み 進 めていく 過 程 では、
至 る 所 でコマンドラインを 使 ってツールを 起 動 します。 動 いてるのかどうかわからない 時 な
どは、このようにして 調 べることができると 覚 えておきましょう。
コマンドの 使 い 方 やオプションが 知 りたいときは「man」コマンドを 実 行 するか、コマンドに
よっては「-h」や「--help」 「help」のオプションと 一 緒 にコマンド 実 行 すればヘルプ 画 面 を
表 示 することができます。
> ls コマンドのマニュアルを 表 示
$ man ls
マニュアルが 表 示 されたら、 「リターンキー」 「 矢 印 キーの 上 下 」 「F キー(forward) 」 「B
キー(backward) 」を 使 って 表 示 位 置 を 進 んだり 戻 したりすることができます。 変 なキーを
押 してしまったら「esc キー」を。マニュアル 画 面 を 終 了 するには「Q キー」を 入 力 します。
作 業 ディレクトリを 移 動 する
ターミナルでは、 現 在 自 分 がいるディレクトリを 基 準 にして 各 種 コマンドを 実 行 します。 現
在 の 作 業 ディレクトリを 変 えてどこか 別 のディレクトリに 移 動 するには、 「cd」コマンドを 実
行 します。 言 うまでもなく「Change Directory」の 略 です。

ターミナルの 操 作 に 慣 れよう 24
> デスクトップに 移 動 する
$ cd ~/Desktop
上 記 コマンドでデスクトップに 移 動 します。 「∼(チルダ) 」は、 自 分 のホームディレクトリ
($HOME)を 表 しますので 覚 えておきましょう。 「$HOME」のように $ ではじまる 文 字 列 は、 環
境 変 数 として 登 録 されています。 次 のようにコマンドに 組 み 合 わせて 使 うことも 可 能 です。
> 環 境 変 数 を 使 った 移 動
$ cd $HOME/Desktop
「cd」だけを 実 行 する、または「cd ∼」を 実 行 すれば 自 分 のホームディレクトリに 戻 ります。
> ‘∼’ を 付 けてホームに 移 動
$ cd ~
一 つ 上 の 階 層 に 移 動 したい 場 合 は、 「cd ..(ピリオド ×2) 」を 入 力 しましょう。
> ひとつ 上 の 階 層 に 移 動
$ cd ..
Web サイト 制 作 で 相 対 パスを 指 定 するのと 同 じですね。このようにコマンド 操 作 だけで 場
所 を 移 動 したり、ディレクトリの 中 身 を 確 認 したりするのは 簡 単 なことです。シェルの 扱 い
に 慣 れてくると、Finder を 使 って 場 所 を 移 動 しディレクトリを 開 くといった 操 作 すらもどかし
く 感 じるかもしれません。
.
ターミナルでは 日 本 語 の 入 力 もできますが、 移 動 などをよりスムーズにおこなうために
も 英 数 字 を 使 ったディレクトリ 名 にしておく 方 が 良 いでしょう。 日 本 語 の OS X の Finder
上 で「デスクトップ」 「 書 類 」と 表 示 される OS の 標 準 ディレクトリは、それぞれ「Desktop」
と「Documents」でアクセスできます。

ターミナルの 操 作 に 慣 れよう 25
入 力 補 完 を 利 用 する
「cd ∼/Desktop」のように 入 力 する 文 字 列 が 長 くなればなるほど 自 分 で 入 力 すれば 記 述
ミスが 発 生 しますし、ディレクトリが 深 くなればなるほど(ファイル 名 が 長 くなればなるほど)
入 力 に 時 間 がかかってしまうでしょう。そこで 時 間 がかかってしまうのであれば、GUI で 操
作 した 方 が 早 いということになってしまいます。
コマンドの 入 力 途 中 で「tab キー」を 押 せば、その 先 の 内 容 を 補 完 する 機 能 がほとんどの
シェルに 用 意 されています。
> ‘cd ∼/D’ を 入 力
$ cd ~/D(tab キー)
「cd ∼/D」まで 入 力 して tab キーを 2 回 押 せば、bash の 場 合 は「Desktop/ Documents/
Downloads/」のようにルートディレクトリ 以 下 にある「D」ではじまるディレクトリが 表 示 され
ます。
> 入 力 内 容 を 追 加
$ cd ~/Des(tab キー)
デスクトップに 移 動 したい 場 合 は、その 後 に 続 く「es」ぐらいまで 入 力 して 再 度 「tab キー」を
入 力 するとその 先 の 入 力 が 補 完 されて 自 分 で 入 力 する 必 要 はありません。デスクトップ
にあるディレクトリ 名 やファイル 名 がわからなくても、 補 完 された 後 に 再 度 tab キーを 2 回
押 せばその 次 の 候 補 が 表 示 されます。
> ディレクトリ 内 をさらに 調 べる
$ cd ~/Desktop/(tab キー)
大 量 にリストされた 場 合 は「:more」が 画 面 内 に 表 示 されます。この 表 示 を 終 了 するには
「Q キー」を 1 度 入 力 しましょう。ファイル 名 の 冒 頭 の 文 字 を 数 文 字 入 れれば、それが 含 ま
れるものに 絞 り 込 まれるので、また tab キーを 使 って 補 完 していけば 入 力 は 最 低 限 で 終 わ
ります。

ターミナルの 操 作 に 慣 れよう 26
.
Finder の「ディレクトリへ 移 動 」メニューでも「tab キー」による 補 完 が 可 能 です。
ヒストリー( 入 力 履 歴 )を 利 用 する
ターミナルでの 操 作 は、 何 度 も 何 度 も 同 じコマンドを 入 力 することもあるでしょう。 入 力 補
完 があるとはいえ、 同 じ 内 容 を 何 度 も 何 度 も 入 力 するほど 面 倒 なことはありません。bash
(やそれ 以 外 のシェルも 含 む)は、 一 度 実 行 した 結 果 をヒストリーとして 保 存 しています。
> ヒストリーの 表 示
$ ( 矢 印 キーの 上 下 )
上 矢 印 のキーを 押 していけば、 過 去 にそのシェルで 入 力 したコマンドを 遡 ることができま
す。 行 き 過 ぎたら、 下 矢 印 キーを 入 力 しましょう。このコマンドの 実 行 履 歴 は、 自 分 のホー
ムディレクトリの 直 下 に「.bash_history」という 不 可 視 ファイルで 保 存 されます。
.
bash では 矢 印 キーの 上 下 以 外 での 選 択 以 外 に、 「control + R」キーを 押 してから 任 意
の 文 字 列 を 入 力 し、ヒストリーをインクリメンタルサーチすることもできます。
コマンド 行 のキャレットの 移 動
ターミナルでは、ここまで 紹 介 したようにして 任 意 のコマンドをテキストで 入 力 します。 実 行
するコマンドにはオプションだけではなく、ディレクトリ 名 、ファイル 名 などを 付 け 加 えるの
で、 長 文 のコマンドで 打 ち 間 違 えなどがあると 修 正 箇 所 まで 戻 るのが 大 変 です。たとえば、
自 分 のホームディレクトリ 以 外 で 下 記 のコマンドを 行 末 まで 入 力 してから 間 違 いに 気 付 く
ことがあります。
$ cd Desktop/folder-name/filename
正 確 には「∼/Desktop/folder-name/filename」のようにチルダが 必 要 です。ここで 一 文 字
ずつ 入 力 内 容 を 消 去 したり、 「 矢 印 キー(←→) 」や「control + F」 「control + B」で 一 文

ターミナルの 操 作 に 慣 れよう 27
字 ずつ 移 動 するのは 面 倒 です。こういう 時 に 備 えてコマンド 行 の 中 のキャレットの 位 置 を
移 動 するショートカットを 覚 えておくと 良 いでしょう。bash では、 「control + A」でコマンド
行 の 先 頭 、 「control + E」でコマンド 行 の 最 後 に 移 動 できます。
ターミナルの 環 境 設 定 で「メタキーとして Option キーを 使 用 」のチェックボックスを 入 れて
おくと、 「option + 左 矢 印 (または option + F) 」で 単 語 をひとつずつ 飛 ばしてキャレットを
後 ろに 移 動 、 「option + 右 矢 印 (option + B) 」で 逆 に 前 方 に 単 語 をひとつずつ 飛 ばして
キャレットを 移 動 できます。
ターミナルの 環 境 設 定 でメタキーを 有 効 に
入 力 しかけたコマンドを 一 旦 キャンセルするには「control + C」を 入 力 します。これで 入 力
した 内 容 が 消 去 されます。 「delete キー」で 消 すより 簡 単 です。
> 入 力 をキャンセルする
$ cd Desktop/folder-nam(control + C キーを 実 行 )
入 力 途 中 のコマンドを 一 旦 取 り 消 してまた 再 び 入 力 するのであれば、 「control + U」と
「control + Y」の 組 み 合 わせを 覚 えておくとよいでしょう。 「control + U」で 一 度 取 り 消 した
内 容 は、 「control + Y」で 復 活 させることが 可 能 です。

ターミナルの 操 作 に 慣 れよう 28
> 入 力 を 取 り 消 す
$ cd Desktop/folder-nam(control + U キーを 実 行 )
> 取 り 消 した 内 容 を 戻 す
$ (control + Y キーを 実 行 すると 内 容 が 戻 る)
Finder でディレクトリを 開 く
任 意 のディレクトリを OS X の Finder 上 に 開 くには「open」コマンドが 使 えます。 「.(ピリオ
ド) 」は 現 在 のディレクトリを 表 しますので、 下 記 のコマンドを 実 行 すると Finder で 現 在 の
作 業 ディレクトリが 開 きます。
> 現 在 のディレクトリを Finder で 表 示
$ open .
OS X には Finder からは 直 接 開 けないディレクトリもあります。 開 きたい 場 合 は、Finder の
「ディレクトリへ 移 動 」メニューを 使 わなくてもターミナルから 直 接 開 くことができます。
> 不 可 視 のディレクトリを 表 示 する
$ open ~/Library/Application\ Support/
ディレクトリ 名 やファイル 名 に 半 角 スペースが 含 まれるものは「\ 」という 風 に「バックス
ラッシュ+ 半 角 スペース」の 入 力 が 必 要 です。これもタブキーによる 入 力 補 完 を 利 用 すれ
ば 簡 単 です。
ファイルの 内 容 を 表 示 する(テキストファイル)
テキストファイルの 中 身 などを 確 認 したい 場 合 は、 「cat」や「more」 「less」といったコマ
ンドが 使 えます。
「cat」コマンドでファイル 名 を 指 定 すれば、そのファイルの 内 容 がすべて 画 面 内 に 出 力 さ
れます。 「cat」コマンドの 本 来 の 用 途 は 複 数 ファイルを 繋 げる(concatenate)コマンドです
が、 単 一 のファイルの 全 体 をパッと 見 たいといった 用 途 にも 使 えます。コマンドを 実 行 すれ
ば、 画 面 内 にファイル 内 容 のすべてが 出 力 されて 終 了 します。 長 いテキストファイルが 出
力 されたとしてもターミナルの 画 面 をマウスカーソルで 遡 れば 内 容 は 確 認 できます。

ターミナルの 操 作 に 慣 れよう 29
> cat コマンドでファイルを 表 示
$ cat ファイル 名
長 いテキストファイルの 内 容 を 順 追 って 見 たい 時 は「more」または「less」コマンドが 便 利 で
す。いずれもファイルを 開 いて 画 面 をスクロールさせながら 内 容 を 確 認 できます。 「more」
や「less」は、 「/」や「?」を 入 力 してから 単 語 を 入 力 し「return」キーを 押 して 検 索 したり、ハ
イライトするといった 使 い 方 もできます(more と less で 挙 動 は 違 います) 。これらのコマン
ドはそのままでは 起 動 したままになるので、 終 了 するには「Q キー」を 入 力 しましょう。
> more コマンドでファイルを 表 示
$ more ファイル 名
> less コマンドでファイルを 表 示
$ less ファイル 名
ファイルの 拡 張 子 によっては「open」コマンドを 使 って 直 接 GUI のアプリケーションで 開 く
こともできます。
> ファイルを 任 意 のアプリケーションで 開 く
$ open ファイル 名
ログファイルなど 長 いファイルの 最 後 の 方 だけ 見 たい 場 合 は「tail」を 使 うと 便 利 で
す。 「tail」コマンドはファイルの 最 後 の 行 から 1 画 面 分 を 画 面 上 に 出 力 します。
> tail コマンドでファイルを 表 示
$ tail ファイル 名
画 面 の 内 容 をクリアする
コマンド 操 作 を 続 けていくと、ターミナルの 画 面 内 にはどんどん 文 字 列 が 表 示 されていき
ます。 現 在 表 示 されている 画 面 を 綺 麗 にしたい 場 合 は「clear」コマンドを 使 うとスクリーン
が 一 画 面 分 スクロールして 真 っ 新 の 画 面 になります。 「clear」コマンドは「control + L」の
ショートカットが 割 り 当 てられています。

ターミナルの 操 作 に 慣 れよう 30
> clear コマンドを 実 行
$ clear
.
スクロールしているだけなので、 画 面 をスクロールすれば 直 前 までの 画 面 に 戻 れます。
新 規 テキストファイルを 作 成 する
空 の 新 規 ファイルを 作 るには「touch」コマンドを 使 います。 本 来 の 用 途 は 既 存 のファイル
のタイムスタンプを 変 更 するものですが、ファイルが 存 在 しない 場 合 は 新 規 の 空 ファイ
ルが 作 成 されます。 以 下 のコマンドを 実 行 すると 現 在 の 作 業 ディレクトリに、 真 っさらの
「sample.txt」というテキストファイルができるでしょう。
> ‘sample.txt’ ファイルを 作 成
$ touch sample.txt
新 規 ディレクトリを 作 成 する
新 規 でディレクトリを 作 成 する 場 合 は「mkdir」コマンドを 使 います。 言 うまでもなく「MaKe
DIRectories」の 略 です。
> 新 規 ディレクトリの 作 成
$ mkdir ディレクトリ 名
任 意 のディレクトリ 名 を 付 けて 実 行 すれば、 現 在 の 作 業 ディレクトリに 新 しいディレクトリが
作 成 されます。 場 所 を 指 定 してディレクトリを 作 りたい 場 合 は、そこまでのパスを 入 力 して
ディレクトリ 名 を 指 定 します。

ターミナルの 操 作 に 慣 れよう 31
> 場 所 を 指 定 してディレクトリを 作 成
$ mkdir ~/Desktop/ディレクトリ 名
「mkdir」コマンドでは、 半 角 スペースを 空 けて 作 りたいディレクトリ 名 を 列 挙 すれば 複 数 の
ディレクトリを 一 度 に 作 成 可 能 です。
> 複 数 のディレクトリの 作 成
$ mkdir ディレクトリ A ディレクトリ B
「-p」オプションを 付 け 加 えれば、 階 層 構 造 をもったディレクトリも 直 接 作 れるので 覚 えてお
きましょう。
> 階 層 付 きでディレクトリを 作 成
$ mkdir -p 親 ディレクトリ 名 / 子 ディレクトリ 名
これらを 組 み 合 わせれば、 以 下 のように 一 回 のコマンドで「projects」ディレクトリ 内 に
「images」 「css」 「js」のディレクトリをあらかじめ 用 意 するといったことができますね。
> 階 層 付 きのディレクトリを 複 数 作 成
$ mkdir -p projects/images projects/css projects/js
ファイルやディレクトリを 移 動 する(リネームする)
ファイルやディレクトリを 移 動 する 場 合 は、 「mv」コマンドを 使 います。 言 わずもがな「MoVe
files」です。 移 動 する 対 象 と 移 動 する 場 所 を 対 で 指 定 します。
> mv コマンドを 実 行
$ mv ファイル 名 移 動 する 場 所
ファイルをデスクトップに 移 動 する 場 合 は 以 下 のようになります。 移 動 先 がディレクトリで
あれば 特 にファイル 名 を 指 定 する 必 要 はありません。

ターミナルの 操 作 に 慣 れよう 32
> デスクトップにファイルを 移 動
$ mv ファイル 名 ~/Desktop/
ファイル 名 も 指 定 したい 場 合 は、 移 動 先 でのファイル 名 を 指 定 しましょう。
> ファイル 名 を 指 定 して 移 動
$ mv ファイル 名 ~/Desktop/ 新 しいファイル 名
「mv」コマンドは、ファイルの 移 動 だけでなくファイル 名 を 変 更 も 可 能 です。 同 一 階 層 で「mv」
コマンドを 実 行 すれば、 単 純 にファイル 名 がリネームされます。 以 下 の 例 は、 「a.txt」が
「b.txt」に 変 更 されます。
> ファイル 名 の 変 更
$ mv a.txt b.txt
ファイル 同 様 、ディレクトリを 移 動 する 場 合 も「mv」コマンドを 使 います。
> ディレクトリを 移 動
$ mv ディレクトリ 名 移 動 する 場 所
簡 単 ですね。ディレクトリ 名 を 変 えたい 場 合 も「mv」コマンドを 使 いますので 覚 えておきま
しょう。
ファイルやディレクトリをコピーする
ファイルをどこか 別 の 場 所 にコピーしたり、 別 名 で 保 存 しておく 場 合 は「cp」コマンドを 使 い
ます。 言 うまでもなく…、です。
> ファイルをコピーする
$ cp ファイル 名 コピーする 場 所
「mv」コマンド 同 様 に 移 動 先 でのファイル 名 を 指 定 することもできます。

ターミナルの 操 作 に 慣 れよう 33
$ cp ファイル 名 ~/Desktop/ 新 しいファイル 名
同 じ 階 層 で「cp」コマンドを 実 行 すれば、 同 じものが 別 名 で 複 製 されます。 慣 れないターミ
ナルでテキストファイルを 編 集 する 際 は、あらかじめファイルを 別 名 で 複 製 しておいて 作
業 するのが 安 全 です。
> ファイルの 複 製
$ cp ファイル 名 新 しいファイル 名
「cp」コマンドはファイルだけでなくディレクトリのコピーも 可 能 ですが、ディレクトリの 場 合
は「cp」コマンドをそのまま 実 行 してもエラーになります。ディレクトリの 場 合 は「-R(-r) 」オ
プションが 必 要 です。
> ディレクトリのコピー
$ cp -R ディレクトリ 名 移 動 先 /ディレクトリ 名
OS X にはファイルやディレクトリのコピーする「ditto」という 別 のコマンドが 用 意 されてい
ます。’ditto’ コマンドは、ディレクトリをコピーする 時 もオプション 指 定 が 不 要 ですのでこち
らの 方 が 簡 単 ですね。
> ditto コマンドによるコピー
$ ditto ディレクトリ 名 移 動 先 /ディレクトリ 名
ファイルやディレクトリを 消 去 する
ファイルやディレクトリを 削 除 する 場 合 は「rm」コマンドを 使 います。 「ReMove」で 覚 えると
良 いでしょう。
「rm」コマンドを 実 行 すると Finder のゴミ 箱 に 入 るわけではありません。 実 行 すれば 問 答 無
用 で、 何 事 もなかったかのようにファイルやディレクトリは 消 え 去 りますので 注 意 が 必 要 で
す。

ターミナルの 操 作 に 慣 れよう 34
> rm コマンドでファイルを 消 去
$ rm ファイル 名
中 身 のあるディレクトリの 場 合 は「-R(-r) 」オプションを 付 けて 実 行 しましょう。
> ディレクトリを 消 去
$ rm -R ディレクトリ 名
いきなり 消 されるのが 怖 い 場 合 は、 「-i」オプションを 付 けて 実 行 することで 確 認 のダイ
アログを 出 すことができます。
> ‘-i’ オプション 付 きで rm コマンドを 実 行
$ rm -i ファイル 名
コマンドを 実 行 すると「Remove ファイル 名 ? 」と 聞 かれますので、 消 去 する 場 合 は「Y」
キー、キャンセルする 場 合 は「N」キーを 入 力 します。うっかり「return」キーを 押 しても 大 丈
夫 です。キャンセルされます。
> ‘rm -i’ による 確 認
Remove ファイル 名 ?(y か n を 入 力 )
rm コマンドは 慣 れるまで 慎 重 に 実 行 しましょう。
.
「rm」を 使 うといきなり 消 されてしまうので、それを 防 止 する「trash」のようなプログラム
もあります( 標 準 ではインストールされません) 。こういった 別 のコマンドを 別 途 インス
トールすることでファイルやディレクトリを 一 旦 ゴミ 箱 に 移 動 することができます。

ターミナルの 操 作 に 慣 れよう 35
.
「rm」コマンドを 必 ず「-i」オプション 付 きで 実 行 するためには、コマンドにいちいちオプ
ションを 付 けずシェルの alias 機 能 を 使 ってあらかじめコマンドを 登 録 しても 良 いでしょ
う。alias とは 任 意 のコマンドを 別 名 で 置 き 換 えることができるものです。alias について
は 後 の 章 で 解 説 しましょう。
複 数 のファイルやディレクトリをまとめて 操 作 する
複 数 のファイルやディレクトリをまとめて 移 動 したり 消 去 したい 時 は、ファイル 名 やディレク
トリ 名 の 代 わりに「*(アスタリスク) 」を 使 ってワイルドカード 指 定 をします。Web 制 作 の 作
業 中 に 特 定 の 拡 張 子 が 含 まれているものだけを 移 動 したり 消 したいことは 良 くあることで
すね。 以 下 のように「*.php」とすれば、themes ディレクトリ 内 の 拡 張 子 「.php」を 持 つファイ
ルがすべて 消 去 されます。
> ワイルドカードを 使 ったコマンドの 実 行
$ rm ./themes/*.php
以 下 のコマンドを 実 行 すれば「images」ディレクトリ 内 の「common-」で 始 まるファイルがすべ
て、 「images/common/」ディレクトリに 移 動 します。
> ワイルドカードを 使 ったファイルの 移 動
$ mv ./images/common-* ./images/common/
.
ワイルドカードで 移 動 や 消 去 、コピーする 対 象 を 指 定 する 場 合 で 中 にディレクトリが 含
まれる 時 は「-R」や「-f」オプションが 必 要 です。 「-f」オプションは「force( 強 制 的 に) 」
という 単 語 の 頭 文 字 です。
複 数 のファイルを 結 合 する
最 初 の 方 で 紹 介 した「cat」コマンドを 使 えば、 複 数 のファイルを 結 合 してひとつのファイル
にすることができます。 以 下 のように、 結 合 したい 複 数 のファイル 名 を「>」で 渡 してあげる
と「a.txt」と「b.txt」の 内 容 が 結 合 されて 新 しく「concat.txt」が 生 成 されます。

ターミナルの 操 作 に 慣 れよう 36
> ファイルの 結 合
$ cat a.txt b.txt > concat.txt
この「>」を「リダイレクト」と 呼 んでいます。ファイルが 既 に 存 在 している 場 合 は、 内 容 が 消
去 され( 上 書 きされ) 「a.txt」 「b.txt」の 内 容 に 変 わるので 注 意 が 必 要 です。ファイルが
既 に 存 在 していて、そこに 新 たに「c.txt」などの 内 容 を 追 加 したい 場 合 は「>>」を 使 いま
す。
> 既 存 のファイルに 追 加
$ cat c.txt >> cancat.txt
「cat」コマンドを 利 用 すれば、 「JavaScript のライブラリなどを 使 用 する 際 にライセンステキ
ストを 付 与 する」ような 作 業 も、わざわざファイルを 開 いてコピー&ペーストすることなくコ
マンドから 一 発 で 付 け 足 すことができます。
ファイルやディレクトリの 所 有 者 やパーミッションを 変 更 する
UNIX 系 の OS では、ファイルやディレクトリには 所 有 者 とグループが 設 定 されています。
OS X の 場 合 はシステムが 利 用 するものは、 所 有 者 が「root」でグループが「wheel(または
admin) 」になっています。 以 下 のコマンドを 実 行 するとリストの 中 の 項 目 の 所 有 者 とグ
ループが「root:wheel」になっているでしょう。
> ‘/usr/bin’ をリスト
$ ls -l /usr/bin
一 方 、デスクトップや 自 分 が 作 成 したディレクトリなどをリストすると「 自 分 のアカウント
名 :staff」になっているはずです。
> デスクトップをリスト
$ ls -l ~/Desktop

ターミナルの 操 作 に 慣 れよう 37
このように UNIX 系 の OS は 複 数 のアカウントで 使 うことを 前 提 としているため、 所 有 者 と
所 属 するグループが 厳 密 に 分 けられて 権 限 が 設 定 されています。
Web サイト 制 作 の 現 場 では、CMS を 設 置 する 時 などリモートのサーバにファイルをアップ
ロードして 実 行 ファイルに 実 行 権 限 を 与 えたり、ディレクトリのパーミッションを 変 更 するこ
とがよくあります。もちろんそれはローカルの OS X での 作 業 中 でもたびたび 発 生 するこ
とでしょう。そんな 時 は「chmod(CHange MODe) 」や「chown(CHange OWNer) 」 「chgrp
(CHange GRouP) 」のコマンドを 使 います。
ファイ ル や ディレ ク ト リ の パーミッション を 変 更 す る に は「chmod」コ マ ン ド を 使 い ま
す。 「chmod」コマンドの 後 にファイルやディレクトリのパーミッションを 指 定 してファイル
名 やディレクトリ 名 を 指 定 します。もちろんワイルドカード 指 定 もできますので、 任 意 の 拡 張
子 を 持 つファイルやディレクトリ 丸 ごとパーミッションを 変 えるといったことも 簡 単 です。
> ファイルのパーミッションの 変 更
$ chmod 755 example.cgi
> ワイルドカードによる 変 更
$ chmod 644 *.php
> ワイルドカードによる 変 更
$ chmod 777 ./htdocs/uploads/*
任 意 のファイルやディレクトリの 所 有 者 とグループを 変 更 する 場 合 は、それぞれ「chown」
コマンド、 「chgrp」コマンドを 使 います。 一 度 に 所 有 者 とグループを 変 えたい 場 合 は、 以 下
のように「 所 有 者 : グループ 名 」と 所 有 者 とグループ 名 を「:(コロン) 」で 区 切 って 一 緒 に 適
用 すると 簡 単 です(-R は 繰 り 返 し 処 理 オプション) 。
※PDF 版 では「 所 有 者 」と「グループ 名 」を 区 切 る「:」の 後 に 半 角 スペースが 入 ってるよう
に 見 えますが、この 位 置 の 半 角 スペースは 不 要 です。
> 所 有 者 とグループを 一 度 に 変 更
$ chown -R 所 有 者 : グループ 名 ファイル 名 やディレクトリ 名
いずれのコマンドにしても 所 有 者 が「root」である 場 合 は、 実 行 してもパーミッションエラー
になります。その 場 合 は「sudo」コマンドと 併 せて 以 下 のように 実 行 します(sudo コマンドに
ついては 後 述 ) 。

ターミナルの 操 作 に 慣 れよう 38
> ‘sudo’ 付 きでコマンドを 実 行
$ sudo chown -R 所 有 者 名 : グループ 名 ファイル 名 やディレクトリ 名
パスワードが 求 められたら、 自 身 の OS X パスワードを 入 力 します。 「*」を 使 って 任 意 の
ディレクトリ 以 下 のファイルをすべて 変 更 することも 可 能 です。
$ sudo chown -R 所 有 者 名 : グループ 名 /usr/local/bin/*
管 理 者 としてコマンドを 実 行 する
OS X ではシステムまわりのコマンドを 実 行 したり、 管 理 者 (root)でないと 開 けないファイ
ルがあります。そのようなディレクトリやファイルを 扱 う 場 合 は、 「sudo」をコマンドの 先 頭 に
付 けて 実 行 します。 「sudo」で 実 行 する 場 合 は、 管 理 者 パスワードの 入 力 を 求 められます
ので 自 身 の OS X パスワードを 入 力 しましょう。
> ‘sudo’ 付 きでコマンドを 実 行
$ sudo コマンド
特 に 最 近 の Web 制 作 では「npm」や「gem」などを 使 う 作 業 も 増 えています。 公 式 のインス
トーラでインストールしたために、コマンドの 実 行 時 に 常 に「sudo」を 付 けている 人 も 多 いの
ではないでしょうか(sudo なしで 実 行 するインストール 方 法 については 5 章 以 降 で 解 説 し
ます) 。 指 定 されたコマンドを 実 行 してもパーミッションエラーが 出 るようであれば、 再 度
「sudo」を 付 けて 実 行 してみましょう(これも alias 機 能 を 使 えば 短 くできます) 。
sudo コマンドは 一 度 パスワードを 入 力 すると 初 期 設 定 された 時 間 だけパスワード 入 力 が
省 略 されますが、 一 定 時 間 が 経 過 したあとは 再 度 パスワード 入 力 が 求 められます。 管 理
者 権 限 が 必 要 な 作 業 をしばらく 続 ける 場 合 など、いちいちパスワードを 入 力 するのがわず
らわしく 感 じるでしょう。そのような 場 合 は sudo に「-s」を 付 けて、 一 時 的 に root ユーザー
になってしまうこともできます。
> 一 時 的 に root ユーザーに 変 更
$ sudo -s
コマンドを 実 行 すれば、 以 後 root ユーザーとしてすべてのコマンドが 実 行 可 能 です(あま
りお 薦 めはしませんが) 。 作 業 が 終 わったら「control + D」キーを 押 して root ユーザーから
ログアウトしましょう。

ターミナルの 操 作 に 慣 れよう 39
.
root ユーザーになるコマンドは 他 にもいくつかありますが、 一 時 的 に 変 わるだけなら 上
記 の「sudo -s」を 覚 えておけば 良 いでしょう。 一 般 的 には sudo コマンドが 実 行 できる
ユーザーは 限 定 されます。

ターミナルの 操 作 に 慣 れよう 40
覚 えておくと 便 利 なコマンド
日 常 の 作 業 では 使 う 頻 度 は 少 ないかもしれませんが、 覚 えておくと 便 利 なコマンドもあり
ます。
コマンドの 場 所 を 確 認 する
ターミナルで 作 業 をしたり、CLI で 実 行 されるツールなどを 使 うようになると、 実 際 のコマン
ドがどこにあるかを 調 べたいときも 出 てきます。そのような 場 合 は「whereis」 「which」のコ
マンドが 使 えます。たとえば、OS X には 標 準 で PHP が 入 っていますが、コマンドの 場 所 を
確 認 するには 以 下 のように「whereis」または「which」にコマンド 名 を 付 けて 実 行 します。
> whereis コマンドの 実 行
$ whereis php
> which コマンドの 実 行
$ which php
コマンドを 実 行 すれば 場 所 を 教 えてくれます。
> 実 行 結 果
/usr/bin/php
.
既 に Homebrew やその 他 のツールで PHP が 別 にインストール 済 みで、それを 使 ってい
る 場 合 は「/usr/local/bin/php」などになるでしょう。

ターミナルの 操 作 に 慣 れよう 41
ファイルやディレクトリを 圧 縮 (アーカイブ)・ 解 凍 する
手 元 のディレクトリをまるごと zip 圧 縮 したり、アーカイブとして tar.gz といった 形 式 でまと
めるには、OS の 圧 縮 プログラムを 利 用 しましょう。リモートのサーバにディレクトリの 中 身 を
ちまちまと FTP でアップロードしたり、また 逆 にちまちまとダウンロードするようなことはでき
れば 避 けたいものです( 予 期 せぬ 事 態 でネットワークが 切 断 されてやり 直 しになるかもし
れません) 。
手 元 のファイルを zip 圧 縮 するには「zip」コマンドを 使 います。
> zip でファイルを 圧 縮 する
$ zip 保 存 するファイル 名 .zip 圧 縮 するファイル
ここでは 保 存 するファイル 名 が 先 になることに 注 意 してください。ディレクトリを 丸 ごと 圧
縮 する 場 合 は「-r」オプションを 付 けます。 「-r」オプションを 付 けないと 空 の zip ファイル
の 完 成 です。
> ディレクトリを zip 圧 縮 する
$ zip -r 保 存 するファイル 名 .zip 保 存 するディレクトリ
zip コマンドは 多 様 なオプションを 備 えています。 「-1」〜「-9」までで 圧 縮 率 を 変 えた
り、 「-f」オプションで 変 更 したファイルだけ 圧 縮 するようなことも 可 能 です。
では、 今 度 は zip を 解 凍 してみましょう。
> zip ファイルを 解 凍 する
$ unzip 解 凍 したいファイル
ディレクトリに 入 っているものはそのまま 解 凍 されます。オプションで「-Z」を 付 けると、.zip
の 中 身 を 表 示 することができます。
> zip ファイルの 中 身 を 確 認 する
$ unzip -Z 中 身 をみたい zip ファイル
インターネット 上 で 公 開 されているライブラリやフレームワークなどは「tar.gz」 形 式 (tar
形 式 のアーカイブ+ gunzip)でまとめられているものがあります。これらのファイルもコマン
ドラインから 元 のファイルに 戻 すことが 可 能 です。

ターミナルの 操 作 に 慣 れよう 42
> tar.gz 形 式 を 解 凍 する
$ tar -xvzf 解 凍 したいファイル.tar.gz
「tar」コマンドは、tar 形 式 のファイルを 操 作 するものです。オプションの 指 定 はいろいろあ
りますが、よくオプションとして 使 われる「-xvzf」は「eXtract/Verbose/gunZip/Filename」の
意 味 があります。 「 解 凍 する/ 冗 長 に/gunzip 形 式 も/ 次 のファイル 名 を」といったところで
しょうか。
逆 に tar.gz 形 式 でアーカイブ+ gunzip 圧 縮 したい 場 合 は、 「x」を「c(Create) 」に 変 える
だけです。
> tar.gz 形 式 で 圧 縮 する
$ tar -cvzf 圧 縮 するファイル 名 .tar.gz 圧 縮 する 対 象 のファイルやディレクトリ
これで 対 象 となるファイルやディレクトリなどが、tar.gz 形 式 でひとかたまりのファイルにな
ります。ここでは「-xvzf」 「-cvzf」とハイフン 付 きにしましたが、 「xvzf」 「cvzf」でも 大 丈
夫 です。Gunzip による 圧 縮 をせず、.tar 形 式 のアーカイブだけ 作 りたい 場 合 は「z」オプショ
ンを 抜 きましょう。
> tar 形 式 のアーカイブの 作 成
$ tar cvf 圧 縮 するファイル 名 .tar 圧 縮 する 対 象 のファイルやディレクトリ
このように 手 元 のファイルやリモートのファイルは、インターネット 経 由 で FTP などでのダ
ウンロード/アップロードの 前 に 一 度 丸 ごとまとめてから 作 業 する 方 がスムーズです。
.
リモートサーバへの SSH によるログインが 可 能 なら、ローカルやリモートで 圧 縮 ・ 解 凍
操 作 をすることにしておけば、FTP でバラバラと 大 量 のディレクトリやファイルを 扱 うこ
とはないでしょう。

ターミナルの 操 作 に 慣 れよう 43
SSH の 鍵 の 作 成
SSH でリモートのサーバにログインしたり GitHub などの Git リポジトリにアクセスするな
ど、 従 来 の FTP に 変 わって SSH と(その 鍵 )を 使 ってサーバとアクセスすることが 増 えてい
ます。 環 境 によってはパスワード 認 証 は 許 可 されず、SSH の 鍵 認 証 などでのログインしか
許 可 されないこともあります。SSH 鍵 をローカルのマシンで 生 成 するには、 以 下 のコマンド
を 実 行 します(オプションで 鍵 の 種 別 を 指 定 することもできます) 。
> SSH の 鍵 を 作 成
$ ssh-keygen
コマンドをそのまま 実 行 すると 下 記 のメッセージが 表 示 されます。 「id_rsa」はデフォルト
の 鍵 の 名 前 です。マシンをアップデートしている 場 合 などは 既 に 作 っていることも 多 いで
しょうから、 新 規 で 作 る 場 合 は 重 複 しないようにどこで 使 う 鍵 なのかわかりやすい 名 前 を
付 けて 鍵 を 作 成 しましょう。
> 生 成 中 の 画 面
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/username/.ssh/id_rsa): (ここに 鍵 の 保 存 場 \
所 を 記 述 )
任 意 で 鍵 の 名 前 を 決 めてリターンを 入 力 します(この 場 合 は、keyname) 。
> 鍵 の 保 存 場 所 と 名 前 を 入 力
Enter file in which to save the key (/Users/username/.ssh/id_rsa): /Users/us\
ername/.ssh/keyname(リターン)
鍵 にアクセスするためのパスフレーズの 入 力 が 求 められますので 入 力 します。パスフレー
ズを 忘 れると 開 くことができなくなるので、 頭 の 中 にしっかり 覚 えておくかどこかにこっそり
メモしておきましょう。
これで 生 成 される「keyname」というのが 秘 密 鍵 、 「keyname.pub」と’.pub’ が 付 いている 方
が 公 開 鍵 です。サードパーティのサービスなどに 登 録 する 時 は 公 開 鍵 を 登 録 します。 必 要
になったらテキストエディタなどで 開 いて 内 容 をコピーするか、 後 ほど 紹 介 する「pbcopy」コ
マンドでコピーして 登 録 しましょう。
SSH は「∼/ssh/config」でホスト 毎 の 設 定 が 可 能 です。
( 参 考 資 料 )ssh-keygen(1) Mac OS X Manual Page

ターミナルの 操 作 に 慣 れよう 44
SSH(SFTP)でリモートのサーバにログインする
SSH での 接 続 が 可 能 なリモートのサーバに 遠 隔 ログインしてマシンを 操 作 できます。ロー
カルのマシン 同 様 に 操 作 することはもちろん、GUI の FTP クライアントがなくとも SFTP を
使 ってファイルのアップロードやダウンロードも 可 能 です。SSH でリモートサーバにログイン
するには、パスワードによる 認 証 や SSH の 鍵 認 証 を 使 います。
> パスワードによるログイン
$ ssh username@example.com
SSH を 使 ってログインを 試 みると、 初 めてアクセスするホスト(IP)の 場 合 は 以 下 のように
接 続 の 処 理 を 続 けるか 確 認 がおこなわれます。 続 ける 場 合 は「yes」を 入 力 しましょう。
> 接 続 の 確 認
The authenticity of host 'example.com (--.--.--.--)' can't be established.
RSA key fingerprint is --:--:--:--:--:--:--:--.
Are you sure you want to continue connecting (yes/no)? (yes、または no を 入 力 )
yes を 入 力 して 進 むと「∼/.ssh/known_hosts」ファイルにホスト 名 (または IP)が 追 加 され
ます。
> known_hosts ファイルへの 追 加 の 通 知
Warning: Permanently added 'example.com' (RSA) to the list of known hosts.
パスワード 認 証 の 場 合 は、ここでログインパスワードを 聞 かれるので 入 力 します。
IP などが 既 に 登 録 されているのにマシンが 変 わった 場 合 など、Warning メッセージが
出 てホストへのログインができないことがあります。この 場 合 は known_hosts から 該 当
ホスト(IP)を 見 つけ 出 して 削 除 しましょう。テキストエディタで 該 当 行 を 1 行 削 除 しても
構 いませんが、 「ssh-keygen -R」コマンドを 使 うと 簡 単 に 削 除 することができます。
> known_hosts からの 削 除
.
$ ssh-keygen -R hostname

ターミナルの 操 作 に 慣 れよう 45
.
SSH の 鍵 認 証 を 使 ったログインは「-i」オプションで SSH の 鍵 を 指 定 します( 後 述 する
ssh-agent を 使 うと 便 利 です) 。
> SSH 鍵 の 認 証 によるログイン
$ ssh -i .ssh/key-name username@example.com
ログイン 後 はリモートサーバの OS にあわせてコマンドを 実 行 します。ここまで 紹 介 したコ
マンドは 同 じように 使 えるでしょう(Linux OS など UNIX 系 の OS の 場 合 ) 。
SFTP を 使 ってファイルのアップロードやダウンロードをおこなうなら、 以 下 のように「ssh」を
「sftp」に 変 えればログイン 可 能 です。こちらも 同 じようにパスワードを 聞 かれたら 教 えてあ
げましょう( 鍵 認 証 でのログインも 可 ) 。
> パスワードによる SFTP ログイン
$ sftp username@example.com
SFTP(FTP)でログイン 後 使 えるコマンドは 限 定 的 なものになります。リモートのサーバでは
ディレクトリのリストを 取 得 するのは「ls」で 同 様 ですが、それと 同 時 にローカルマシン 側 を
操 作 するコマンドも 使 えます。
> SFTP でログイン 後 のリモートのファイルのリスト 表 示
sftp> ls
ローカルマシン 側 の 操 作 をする 場 合 はコマンドの 先 頭 に「l( 小 文 字 の L) 」を 付 け 加 えま
しょう。ローカルの 作 業 ディレクトリの 一 覧 をリストするには「lls」となります。
> SFTP でログイン 後 のローカルのファイルのリスト 表 示
sftp> lls
他 にも「lcd」でローカルのディレクトリの 移 動 が 可 能 です。このように FTP や SFTP で 接 続
している 場 合 は、ひとつのターミナルの 画 面 で 双 方 を 操 作 できるのです。
ヘルプの 表 示 は「?」を 入 力 してリターン。ログアウトするには「bye」を 入 力 してリターン、も
しくは「control + D」を 使 いましょう。

ターミナルの 操 作 に 慣 れよう 46
> ヘルプの 表 示
sftp> ?
以 下 は、 参 考 までコマンドの 一 覧 を 載 せておきます( 環 境 によって 使 えるコマンドは 異 なり
ます) 。
> SFTP でログイン 後 に 使 えるコマンドの 一 覧
Available commands:
bye
cd path
chgrp grp path
chmod mode path
chown own path
df [-hi] [path]
exit
get [-Ppr] remote [local]
help
lcd path
lls [ls-options [path]]
lmkdir path
ln [-s] oldpath newpath
lpwd
ls [-1afhlnrSt] [path]
lumask umask
mkdir path
progress
put [-Ppr] local [remote]
pwd
quit
rename oldpath newpath
rm path
rmdir path
symlink oldpath newpath
version
!command
!
?

ターミナルの 操 作 に 慣 れよう 47
「ssh-agent」を 使 えば SSH の 鍵 を 登 録 して 簡 単 にログインできます。 登 録 するコマンド
は「ssh-add」です。
> SSH 鍵 の 登 録
$ ssh-add 鍵 の 場 所
オプションを 何 も 渡 さない 場 合 は 一 時 的 に 登 録 されますが、 「-K」オプション 付 きで 鍵
を 登 録 するとキーチェーンに 鍵 が 保 存 され 都 度 オプションを 指 定 する 必 要 はありませ
ん。
> SSH 鍵 をキーチェーンに 登 録
$ ssh-add -K 鍵 の 場 所
鍵 が 登 録 されたらオプションは 不 要 でログイン 可 能 です(sftp も 同 様 ) 。
> 登 録 後 のログイン
$ ssh username@example.com
登 録 済 みの 鍵 は「-l( 小 文 字 の L) 」を 付 けるとリストされます(-L にすると 内 容 も 含 め
て 表 示 ) 。
> 登 録 済 みの SSH 鍵 の 表 示
$ ssh-add -l
.
( 参 考 資 料 )ssh-agent(1) Mac OS X Manual Page ( 参 考 資 料 )ssh-add(1) Mac OS X
Manual Page ( 参 考 資 料 )ssh-agent の 使 い 方 - Qiita
シンボリックリンクの 作 成
OS X は、 本 来 の 場 所 とは 異 なる 場 所 に「エイリアス」としてショートカットを 作 ることができ
ます。UNIX 系 の OS では「シンボリックリンク」という 実 体 をもったように 振 る 舞 うリンクを
作 成 することができます(UNIX でのエイリアスは、まったく 別 の 意 味 の 機 能 をさします) 。

ターミナルの 操 作 に 慣 れよう 48
> シンボリックリンクの 作 成
$ ln -s 元 のファイルやディレクトリ シンボリックリンクの 場 所 (+ファイル 名 )
このシンボリックリンクは 他 の UNIX 系 OS でもよく 使 うので 覚 えておきましょう。
.
( 参 考 資 料 ) 知 っておくと 何 かと 重 宝 するシンボリックリンクを Mac で 作 成 する 方 法
現 在 の 日 時 を 表 示 する
現 在 の 日 時 を 表 示 したいときは「date」コマンドを 実 行 しましょう。
> 日 時 の 表 示
$ date
カレンダーを 表 示 する
今 月 のカレンダーが 見 たかったら「cal」コマンドで。
> カレンダーの 表 示
$ cal
英 語 の 発 音 を 確 認 する
英 単 語 の 発 音 が 知 りたい 場 合 は、 「say」コマンドが 使 えます。
> 文 章 の 読 み 上 げ
$ say hello world
コマンドの 実 行 結 果 を 他 のプログラムに 渡 す
「pbcopy」コマンドを 使 えば、OS X のクリップボードにテキストなどの 内 容 をコピーして 再 利
用 することもできます。

ターミナルの 操 作 に 慣 れよう 49
> 内 容 をクリップボードへコピー
$ ls ~/Desktop | pbcopy
実 行 してテキストエディタに 貼 り 付 けると、デスクトップのファイル 一 覧 が 表 れるでしょ
う。 「|」は「パイプ」と 呼 ばれるもので、その 区 切 りの 前 の 処 理 を 区 切 りの 後 のコマンドに
渡 します。pbcopy の 詳 しい 使 い 方 は「man pbcopy」で。
このパイプを 覚 えておくと 長 いドキュメントや 実 行 結 果 などを、 他 のプログラムに 渡 してみ
るといったことができます。 以 下 のようにパイプを 使 って「/usr/bin」のリスト 結 果 を「less」
に 渡 せば、 結 果 を 一 度 に 表 示 するのではなく 段 階 的 に 見 ていくことができます。
> パイプを 使 った 処 理
$ ls -la /usr/bin | less
こうすれば、 「grep」コマンドに 内 容 を 引 き 渡 して「passwd」の 文 字 列 が 含 まれるものだけ
を 画 面 に 出 すことができます。
> ‘passwd’ の 文 字 列 が 含 まれるものをリスト
$ ls -la /usr/bin | grep passwd
このパイプを 使 えば、 冒 頭 で 紹 介 した「ps -ax」コマンドを 使 って Web サーバが 起 動 してい
るかを 確 認 することも 可 能 です。
> httpd の 文 字 列 が 含 まれるプロセスだけを 表 示
$ ps -ax | grep httpd
起 動 していなければ「grep httpd」だけが 表 示 されて 終 了 します。
複 数 のコマンドを 一 度 に 実 行 するには?
ターミナルの 操 作 に 慣 れてくると、 「 複 数 のコマンドを 連 続 して 実 行 できたら…」という 衝
動 にかられるかもしれません。
一 般 的 なコマンドは 一 度 実 行 するとその 処 理 が 終 わるまでは 解 放 されません。 処 理 に 時
間 がかかるものや 一 連 のコマンドを 連 続 して 打 つような 操 作 をする 場 合 は、 一 度 に 複 数
のコマンドを 実 行 してしまえば 楽 です。 以 下 のコマンドは「example」ディレクトリを 作 成 して、
そこに 移 動 して「index.html」ファイルを 作 成 します。

ターミナルの 操 作 に 慣 れよう 50
> コマンドを 連 続 して 実 行 する
$ mkdir example && cd example && touch index.html
このようにそれぞれのコマンドを「&&」で 繋 げてあげると、そのコマンドの 処 理 が 終 わったら
次 、 次 のコマンドが 終 わったらまた 次 の 処 理 と 連 続 して 処 理 をさせることができます( 先 に
紹 介 したパイプの 機 能 とは 違 います。パイプはその 実 行 結 果 を 別 のコマンドに 引 き 渡 すも
の) 。
bash では「&&」で 処 理 を 続 けることができますが、ほかのシェルでは 場 合 によっては「&&」
が 使 えないことがあります。 「&&」 以 外 にコマンドの 行 末 をあらわすのに「;(セミコロン) 」
もあります(&& は 処 理 が 正 常 に 終 了 したら 次 へ 移 動 、; は 関 係 なく 次 へ) 。サイトなどに
記 載 されていることも 多 い「&&」ですが、コマンドの 区 切 りは「&&」だけでなく「;」もあわせて
覚 えておくと 良 いでしょう。
> ‘;’ を 使 った 例
$ mkdir example; cd example; touch index.html
.
コマンドをバックグラウンドで 実 行 したい 場 合 は、コマンドの 最 後 に「&」を 付 けると 処 理
をバックグラウンドに 回 すことができます。
.
これ 以 外 にも、OS X で 使 えるターミナルのコマンドは 豊 富 にあります。 一 部 OS X でし
か 動 かないものもありますが、その 多 くは 他 の UNIX でも 同 じように 使 えるでしょう。
( 参 考 資 料 )An A-Z Index of the Apple OS X command line ( 参 考 資 料 )An A-Z Index
of the bash command line for Linux

ターミナルの 操 作 に 慣 れよう 51
ターミナルでテキストを 編 集 する
ターミナルでは「Vim(Vi) 」や「emacs」 「nano」といったテキストエディタを 使 うことができ
ます。
ローカルではグラフィカル ・ ユーザー・ インターフェイスで 提 供 されるテキストエディタで
編 集 する 方 が 早 いでしょうが、OS X に 限 らずいろいろな 環 境 で 共 通 して 使 えるエディタ
の 簡 単 な 操 作 方 法 だけでも 覚 えておけば、リモートサーバにログインした 状 態 で 設 定 ファ
イルを 変 更 するといったことも 可 能 です。
Vim(Vi)
Vim は、もともと Vi として 提 供 されていたエディタの 改 良 版 です。 起 動 コマンドは「vim」で
も「vi」でも 構 いません。 同 じものが 起 動 します。
> Vim の 起 動
$ vi
Vim には、 「ノーマルモード」 「 挿 入 モード」 「コマンドモード」 「ヴィジュアルモード」とい
うモードの 概 念 があります。 何 か 操 作 を 行 うときにそれぞれのモードに 切 り 替 える 必 要 が
あります。これが Vim のちょっと 難 しい 部 分 です。ターミナルの 中 で 操 作 するため、 文 書 中
のキャレットの 移 動 などもすべてキーボードからおこなうことができます。 何 か 操 作 に 困 っ
たり、 画 面 の 意 味 がわからない 時 は「esc」キーを 入 力 してみましょう。
Vim の 起 動 直 後 は「ノーマルモード」になっています。コマンドだけ 実 行 した 場 合 は Vim の
初 期 画 面 が 開 きますが、そのままモードを 切 り 替 えて 入 力 可 能 です(ファイルの 保 存 は 後
半 を 参 照 ) 。 新 規 ファイル 名 を 指 定 すれば、そのファイル 名 で 画 面 が 開 きます。
> 新 規 ファイル 名 を 指 定 して 起 動
$ vi 作 成 するファイル 名
編 集 したいファイルがある 場 合 は、vi に 続 いて 半 角 スペースをあけてファイル 名 を 入 力 し
ます。

ターミナルの 操 作 に 慣 れよう 52
> ファイル 名 を 指 定 して Vim で 開 く
$ vi 編 集 したいファイル
このノーマルモードの 場 合 は、 矢 印 キーの 上 下 左 右 、またはキーボードの「h」 「j」 「k」 「l」
で 文 書 の 中 のキャレットを 移 動 することができます(※ キーボードの 大 文 字 小 文 字 は 区 別
されるので 気 を 付 けましょう。 以 下 大 文 字 のキーは Shift キーを 同 時 に 押 してください) 。
OS X Yosemite からは、マウスのスクロール 操 作 でキャレットの 上 下 移 動 が 可 能 です。
• 左 に 移 動 (←、または h)
• 右 に 移 動 (→、または l)
• 上 に 移 動 (↑、または k)
• 下 に 移 動 (↓、または j)
移 動 してみるとわかりますが、これらのキーを 入 力 すると 左 右 は 一 文 字 ずつ、 上 下 は 行 ご
とにキャレットが 移 動 するだけです。これだけでキャレットを 移 動 して 編 集 するのは 難 儀 な
ので、これ 以 外 に 最 初 の 行 (gg)や 最 後 の 行 (G) 、 行 の 先 頭 (0 - ゼロ)や 行 の 最 後 ($) 、
単 語 を 飛 ばして 移 動 (w や b)といったショートカットがあります。 慣 れないうちは 矢 印 キー
の 上 下 左 右 の 移 動 からはじめてみましょう。
ノーマルモードで 開 いた 文 書 を 編 集 したい 場 合 は「 挿 入 モード」に 切 り 替 えます。 挿 入 モー
ドへの 切 り 換 えは、いくつかのキーを 押 すことで 切 り 替 わります。 何 のキーを 入 力 するかで
キャレットの 位 置 を 思 い 通 りの 位 置 に 変 えてから 編 集 可 能 です。
• i(キャレットの 位 置 から 挿 入 )
• a(キャレットの 次 の 位 置 から 挿 入 )
• I( 行 の 先 頭 テキストに 移 動 して 挿 入 )
• A( 行 末 にキャレットを 移 動 して 挿 入 )
• o( 下 に 空 白 行 を 入 れて 挿 入 )
• O( 上 に 空 白 行 を 入 れて 挿 入 )
• s( 一 文 字 消 して 挿 入 )
慣 れないうちは「i」キーを 押 せば、キャレットの 位 置 で 挿 入 モードに 切 り 替 わると 覚 えてお
けば 良 いでしょう。 挿 入 モードの 時 は、 通 常 のテキストエディタ 同 様 に「delete」キーで 文 字
を 消 すこともできます(control + H でも) 。 挿 入 モードを 解 除 するには「esc」キーを 入 力 し
ます。 挿 入 モードを 解 除 すればノーマルモードに 移 行 します。
ノーマルモードでは、 文 字 を 消 したり 行 を 丸 ごと 削 除 したりすることもできます。

ターミナルの 操 作 に 慣 れよう 53
• x(キャレットの 位 置 から 1 文 字 消 す〜 delete)
• X(キャレットの 位 置 から 1 文 字 消 す〜 back space)
• D(キャレットの 位 置 から 行 末 まで 削 除 )
• dd(その 行 をまるごと 削 除 )
• 数 字 + dd(キャレットの 位 置 から 指 定 した 数 字 ぶんの 行 をまるごと 削 除 )
ノーマルモードで「dd」を 入 力 すれば、キャレットのある 行 が 1 行 まるごと 削 除 されま
す。 「10dd」のように 数 字 を 加 えて 実 行 すると、キャレットの 位 置 から 10 行 が 消 去 され
ます。このようにモードを 切 り 替 えながら 編 集 をおこなうのが Vim の 特 徴 です。 文 書 内 の
単 語 を 検 索 したい、 編 集 が 終 わって 保 存 したい、Vim を 終 了 したいときなどは「コマンド
モード」に 移 行 します。コマンドモードは「/(?) 」や「:(コロン) 」などを 入 力 して 切 り 替 えま
す。
• /( 文 字 列 を 検 索 する)
• ?( 文 字 列 を 検 索 する)
• :(コマンドの 入 力 )
文 書 内 の 単 語 を 検 索 する 場 合 は「/」を 入 力 して 検 索 したい 文 字 列 を 入 れてリターンキー
を 押 しましょう。 「/」で 次 を 検 索 、 「?」で 前 を 検 索 します。 編 集 が 終 わったら「 文 書 を 保 存
する」 「 名 前 を 付 けて 保 存 する」 「 保 存 しないで 閉 じる」といった 操 作 をおこなうでしょう。
まずは「:」を 入 力 してコマンドモードに 切 り 替 えて 以 下 を 入 力 します。
• w( 保 存 )
• wq( 保 存 して 終 了 )
• q(Vim を 終 了 )
• q!( 変 更 を 保 存 せずに Vim を 終 了 )
新 規 ファイルを「vi」だけで 作 った 場 合 は、コマンドモードに 切 り 替 えて「:w ファイル 名 」を 実
行 すればファイル 名 が 付 与 されて 保 存 されます。
> ファイル 名 を 付 けて 保 存
:w ファイル 名
コマンドモード 以 外 にもノーマルモードで 直 接 保 存 して 終 了 することができます。

ターミナルの 操 作 に 慣 れよう 54
• ZZ( 保 存 して 終 了 )
このように Vim は、ノーマルモード、 挿 入 モード、コマンドモードを 適 時 切 り 替 えて 文 書 を 編
集 するテキストエディタなのです。
この Vim の 基 本 操 作 を 覚 えてしまえば、OS X だろうが Linux だろうが、FreeBSD だろうが
テキストの 編 集 は 可 能 です。リモートのサーバの 設 定 ファイルを 編 集 するといったことも、
いちいちダウンロードして 書 き 換 えてアップロードするような 面 倒 くさい 作 業 とはおさらば
できるでしょう。
.
( 参 考 資 料 )Vim 基 本 操 作 まとめ - Archiva
nano
Vim(Vi)はその 操 作 に 慣 れないうちは、 文 書 の 編 集 操 作 が 非 常 に 怖 く 感 じます。そんな 時
は「nano」を 起 動 してテキストを 編 集 すると 良 いでしょう。
> nano の 起 動
$ nano
> ファイル 名 を 指 定 して 起 動
$ nano ファイル 名
nano を 起 動 するとスクリーンの 下 にメニューとショートカットが 表 示 されます。Vim のよう
にノーマルモードや 挿 入 モードといった 切 り 換 えはありません。そのままキャレットを 移 動 し
てファイルを 編 集 し、 保 存 することができます。ターミナルの meta キー(option キー)を 有
効 にしていれば、さまざまなショートカットも 使 えます。
• control + G(ヘルプを 表 示 。 閉 じるのは control + C)
• control + C(さまざまな 操 作 をキャンセル)
• control + O( 名 前 をつけて 保 存 する)
• control + X(nano を 終 了 する)

ターミナルの 操 作 に 慣 れよう 55
• control + W( 文 字 列 を 検 索 する)
これ 以 外 にもキャレットの 移 動 などにショートカットが 用 意 されています。
• control + A( 行 の 先 頭 に 移 動 )
• control + E( 行 の 最 後 に 移 動 )
• control + space( 単 語 を 順 にひとつ 飛 ばしで 後 ろに 移 動 )
• meta + space( 単 語 を 順 にひとつ 飛 ばしで 前 に 移 動 )
設 定 ファイルなどを 編 集 する 場 合 は、そのままではテキストの 折 り 返 しの 処 理 がはいって
しまい 問 題 が 起 きる 可 能 性 があります。 折 り 返 しを 無 効 化 して 起 動 すると 意 図 しないエ
ラーは 回 避 できるでしょう。
> 折 り 返 しを 無 視 して 起 動
$ nano -w ファイル 名
「-w」オプションはテキストの 折 り 返 しを 無 効 化 します。これ 以 外 にも 閲 覧 専 用 で 開 くなど
さまざまなオプションがあります。 詳 しくは「man nano」コマンドで 表 示 されるマニュアル
か、 「nano --help」を 実 行 して 確 認 しましょう。
どうでしょうか?ここまで 説 明 してきたように 日 頃 の 操 作 で 使 うコマンドはさほど 多 くはあ
りません。コマンドの 実 行 方 法 やオプションの 存 在 、ディレクトリの 移 動 やファイルの 作 成 、
コピー、エディタの 簡 単 な 使 い 方 ぐらいを 覚 えておけば、 日 常 的 な 作 業 においては 困 るこ
とはないでしょう。

制 作 環 境 構 築 の 下 準 備
実 際 の 制 作 環 境 を 作 り 始 める 前 に 下 準 備 をしておきましょう。コマンドラインを 使 ったツー
ルが 増 えているいまどきの Web 制 作 では、それらをすんなりと 扱 うためにもあらかじめ 入
れておいた 方 が 良 いソフトウェアがあります。 本 章 で 紹 介 する 各 種 ツールはなくてもどう
にかなりますが、いずれどこかでこれらのお 世 話 になることになるかもしれません(ないと
始 まらないこともあります) 。ここで 前 もってインストールだけ 済 ませておきましょう。
56

制 作 環 境 構 築 の 下 準 備 57
Xcode とコマンドラインツールのインストール
Xcodeは、OS X や iOS のアプリケーションを 作 成 するための 統 合 開 発 環 境 です。Web 制
作 の 現 場 では iOS シミュレータなどで 既 にお 世 話 になっている 方 もいらっしゃるかもしま
せんね。 最 新 の Web 制 作 ツールを 利 用 するにあたって Xcode 本 体 は 必 要 ありませんが、
Apple の Developer サイトで 公 開 されている「Command Line Tools for Xcode」だけはイン
ストールしておきましょう。
Xcode のダウンロード
Xcode は、App Store からダウンロードしてインストールすることができます。 前 述 のように
本 体 そのものは iOS アプリなどの 開 発 をしない 限 りは 必 要 ではありません。Web とネイ
ティブで 動 作 するハイブリッドなアプリを 開 発 する 時 がきたら、 「Cordova」のようなツール
でコンパイル ・ シミュレートをする 際 に 必 要 となるなので 入 れておくと 良 いでしょう(ディス
ク 容 量 が 切 迫 している 方 は、 次 の Command Line Tools だけでも 構 いません) 。
Xcode は App Store からダウンロード
Xcode がインストールできているかを 確 認 する 場 合 は、 以 下 のコマンドをターミナルから 実
行 します。

制 作 環 境 構 築 の 下 準 備 58
> Xcode の 有 無 を 確 認
$ xcode-select -p
既 にインストールされている 場 合 は、 以 下 のようにインストール 先 が 表 示 されます。
> コマンドの 実 行 結 果
$ /Applications/Xcode.app/Contents/Developer
コマンドラインツールのインストール
Apple が 提 供 す る ソ フ ト ウェア の コ ン パ イ ル に 必 要 な コ マ ン ド ラ イ ン ツール 一 式
は、 「Command Line Tools for Xcode」として、Xcode とは 別 に 配 布 されています。この
ツール 群 は、Apple の Developer サイトからダウンロードするか( 要 無 償 の 会 員 登 録 ) 、
ターミナルからインストールすることもできます。
Command Line Tools は OS X のバージョン 毎 に 分 かれて 配 布 されています。Web サイト
からダウンロードする 際 は、 使 用 中 の OS のバージョンにあわせてダウンロードしてくださ
い。このファイルは Xcode のアップデートの 時 などにあわせてバージョンアップされますの
で、たまには 最 新 版 がないか 覗 いてみると 良 いでしょう。ダウンロードが 終 わったらインス
トールしておきます。

制 作 環 境 構 築 の 下 準 備 59
Command Line Tools は OS のバージョン 別 に 配 布
インストーラを 起 動 して 画 面 の 指 示 に 従 ってインストール
既 に Command Line Tools がインストール 済 みかはどうかわからない 場 合 は、 以 下 のコマ

制 作 環 境 構 築 の 下 準 備 60
ンドを 実 行 してみると 良 いでしょう。 「gcc」の 実 行 には、Command Line Tools が 必 要 にな
ります。
> インストールされているかの 確 認
$ gcc
ダイアログが 表 示 されたらインストールを 実 行 するか、あらかじめターミナルからインス
トールする 場 合 は 以 下 のコマンドを 入 力 します。
> Command Line Tools をターミナルからインストール
$ xcode-select --install
インストールが 終 わったら 確 認 してみましょう。
> gcc のバージョンを 確 認
$ gcc --version
インストールされていれば「gcc」コマンドのバージョンが 表 示 されます。
> gcc のバージョン 表 示
gcc --version
Configured with: --prefix=/Applications/Xcode.app/Contents/Developer/usr --w\
ith-gxx-include-dir=/usr/include/c++/4.2.1
Apple LLVM version 6.0 (clang-600.0.56) (based on LLVM 3.5svn)
Target: x86_64-apple-darwin14.0.0
Thread model: posix
回 線 環 境 をシミュレートする 設 定 のインストール
Apple の Developer サイトには、Web 制 作 の 現 場 で 役 に 立 つ「Hardware IO Tools for
Xcode」も 公 開 されています。こちらもあわせてダウンロードしておくと 便 利 です。このツー
ル 群 には「Network Link Conditioner.prefpane」が 含 まれています。このファイルをダブルク
リックしてインストールすると、 環 境 設 定 のパネルからネットワーク 速 度 に 制 限 をかけるこ
とができます。

制 作 環 境 構 築 の 下 準 備 61
これがあれば 回 線 環 境 をシミュレートしながら、 制 作 中 もしくは 公 開 中 の Web サイトの 表
示 速 度 チェックが 可 能 です。 普 段 高 速 な 回 線 で 作 業 していると、 遅 い 回 線 のことは 自 分
で 気 にしない 限 りは 気 付 きませんからインストールしておきたいものです。 同 様 のことは
「Charles」のような GUI アプリケーションでも 可 能 です。
JRE(Java Runtime Environment)のインストール
開 発 ツール の 中 に は、Java を 必 要 と す る も の が あ り ま す の で「JRE(Java Runtime
Environment) 」をインストールします。Java のパッケージの 最 新 版 は Oracle のサイト
で 公 開 されていますが、 中 には Java 6 を 要 求 するものがあり、Apple 社 が 公 開 している
「Java for OS X 2014-001」が 必 要 なことがあります。あらかじめこちらもインストールしておき
ましょう。
ここまで 紹 介 したもろもろのソフトウェアは、インストールが 終 わったら 特 に 何 もする 必 要
はありません。
Hardwawre IO Tools も Apple の Developer サイトから

制 作 環 境 構 築 の 下 準 備 62
ダウンロードファイルを 開 いてダブルクリックでインストール
システム 環 境 設 定 からパネルを 開 いて 通 信 速 度 を 制 限 可 能

制 作 環 境 構 築 の 下 準 備 63
Java for OS X のダウンロード

制 作 環 境 構 築 の 下 準 備 64
Homebrew のインストール
OS X は UNIX ベースの OS ですが、UNIX 系 の OS でよく 利 用 されるツールがすべて 入 っ
てるわけではありません。また、ひとつのバージョンとしてパッケージングされて 提 供 され
る OS という 性 質 上 、システムの 出 荷 時 にあらかじめインストール 済 みの 各 種 ソフトウェア
のバージョンがどうしても 古 くなってしまうことが 起 こります。 「Homebrew」は、そういった
問 題 を 解 決 してくれるパッケージマネージャと 呼 ばれるソフトウェアです。
Yosemite にインストール 済 みのソフトウェア
Homebrew をインストールする 前 に、OS X Yosemite にインストール 済 みで Web 制 作 の 現
場 で 使 いそうなソフトウェアのバージョンを 確 認 してみましょう。 各 種 ソフトウェアのバー
ジョンもコマンドラインから 確 認 できます。
実 は OS X には、Web(HTTPD)サーバである Apache、そして PHP もインストールされてい
ます。Apache は 初 期 状 態 でただ 起 動 されてないだけです。Apache のバージョンを 確 認 す
るには、 以 下 のように「-v」オプションを 付 けて 下 記 のコマンドを 実 行 します(ソフトウェアに
よっては、--version オプションで 表 示 ) 。
> Apache のバージョン 確 認
$ httpd -v
コマンドを 実 行 すると 以 下 のように 表 示 されます。
> Apache のバージョン 表 示 結 果
Server version: Apache/2.4.9 (Unix)
Server built: Sep 9 2014 14:48:20
Apache の 執 筆 時 点 (2014 年 12 月 末 )での 最 新 版 は「2.4.10」で、これは 2014 年 の 7 月 に
リリースされているものです。PHP は 複 数 のバージョンがありますが、OS X にインストール
済 みの 5.5.x 系 の 最 新 版 は「5.5.20」です。このようにちょっとだけ 古 いバージョンになって
しまうのです。 以 下 、OS X Yosemite にインストール 済 みのソフトウェアのバージョンです。
• Apache: Apache/2.4.9 (Unix)
• PHP: PHP 5.5.14 (cli) (built: Sep 9 2014 19:09:25)

制 作 環 境 構 築 の 下 準 備 65
• Ruby: ruby 2.0.0p481 (2014-05-08 revision 45883)
• Python: Python 2.7.6
• Git: git version 1.9.3 (Apple Git-50)
次 に 執 筆 時 点 (2014 年 12 月 末 )での 各 ソフトウェアの 最 新 バージョンです。
• Apache: 2.4.10
• PHP: 5.4.36/5.5.20/5.6.4
• Ruby: 2.2.0
• Python: 2.7.9/3.4.2
• Git: 2.2.1
ご 覧 のようにやはり 最 新 OS であるとはいえ、バージョンには 違 いがあるものなのです。
.
決 して 古 いのが 悪 いというわけではありませんが( 重 大 なセキュリティ 上 の 問 題 がある
ものはアップデートされます) 、 最 新 の OS であればまだしも 数 年 にわたって 使 ってい
くとどうしても 古 いものを 使 ってる 状 態 になります。Git については 2014 年 12 月 に 脆 弱
性 が 見 つかっていますが、2014 年 12 月 末 の 執 筆 時 点 では Xcode の β 版 をインストー
ルしないと 更 新 されないようです。
Homebrew とは
Homebrewは「The missing package manager for OS X」というタグラインが 示 すように、OS
X にはないパッケージを 管 理 するためのソフトウェアです。Linux など UNIX 系 の OS に 触
れる 機 会 がある 方 には、おなじみのパッケージマネージャーです。
そもそもソフトウェアは、ソースコードがあってそれをコンパイルすることで 動 作 するもので
す。 公 開 されたソースコード 一 式 をコンパイルするといっても、その 他 にも 必 要 なソフトウェ
アが 存 在 します。これらを 手 動 で 用 意 してコンパイルして 実 行 するという 作 業 は、OS に 詳
しくない 人 、 慣 れない 人 には 苦 行 以 外 の 何 ものでもありません。できれば、インストールも
アップデートもアンインストールも 簡 単 であるに 超 したことはありません。
そういった 手 間 を 軽 減 するためにもソフトウェアをすぐに 利 用 できるようにパッケージ 化 し
て、その 実 行 に 必 要 な 他 のソフトウェアとの 依 存 関 係 までを 丸 っと 管 理 してしまおうという
のがパッケージマネージャーです。 各 種 Linux 系 の OS をはじめとして UNIX 系 の OS で

制 作 環 境 構 築 の 下 準 備 66
は、 使 う 仕 組 みこそ 異 なりますがそれぞれにこのようなパッケージマネージャーが 存 在 し
ています。この 考 え 方 は、いまどきの Web 制 作 でもよく 利 用 するツールにも 採 り 入 れられ
ています。node.js の「npm」や Ruby の「RubyGems(gem) 」は、まさにそれ 専 用 のパッケー
ジマネージャーに 他 なりません。
Homebrew の 役 割 は、 「システム 内 のファイルを 直 接 変 更 することなく、 比 較 的 最 新 版 の
ソフトウェアを 使 えるようにする」 「インストールされてない UNIX 系 のソフトウェアを 簡 単
に 使 えるようにして、ソフトウェアのバージョンを 含 めて 全 体 を 管 理 する」ことだと 思 っても
らえば 良 いでしょう。
Homebrew の 公 式 サイト
Homebrew のインストール
Homebrew のインストールは 簡 単 です。
公 式 サイトに 記 載 されたインストールコマンドをターミナルから 実 行 しましょう。 下 記 のコ
マンドが 変 わることはないと 思 いますが、 公 式 サイトのトップページ 下 にあるコマンドをコ
ピーしてターミナルの 画 面 にペーストして「return キー」を 押 して 実 行 してください。

制 作 環 境 構 築 の 下 準 備 67
Homebrew のインストールコマンドはページの 下 に
> Homebrew のインストールコマンド
$ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/m\
aster/install)"
コマンドを 実 行 すると 以 下 のようにインストールプロセスが 始 まります。 途 中 パスワードを
入 力 する 必 要 がありますので、ほったらかしにせずしばらく 眺 めていてください。

制 作 環 境 構 築 の 下 準 備 68
コマンドをコピー&ペーストして 実 行 。 一 度 リターンキーを 入 力 する
パスワードの 入 力 を 求 められたら 入 力

制 作 環 境 構 築 の 下 準 備 69
> インストール 中 の 出 力
==> This script will install:
/usr/local/bin/brew
/usr/local/Library/...
/usr/local/share/man/man1/brew.1
Press RETURN to continue or any other key to abort(リターンキーを 入 力 )
==> /usr/bin/sudo /bin/mkdir /usr/local
WARNING: Improper use of the sudo command could lead to data loss
or the deletion of important system files. Please double-check your
typing when using sudo. Type "man sudo" for more information.
To proceed, enter your password, or type Ctrl-C to abort.
Password:(パスワードを 入 れてリターンキーを 入 力 )
==> /usr/bin/sudo /bin/chmod g+rwx /usr/local
==> /usr/bin/sudo /usr/bin/chgrp admin /usr/local
==> /usr/bin/sudo /bin/mkdir /Library/Caches/Homebrew
==> /usr/bin/sudo /bin/chmod g+rwx /Library/Caches/Homebrew
==> Downloading and installing Homebrew...
remote: Counting objects: 218996, done.
remote: Compressing objects: 100% (57781/57781), done.
remote: Total 218996 (delta 160034), reused 218919 (delta 159981)
Receiving objects: 100% (218996/218996), 48.94 MiB | 4.39 MiB/s, done.
Resolving deltas: 100% (160034/160034), done.
From https://github.com/Homebrew/homebrew
* [new branch] master -> origin/master
HEAD is now at 3bdab72 libmagic: update 5.21 bottle.
==> Installation successful!
==> Next steps
Run `brew doctor` before you install anything
Run `brew help` to get started
ここまで 表 示 がでたらインストール 完 了 です。 最 後 に 記 載 されているように、まずは「brew
doctor」コマンドを 実 行 しましょう(brew doctor コマンドについては 後 述 ) 。

制 作 環 境 構 築 の 下 準 備 70
> インストール 後 にセルフチェック
$ brew doctor
Homebrew のセルフチェックが 実 行 され、 問 題 がなければ 以 下 のような 表 示 が 出 力 され
るでしょう。
> ‘brew doctor’ の 実 行 後
Your system is ready to brew.
Homebrew の 各 種 ファイルは「/usr/local」ディレクトリ 以 下 にインストールされます。
Homebrew を 使 ってインストールされたソフトウェアは、 「/usr/local/Celler」ディレク
トリに 格 納 されて、それぞれが「/usr/local/bin」にシンボリックリンクが 追 加 されて 使 える
状 態 になります。
brew コマンドが 実 行 されない 場 合 は、 以 下 のコマンドを 実 行 してみましょう。
> 環 境 変 数 の 確 認
$ echo $PATH
表 示 結 果 に「/usr/local/bin」があるか 確 認 してください。
> 環 境 変 数 の 表 示 結 果
/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
「/usr/local/bin」が 含 まれていない 場 合 は、 以 下 のコマンドを 実 行 して 環 境 変 数 のパ
スに 追 加 します。パスの 解 説 は 後 述 。
> 環 境 変 数 にパスを 追 加
$ echo export PATH='/usr/local/bin:$PATH' >> ~/.bash_profile
追 加 した 設 定 を 再 読 み 込 みします。
.
> bash の 設 定 を 再 読 み 込 み

制 作 環 境 構 築 の 下 準 備 71
$ source ~/.bash_profile
.
もう 一 度 「brew」コマンドが 実 行 できるか 確 認 しましょう(bre まで 入 力 して tab キーで 候
補 に「brew」が 見 えれば 大 丈 夫 です) 。
以 下 、 「brew doctor」を 実 行 して 起 こりがちなエラーとその 対 策 です。
書 き 込 み 権 限 がないと 言 われる
Warning: Some directories in /usr/local/share/man aren’t writable.
This can happen if you “sudo make install” software that isn’t managed
by Homebrew. If a brew tries to add locale information to one of these
directories, then the install will fail during the link step. You should probably
chown them:
/usr/local/share/man/man3
/usr/local/share/man/man5
/usr/local/share/man/man7
「/usr/local」ディレクトリ 以 下 に 書 き 込 み 権 限 がないと 言 われて 処 理 が 続 けられない
場 合 は、 「chown」コマンドを 使 って 所 有 者 とグループを 変 えましょう。 所 有 者 は「 自 分
のアカウント 名 」 、グループは「admin」にすれば 大 丈 夫 でしょう。
> 所 有 者 とグループを 変 更 する
$ sudo chown -R username:admin /usr/local/*
node ディレクトリのヘッダファイルが 列 挙 される
Warning: Unbrewed header files were found in /usr/local/include.
If you didn’t put them there on purpose they could cause problems when
building Homebrew formulae, and may need to be deleted.
.

制 作 環 境 構 築 の 下 準 備 72
Unexpected header files:
/usr/local/include/node/ares.h
/usr/local/include/node/ares_version.h
/usr/local/include/node/nameser.h
/usr/local/include/node/node.h
・・・ 以 下 ファイル 名 が 続 く
node.js を 既 に イ ン ス トール し て い て こ の エ ラーが 出 る 人 は 非 常 に 多 い の で す
が、 「/usr/local/include/node」ディレクトリ 内 にある node.js のヘッダファイルを 消
しましょう。
> /usr/local/include/node 内 のヘッダを 消 す
$ sudo rm -f /usr/local/include/node/*.h
$ sudo rm -f /usr/local/include/node/openssl/*.h
$ sudo rm -f /usr/local/include/node/uv-private/*.h
.
node.js を 公 式 のインストーラからでなくインストールする 方 法 は 後 の 章 で 紹 介 します。
そうすればこのエラーとは 無 縁 になるでしょう。
パスを 通 す? 環 境 変 数 に 追 加 する?
エンジニアさんのブログ 記 事 などを 読 んでいるとよく「 環 境 変 数 に 追 加 する」 「パスを 通
す」という 表 現 がされています。プログラミングやバックエンドのことに 不 慣 れだと、これら
の 言 い 回 しでまず 躓 くのではないでしょうか?
通 常 、システムが 利 用 するコマンドは「/bin」や「/usr/bin」といったディレクトリに 実 行 ファ
イルを 置 くようになっています。すべてがシステムに 関 係 するソフトウェアであれば 良 いの
ですが、そういうものばかりでもありません。 時 には 今 回 の Homebrew のように 標 準 では
インストールされておらず、 後 から 自 分 が 追 加 して 実 行 したいソフトウェアも 出 てくるでしょ
う。
システムのコマンドがインストールされているディレクトリに 自 分 が 追 加 する 実 行 ファ
イルを 直 接 入 れても 良 いのですが、それだとシステムのものなのかどうなのかわから
なくなり 管 理 もしにくくなります。そこで、 一 般 的 にユーザーが 追 加 するソフトウェアは
「/usr/local/bin」や 自 分 のホームディレクトリ 直 下 の 任 意 のディレクトリなどに 実 行 ファイ
ルをインストールします。

制 作 環 境 構 築 の 下 準 備 73
しかし、システムがチェックするディレクトリは「/etc/paths」に 記 述 されたものだけなので、
それではシェルがそのディレクトリを 見 つけることができません。そこで 必 要 なのが「パス
を 通 す」という 作 業 です。このパスを 通 すというのは 環 境 変 数 の「$PATH」に 対 して 自 分 の
シェルから 実 行 可 能 なディレクトリを 登 録 する ・ 追 加 することを 意 味 します。 一 般 的 には
bash の 設 定 ファイルである「∼/.bash_profile」などにその 場 所 を 書 いておきます。
> .bash_profile を 編 集
$ nano -w ~/.bash_profile
追 加 したいパスをファイルに 追 記 します。
> .bash_profile を 編 集
export PATH=/usr/local/bin:$PATH
パスを 追 加 する
ただ 追 加 しただけはすぐには 反 映 されないので、 「source ∼/.bash_profile」を 実 行 し
て 再 読 み 込 みします。

制 作 環 境 構 築 の 下 準 備 74
> bash の 設 定 を 再 読 み 込 み
$ source ~/.bash_profile
新 しくソフトウェアをインストールした 際 に、パスの 追 加 を 促 されたらこの 作 業 をおこない
ましょう。
.
自 分 しか 使 わないマシンなら「/etc/paths」に 直 接 書 くという 方 法 もありますが、 一 般
的 な 方 法 をお 薦 めします。パスを 追 加 したのにコマンドが 呼 び 出 せない( 反 映 されな
い) 場 合 は、source コマンドを 実 行 し 忘 れていないか、パスの 順 番 がおかしくないか、な
どを 確 認 しましょう。
パスは 個 別 に 指 定 しても 良 いですし、1 行 でまとめても 構 いませんが、その 記 述 順 が 関
係 します。 同 一 コマンドが 複 数 の 場 所 にある 場 合 は、 先 に 見 つけて 欲 しいパスを 先 に 記
述 します。パスの 区 切 りは「:(コロン) 」でディレクトリ 最 後 の「/(スラッシュ ) 」は 不 要
です。
> 1 行 でパスを 追 加 する
export PATH=/usr/local/bin:/bin:/sbin:$PATH
.
.
シェルの 設 定 ファイルは「.bash_profile」 以 外 に「.bashrc」や「.profile」などいくつかあり、
自 分 のホームディレクトリ 直 下 に 配 置 されますが、それぞれのファイルは 読 み 込 まれる
タイミングが 異 なります。 詳 しいことは 以 下 の 記 事 が 参 考 になるでしょう。
( 参 考 記 事 )bash の 便 利 な 機 能 を 使 いこなそう (2/2)

制 作 環 境 構 築 の 下 準 備 75
Homebrew のアンインストール
「インストールがうまくいかない」 「もう 一 度 入 れ 直 したい」ということもあるかと 思 います。
Homebrew をアンインストールする 方 法 は、 公 式 の GitHub のページに 説 明 とアンインス
トールスクリプトへのリンクがあります(こちらのコメント 欄 のスクリプトが 良 いかもしれま
せん) 。 手 動 でよければ、 以 下 のディレクトリやファイルを rm コマンドで 消 去 しましょう。
> Homebrew がインストールするファイル
"/usr/local/.git"
"/usr/local/.gitignore"
"/usr/local/Cellar"
"/usr/local/Library"
"/usr/local/CODEOFCONDUCT.md"
"/usr/local/CONTRIBUTING.md"
"/usr/local/LICENSE.txt"
"/usr/local/README.md"
"/usr/local/SUPPORTERS.md"
"/Library/Caches/Homebrew"
"~/Library/Caches/Homebrew"
"~/Library/Logs/Homebrew"
"/usr/local/bin/brew"
"/usr/local/share/man/man1/brew"
.
ブログの 記 事 などでは「/usr/local/bin ディレクトリを 丸 ごと 消 す」といった 記 載 もあり
ますが、そのディレクトリは 他 のツールでも 使 うためまるごと 消 すのはお 薦 めしません。
.
インストール 済 みのパッケージがある 場 合 は 先 に「brew list」を 実 行 し、インストール
し 直 すパッケージをメモしておきましょう。リストにはパッケージの 追 加 時 に 依 存 関 係
でインストールされたものも 含 まれます( 使 ってるツールだけ 入 れ 直 せば 依 存 している
ものは 自 動 で 入 ります) 。 新 しく Homebrew でインストールする 際 は、 「 何 を 追 加 した
か」をどこかにメモしておくのがポイントです。

制 作 環 境 構 築 の 下 準 備 76
Homebrew によるツールのインストールと 管 理
Homebrew のインストールが 終 わったら、さっそく Homebrew を 使 ってあると 便 利 なソフト
ウェアをいくつかインストールしつつ、Homebrew の 使 い 方 に 慣 れていきましょう。
tree のインストールと 実 行
「tree」は、 任 意 のディレクトリ 以 下 に 含 まれるファイルやディレクトリをツリー 形 式 のフォー
マットで 書 き 出 せるソフトウェアです。Web 制 作 の 作 業 をしていると、ディレクトリ 構 造 をツ
リー 上 に 表 したいこともあります( 何 が 何 でも Excel というわけでもないでしょう) 。
> ∼/Music 以 下 を tree で 表 示 した 結 果
└── iTunes
├── Album\ Artwork
├── iTunes\ Library\ Extras.itdb
├── iTunes\ Library\ Genius.itdb
├── iTunes\ Library.itl
├── iTunes\ Media
├── iTunes\ Music\ Library.xml
└── sentinel
では、さっそく Homebrew でインストールしましょう。Homebrew の 公 式 リポジトリ( 登
録 先 )にあるソフトウェアをインストールするには「brew install」コマンドを 実 行 しま
す。 「install」の 後 には 半 角 スペースを 入 れて、インストールしたいパッケージ 名 を 入 力
します(Homebrew の 各 種 コマンドについては 後 述 します) 。
> tree のインストール
$ brew install tree
コマンドを 実 行 するとインストールプロセスが 表 示 されます。

制 作 環 境 構 築 の 下 準 備 77
> インストールプロセス
==> Downloading http://mama.indstate.edu/users/ice/tree/src/tree-1.7.0.tgz
==> Patching
==> make prefix=/usr/local/Cellar/tree/1.7.0 MANDIR=/usr/local/Cellar/tree/1\
.7.0
/usr/local/Cellar/tree/1.7.0: 7 files, 128K, built in 2 seconds
生 ビールの 絵 文 字 とともにインストールされたパスが 表 示 されたら 終 了 です。さっそく
tree を 使 ってみましょう。
> tree コマンドで 書 類 ディレクトリを 表 示
$ tree ~/Documents -L 1
どうでしょう? 「 書 類 」ディレクトリの 1 階 層 目 がリストされたでしょうか?コマンドに 追 加 し
ている「-L 1」は 階 層 のレベルを 表 します。この 場 合 は、1 階 層 分 だけ 表 示 してくれ、という
ことですね。
次 は Homebrew を 使 って OS X のソフトウェアをインストールしてみましょう。
.
Hombrew を 使 ってソフトウェアをインストールすると、 終 了 直 前 でインストール 先 のパ
スやインストール 後 実 行 しなければならないコマンドなどが 表 示 されている 場 合 があ
ります。 何 かソフトウェアをインストールする 時 は 気 をつけてください(インストール 終 了
直 後 の 画 面 はちゃんと 見 ましょう) 。
OS X のソフトウェアを Homebrew でインストール
Homebrew に「Homebrew Cask」を 追 加 すると、brew cask コマンドを 使 って OS X 用 のソフ
トウェアをインストールすることができます。 以 下 のコマンドを 実 行 して Homebrew Cask を
インストールしましょう。

制 作 環 境 構 築 の 下 準 備 78
> Cask のインストール
$ brew install caskroom/cask/brew-cask
これで「brew cask」コマンドが 利 用 可 能 です。brew cask コマンドを 使 ってインストールさ
れたソフトウェアは「/opt/homebrew-cask/Caskroom」にインストールされます。
では、Homebrew Cask を 使 ってソフトウェアを 追 加 してみましょう。OS X の 標 準 機 能 であ
る「Quicklook」は、Finder 上 でファイルを 選 択 してスペースキーを 押 すことでテキストファ
イルや 画 像 ファイルの 中 身 を 見 ることができて 重 宝 します。しかし、 標 準 対 応 したものしか
閲 覧 できないため、Web 制 作 の 現 場 などで 用 いられるファイルはアイコンプレビューだけ
しか 出 ないのです。
Quicklook 自 体 はプラグインで 拡 張 できるため、 用 途 に 合 わせた 便 利 なプラグインが 公
開 されています。これらを 追 加 すれば、Markdown のファイルや README のテキスト、.json
や.csv をプレビューする、 画 像 のプレビューと 同 時 にファイルサイズもチェックするといった
ことが 可 能 になります。
• qlcolorcode: ソースコードのシンタックスカラーリング
• qlstephen: 拡 張 子 のないテキストファイルのプレビュー
• qlmarkdown: Markdown ファイルのプレビュー
• quicklook-json: JSON ファイルのプレビュー
• quicklook-csv: CSV ファイルのプレビュー
• betterzipql: ZIP ファイルの 中 身 をプレビュー
• qlimagesize: 画 像 ファイルのプレビューにサイズを 表 示
ここに 取 りあげたのは 一 例 です。さまざまなプラグインがあるのでインストールしておくと
作 業 効 率 もあがります。もちろん 手 動 で 公 開 先 からダウンロードしてインストールしても 良
いのですが、Homebrew Cask のリポジトリに 登 録 されているのも 多 く、Homebrew 経 由 の
方 がインストールもその 後 の 管 理 も 簡 単 になります。
> Cask を 使 ったインストール
$ brew cask install qlcolorcode qlstephen qlmarkdown quicklook-json quickloo\
k-csv betterzipql qlimagesize

制 作 環 境 構 築 の 下 準 備 79
複 数 のソフトウェアを 一 度 にインストールするには、 各 ソフトウェア 名 を 半 角 スペースで 区
切 ります。コマンドは 通 常 の brew コマンドと 変 わりません。brew install が brew cask
install になる 感 じです。インストールが 終 わったら、これまではアイコンしか 表 示 されな
かったファイルを Quicklook してみましょう。
JSON ファイルもご 覧 の 通 り QuickLook でプレビュー 可
インストール 済 みの Cask を 表 示 するには 以 下 のコマンドを 実 行 します。
> Cask 経 由 でインストール 済 みのソフトウェアの 表 示
$ brew cask list
> コマンドの 実 行 結 果
betterzipql qlimagesize qlstephen quicklook-json qlcolorcode qlmarkdown quic\
klook-csv
インストールされた Cask の 実 体 は 前 述 のように「/opt/homebrew-cask/Caskroom」にあり
ます。ls コマンドを 実 行 すると「∼/Library/QuickLook」ディレクトリへシンボリックリンクが
貼 られた 状 態 になっているのが 確 認 できるでしょう。

制 作 環 境 構 築 の 下 準 備 80
> ユーザーディレクトリの QuickLook を 表 示
$ ls -la ~/Library/QuickLook/
.
「brew cask help」を 実 行 するとコマンド 一 覧 が 表 示 されます。 「man brew-cask」コマン
ドで 詳 細 なマニュアルを 表 示 します(Q キーで 終 了 ) 。
公 式 リポジトリ 以 外 からソフトウェアをインストール
Homebrew は 初 期 設 定 では 公 式 のリポジトリに 登 録 したソフトウェアしかインストールで
きません。 先 ほどの Homebrew Cask は、OS X 用 のソフトウェアを 登 録 した 別 のリポジトリ
でしたが、 同 様 に UNIX 系 のソフトウェアでも 公 式 リポジトリには 登 録 されていないものが
あります。
Chapter 02 の「ターミナルの 操 作 に 慣 れよう」で 最 後 に 紹 介 した「nano」は OS X には 標 準
インストールされていますが、これは Homebrew を 使 って 最 新 版 に 置 き 換 えたくても 公 式
リポジトリには 登 録 されていません。このようなソフトウェアは 公 開 先 のリポジトリを 追 加
することでインストール 可 能 です。
> nano のインストール
$ brew install nano
インストールコマンドを 実 行 してもエラーメッセージが 表 示 されます。
> エラーメッセージ
Error: No available formula for nano
Searching taps...
homebrew/dupes/nano
taps は 別 の リ ポ ジ ト リ を 表 し ま す。Homebrew が 別 の リ ポ ジ ト リ を 検 索 し た 結
果 、 「homebrew/dupes/nano」にあるということを 知 らせてくれます。nano は「homebrew/dupes」
にあるようなので「brew tap」コマンドでリポジトリを 追 加 しましょう( 追 加 されているリポジ
トリを 除 去 する 場 合 は「brew untap」 ) 。

制 作 環 境 構 築 の 下 準 備 81
> dupes リポジトリの 追 加
$ brew tap homebrew/dupes
リポジトリをアップデートしてインストールしましょう。
> リポジトリの 情 報 のアップデート
$ brew update
> nano のインストール
$ brew install nano
依 存 するソフトウェアとともにコンパイルされてインストールが 実 行 されます。
> インストールプロセス
==> Installing nano from homebrew/homebrew-dupes
==> Downloading http://www.nano-editor.org/dist/v2.2/nano-2.2.6.tar.gz
==> Patching
==> ./configure --prefix=/usr/local/Cellar/nano/2.2.6 --sysconfdir=/usr/loca\
l/et
==> make install
/usr/local/Cellar/nano/2.2.6: 43 files, 592K, built in 15 seconds
これで nano も 最 新 版 が 使 えるようになりました。バージョンを 確 認 します。
> nano のバージョンを 確 認
$ nano --version

制 作 環 境 構 築 の 下 準 備 82
> Homebrew でインストールされた nano
GNU nano version 2.2.6 (compiled 23:35:46, Dec 31 2014)
インストールされた nano の 実 行 ファイルは「/usr/local/bin/nano」で、nano コマンドを 実
行 するとこちらが 起 動 します。OS X にあらかじめ 入 っている nano は「/usr/bin/nano」に
残 ったままです(つまり、 消 去 も 上 書 きもされていません) 。あくまでも 環 境 変 数 のパスの
優 先 順 位 で「/usr/local/bin」が「/usr/bin」より 前 にあるために、Homebrew の 方 が 使 わ
れることになるのです。
> OS 標 準 の nano のバージョンを 確 認
$ /usr/bin/nano --version
> OS 標 準 の nano
GNU nano version 2.0.6 (compiled 16:25:25, Sep 9 2014)
「brew uninstall nano」を 実 行 すれば、Homebrew の nano がアンインストールされて 再 び
OS 標 準 の nano が 実 行 されます。
インストール 済 みのソフトウェアのアップデート
Homebrew でインストールしたソフトウェアは、リポジトリデータを 更 新 してアップグレード
処 理 を 実 行 しない 限 りはアップデートされません。 「brew update」コマンドでリポジトリ
データの 更 新 、 必 要 に 応 じて「brew upgrade」コマンドを 実 行 してパッケージの 最 新 版 をイ
ンストールしましょう。
> リポジトリの 更 新
$ brew update

制 作 環 境 構 築 の 下 準 備 83
brew update コマンドを 実 行
「brew update」を 実 行 するとリポジトリデータが 更 新 されて、 新 規 追 加 されたパッケージ、
更 新 されたパッケージなどがリストされます。Homebrew は、 通 常 は 使 わない Formula や
Keg、Celler など 酒 の 醸 造 に 関 する 単 語 が 用 いられるため 非 常 に 紛 らわしいのですが、
アップデートされた Formula のリストが 出 てきたら 次 の「brew outdated」コマンドを 実 行 し
てみましょう。
> 更 新 されたパッケージをリスト
$ brew outdated

制 作 環 境 構 築 の 下 準 備 84
brew outdated コマンドを 実 行
更 新 されているものがあればリスト 表 示 されます。すべてアップグレードする 場 合 は「brew
upgrade」 、パッケージを 指 定 してアップグレードする 場 合 は「brew upgrade package-name」
のようにパッケージ 名 を 指 定 してアップグレードします。
> パッケージのアップグレード
$ brew upgrade( 必 要 に 応 じてパッケージ 名 を 指 定 )

制 作 環 境 構 築 の 下 準 備 85
brew upgrade コマンドを 実 行
アップグレードが 終 わったら、 古 いバージョンのパッケージデータを「brew cleanup」コマン
ドで 削 除 します。
> 古 いパッケージデータの 削 除
$ brew cleanup

制 作 環 境 構 築 の 下 準 備 86
brew cleanup コマンドを 実 行
GUI のソフトウェアのようにアップデートの 通 知 が 自 動 的 に 届 いたりといったことはありま
せん。 頻 繁 にアップデートの 確 認 をする 必 要 はありませんが、 何 か 新 しくソフトウェアをイ
ンストールする 時 などは 必 ず「brew update」を 実 行 する 癖 をつけて、そのついでにでもアッ
プグレードがないか 確 かめてみると 良 いでしょう。
覚 えておきたい Homebrew のコマンド
ここまで Homebrew の 使 い 方 に 慣 れるためにいくつかのコマンドを 実 行 してきました。イン
ストールしたソフトウェアは 比 較 的 頻 繁 にアップデートされるものも 多 くあります。パッケー
ジリストの 更 新 コマンドである「brew update」は、24 時 間 実 行 していないと「brew doctor」
でメッセージを 表 示 します( 気 にすることではありませんが) 。
以 下 、Homebrew を 使 うにあたって 最 低 限 覚 えておきたいコマンドを 紹 介 します。これらの
「brew」に 続 く「list」や「update」などのコマンドは、 後 の 章 で 解 説 する npm や gem、 他 の
Linux 系 の OS のパッケージマネージャーでも 大 体 似 たようなコマンドで 同 じ 操 作 をおこな
うことができます。この Homebrew の 操 作 で「どういうコマンドだと 何 が 実 行 されるのか」
を 覚 えておきましょう。より 詳 細 なコマンドのリストは「brew help」を 参 照 してください。
インストール 済 みのパッケージをリスト 表 示 するには「brew list」コマンドを 実 行 します。

制 作 環 境 構 築 の 下 準 備 87
> インストール 済 みのパッケージをリスト
$ brew list
登 録 済 みのリポジトリのパッケージリストを 更 新 するには「brew update」コマンドを 実 行 し
ます。 「brew upgrade」や「brew doctor」を 実 行 する 前 には 一 度 アップデートをかけましょ
う。
> パッケージリストをアップデート
$ brew update
「brew outdated」は、インストール 済 みのパッケージでアップグレード 可 能 なソフトウェア
をリストします。 特 定 のソフトウェアのバージョンを 固 定 しておきたい 場 合 など、 「brew
upgrade」コマンドでまとめてアップグレードをかけたくない 場 合 はコマンドを 実 行 して 確 認
すると 良 いでしょう。
> バージョンアップしたパッケージの 表 示
$ brew outdated
インストール 済 みのパッケージを 最 新 版 にアップグレードするコマンドは「brew upgrade」
です。 特 定 のパッケージのみアップグレードしたい 場 合 は、 「brew upgrade」に 続 けてパッ
ケージ 名 を 指 定 します。
> パッケージのアップグレード
$ brew upgrade
> 特 定 のパッケージをアップデート(パッケージ 名 を 指 定 )
$ brew upgrade package-name
インストールしたいパッケージ 名 がわからない 時 は、 「brew search」コマンドに 続 けて 検
索 したい 文 字 列 を 指 定 します。 文 字 列 が 含 まれているパッケージが 結 果 としてリストされ
ます。

制 作 環 境 構 築 の 下 準 備 88
> パッケージの 検 索
$ brew search 検 索 したい 文 字 列
パッケージの 情 報 を 見 るには「brew info」コマンドを 使 います。
> パッケージの 情 報 を 表 示
$ brew info package-name
不 要 になったパッケージをアンインストールする 場 合 は「brew uninstall」コマンド、もしく
は「brew remove」コマンドに 続 けてパッケージの 名 前 を 入 れましょう。
> パッケージのアンインストール
$ brew uninstall package-name
パッケージをアップグレードした 後 、 不 要 になった 古 いバージョンは 定 期 的 に 削 除 するこ
とをお 薦 めします。 放 っておくとソースファイルなどがどんどん 溜 まっていきディスクの 容
量 を 圧 迫 していくだけです。
> パッケージの 古 いバージョンを 削 除
$ brew cleanup
Homebrew のインストール 直 後 に 実 行 した「brew doctor」は、Homebrew の 環 境 をセルフ
チェックするコマンドです。エラーメッセージが 出 たりしてコマンドが 実 行 できない 場 合 は、
表 示 された 解 決 策 を 試 すことで 多 くの 問 題 は 解 決 します。 「brew update」を 24 時 間 実
行 していなければ 必 ず Warning が 出 ます。 一 度 「brew update」コマンドを 実 行 しましょう。
> Homebrew の 環 境 チェック
$ brew doctor
困 った 時 はエラーメッセージをまるごとコピーして、Google や Stack Overflow で 検 索 する
と 良 いでしょう。この 際 はいずれも 英 語 版 のサイト(もしくは 結 果 を 英 語 に 絞 って) 検 索 し
た 方 がすぐ 見 つかります。

制 作 環 境 構 築 の 下 準 備 89
Android SDK Tools のインストール
Android SDK Tools は Android OS を 搭 載 したデバイス 向 けのソフトウェア 開 発 キットです。
最 近 は「Android Studio」という 統 合 開 発 環 境 付 きでも 配 布 されています。
Android SDK Tools のダウンロード
Android SDK Tools はAndroid の 公 式 サイトの「Installing the Android SDK」セクションか
らダウンロードしましょう。
Android Studio は 統 合 開 発 環 境 で SDK Tools もセットに
統 合 開 発 環 境 付 きの「Android Studio」 、もしくは SDK Tools 単 体 のいずれかでダウン
ロード 可 能 です。ここでは「Android SDK Tools」を 単 体 でダウンロードしてセットアップして
いきます。 右 側 のリンクを 進 んで「SDK Tools Only」のセクションからファイルをダウンロー
ドしましょう。

制 作 環 境 構 築 の 下 準 備 90
右 側 の Stand-alone SDK Tools のリンクから 進 む
SDK Tools Only のセクションからダウンロード

制 作 環 境 構 築 の 下 準 備 91
.
Android SDK Tools は、セットアップ 後 OS のバージョン 別 のビルドツールやライブラリ
をインストールすると 軽 く 10GB を 超 えますが、Meteor や Ionic のようなフレームワーク
で Cordova などを 使 う 際 に 必 ず 必 要 になりますのでインストールしておく 方 が 良 いか
もしれません。
Android SDK Tools のセットアップ
ダウンロードが 終 わったらファイルを 解 凍 して、ディレクトリを 任 意 の 場 所 に 移 動 します。 場
所 はどこでも 構 いませんが、 自 分 のホームディレクトリ 直 下 などにする 方 が 良 いでしょう。
ディレクトリ 名 は 短 く 変 更 しても 大 丈 夫 です。ここでは「Development」ディレクトリを 用 意 し
て、その 中 に「android-sdk」というディレクトリで 配 置 しています。この SDK のディレクトリ
は、シェルからアクセスできるようにします。
解 凍 した SDK Tools

制 作 環 境 構 築 の 下 準 備 92
自 分 のホームディレクトリ 直 下 などに 移 動
移 動 が 終 わったら、Vim や nano を 使 って「∼/.bash_profile」にパスを 追 加 します。
> ∼/.bash_profile を 編 集
$ nano -w ~/.bash_profile
追 加 するパスは「platform-tools」と「tools」ディレクトリだけで 構 いません。 下 記 を 参 考 に 自
分 自 身 のパスに 置 き 換 えましょう。パスがわからない 場 合 は、 移 動 した「SDK Tools」のディ
レクトリをターミナルアプリにドラッグすれば、そのディレクトリに 移 動 できます。 「pwd」コマ
ンドでパスを 表 示 しましょう。
> ファイルの 最 後 など 任 意 の 場 所 にパスを 追 加 。
export PATH="$HOME/Development/android-sdk/platform-tools:$HOME/Development/\
android-sdk/tools:$PATH"
パスの 追 加 が 終 わったら、 「∼/.bash_profile」を 再 読 込 します。

制 作 環 境 構 築 の 下 準 備 93
> ∼/.bash_profile の 再 読 込
$ source ~/.bash_profile
ターミナルアプリで「android」コマンドへのパスが 表 示 されれば 準 備 は 完 了 です。
> which コマンドによるパスの 確 認
$ which android
> android コマンドへのパスが 表 示 される
/Users/username/Development/android-sdk/tools/android
Android SDK Manager の 起 動
「android」コマンドが 使 えるようになったら「Android SDK Manager」を 起 動 することができ
ます。 起 動 して Android OS のバージョン 別 の Platform Tools などをインストールします。こ
れらは 必 要 に 応 じて 追 加 すれば 良 いので 初 期 設 定 のままで 大 丈 夫 ですが、ウィンドウの
一 番 下 にある「Intel x86 Emulator Accelerator(HAXM Installer)」のチェックを 有 効 にしてイ
ンストールを 進 めます。
.
ハイブリッド Web アプリケーションフレームワークの Ionic は、Android 4.4.2(API 19)を
ターゲットにするのが 初 期 設 定 のようです。もしこのようなツールを 使 う 場 合 は 必 要 に
応 じて 追 加 しましょう。

制 作 環 境 構 築 の 下 準 備 94
HAXM Installer のチェックは 有 効 に
ライセンスアグリーメントに 同 意 してインストール
インストールが 終 わったら、ウィンドウを 閉 じて 終 了 します。

制 作 環 境 構 築 の 下 準 備 95
HAXM と Apache Ant のインストール
Android SDK Tools のインストールが 終 わったら 追 加 でいくつかのソフトウェアをインス
トールします。
まずは、 「Intel® Developer Zone」から「Android* - Intel® Hardware Accelerated Execution
Manager」をダウンロードしてインストールします。OS X では、これをインストールし GPU を
有 効 化 したデバイスを 作 らないと 起 動 が 遅 くとても 使 い 物 になりません。ファイルのイン
ストール 後 は 特 に 何 もする 必 要 はありませんが、OS X のメジャーバージョンアップなどを
行 った 際 は 最 新 版 が 配 布 されていないか 公 式 サイトで 確 認 しましょう。
Intel® のサイトからファイルをダウンロード

制 作 環 境 構 築 の 下 準 備 96
ダウンロードしたファイルを 開 きインストール
またあわせて、デバイスの 起 動 時 に 必 要 になる「Apache Ant」もインストールします。こちら
は Homebrew を 使 って 下 記 のコマンドで 実 行 しましょう。
> Homebrew で Ant を 追 加
$ brew install ant
さぁ 、 次 はいよいよデバイスのセットアップです。
Android デバイスのセットアップ
Android のデバイスをシミュレートするには、あらかじめ 仮 想 デバイスを 設 定 しておく
必 要 があります。 再 度 「android」コマンドを 実 行 し、 「Android SDK Manager」を 起 動 しま
す。 「Tools → Manage AVDs」メニューを 選 択 して、 仮 想 デバイスを 追 加 します。
「Android Virtual Device(AVD) Manager」が 起 動 するので「Device Definitions」タブをクリッ
クし、 作 成 したデバイスを 選 択 して「Create AVD…」をクリックして 設 定 します。ここでは
「Nexus 5」で 進 めています。

制 作 環 境 構 築 の 下 準 備 97
Tools → Manage AVDs を 選 択
デバイスを 選 択 して「Create AVD…」をクリック
デバイスの 設 定 画 面 では CPU を「Intel Atom(x86)」にし、Emulation Options の「Use Host

制 作 環 境 構 築 の 下 準 備 98
GPU」を 有 効 にするのを 忘 れないようにしましょう。 「OK」ボタンを 押 して 進 むと 確 認 ダイ
アログがでてデバイスが 追 加 されます。
Use Host GPU のチェックを 有 効 に
追 加 されたデバイスは「Android Virtual Devices」にリストされます。 「Edit」で 後 からデバ
イスを 再 編 集 可 能 です。 「Start…」ボタンをクリックすればこのウィンドウからも 仮 想 デバ
イスを 起 動 することもできます。

制 作 環 境 構 築 の 下 準 備 99
追 加 された 仮 想 デバイスは 後 から 編 集 も 可 能
これで 仮 想 デバイスの 追 加 が 終 わりました。 他 のデバイスが 必 要 な 時 は 同 じ 手 順 で 追 加
しましょう。