ロコガイド テックブログ

「地域のくらしを、かしこく、たのしく」する、株式会社ロコガイドの技術部ブログです。主にトクバイ・ロコナビのサービス開発について発信しています。

「地域のくらしを、かしこく、たのしく」する、株式会社ロコガイドの技術部ブログです。
主にトクバイ・ロコナビのサービス開発について発信しています。

世界一お手軽!2行書くだけ!iOSバグレポーティングライブラリ”Huruhuru”をリリースしました

f:id:nnnnn15z:20200302181528p:plain

こんにちは、ネコ大好きiOSエンジニア@k0uhashiです。最近ネコチャンを迎え入れました。いまでは主従の立場が逆転してしまいました。僕は奴隷です。でもそれがいい。

ところで、みなさん、アプリ開発でのバグレポーティングってどうしますか?不具合っぽいの見つけたらSlackで報告?プロジェクト管理ツールにチケットを作る?GitHubにissueたてる?...スクショをとって貼り付けて報告するのって面倒ですよね。

今回、そのバグレポーティングに便利な軽量ライブラリを作ったので紹介します。

Huruhuru

iPhoneを手に持って振っているGIF画像
動作イメージ

上記GIFのようにアプリ内から簡単にバグレポーティングできるライブラリです。コードを2行書くだけで導入できます。

  • 特徴
  • コード2行で導入できる(※CocoaPodsへの記述を含めると3行)
  • オープンソース (★GitHub)
  • GitHubのみ対応 (2020/02/27現在)
  • 発火ジェスチャーをカスタムでき、他ライブラリとのジェスチャー競合回避が可能(※まだシェイクジェスチャーかスクショ検知しか対応してませんが今後追加予定)

レポーティング時は、以下のようにissueが作成されます。(※2020/02/27現在)

作成されたissue画像
作成されたissue

導入方法

  • 最新情報は★README.md参照
  • Huruhuruは、ライブラリ管理ツールCocoaPodsを利用して導入することを推奨しています。
  • 【前準備】アプリからGitHubにissueを立てるためのトークンを発行し、保管しておきます。 ★詳細

CocoaPodsに導入文を1行追加します

# Podfile
pod 'Huruhuru'
pod 'Huruhuru', :configurations => ['Staging'] // スキーマを指定したほうが安全かもしれません。お好みでどうぞ。

コード内に定義とimport文追加します

// AppDelegate.swift
// ...
import Huruhuru
// ...
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
    // ...
    Huruhuru.shared.start(sendTo: Huruhuru.RepositoryInfo(ownerName: GITHUB_OWNER_NAME, repositoryName: GITHUB_REPOSITORY_NAME) , token: Huruhuru.GithubToken(token: GITHUB_TOKEN), supportDetectGesture: Huruhuru.SupportDetectGesture(types: [.shake, .screenshot]) )
    // ...
}

ryo-takahashi/example-app にissueを立てたい場合は、次のように記述します

Huruhuru.shared.start(sendTo: Huruhuru.RepositoryInfo(ownerName: "ryo-takahashi", repositoryName: "example-app") , token: Huruhuru.GithubToken(token: GITHUB_TOKEN), supportDetectGesture: Huruhuru.SupportDetectGesture(types: [.shake, .screenshot]) )

※このままリリースすると本番アプリでも出てしまうので、開発環境のみ実行させるような分岐処理を入れてくださいね!

導入はこれで完了です。あとは冒頭のGIFのようにアプリを起動し端末をHuruhuruってみてください!

₍₍⁽⁽📱👋₎₎⁾⁾

仕組み

f:id:nnnnn15z:20200228174429p:plain

  1. アプリ上の画面を画像データ化
  2. ★GitHub Contents API を利用して画像アップロード専用ブランチを切り、画像をアップロード
  3. ContentsAPIのレスポンスにアップロード先のURLが返ってくるので、その参照URLと入力した内容と端末情報をがっちゃんこしてissue作成用データ作成
  4. 3. を元に ★GitHub Create Issue API を利用してissue作成

当初画像のホスティング先でウーンウーン悩んでいて、アプリ開発者ならほぼみんなFirebase入れてるからFirebaseCloudStorageにアップロードするのがいいんじゃね?と考えていたのですがそうするとセットアップが面倒で導入のハードルが高くなりそうだなあと思ったり依存先を増やすのもどうなんだろうと思ったりして結局このような形に落ち着きました。

GitHubなら対象リポジトリを閲覧できるメンバーのみにアクセスが限定できるので、セキュリティ的にも良いですね。 ソースコードは★GitHubで公開しています。

今後は発火ジェスチャー種類を増やしたり、ペイント機能、動画機能、シェア先の追加の実装を想定しています。

開発の背景

ロコガイドでは、レイアウト崩れや不具合を見つけたときにGitHubのそれぞれのリポジトリにissueを立てるという運用を行っています。(僕が個人的に作ってるアプリや副業でお手伝いしているチームでも似たような運用を行っています。)
以前までは今回開発した Huruhuru と同じようにアプリ内からレポーティングできる有料サービスを使っていました。
しかし、値上げをきっかけに再検討し自分でも作れそう and OSS作ってみたかった and 個人アプリ開発でも似たような仕組みで運用したくて、自作しました。めちゃくちゃ便利です。

まとめ

  • 開発チーム内で簡単にバグレポーティングできる機能を作り、公開しました。
  • 現時点では最低限の機能かつGitHubのみにしか対応していませんが、今後色々対応予定です。
  • 日常的に気軽にフィードバックできる状態にすることは大事ですね。
  • 今回作ったものは誰でも簡単に導入できるので、よければ使ってみてください。

locoguide.co.jp