フリッパー

Flipper（以前のSonar）は、iOSおよびAndroidでモバイルアプリをデバッグするためのプラットフォームであり、最近では、ブラウザーまたはNode.jsでJSアプリをデバッグすることもできます。シンプルなデスクトップインターフェイスからアプリを視覚化、検査、制御します。Flipperをそのまま使用するか、プラグインAPIを使用して拡張します。

目次

• このリポジトリでは
• 入門
  • 要件
• ソースからの構築
  • デスクトップ
    • ソースから実行
    • スタンドアロンアプリケーションの構築
  • iOSSDK+サンプルアプリ
  • AndroidSDK+サンプルアプリ
  • React NativeSDK+サンプルアプリ
  • JSSDK+サンプルReactアプリ
    • トラブルシューティング
• ドキュメンテーション
  • 貢献
  • ライセンス

モバイル開発

Flipperは、iOSおよびAndroidでのモバイルアプリ開発のナンバーワンコンパニオンになることを目指しています。そのため、ログビューア、インタラクティブレイアウトインスペクタ、ネットワークインスペクタなど、便利なツールを多数提供しています。

フリッパーを伸ばす

フリッパーはプラットフォームとして構築されています。すでに含まれているツールを使用することに加えて、モバイルアプリからのデータを視覚化およびデバッグするための独自のプラグインを作成できます。Flipperは、データの送受信、関数の呼び出し、モバイルアプリでのイベントのリッスンを処理します。

フリッパーへの貢献

Flipperのデスクトップアプリ、ネイティブモバイルSDK、JS SDKはどちらもオープンソースであり、MITライセンスを取得しています。これにより、プラグインの構築方法を確認して理解できます。もちろん、コミュニティに参加してFlipperの改善に役立てることができます。このプラットフォームで何を構築するかを楽しみにしています。

このリポジトリでは

このリポジトリには、Flipperのすべての部分が含まれています。これも：

• Electronを使用して構築されたFlipperのデスクトップアプリ （

  /desktop

  ）
• iOS用のネイティブFlipperSDK（

  /iOS

  ）
• Android用のネイティブFlipperSDK（

  /android

  ）
• React Native Flipper SDK（

  /react-native

  ）
• JS Flipper SDK（

  /js

  ）
• プラグイン：
  • ログ（

    /desktop/plugins/public/logs

    ）
  • レイアウトインスペクター（

    /desktop/plugins/public/layout

    ）
  • ネットワークインスペクター（

    /desktop/plugins/public/network

    ）
  • 共有設定/NSUserDefaultsインスペクター（

    /desktop/plugins/public/shared_preferences

    ）
• ウェブサイトとドキュメント（

  /website

  /

  /docs

  ）

入門

Flipperのセットアップについては、スタートガイドを参照してください 。または、（まだ実験段階ですが）

npx flipper-server

要件

• ノード>=8
• 糸>=1.5
• iOS開発者ツール（iOSプラグインを開発するため）
• AndroidSDKとadb

ソースからの構築

デスクトップ

ソースから実行

git clone https://github.com/facebook/flipper.git
cd flipper/desktop
yarn
yarn start

注：Windowsを使用している場合は、この問題が解決するまでYarn1.5.1を使用する必要があります 。

スタンドアロンアプリケーションの構築

、、またはそれら

--mac

--win

--linux

yarn build

yarn build --mac --version $buildNumber

結果のアーティファクトは

dist/

iOSSDK+サンプルアプリ

cd iOS/Sample
rm -f Podfile.lock
pod install --repo-update
open Sample.xcworkspace
<Run app from xcode>

インストールを高速化するために省略でき

--repo-update

AndroidSDK+サンプルアプリ

Androidエミュレーターを起動し、プロジェクトルートで次を実行します。

./gradlew :sample:installDebug

React NativeSDK+サンプルアプリ

cd react-native/ReactNativeFlipperExample
yarn
yarn android

最初の2つのステップは1回だけ実行する必要があることに注意してください。

iOS

yarn ios

初めて実行する場合は 、フォルダ

pod install --repo-update

react-native/ReactNativeFlipperExample/ios

JSSDK+サンプルReactアプリ

cd js/react-flipper-example
yarn
yarn start

トラブルシューティング

古いバージョンのヤーンでは、「他のヤーンインスタンスが終了するのを待っています」というメッセージとともにエラー/ハングが表示される場合があります。その場合は、

yarn

react-native/react-native-flipper

ドキュメンテーション

fbflipper.comでこのプロジェクトの完全なドキュメントを見つけて ください。

私たちのドキュメントはDocusaurusで構築されています。これを実行することにより、ローカルでビルドできます。

cd website
yarn
yarn start

貢献

支援方法については、 CONTRIBUTINGファイルを参照してください。

ライセンス

フリッパーは、LICENSEファイルにあるようにMITライセンスです。