Flutter製個人アプリをリリースした!

今思えば長い道のりだった!

2022年の9月始めにFlutter3で個人アプリをたったの3日で開発してリリースしました!

iOS版
https://apps.apple.com/app/ユー-フィール-チャート/id1643510750

2022年の9月15日に最新申請したAndroid版も審査に通りました!
AppBarのTextが左端によってしまうAndroid特有の問題を解消しました!

Andriod版
https://play.google.com/store/apps/details?id=com.junichi.you_feel_chart

アプリをリリースするまでにやったこと

Flutterは１年以上勉強していましたが、最初はレシピアプリを作ろうかなと思ったが、既に世の中に素晴らしいアプリがあったので、やめました😇
で、今度は動物系のアプリを作ろうとしたのですが、アイディアが形にならずに断念しました😭

まずは、手持ちの技術でアプリを作ることにしました!

1. 毎日技術を学びながら、Zennの記事を書いてoutputしていましたね。
2. デザインツールについて学びながら申請用のスクリーンショットを作りました!
3. 用件定義->デザイン->コーディングですが、頭の中に設計図があったので、開発から始めました
4. アプリ完成させてAppStoreとGooglePlayに申請しました!

使った技術とサービス

iPhoneの端末のスクリーンショットはこちらを使いましたね!
これすごいですよ!、おすすめです💙
https://apps.apple.com/jp/app/mockview/id1592728145

Androidはモックがなかったので、以前のように画像を加工するサービスを使いました。
やり方は、白い背景の上にAndroidのエミュレーターを持ってきて、スクリーンショットを撮って、こちらのサービスを利用して背景を削除して、Android端末を操作している加工された画像を作成しました!
https://www.remove.bg/ja/upload

デザインがWebブラウザでできるサービス
美しいスクリーンショットが簡単に作れます。以前はKeyNoteで作りましたが、こっちの方がやりやすかったですね。無料の画像素材も使えますし!
https://www.canva.com/ja_jp/

Dartのpackageはこちらを使いました

• firebase_auth: ^3.4.2
  メールアドレスとパスワードログインで使用。退会機能もないとリジェクトされるとのことで、再認証をさせてユーザーを削除する機能をつけて対策をしました!

• cloud_firestore: ^3.3.0
  Firebaseにデータを保存するのに使いました。グラフに表示するデータはこちらから読み込んできています!

• flutter_hooks: ^0.18.5+1
  initStateと似た機能を使えるuseEffectメソッドを使用するために使用しました。
  useTextEditingControllerには、Stateを破棄してくれる機能があるらしい?、知らずに使ってました!

• hooks_riverpod: ^1.0.4
  状態管理はこちらのライブラリを使いました。流行りというのありますが、情報が多かったので個人開発で使用しました。

• fl_chart: ^0.55.1
  折れ線グラフを使用するために使いました。何を参考にしたかというと、ブログの記事ですが、公式ドキュメントを日本語翻訳しながら、ダミーのデータを描画できる綺麗な折れ線グラフを作ってから、Firebaseと連携させましたね。

• app_tracking_transparency: ^2.0.2+4
  iOS14以降はATTなるものに対しての対策が必要で、xmlとSwiftのコードを書いて設定しないと審査を通してくれなくなりました😇
  以前、Swiftでアプリを２個リリースしたときに躓きましたね!
  FlutterだとDartのライブラリと決まったコードを書くだけで簡単に設定できました!
  あとは、initStateでアプリが起動したときに、呼び出すだけですね🧑‍💻

SwiftではATTはこんなふうに対策した!
info.pilist

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>GADApplicationIdentifier</key>
    <string>ca-app-pub-3940256099942544~1458002511</string>
	<key>SKAdNetworkItems</key>
	<array>
      <dict>
        <key>SKAdNetworkIdentifier</key>
        <string>cstr6suwn9.skadnetwork</string>
      </dict>
	</array>
	<key>NSUserTrackingUsageDescription</key>
	<string>「許可」するとお客様に最適化された広告が表示されます</string>
	<key>UIApplicationSceneManifest</key>
	<dict>
		<key>UIApplicationSupportsMultipleScenes</key>
		<false/>
		<key>UISceneConfigurations</key>
		<dict>
			<key>UIWindowSceneSessionRoleApplication</key>
			<array>
				<dict>
					<key>UISceneConfigurationName</key>
					<string>Default Configuration</string>
					<key>UISceneDelegateClassName</key>
					<string>$(PRODUCT_MODULE_NAME).SceneDelegate</string>
					<key>UISceneStoryboardFile</key>
					<string>Main</string>
				</dict>
			</array>
		</dict>
	</dict>
</dict>
</plist>

AppDelegate.swift

//
//  AppDelegate.swift
//  MyHomeStocker
//
//  Created by 橋本純一 on 2022/02/12.
//

import UIKit
import RealmSwift
import AppTrackingTransparency
import AdSupport
import GoogleMobileAds

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
    
    var window: UIWindow?

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        
        // print(Realm.Configuration.defaultConfiguration.fileURL)
        
        do {
            let realm = try Realm()
        } catch {
            print("Error initialising new realm, \(error)")
        }
        
        if #available(iOS 14, *) {
                    ATTrackingManager.requestTrackingAuthorization(completionHandler: { status in
                        GADMobileAds.sharedInstance().start(completionHandler: nil)
                    })
                } else {
                    // Fallback on earlier versions
                    GADMobileAds.sharedInstance().start(completionHandler: nil)
                }
        
        
        return true
    }
    
    
    func applicationWillTerminate(_ application: UIApplication) {
        
    }

}

Podfile

# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'

target 'MyHomeStocker' do
  # Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!
  pod 'RealmSwift'
  pod 'SwipeCellKit'
  pod 'Google-Mobile-Ads-SDK'

  # Pods for MyHomeStocker

  target 'MyHomeStockerTests' do
    inherit! :search_paths
    # Pods for testing
  end

  target 'MyHomeStockerUITests' do
    # Pods for testing
  end

end

6日ぐらいで目的を達成できた!

開発と申請に３日使いついに、AppStoreで審査が通ってアプリをリリースできました!
自分の作ったアプリがStoreに並んで、自分のスマートフォンにインストールできたときの喜びは人生で最高の瞬間でしたね!
とても嬉しかったです。
また何か、自分が作ってみたいと思ったアプリを作りたいですね。