Edited at

【ReactNative】環境構築


開会式

今までWebアプリしか作ったことがなかったので、そろそろスマホアプリを開発したいと思います。

iOS, Androidどちらも作りたいので、Swift, Kotlinを学習しようと思いましたが、片方で燃え尽きそうなので共通して開発が可能なReactNativeで開発しようと思います。


作るもの

出会い系じゃないマッチングアプリ


環境構築

以下のドキュメントにしたがってget start!(一旦iOSだけ)

https://facebook.github.io/react-native/docs/getting-started


nodeとwatchmanをinstall

$ brew install node

$ brew install watchman

nodeのバージョンは、8.3以上推奨

watchmanはReact Nativeを開発したFaceBookが推奨しているファイル変更管理ツール


The React Native CLIのinstall

$ npm install -g react-native-cli

npmはnodeと共にinstallされるので、すでに使用できる状態になっていると思います。

CLI(Command Line Interfaceの略)

※もしエラーが出た場合以下で実行

$ curl -0 -L https://npmjs.org/install.sh | sudo sh


Xcodeのinstall

こちらはAppStoreにてダウンロード(結構時間と容量がかかります)


React Native Projectの作成と、シミュレーター起動

$ react-native init ProjectName

$ cd ProjectName
$ react-native run-ios

すると、以下のようなシミュレーターが立ち上がる

スクリーンショット 2019-01-06 13.03.21.png

index.jsが読み込まれると、以下のような画面になります

image.png


まとめ

基本的にドキュメントだけみていれば問題ないです。

2の際に、エラーが出続けたのですが、nodeのバージョンがv10.2.1とかだったのを、brew node upgradeしてv11.6.0にしたらできました。