CircleCIを使ってAndroidアプリをデプロイゲートに自動でデプロイ【CirleCI 2.0】
みなさん、CircleCI使ってますか？
にわかエンジニアの私も、CircleCIは便利なので最近お世話になっています。
今回はAndroidアプリを作成する際に、git pushから自動でデプロイゲートへデプロイをしてくれる環境を構築しました。
今まではapkファイルを作成後に手動でデプロイゲートへアップしていましたが、gitへpushするだけで自動で実行されるようになったので非常に便利です！！
酔っ払いながら環境構築したので、忘れないうちにメモっておきます。
まずはアプリのプロジェクトをGitHubかBitbucketにpush
今回はAndroidアプリを作成していることを想定しています。
作成しているアプリはGitHubかBitbucketのどちらかでバージョン管理しているものとします。
CircleCIへログイン
とりあえず、CircleCIへログインしましょう。
アカウントを持っていない方はサインアップ。
GitHubかBitbucketのアカウントがあればすぐに使用できるので簡単です。
ログイン後は、自動でデプロイしたいアプリにチェックし、「Follow」を押しましょう
CircleCIの環境変数を設定
プロジェクトの設定 -> Environment Variables -> Add Variables に、デプロイゲートのAPI Keyを設定しましょう。
今回、Key名は DEPLOY_GATE_API_KEY としています。
デプロイゲートのAPI Keyは、デプロイゲートのアカウント設定ページから確認できます。
CircleCIの設定
Androidアプリのプロジェクトに、CircleCIの設定ファイルを追加します。
Androidアプリプロジェクトのルートディレクトリ（appとかgradleとか格納されているディレクトリ）に、 .circleci/config.yml ファイルを作成します。
設定のサンプルは公式にあがっています。
これを参考に、下記のように修正します。（今回テストは実行していません）
version: 2
jobs:
build:
branches:
only:
- develop
working_directory: ~/code
docker:
- image: circleci/android:api-25-alpha
environment:
JVM_OPTS: -Xmx3200m
steps:
- checkout
- restore_cache:
key: jars-{{ checksum "build.gradle" }}-{{ checksum "app/build.gradle" }}
- run:
name: Download Dependencies
command: ./gradlew androidDependencies
- save_cache:
paths:
- ~/.gradle
key: jars-{{ checksum "build.gradle" }}-{{ checksum "app/build.gradle" }}
- run:
name: Generate APK
command: ./gradlew assembleDebug
- run:
name: Upload DeployGate
command: curl -F "token=${DEPLOY_GATE_API_KEY}" -F "file=@app/build/outputs/apk/debug/app-debug.apk" -F "message=deployed" https://deploygate.com/api/users/デプロイゲートの登録名/apps
デプロイゲートの登録名 は、各自修正してください。
今回は Bitbucketで develop ブランチにpushした場合のみデプロイゲートにデプロイされるようになっています。
以上です。
CI使えばいろいろできるので、今後も活用していこうと思います！
CircleCI + Capistranoでデプロイできなくて焦った話
Railsアプリを作成する際は、CircleCIを使ってCapistranoでAWS EC2にデプロイしているのですが、ある日急にデプロイできなくなりました。。
CircleCIのログを見ると以下のメッセージが。
01 /srv/xxxx/shared/bundle/ruby/2.5.0/gems/bootsnap-1.3.2/lib/bootsnap/compile_cache/iseq.rb:37:in `fetch' 01 : 01 No space left on device - bs_fetch:atomic_write_cache_file:write 01 ( 01 Errno::ENOSPC 01 ) 01 from /srv/xxxx/shared/bundle/ruby/2.5.0/gems/bootsnap-1.3.2/lib/bootsnap/compile_cache/iseq.rb:37:in `load_iseq' 01 from /srv/xxxx/shared/bundle/ruby/2.5.0/gems/bootsnap-1.3.2/lib/bootsnap/load_path_cache/core_ext/kernel_require.rb:21:in `require' 01 from /srv/xxxx/shared/bundle/ruby/2.5.0/gems/bootsnap-1.3.2/lib/bootsnap/load_path_cache/core_ext/kernel_require.rb:21:in `block in requir
No space left on device とありますが、EC2インスタンスの容量が足りないようです。
EC2のインスタンスにログインしてみます。
__| __|_ )
_| ( / Amazon Linux AMI
___|\___|___|
https://aws.amazon.com/amazon-linux-ami/2018.03-release-notes/
/home/xxxx/.rbenv/libexec/rbenv-init: 行 131: ヒアドキュメント用一時ファイルを作成できません: デバイスに空き領域がありません
空き容量が無いって出てますやん。
$ df -h ファイルシス サイズ 使用 残り 使用% マウント位置 devtmpfs 483M 60K 483M 1% /dev tmpfs 493M 0 493M 0% /dev/shm /dev/xvda1 7.8G 7.8G 0 100% /
100%やん！
ということで、以下のコマンドでログをクリア。
ファイル自体は削除せず内容を空に。
$ find /var/log/ -type f -name \* -exec cp -f /dev/null {} \;
結果、容量が空き無事にデプロイ出来ました。
$ df -h ファイルシス サイズ 使用 残り 使用% マウント位置 devtmpfs 483M 60K 483M 1% /dev tmpfs 493M 0 493M 0% /dev/shm /dev/xvda1 7.8G 4.9G 2.9G 63% /
一応解決！ ただ、もうちょいサイズは増やさないとなー
はてなブログでソースコード表示時にタイトルを付ける
技術系のブログを書くときは、ソースコードの貼付けってしますよね？
その時にタイトルというか、ファイル名みたいなの付けたいんです。はてなブログで。
こんな感じ
puts 'nomisugita.'
hatena.rb というファイル名が表示されています。
Markdown記法ならバッククォート3つの後に ruby:hatena.rb とかで出来るけど、はてなブログは対応していないっぽい。
てことで、はてなブログ用にデザインCSSを作りました！
[デザイン] -> [カスタマイズ] -> [デザインCSS] に下記を追加で貼り付ければ使用できます。
/* ソースコードの囲み */ pre.code { margin-bottom: 1.5em; padding: 1em; background: #333; color: #eee; position: relative; border-radius: 3px; } /* ソースコードタイトル */ .code-title { position: relative; } .code-title pre.code { padding-top: 2.4em; } .code-title::before{ content: attr(data-title); padding: 0 1em; background: #666; color: #fff8e1; font-size: 0.8em; border-radius: 3px 0 0 0; position: absolute; top: 0; left: 0; z-index: 10; }
使い方
下記のように、ソースコードをタグで囲みます。
data-title にタイトルを入れてください。
<div class="code-title" data-title="ここにタイトル！"> <!-- ここにソースコード --> </div>
実際の仕様例はこんな感じ↓
これで下記のように表示されます。
puts 'nomisugita.'
満足満足
Android端末を無線で実機デバッグ
Androidアプリの開発をしていると、実機確認する際にPCとAndroid端末が繋がっているのって邪魔じゃないですか？
私は邪魔でした！無線化しましょう！
環境はmac想定です。
まずはadbを使えるように！
Android端末をコマンドラインで操作するために、Android Debug Bridge（adb）を使います。
Android Studioを入れている場合はすでにadbが入っていると思うので、まずはパスを通します。
bash_profileを編集
vi ~/.bash_profile
パスを追加
# 下記を追加 export PATH=$PATH:/Users/[ユーザー名]/Library/Android/sdk/platform-tools
source の再読込
source ~/.bash_profile
これでオッケー！
パスが追加されているかは下記コマンドで確認できます。
echo $PATH
Android端末を接続
Android端末とPCを同じWi-Fi環境に置いてください。
事前にAndroid端末のIPアドレスを確認しておきます。
[設定] -> [システム] -> [端末情報] -> [機器の状態] -> [IPアドレス] などで確認できます。
Android端末とPCをケーブルで接続した状態で、下記を実行します。
adb tcpip 5555 adb connect xxx.xxx.xxx.xxx #ここにIPアドレス
これでケーブルを抜いても、デバッグできるようになります！
ヤバイ便利。
接続を解除する場合は下記を実行。
adb disconnect
せっかくなのでスクリプトも作るか
接続をひとつのコマンドで出来るようにしましょう。
てきとーにスクリプト入れる用のディレクトリでも作ってパスを通しておきます
mkdir /User/[ユーザー名]/scripts
パスを追加
# 下記を追加 export PATH=$PATH:/Users/[ユーザー名]/scripts
source の再読込
source ~/.bash_profile
次にスクリプトを書くファイルを作成します。
ここで作成したファイル名が実行するコマンドになります。
vi /User/[ユーザー名]/scripts/adbc
#!/bin/sh # android端末に接続 adb tcpip 5555 && adb connect xxx.xxx.xxx.xxx #ここにIPアドレス
行頭に #!/bin/sh を付ける必要があるため注意してください。
スクリプトを実行可能にするため、ファイルの権限編集を行います。
chmod u+x /User/[ユーザー名]/scripts/adbc
ここまでで完了です！
Android端末をPCにつないで、ターミナルで下記を実行すれば接続されます！
adbc
いやー捗る
ちなみに、IPアドレスを可変で指定したい場合は、スクリプトを下記のようにします
#!/bin/sh # android端末に接続 adb tcpip 5555 && adb connect $1
これで実行時にIPアドレスを渡せるようになります
adbc 192.168.100.1
これでどこでも無線デバッグ！
