Tech Racho エンジニアの「?」を「!」に。
  • Ruby / Rails関連

Rails: Hotwire Nativeをデバッグする(4)ネイティブアプリのログを取る(翻訳)

概要

元サイトの許諾を得て翻訳・公開いたします。

日本語タイトルは内容に即したものにしました。

従来Turbo NativeとStradaと呼ばれていたものは、現在はHotwire Nativeに統合されました。

参考: Hotwire Native: Hotwire Native is a web-first framework for building native mobile apps.

hotwired/hotwire-native-ios - GitHub

hotwired/hotwire-native-android - GitHub

Rails: Hotwire Nativeをデバッグする(4)ネイティブアプリのログを取る(翻訳)

「Hotwire Nativeをデバッグする」シリーズの続きです。本シリーズは、Hotwire Nativeで問題が起きたときに役立てるためのものです。
今回はログを扱います。私はどんなプログラミング言語やフレームワークを使うときも、ログの内容を常に掌握できるよう心がけています。

この習慣は、私が10年以上の間、何百個ものアプリケーションを扱ってきた経験の賜物です。

Hotwire Nativeを使うときは、ログに関する4つの異なる環境をしっかり理解しておく必要があります(バックエンド次第ではさらに増える可能性もあります)。

Hotwire Nativeのログは以下の4つの場所から取り出せます。

  • サーバーログ
    -JavaScriptのログ
  • iOS のログ
  • Androidのログ

本記事では、主にWeb開発者を想定読者として、iOSとAndroidに充填を起きます。

🔗 Android Studioでログを取得する

Androidにはすぐ使える優秀なデバッグツールがいくつも揃っています。システムログはそうしたツールの好例です。Logcatウィンドウと組み合わせると、Androidでのログ取得は驚くほど洗練されたエクスペリエンスとなるでしょう。

たとえば、ログのさまざまな部分にタグを直感的に追加できます。

「先生、質問です。タグって何ですか?」

タグとは、ログに追加する特定のカテゴリのことです。

タグの構文は以下のとおりです。

Log.e("TAG", message)

Log.e()という関数にご注目ください。eはエラーのことです。ログレベルに応じて他にも以下の関数が用意されています。

  • Log.e() -> error
  • Log.d() -> debug
  • Log.i() -> information
  • Log.wtf() -> What a terrible failure

Android Studioで以下のボタンをクリックするとLogcatが開きます。

ここでCtrl + Spaceを押して検索候補を表示することも、独自の絞り込みを開始することも可能です。

たとえば、以下は私が多用している検索です。

以下のようなWebFragmentクラスがあるとします。

@HotwireDestinationDeepLink(uri = "turbo://fragment/web")
open class WebFragment : HotwireWebFragment() {
    private val TAG = "WebFragment"

    override fun onStart() {
    super.onStart()
    Log.d(TAG, "calling onStart()")
    }
    ...
}

ログをtag:WebFragmentで検索すれば、これをログで見つけられることがわかります。

Logcatで用意されているフィルタは、タグよりもずっと豊富です。

たとえば、「パッケージ」「プロセス」「メッセージ「ログレベル」「age(経過時間)」に論理演算子を組み合わせてフィルタできます。

Androidでの開発はiOSと比べて複雑ですが、Android Studioのログ取得やデバッグ機能は驚くほど強力です。

🔗 Xcodeでログを取得する

「Apple流」のログ取得方法を試してみた結果、iOSでもAndroidと共通のデバッグエクスペリエンスを得られるようにするのがよいと判断しました。環境を切り替えたときの認知の負荷を下げたかったからです。

そこで自分のiOSアプリに以下を仕込みました。

import OSLog
extension Logger {
  private static var subsystem = Bundle.main.bundleIdentifier!
  static let connections = Logger(subsystem: subsystem, category: "Connections")   static let accounts = Logger(subsystem: subsystem, category: "Account")
}

テストではbundleIdentifiernilになる可能性があるため、以下を設定しておく必要がある点にご注意ください。

subsystem = "com.example.fallback"

これで、さまざまなログを以下に示したようにカテゴリでフィルタできるようになります。このフィルタはXcodeの右下に表示されます。

これで、必要に応じてロガーを自由に拡張できます。

本記事がお役に立ちますように。
Happy hacking!

関連記事

Rails: Hotwire Nativeで作るネイティブモバイルアプリ: iOS編(1)(翻訳)

Rails: Hotwire Nativeで作るネイティブモバイルアプリ: Android編(1)セットアップ(翻訳)


CONTACT

TechRachoでは、パートナーシップをご検討いただける方からの
ご連絡をお待ちしております。ぜひお気軽にご意見・ご相談ください。