| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 |
- Title: Three.jsのセットアップ
- Description: three.jsの開発環境のセットアップ方法
- TOC: セットアップ
- これはthree.jsの連載記事の1つです。
- 最初の記事は[Three.jsの基礎知識](threejs-fundamentals.html)でした。
- まだ読んでない人はそこから読んでみるといいかもしれません。
- 先に進む前に開発環境のセットアップの話をする必要があります。特にセキュリティ上の理由から、WebGLはハードディスクから直接画像を扱う事ができません。開発をするためにはWebサーバーを利用する必要があります。幸運な事に開発用のWebサーバーをセットアップし利用する事は非常に簡単です。
- まず最初にこのサイト全体を[このリンク](https://github.com/gfxfundamentals/threejsfundamentals/archive/gh-pages.zip)からダウンロードする事ができます。
- ダウンロードしたらzipファイルをダブルクリックで解凍して下さい。
- 次にシンプルなWebサーバーの1つをダウンロードします。
- ユーザーインターフェースのあるWebサーバーをお望みなら[Servez](https://greggman.github.io/servez)があります。
- {{{image url="resources/servez.gif" className="border" }}}
- ファイルを解凍してフォルダを指定し、"Start"をクリックしてからブラウザで[`http://localhost:8080/`](http://localhost:8080/)を表示するか、またはサンプルを閲覧したい場合は[`http://localhost:8080/threejs`](http://localhost:8080/threejs)にアクセスして下さい。
- Servezのサービスを停止するにはstopを選ぶか、Servezを終了します。
- コマンドラインが好きな方は(私はそうしてる)、別の方法として[node.js](https://nodejs.org)を使う事もできます。
- ダウンロードしてインストールし、コマンドプロンプト / コンソール / ターミナルウィンドウを開きます。WindowsのNode.jsインストーラーで追加した場合、"Node Command Prompt"を選択する必要があります。
- [`servez`](https://github.com/greggman/servez-cli)をインストールするには、次のように入力します。
- npm -g install servez
- もしMacを使ってる場合は以下を入力します。
- sudo npm -g install servez
- 次に以下を入力します。
- servez path/to/folder/where/you/unzipped/files
- または、私と同じであれば以下を入力します。
- cd path/to/folder/where/you/unzipped/files
- servez
- そして、以下のように表示されるはずです。
- {{{image url="resources/servez-response.png" }}}
- ブラウザで[`http://localhost:8080/`](http://localhost:8080/)にアクセスして下さい。
- もしパスを指定しなかった場合、servezは現在のフォルダをserveします。
- これらのオプションが好きでない場合、[他にもたくさんのシンプルなサーバーがあります](https://stackoverflow.com/questions/12905426/what-is-a-faster-alternative-to-pythons-servez-or-simplehttpserver)。
- これでサーバーのセットアップが完了したので[テクスチャ](threejs-textures.html)のページに移動しましょう。
|