【Netlify】Flutterアプリを無料で公開してみた。

最近（？）個人開発系の記事が流れてきており、興味が沸いた。
まずは、ミニマムなところから触ってみようと考え、
簡単なアプリを作成して公開してみた。

概要

①作成したアプリ
　１秒毎に大谷選手の秒給分、画面の数字が増えていく単純なアプリです。

②利用したサービス
　Netlify
　
　Githubに連携することで、リポジトリを選択して、
　簡単にデプロイを行うことが出来るそう。
　今回は、手動アップロードによるデプロイを行っていく。

手順

たったの２stepです。

①リリースを行うプロジェクト配下で、ビルドを行う。
　今回は、Webアプリのみを指定。

flutter build web --release

②build/web配下に必要なファイルが生成されるので、
　webフォルダごとNetlifyでアップロードする。
　※ or deploy manually から手動UL

これだけでサイトを公開出来ました。
※こちらが実際にアップロードしたアプリです。　※自動生成なので、urlが怪しく見える….。
<https://sprightly-flan-fc9fdf.netlify.app/>

おまけ（今回のソース）

import 'package:flutter/material.dart';
import 'dart:async';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '大谷選手の収入シミュレーター',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: IncomeSimulator(),
    );
  }
}

class IncomeSimulator extends StatefulWidget {
  @override
  _IncomeSimulatorState createState() => _IncomeSimulatorState();
}

class _IncomeSimulatorState extends State<IncomeSimulator> {
  final double incomePerSecond = 394.444;

  // 表示する累計金額
  double totalIncome = 0.0;

  // タイマーを管理
  Timer? timer;

  @override
  void initState() {
    super.initState();
    startIncomeUpdate();
  }

  @override
  void dispose() {
    timer?.cancel(); // アプリ終了時にタイマーを停止
    super.dispose();
  }

  void startIncomeUpdate() {
    timer = Timer.periodic(Duration(seconds: 1), (timer) {
      setState(() {
        totalIncome += incomePerSecond; // 1秒ごとに金額を加算
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('大谷選手の収入シミュレーター'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              '大谷選手が稼ぐ金額',
              style: TextStyle(fontSize: 36, fontWeight: FontWeight.bold),
            ),
            SizedBox(height: 20),
            Text(
              '${totalIncome.toStringAsFixed(2)} 円',
              style: TextStyle(
                  fontSize: 48,
                  fontWeight: FontWeight.bold,
                  color: Colors.green),
            ),
            SizedBox(height: 20),
            Text(
              '(このアプリはジョークアプリです)',
              style: TextStyle(fontSize: 24, color: Colors.grey),
            ),
          ],
        ),
      ),
    );
  }
}