無料でAIとペアプロ！？OpenHands × OpenRouterでAndroidアプリをバイブコーディングしてみた話

1. OpenHandsって何？

1-1. 通常のローカル実行

docker pull docker.all-hands.dev/all-hands-ai/runtime:0.53-nikolaik

docker run -it --rm --pull=always \
    -e SANDBOX_RUNTIME_CONTAINER_IMAGE=docker.all-hands.dev/all-hands-ai/runtime:0.53-nikolaik \
    -e LOG_ALL_EVENTS=true \
    -v /var/run/docker.sock:/var/run/docker.sock \
    -v ~/.openhands:/.openhands \
    -p 3000:3000 \
    --add-host host.docker.internal:host-gateway \
    --name openhands-app \
    docker.all-hands.dev/all-hands-ai/openhands:0.53

http://localhost:3000 で確認できます。

1-2. OpenHands CLI

最初に初期設定を求められます。

コマンド操作などができるようになります。

1-3. GitHub Actionsでの openhands-resolver

2. OpenRouterって何？

※ OpenRouterには無料枠とクレジットの2段階がある

3. 実践！Android日記アプリをAIとバイブコーディング

3-0. 事前準備

.github/workflows/
にGitAction用のYAMLを設置（複数可）

今回は以下を設置
・OpenHands用のopenhands-resolver
・自動テスト用のfirebase-testlab（後述）

3-1. IssueからPR（プルリクエスト）作成まで

"fix-me"ラベルがついたGitHub Issueを検知するとGitActionが実行されOpenHandsが働いてくれます。

しばらく待つと開発ブランチ（openhands-fix-issue-{issue番号}）にコミットしてPRを作成してくれます

3-2. 自動ビルド＆テスト

main（default）ブランチ向けのPRが作成されるタイミングでビルドチェックを行い、ビルドエラーの場合はエラーログをPRにコメントして、ビルド成功した場合はFirebase Test Labでテストコード実行してキャプチャを残すGitActionを用意しました。

↓.github/workflows/firebase-testlab.yml

name: Run Instrumentation Tests on Firebase Test Lab

on:
  pull_request:
    branches: [ main ]
  push:
    branches: [ main ]

jobs:
  firebase-test:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v3

      - name: Set up JDK
        uses: actions/setup-java@v3
        with:
          distribution: 'temurin'
          java-version: '17'

      - name: Set up Android SDK
        uses: android-actions/setup-android@v2

      - name: Write service account key from Base64
        run: |
          echo "${{ secrets.GCLOUD_SERVICE_KEY_B64 }}" | base64 -d > gcloud_key.json

      - name: Authenticate to GCP
        run: |
          gcloud auth activate-service-account --key-file=gcloud_key.json
          gcloud config set project your-gcp-project-id
        env:
          GOOGLE_APPLICATION_CREDENTIALS: gcloud_key.json

      - name: Build debug and test APKs
        id: build_apk
        run: |
          ./gradlew assembleDebug assembleAndroidTest > build.log 2>&1 || echo "BUILD_FAILED=true" >> $GITHUB_ENV

      - name: Comment build error on PR
        if: env.BUILD_FAILED == 'true'
        run: |
          echo " :x: Android Build Failed" > comment.md
          echo '```' >> comment.md
          tail -n 300 build.log >> comment.md
          echo '```' >> comment.md
          gh pr comment "$PR_NUMBER" --body-file comment.md
        env:
          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          PR_NUMBER: ${{ github.event.pull_request.number }}

      - name: Run tests on Firebase Test Lab
        run: |
          gcloud firebase test android run \
            --type instrumentation \
            --app app/build/outputs/apk/debug/app-debug.apk \
            --test app/build/outputs/apk/androidTest/debug/app-debug-androidTest.apk \
            --device model=redfin,version=30,locale=en,orientation=portrait \
            --results-bucket=your-test-lab-results

3-3. 自動修正

PRのラベルに"fix-me"をつけるとPRコメントを読んで修正してくれました。
今回はImageButtonのimportが抜けていただけのようでした。

ビルドが成功したので、Firebase Test Lab がテストを実行して、UIテストのキャプチャーをバケットに残してくれています

3-4. 最終確認

例ではお気に入り機能をつけてうまく実装されていそうでした。

4. やってみた感想

5. おまけ：AIで情報キャッチアップツールも作ってみた

無料APIキーを活用して、自分専用ニュースアシスタントが完成しました。

まとめ