LoginSignup
1
3

More than 3 years have passed since last update.

Flutter×Codemagic入門(アカウント作成~テスト/ビルド/配信の自動化)

Posted at

:book: Flutterの記事を整理し本にしました :book:

  • 本稿の記事を含む様々な記事を体系的に整理し本にまとめました
  • 今後はこちらを最新化するため、最新情報はこちらをご確認ください
  • 25万文字を超える超大作になっています!!

まとめ記事

はじめに

  • 個人開発だと、とりあえずGithubでソースコードを管理するだけでいいや!になり、CICDまでちゃんとやろうとならないのですが、せっかくなので、Codemagicを用いて、自動化してみました。

Codemagicとは

CodemagicはCI/CDサービスの一種で、GithubActionなどと同じようなサービスになります。
Flutterの専門のCI/CDから始まったため、かなりFlutterのCI/CDが扱いやすくなっています。

初期設定

アカウントの作成

サイトにアクセスし、Sign upをクリックします。

4tv7glagavh6hhdzxurc3ql6u6hk.png

続いて、認証方法を選択し、認証します。

g1l1qahgf6jdsvdhmfnjhh77ifui.png

この後Github側で許可をすれば、アカウント作成が完了します。

以後、Githubを前提に進めます

リポジトリの設定

リポジトリを連携させるために「Install GitHub app」をクリックします。

5fg0g8njiru96bkd3xrtkw1ypbby.png

連携するリポジトリを選択して認証を行います。

s1e37jcele7cg8if964zbbi2t29u.png

デフォルトフローでのビルド

「Set up build」を選択します。

zxgknaqni7ulps9w3j3b1jpqzx01.png

アプリの種類を聞かれるので、「Flutter App」を選択します
oxr7fx4g3sp6hfh86svx8yjpbjqm.png

フローの編集画面に移動します。
「Workflow Editor」に移動した上で、「Start your first build」をクリックして、デフォルトの設定のまま実行します。

ffnf91qon10e1x04bw1ih1p93n5w.png

ブランチとフローを選択します。
ブランチは、ビルドに利用するブランチを選択してください。フローはデフォルトで問題ありません。
nciu3p4ysbqbzbpex9nfgays61dj.png

ビルドが問題なく終わると、「build finished」が表示され、成果物が作成されます。

1jgp0ybpj7pek9s1hrweqll9qc40.png

なお、ビルド中はビルドを行っているマシンにリモート接続することも可能です。
kdvpd2p8n9sg9h1bytb8uma9luu2.png

ビルドフローの概要

ビルドのカスタマイズが必要な場合は、「WorkFlow Editor」や「codemagic.yaml」で設定を行います。

今回はWorkFlow Editorを使いGUIからカスタマイズを行います。
codemagic.yamlには触れません。

全体的な流れは下記のようになっています。

ky69v8ipsvc3vocs1zopouta5wpa.png

全体設定

また、どのプラットフォーム向けにビルドするのかと、どの環境でビルドするのかを全体の設定として選択します。

0e6q1qaidnjmhu70wuq2isexb2qd.png

事前準備のカスタマイズ

Build trigger

ビルドトリガーでは、どのような条件でビルドを開始するのかを指定できます。
push,pullrequest,tagのイベントと対象となったブランチの正規表現の組み合わせでトリガーを設定します。

9eiwyp3ymt2z6pp0ge4wzgmkrnf0.png

Environment Variables

環境変数では、後続処理で必要な環境変数の定義を行います。

1sz6pkwg9yr51pfycmfhzvrlbjy5.png

Dependency caching

依存関係のキャッシュでは、特定の依存関係をキャッシュすることで、取得や解消の処理をキャッシュから行い、作業を効率化します。

8zux80lbp8qi63qouphw5jenhmb3.png

Post-clone script

cloneを行った後に、スクリプトを設定することができます。
以後の各処理の間にもスクリプトを設定でき、コマンドの実行など、細かく処理を制御できるようになっています。

fnpuhebnnvgky08ysorax0g8y1zn.png

オプションの処理となるpost,preのスクリプトは同じ形式ですので、以後は省略します。

テストのカスタマイズ

テストの設定では、解析やテストの実行の有無、テストNG時のビルドの停止などのプロセスの制御や、実行時のパラメタ、エミュレータの種類などを設定します。

m8xe00jhzlh6ggtbwak84lt8cu67.png

パイプラインには細かいログが表示されます。
テストにおいては、全体の概要のResultと詳細のLogを確認することができます。

9sw1t3a2v4irnoc3h11b4ckjtlu3.png

ビルドのカスタマイズ

Build

ビルドの設定では、FlutterやXCodeのバージョンや、Androidの出力形式、モードなどを選びます。

ofd0gte3xf7ho0vz9ijeqgdnj06t.png

配信のカスタマイズ

メール

デフォルトでメールに連絡が来るようになっていますが、もちろんカスタマイズすることもできます。
メールアドレスを追加したり、失敗した時にメールが来るようにできます。

fjfys5irtf2s64xzvc87m45exna1.png

なお、通知されたメールのリンクをクリックすることで、作成された成果物をダウンロードすることができます。

qmuzzgi9ex5h61h1eeh21lidct53.png

Slack

SlackにもWorkspace/channelを指定した上で、通知を送ることができます。

g70a4y1sjj7d66fvci891jay4rmt.png

こちらも同じようにリンクから、作成された成果物をダウンロードすることができます。

pyw2eitv392dbzowg1dhi6tcmppg.png

GooglePlay/AppStore

署名(Android code signing / iOS code signing)を行った上で、「Google Play」「App Store Connect」の設定を行うと、自動でそれぞれのストアにアップロードをすることもできます。

配信ストアへの自動アップロードは、運用の仕方やどこまでを自動で行い、どこからを手動でチェックするのかなどが、各プロジェクトの案件によって異なりますので、ここでは省略させていただきますが、公式ドキュメントに詳細な手順がありますので、こちらをご参照ください。

Codemagic公式ドキュメント

1
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
3