Pippi Life

主に仕事に関連するITのことや、プライベートもちょいちょい書きます。

react-native環境の構築

やらないといけなさそうなので、 勉強はじめました。 まずは環境セットアップから。

前提

node,npmのインストール

以下のコマンドでインストールします

$ brew install node
$ brew install npm

watchmanのインストール

Facebookが作ったファイルシステムの監視ツールらしく React-nativeでは必須なんだそうです。 以下のコマンドでインストールします

$ brew install watchman

react-nativeのインストール

npmでインストールします。

$ npm isntall -g react-native-cli

Hello worldの実行

さっそくreact-nativeでhello worldしてみます。 特定のディレクトリに移動して、初期化してみます。

$ react-native init hello_world

いろいろと関連モジュールのダウンロードのため、 ちょっと時間がかかるかもしれません。 自分の環境では、npmがsudoじゃないと動かなかったのですが、きっと昔にsudoでインストールしていたのかもしれません。。。切ない。

:
:
:
To run your app on iOS:
   cd /Users/user_name/hello_world
   react-native run-ios
   - or -
   Open ios/hello_world.xcodeproj in Xcode
   Hit the Run button
To run your app on Android:
   cd /Users/user_name/hello_world
   Have an Android emulator running (quickest way to get started), or a device connected
   react-native run-android

iOS上で実行したかったら、 react-native run-iosを実行しろと言っているので実行してみましょう。

$ cd hello_world
$ react-native run-ios

動きました!! image.png

こちらでも同じ記事を置いています。