React Nativeを触ってみた


朝起きたらこんなページを見つけたので15分だけ触ってみた。
基本的な導入は以下にあるが、ここでは最低限動くまでメモ。

1. 準備

React Nativeを動かすには、最低限nodereact-native-cliが必要になる。
上記をインストール後、react-native initでプロジェクトを作成する。

$ brew install node
$ npm install -g react-native-cli
$ react-native init AwesomeProject

作成されるディレクトリの概要は以下のとおり。

$ cd AwesomeProject
$ tree -L 2
.
├── AwesomeProject.xcodeproj
│   ├── project.pbxproj
│   ├── project.xcworkspace
│   ├── xcshareddata
│   └── xcuserdata
├── iOS
│   ├── AppDelegate.h
│   ├── AppDelegate.m
│   ├── Base.lproj
│   ├── Images.xcassets
│   ├── Info.plist
│   └── main.m
├── index.ios.js
├── node_modules
│   └── react-native
└── package.json

9 directories, 7 files

2. 実行

  1. AwesomeProject.xcodeprojをXcodeを開く
  2. cmd+RでRunする

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

3. 編集

  1. index.ios.jsを編集する
  2. Xcode上でcmd+RでRunする

4. 所感

15分どころか、ものの3分もあれば実行まで確認できた。
次はチュートリアルを見ながらなにかつくってみる。