こんばんは。今日は、Expo + React Nativeで最初のプロジェクトを作成するまでの手順を残しておこうと思います。こちらの記事はMac OSでの開発を前提としていますが、もしReact Nativeの開発環境がまだ準備されていない場合は、こちらをご参照ください。
Contents
React Nativeプロジェクトの作成
まずは、React Nativeプロジェクトの作成を行います。Expoを利用すれば、とても簡単にプロジェクトの作成が行えます。
コンソールで、以下コマンドを実行します。
expo init MyFirstProjectすると、テンプレートプロジェクトが作成されます。
これだけで完了です！
（参考）プロジェクトの構成
ちなみに、テンプレートプロジェクトの構成は以下のようになっています。
cd MyFirstProject
ls -ltr
package.json
package-lock.json
React Native プロジェクトの実行
それでは、プロジェクトを実行してみます。プロジェクトディレクトリ内で、以下コマンドを実行します。
cd MyFirstProject
npm startすると、エミュレータ画面が立ち上がりましたが、エラーが・・・
コンソール画面にも、”Error running ‘xcrun simctl list devices –json’:xxxx”というエラーが出ています。
他のWebページをみると、どうやらXCode側で事前設定が必要だったみたい。
XCodeを起動し、Preference>Locationsで、CLI (Command Line Tools）を指定すればOKです。
再度コンソールでnpm startを実行し、iOSエミュレータを起動するため、”i”を押すと・・
今度は無事XCodeのエミュレータが立ち上がり、テンプレートアプリが立ち上がりました！
以上、React Nativeアプリを作成し、ローカルで立ち上げるまでの手順でした！
[番外編] ReactNativeをもっと学ぶなら・・・
React Nativeをもっとちゃんと学びたい！という方は、こちらにおすすめコンテンツをまとめましたので、ご参考にしていただければと思います・・！
