はじめに

JavaScriptとReactを使ってモバイルアプリを開発できるReact Nativeの開発環境をWindowsに一からインストールします。WindowsなのでAndroidアプリの開発環境です。インストール手順はReact Nativeの公式にあるのでそれに従えばいいんですが、いくつか詰まったので通しで方法を残しておきます。
インストールするのはNode.js、React Native、それにAndroid Studioです。（記事現在のReact Nativeのバージョンは0.39）

Node

Node . js と Python 2 を インストール し ます 。 パッケージ 管理 ソフト の chocolatey を 経由 し て インストール する の が 推奨 と いう こと な の で 手順 に 従う ます 。

Chocolatey

公式 の インストール 手順 。 メニュー から powershell を 管理 者 権限 で 起動 。 powershell の バージョン を 調べる て 、

3以上だったので三番目のコードを使用します。が、その前に実行ポリシーをremotesignedまで上げる必要があります。
現在 の 実行 ポリシー is 表示 は これ で 表示 。

デフォルトはRestrictedだったので上げます。

powershell

set - executionpolicy -ExecutionPolicy remotesigned

これでインストール。

powershell

iwr https://chocolatey.org/install.ps1 -UseBasicParsing | iex

実行ポリシーを戻したいときはこれで。

powershell

set - executionpolicy -ExecutionPolicy Restricted

Node . js と Python 2

Chocolateyでインストールします。コマンドラインなりPowerShellなりで次のコマンドを一行ずつ実行。

cmd

choco install nodejs.install
choco install python2

THE react native cli

Node.jsに付いてくるパッケージ管理ソフトnpmで、React Nativeのコマンドラインインタフェースをインストールします。コマインドラインで次を実行。

cmd

npm install -g react-native-cli

Android 開発 環境

Android の 開発 環境 を インストール し ます 。

1. Android Studioのインストール

Android Studioの公式からダウンロードしてきてインストーラーに従ってインストール。Android SDKとAVD(Android Virtual device)にチェックが入っているのを確認。

JDKも忘れずに

React Nativeの方には書いてありませんがコンパイルを通すためにJavaのDevelopment Kitも必要です。公式からJDK8をインストール。

2 . avd と HAXM の インストール

Android Studioの初回起動時にいろいろ出てくるので適当に(I do not have…を選んでOkしたり)。Customを選んで次にチェックが入っていればOKです。そもそもチェック外せなかったりinstalledとか出ていたりするかもしれません。

• Android SDK
• Android sdk platform
• Performance (Intel HAXM)
• Android Virtual device

HAXMについて何やら出てくるので画面に従って入れます。
この画面、初回しか出ません。二回目以降でHAXM入れたいならここから。

3. Android 6.0 (Marshmallow) SDKのインストール

react Native に 必要 な sdk は バージョン が 決まる て い て Android 6.0 ( marshmallow ) です 。 改めて これ を インストール し ます 。
（ちなみにSDKは6.0ですがAndroidの動作する最低バージョンは4.1です。readme参照）

1. Android Studioを起動してWelcome画面の右下、ConfigureからSDK Managerを開きます。
2. 上のSDK Platformsタブが選ばれているのを確認
3. Android 6.0 (Marshmallow)をチェック
4. 右下 の Show package detail を チェック
5. Android 6.0 (Marshmallow)から次の項目を追加でチェック(全部で6項目にチェックが入る)

• Google APIs
• Intel x 86 atom System image
• Intel x86 Atom_64 System Image
• Google APIs Intel x86 Atom_64 System Image

1. 上のSDK Toolsタブを選択
2. 右下 の Show package detail を チェック
3. Android SDK Build-Toolsの23.0.1にチェック
4. 右下のApply

4. 環境変数にANDROID_HOMEを設定

React Nativeに必要なパスを通します。コントロールパネルのシステムの詳細設定->環境変数->ユーザー環境変数にANDROID_HOMEを新規追加します。
パスは3.の画面の上の方のテキストボックスに入っているのと同じものです。大体次の通り。

C:\Users\(ユーザー名)\AppData\Local\Android\sdk

Android Virtual deviceのスタート

Android Studio内にあるエミュレータを起動します。ここは他の詳しい記事に任せます。

React Nativeアプリのインストールテスト

プロジェクトを作りたい場所でコマンドプロンプトを開きます。作成するプロジェクト名をAwesomeProjectとして、

cmd

react - native Init awesomeproject 
 CD awesomeproject 

エミュレータ が 起動 し て いる の を 確認 し て 次 の コマンド 。

ちょこちょこ文字化けしますが気にせずに、エミュレータ内にアプリが起動したら完了です。