家庭菜園アプリ「はたけびより」を作って公開するまで

## はじめに

先日、自分が作ったWebアプリを公開しました。

**「はたけびより」** という家庭菜園の栽培記録・管理アプリです。

👉 https://garden-note-d9c5a.web.app

ブラウザで動くので、インストール不要で使えます。Googleアカウントでログインすれば、スマホとPCでデータを共有できます。

—

## なぜ作ったのか

正直に言うと、最初は「とにかく何か作ってみたい」という気持ちだけでした。

プログラミングを学び始めて、チュートリアルをこなしているだけでは「本当に自分で作れる気がしない」という壁にぶつかりました。手を動かして、一つ完成させることが大事だとわかっていても、何を作るかが決まらない。

テーマを考えたとき、「家庭菜園の管理」というアイデアが浮かびました。既存のアプリもありますが、シンプルに使えるものがなかなか見つからなかった。だったら自分で作ってしまおうと。ポートフォリオにもなるし、一石二鳥だと思いました。

—

## 使った技術

| 技術 | 用途 |
|——|——|
| Flutter | UIの構築（Dart言語） |
| Firebase Authentication | Googleログイン・匿名ログイン |
| Cloud Firestore | クラウドへのデータ保存 |
| Firebase Hosting | Webへの公開 |

技術選定の理由はシンプルで、「Flutterは一つのコードでスマホ・Web両対応できる」と聞いたからです。最初はモバイルアプリも視野に入れていたので、Flutterを選びました。バックエンドはFirebaseを使えばゼロからAPIを作らなくて済むので、初心者にはちょうどよかったです。

—

## 大変だったこと① 何を作るか決める

意外と一番悩んだのがここでした。

「家庭菜園アプリ」と決めても、どんな機能を入れるかが難しい。記録するだけなら簡単すぎるし、詰め込みすぎると完成しない。

最終的に「自分が使うとしたら何が欲しいか」を軸に考えて、最初は最低限の機能だけにしました。完成してから機能を足していく、という順番にしたことで、なんとかリリースまでたどり着けたと思っています。

—

## 大変だったこと② FlutterのUI実装

Dart言語もFlutterも初めてだったので、最初は画面を一つ作るだけで何時間もかかりました。

ウィジェットの概念や、StatefulWidget・StatelessWidgetの違いなど、覚えることが多くて混乱しました。公式ドキュメントやサンプルコードを読みながら少しずつ慣れていきました。

カレンダー表示・年間計画のガントチャートあたりは特に苦労しました。レイアウトのズレを修正するだけで丸一日使ったこともあります。

—

## 大変だったこと③ Firebase・認証まわり

Googleログインの実装は想像以上に設定が多かったです。

Firebaseコンソールでの設定、`google-services.json`の扱い、Webとモバイルで認証方法が違うこと……エラーメッセージが意味不明で何時間も詰まることもありました。

特にWebへのデプロイ後に「白画面になる」問題には悩まされました。ローカルでは動いているのに本番だけ動かない。原因は古いビルドキャッシュで、`flutter clean` してビルドし直すことで解決しましたが、原因に気づくまでに時間がかかりました。

—

## 大変だったこと④ デプロイ・公開

Firebase Hostingへのデプロイ自体はコマンド数行で済むのですが、そこに至るまでの環境構築が大変でした。

Flutterのバージョン管理、Firebase CLIのインストール、ビルドの順番……一つでもミスると動かなくなるので、手順書を自分でまとめながら進めました。

—

## 完成したアプリの機能

紆余曲折ありながら、最終的にこんな機能が揃いました。

– **ダッシュボード**：今日・今週・今月の作業状況、連続記録日数（ストリーク）、今月のワンポイントアドバイス
– **マイ畑**：野菜の登録と成長ステータス管理（種まき→発芽→成長中→収穫中→終了）、カレンダー表示、年間計画ガントチャート
– **栽培日誌**：水やり・収穫・施肥などの作業記録
– **野菜図鑑**：種まき・定植・収穫の適期情報（地域に合わせた補正あり）
– **データエクスポート/インポート**：JSONでバックアップ可能
– **ゲストログイン**：Googleアカウントなしでもそのまま使える

—

## 作ってみて感じたこと

「完成させる」のが一番大事だと実感しました。

途中で何度も「これ本当に動くのか？」「需要あるのか？」と不安になりましたが、とにかく動くものをリリースするところまでやりきれてよかったです。

コードは決してきれいではないし、機能も不足している部分があります。でも、自分が作ったものがブラウザで動いて、他人が使える状態になっているのは素直に嬉しいです。

次は使ってくれた人のフィードバックをもとに、少しずつ改善していくつもりです。

—

## さいごに

アプリはこちらから無料で使えます。

👉 **はたけびより** https://garden-note-d9c5a.web.app

家庭菜園をやっている方、興味のある方はぜひ試してみてください。感想・要望はアプリ内の「ご意見・ご提案」フォームからお気軽にどうぞ。

—

*使い方マニュアルはこちら → [別記事リンク]*
*利用規約はこちら → [別記事リンク]*