HTMLとスクリプト（GAS）を使ったウェブアプリ開発に切り替えたことで、私たちのアプリ作成スピードは劇的に上がりました。
案件管理、請求、作業車点検、緊急安否報告、そして念願だったドラッグ＆ドロップの人員配置アプリまでが次々と形になり、外注せずとも自社で内製できる楽しさを噛み締めていました。
しかし、アプリの数が増え、実際に現場でデータが回り始めると、私の頭の中に「新たな疑問や不安」が次々と浮かび上がってきたのです。
スプレッドシートの限界と恐怖
まず一つ目は、データの保管庫（データベース）についてです。
当時は、日報や明日の予定などのデータをすべて「Google スプレッドシート」に記録していました。作り始めてデータが少ないうちはサクサク動いていいのですが、「これ、データがどんどん溜まっていったら、いつか動きがめちゃくちゃ遅くなるんじゃないか？」という懸念が拭えませんでした。
さらに、もしデータが溜まりすぎてスプレッドシートが耐えられなくなった時、その膨大なデータを別のシステムへ引っ越すのは相当大変な作業になります。「今はたまたま動いているけれど、ある日突然、容量オーバーで動かなくなる可能性もあるのではないか……」という恐怖が常にありました。
アプリ連携の壁と「1,000行の壁」
二つ目は、アプリ同士の横の連携です。
HTMLとスクリプトで一個一個独立してアプリを作っていたため、それぞれのアプリが裏側で綺麗に連携してくれないという問題にぶつかりました。日報のデータ、配置のデータ、請求のデータ。これらが別々の箱に入ったまま、うまく繋がらないのです。
さらに、機能を追加していくうちにコードの量が膨大になり、ついに「1,000行の壁」にぶつかりました。コードが長くなりすぎると、頼みの綱であるAI（Gemini）も全体像を把握しきれなくなり、エラーの原因を見つけるのが一気に難しくなったのです。
モダンプログラミングへの大転換
このままでは限界が来る。そう感じた私は、システム全体を根本から見直す決断をしました。
そこで辿り着いたのが、「React（リアクト）」と「Supabase（スーパベース）」の導入です。
UI（画面）はReactを使ってスマートに整理し、データの保管庫にはスプレッドシートの代わりに、本格的なリレーショナルデータベースである「Supabase」を採用しました。
これによって、データが複雑に絡み合っても、どれだけデータが増えても、ストレスなく一瞬でサクサク動く。会社の基盤となるシステムの骨組みが、ようやく完成しました。
写真データの壁と「ハイブリッド設計」
しかし、ここでまた一つ、リアルな問題にぶつかりました。「日報の写真」です。
我が社の日報アプリでは、現場の写真（撮影可能な箇所のみ）も記録できるようにしています。最初は、この画像データもすべてSupabaseの中に組み込んで保存していました。しかし、画像はデータ量が重いため、すべてをそこに溜めていくと、クラウドの利用料金がどんどん嵩んでいってしまうことに気づいたのです。
「システムを維持するコストは、できるだけ安価に、スマートに抑えたい」
そこで頭を捻って編み出したのが、独自のハイブリッド型システムでした。
現場から上がってきた写真は、一度システム側でギュッと圧縮をかけ、容量に余裕がある「Googleドライブ」のフォルダへと格納する。そして、その写真が「どこの現場の、いつの日報のものか」というデータ（紐付け）だけを、先ほど連携させた「Supabase」側で賢く管理する。
この役割分担を思いついたことで、料金を最小限に抑えながら、大量の現場写真をサクサク管理できる、我が社に最適な仕組みが完成しました。
最高にワクワクする「最強のインフラ」
最初は、2週間ノーコードを触っていただけの電気屋の社長でした。
それが、土日も忘れてワクワクしながらバグと格闘し、気づけばAIを駆使して、アプリを完璧に横連携させ、コストパフォーマンスも考慮したシステム設計をしていました。
自社に100%フィットした、我が社を支える最強のインフラ。
それが、本当に自分たちの手で形になったのです。
しかし、これで終わりではありません。
次なる挑戦。どうぞご期待ください！
---
▶︎ ホームへ戻る
