こんばんは。今日は、MacでReact Native開発を行うための環境構築を行いましたので、その手順について備忘のため残しておこうと思います。
Contents
必要なツールをインストールする
MacでReact Native開発をするためには、事前に以下のツールをインストールしておく必要があります。一つ一つ見ていきましょう。
Home Brewをインストールする
Home BrewはMac向けのパッケージ管理ソフトです。以下の公式ページのコマンド一つでインストールすることができます。
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
NodeJSをインストールする
続けて、Node JSのインストールです。以下コマンドで完了します。
## Node JSのインストール
brew install nodejs
node -v
npm -v
Watchmanをインストールする
こちらは、React Native開発元であるFacebookが開発しているファイル監視ツールです。ファイルの更新を検知し、アクションを実行することができます。
React Native CLIをインストールする
React Native CLI (Command Line Interface)は、React Native御本家ではなく、React Native Communityにより開発されているツールのようで、React Nativeの開発を手助けしてくれるようです。とりあえず、後のために入れておきます。
npm install -g react-native-cli
(追記)いろいろな記事を読んでいると、React Native CLIよりも、Expoを使う方法の方が開発は簡単とされているようです。私もReact Native CLIをインストールしたものの、最初はExpoを使って開発を進めていこうと思います。
https://qiita.com/kaba/items/569aafd80889bb5d9328
https://qiita.com/zaburo/items/b47bfe27d0b8910a1488
(追加)Expoをインストール
上の流れを受けて、Expoのインストール方法についても載せておきます。ExpoはReactのフレームワークです。
npm install -g expo-cli
VS Code+拡張機能をインストールする
コードエディタにはVS Codeが最適です。VS Codeは、Microsoftが提供するコードエディタで、無料で利用できます。インストールはこちらから。
https://azure.microsoft.com/ja-jp/products/visual-studio-code/
さらに、TypeScriptでReact Nativeアプリ開発をする場合には、以下の拡張機能はオススメです。
XCodeをインストールする
iPhoneアプリ開発のためには、XCodeという公式のIDEが必要ですので、こちらもインストールしておきます。MacのApp Storeからインストール可能です。
Android Studioをインストールする
もし、Android版のアプリリリースを検討されている場合は、XCodeのAndroid版と言える、Android Studioが必要になってきます。
以上で、初期に必要なツールは全て揃いました!それでは、次の記事では、早速サンプルアプリを構築してみたいと思います!
今日も最後までご覧いただきありがとうございました!
[番外編] ReactNativeをもっと学ぶなら・・・
React Nativeをもっとちゃんと学びたい!という方は、こちらにおすすめコンテンツをまとめましたので、ご参考にしていただければと思います・・!
土台のJavaScript/TypeScriptに不安がある方は、こちらもまとめましたので、ご参考になりましたら幸いです。