背景
新しくアプリを作るとき毎度セットアップ (ライブラリの導入、ファイル階層を構成、開発環境設定 etc..) に時間がかかります。汎用性が高く、使い勝手のよいボイラープレートを作成し、セットアップにかかる時間を大幅に削ることが目的。
今回のボイラープレートは、expo を使用します。
ボイラープレートとは
新しくReactNativeでアプリを作り始める時の、お決まりの構成。テンプレート的なものになります。今回はどのアプリでも使える、一般的なライブラリのみを使用しています。
デフォルトで入れたライブラリ一覧
- expo
- react-navigation
- react-redux
- redux
- redux-logger
- redux-promise-middleware
- redux-thunk
デモ
面倒な、Stacknavigation, TabNavigation, Drawer、Redux, 開発環境(ESLint)のセットアップが完了しています。ここからアプリ毎のUI、機能を実装していきます。
使い方
セットアップは10分で完了します。
-
こちらのリンクより、zip をダウンロードしてください。
-
update app.jsonの name と slug 名を変更します
"name": "your-app-name",
"slug": "your-app-name", -
yarn installもしくはnpm installでプロジェクトをビルド -
expoからプロジェクトを選択し、シミュレーターを立ち上げる。
おすすめエディタ
-
エクステンションより、
eslintを導入してください。
バグを見つけたり、括弧やスペースの使い方などのスタイルを統一したりするのに役立ちます。 -
iOS開発からRect Native始めた方は、
Mark Jumpをインストールするといいかもしれません。MARK: 、TODO: が一覧で見れて、関数ジャンプもできるので、開発が非常に捗ります。
公開リンク
expoで公開しています。
https://expo.io/@wataru/react-native-boilerplate
プロジェクトはこちらにあります。(Github)
https://github.com/WataruMaeda/react-native-boilerplate
Happy Coding!