ReactNativeのGetting Startedをやってみた（翻訳付き）

# [React Native](https://facebook.github.io/react-native/)

なにやらiOS, Androidでコードが共有できるとかどうとか。
以前から気になっていたものの、手が出せなかったのですがGWに入りようやく少し手が空き始めたのと、最近ゆる〜くモバイル関連の案件が入ったので、（ひねくれ者なので）普通にやるのも面白くないと思いまずはReactNativeの調査から始めることにしました。

[Getting Startedページ](https://facebook.github.io/react-native/docs/getting-started.html)の冒頭にはこう書いてあります。

> This page will help you install and build your first React Native app. If you already have React Native installed, you can skip ahead to the Tutorial.

_このページは、はじめてのReact Native appをインストール&ビルドする手伝いをします。もしすでにReact Nativeがインストール済みなら、[チュートリアル](https://facebook.github.io/react-native/docs/tutorial.html)に進んでね。_

__はじめてなのでQuickStartやります__

## Quick Start

> Create React Native App is the easiest way to start building a new React Native application. It allows you to start a project without installing or configuring any tools to build native code - no Xcode or Android Studio installation required (see Caveats).

_[Create React Native App](https://github.com/react-community/create-react-native-app)は新しいReact Nativeアプリケーションをビルドする最も簡単な方法です。何かしらのツールの設定やネイティブコードをビルドもしなくていい - XcodeとかAndroid Studioとかいらない。(参考 [Caveats](https://facebook.github.io/react-native/docs/getting-started.html#caveats))_

> Assuming that you have Node installed, you can use npm to install the create-react-native-app command line utility:

_あなたがNodeをインストール済みだとしたら、npm使えると思うからcreate-react-native-appコマンドラインユーティリティいれてね_

__>>もはや翻訳が横文字<<__

`npm install -g create-react-native-app`

これ、僕はグローバルインストールしたくない派なので、いろんなプロジェクト置いてるディレクトリ `projects/`みたいなところで`npm init`して`npm install --save-dev create-react-native-app`しました。

イラネってなったら`node_modules`ディレクトリ削除するだけで済むので…まぁこの辺はどっちでもよさそうですが。

あと大事なことなんですが、nodeがインストール済みという前提がしれっとあるように、書かれていないですがwatchmanが必要なので`brew install watchman`してください。

> Then run the following commands to create a new React Native project called "AwesomeProject":

_そしたら"AwesomeProject(すばらしいプロジェクト)"という新しいReact Nativeプロジェクトを作るために次のコマンド打ってね_

```bash
create-react-native-app AwesomeProject

cd AwesomeProject
npm start
```

`create-react-native-app`はグローバルインストールしなかったので、`package.json`にエイリアス作るか`node_modules`にある実行可能ファイルを直接実行しよう

> This will start a development server for you, and print a QR code in your terminal.

_こうすると開発サーバーが起動して、QRコードをターミナルに表示するよ。_

### Running your React Native application

> Install the Expo client app on your iOS or Android phone and connect to the same wireless network as your computer. Using the Expo app, scan the QR code from your terminal to open your project.

_手持ちのiOSかAndroidに[Expo](https://expo.io/)アプリをインストールして、PCと同じワイヤレスネットワークに接続してね。Expoを使って、ターミナルに表示されているQRコードを読み取ってプロジェクトを開こう。_

#### Modifying your app

> Now that you have successfully run the app, let's modify it. Open App.js in your text editor of choice and edit some lines. The application should reload automatically once you save your changes.

_アプリが正常に動いているだろうから、いじってみよう。App.jsをテキストエディタで開いて、いくつか行を編集してみて。変更を保存したら、アプリケーションが自動で再読み込み仕直すよ。_

#### That's it!

> Congratulations! You've successfully run and modified your first React Native app.

_おめでとう！React Nativeのアプリを起動して変更することができたね！_

といったところか…ぐう簡単

ただ、後の説明や注意（Caveats)を読んでいると、Expoが対応してないネイティブコードを使おうと思ったりした時は、別の手順（Building Projects with Native Code）をやっていかないといけないようなので、そのうち必要となる場合そっちでやったほうがいいようなことが書いてあるのでそういう場合そっちの手順でやったほうがよいということ。