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

Rails: Hotwire Nativeをデバッグする(5)ブレークポイント(翻訳)

概要

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

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

従来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をデバッグする(5)ブレークポイント(翻訳)

Hotwire Native iOSアプリとHotwire Native Androidアプリをデバッグする本シリーズ記事の最終回へようこそ。本シリーズでは「よくある質問」「ログ取得の方法」「WebViewのデバッグ」までの項目をひと通り網羅してきました。今回はいよいよブレークポイントです。

XcodeもAndroid Studioもプログラムを一時停止できる強力なデバッガを備えていて、一時停止した時点のさまざまなオブジェクトや変数を検査できます。

最初にAndroid Studioでブレークポイントを使う方法、そして最後はXcodeでブレークポイントを使う方法で締めくくりましょう。

🔗 Android Studioのデバッガを使う

🔗 前提条件

isDebuggableapp/build.gradle(アプリレベル)でtrueに設定してあること。

  getByName("debug") {
            isDebuggable = true
            applicationIdSuffix = ".debug"
            proguardFiles(getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro")
            ...
  }

エミュレータを利用するか、またはUSBデバッグが有効な物理のAndroidスマートフォンが用意されていること(USBデバッグはSettings > System > Developerオプションにあります)。

🔗 ブレークポイントを設定する

ブレークポイントを設定したい行番号をクリックすると、赤い点が行番号の位置に表示されます。

ここでブレークポイントを右クリックして、ブレークする条件を設定できますが、必須ではありません。

🔗 デバッグを開始する

以下のDebugボタンをクリックします。

これでAndroidはアプリをデバッグモードで起動します。成功すると、エディタの左下に小さな虫のアイコンが表示されます。

このブレークポイントでコードを実行できます。
ステップオーバーや、関数へのinやoutなどの一般的なデバッグツールも利用できます。その時点でさらにコードを実行することも可能です。

Android Studioのデバッガは強力で、かなり深くまで到達できます。本記事はAndroid初心者のHotwire Native開発者を対象としているため、この辺で切り上げてXcodeに進むことにします。

🔗 Xcodeのデバッガを使う

🔗 前提条件

🔗 ビルド設定をDebugに設定すること

Xcodeには適切なデフォルト設定がありますが、デバッガが動作しない場合は以下の設定を確認しておきましょう。

  • Product > Scheme > Edit Scheme > 「Run」タブ > Info > 「Set Build Configuration to Debug(新規プロジェクトのデフォルト)」

🔗 ブレークポイントを設定する

ブレークポイントを設定したい行番号をクリックすると、青い矢印が行番号の位置に表示されます。

🔗 デバッグを開始する

⌘+Rキーでアプリを実行します。

コードの実行がそのブレークポイントに差し掛かると、Xcodeの下部でデバッグウィンドウが開きます。

ここでLLDBデバッガを使ってpo variableオブジェクトを出力したり、expr variable = newValueのようにコードを実行したりできます。

Androidのデバッガほどスムーズで直感的とはいきませんが、ステップオーバーや、関数へのinやoutなどが使える点は似ています。本記事ではここでおしまいとします。

🔗 ついにデバッグ方法を学び終えた

新しいフレームワークやパラダイムを学ぶときは苦労がつきものですが、ネイティブアプリの開発も例外ではありません。Hotwire Nativeはうまく動いているうちはよいのですが、問題に遭遇したときにどう対応すればよいでしょうか?

皆さんが本シリーズで学んだ知識を駆使すれば、皆さんの貴重な数時間を節約できるはずです。デバッグを行うときは、謎を解くために何をすればよいか、どこを調べればよいかを押さえておけば十分です。

Happy hacking.

関連記事

RailsとHotwire Nativeで Android / iOS アプリを作ろう(全15回)

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

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


CONTACT

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