はじめに

約1ヶ月前、Claudeを使って家計簿WebアプリをHTML/CSS/JavaScriptで作りVercelに公開しました。

公開後も機能追加・改善を続け、現在はこんな機能を持つアプリになっています。

この記事では1ヶ月運用して気づいたことをまとめます。

技術面でわかったこと

データをlocalStorageに保存しているため、複数端末での同期ができません。スマホで入力したデータがPCで見られない、という制限があります。

将来的にはSupabaseなどのサーバーサイドに移行する予定です。

最初は各HTMLファイルに<style>タグでCSSを書いていました。ページが増えるにつれて同じCSSが6ファイルに重複する状態になりました。

style.cssに共通化してからは、デザイン変更が1ファイルの修正で完結するようになりました。

<!-- 変更前：各ファイルに<style>タグ -->
<style>
  /* 300行のCSS */
</style>

<!-- 変更後：1行で済む -->
<link rel="stylesheet" href="style.css">

実際に自分で使ってみると「不便だな」と感じる点がたくさん出てきます。

「使ってみて不便に感じたこと」を一つずつ直すのが、アプリ改善の一番の近道でした。

せっかく作ったのに誰も見てくれない…それは当たり前！
まだまだ知名度も低く、クリック数も少ないですがこれからも更新していこうと思います。

公開と同時に申請しましたが、3週間経過した現在も「準備中」のままです。アクセス数が増えれば承認される可能性が上がると判断し、引き続き記事投稿を続けています。

Claudeにコードを生成してもらうだけでなく、「なぜこの実装にしたのか」を聞いたり、コードの意味を問題形式で確認したりすることで、少しずつ自分の理解が深まってきました。

最初から完璧なものを作ろうとしないことが大事でした。シンプルな状態で公開して、使いながら改善を繰り返すほうがモチベーションも続きます。

気づき	内容
技術面	localStorageの限界・CSS共通化の重要性
改善面	自分で使うことで不便な点が見つかる
SEO面	記事投稿が被リンクになって効果が出た
収益化	AdSenseはアクセスが増えてから通りやすくなる
開発面	小さく作って少しずつ改善が正解

2本目のアプリ（スイスドロー対戦管理アプリ）の開発も始めているので、またレポートします！

★開発したアプリ
【シンプル家計簿】https://kakeibo-khaki.vercel.app/