- 投稿日:2026/04/07
- 更新日:2026/04/08
1. はじめに
こんにちは❗ Naoです。フリーランスのFPとITコンサルをやっています✨️
突然ですが、旅行やおでかけの準備でこんな経験はありませんか?
🌀 忘れ物が無いか不安
🌀 荷造りに時間がかかる
🌀 「全部入れた気がする…」で結局忘れ物をしてしまった
そんな方のために、今回はクロコちゃんを使って自分専用の持ち物チェックアプリを無料で作る方法をご紹介します✨️
✅️ 持ち物がリスト化されるので、「忘れた!」が無くなる
✅️ スマホで荷造りしながらチェックできるので「どこまで入れたっけ?」がなくなる
✅️ 旅行・おでかけ・スポーツなど、シーン別にリストを作成できる
今回使うのは、もちろんクロコちゃん(Claude Code・Coworkどちらでも大丈夫です)です。指示するだけでアプリが完成します。
指示すら面倒な場合は、この記事を読み込ませるとそのとおりにやってくれます👍️
持ち物アプリ以外にも活用できる「Webアプリの作り方」の記事になっていますから、ぜひお試し頂ければと思います😊
2. 事前準備|持ち物リストをテキストで用意する
まず、チェックしたい持ち物のリストをテキストで用意します。
メモ帳でも、手書きのメモをアップロードしても大丈夫です。思い浮かぶものを全部書き出してみましょう。
クロコちゃんと相談しながら作っても良いですね👍️
私の場合は旅行用にこんなリストを用意しました。
##旅行(冬)
- 上着
- ズボン
- 靴下
- 下着
- タイツ
- パジャマ
- ハンカチ
- 手袋
- 財布
- スマホ
- スマホ充電器
- Apple Watch
- Apple Watch充電器
- AirPods
- PC
- PC充電器
- 歯ブラシ
- 歯磨き粉
- 日焼け止め
- 薬
…(以下続く)
💡ワンポイント💡
リストは完璧でなくてOKです!
あとからクロコちゃんに「○○を追加して」と指示するだけで簡単に修正できます。
まずは思いつくものを全部書き出してみましょう。
3. クロコちゃんにデータを整理してもらう
持ち物リストが用意できたら、クロコちゃんに渡して整理してもらいます。
クロコちゃんはバラバラなリストを見て、似ているもの同士を自動でグループ分けしてくれます。
✅️① クロコちゃんにこのように指示します
🧑🏻「持ち物チェック用のデータベースを作って。似ているものは構造化してね。(リストをそのまま貼り付ける)」
するとクロコちゃんが自動でカテゴリ分けしてくれます。
私の場合、38個のアイテムが6つのカテゴリに整理されました✨️
カテゴリアイテム例
👕 上着・ズボン・靴下・手袋 など
💻 スマホ・PC・充電器類 など
👛 身分証・財布・名札 など
🪥 歯ブラシ・歯磨き粉・薬 など
✨ 化粧水・日焼け止め・ワックス など
🍱 お弁当・ナッツ・水筒 など
💡ワンポイント💡
シーン別に複数のリストを作ることもできます。
私は「旅行(冬)」「ジム」「オフ会」の3シーンを作成しました😊
クロコちゃんに渡すリストを複数用意すればOKです。
4. クロコちゃんにアプリを作ってもらう
データが整理できたら、次はアプリ本体を作ってもらいます。
✅️① クロコちゃんにこのように指示します
🧑🏻「このリストを使って、スマホで見られるチェックリストアプリを作って。カテゴリごとに表示して、チェックした状態を記憶できるようにして。」
するとクロコちゃんがアプリを作ってくれます!
私の場合は1回でこんなアプリができあがりました。

✅️ できあがったアプリにはこんな機能が入っています
⭕️ 上部に進捗バーが表示される(例:0 / 38 完了)
⭕️ タブでシーンを切り替えられる(旅行・ジムなど)
⭕️ カテゴリごとに折りたたんで表示される
⭕️ チェックした状態がスマホに保存される
⭕️ 「リセット」「全てチェック」ボタンがある
💡ワンポイント💡
うまくいかないときはクロコちゃんに「こうなっています」と見たままを伝えるだけでOKです。
スクリーンショットを一緒に送るとさらに伝わりやすいです。
めげずにクロコちゃんに原因を聞きながら解決しましょう!
5. Netlifyで無料公開する
アプリが完成したら、スマホからアクセスできるようにURLを発行します。Netlifyという無料サービスを使います。
慣れないと戸惑いますが、難しくありません!もう一踏ん張りです👍️
以下の手順をクロコちゃんに任せることもできますが、自分でやる方法も書いておきますね🤔
5.1. Netlifyのアカウントを作成する
✅️① ブラウザで「Netlify」を検索し、公式サイトを開く
✅️② 「Sign up」ボタンをクリック
✅️③ 「Continue with Google」を選択
✅️④ Googleアカウントを選択
✅️⑤「次へ」をクリック
✅️⑥ 適当にアンケートに答えて、画面下部の「Continue to Deploy」をクリック
※名前と会社名を入れないと次に進めません。適当に入れておきましょう。
これでNetlifyアカウントの作成は完了です。
5.2. アプリをアップロードする
✅️① 「Upload your project files」内の「Choose a folder」をクリック
✅️② アプリが入ったフォルダを選んで「アップロード」をクリック
✅️③Chrome上部に出る「アップロード」をクリック
💡ワンポイント💡
フォルダの場所が分からなくなったときは、クロコちゃんに「アプリが入ってるフォルダを教えて」といえば大丈夫です😊
✅️④ 緑色の字で "〇〇〇〇.netlify.app" というURLが発行されます。これが持ち物アプリのURLです!!
やりました👍️

6. スマホのホーム画面に追加する
発行されたURLをスマホで開けば、すぐに使えます。
さらに、ホーム画面に追加するとアプリのように使えて便利です。
※Safariを使っている場合で説明します。
✅️① 発行されたURLをメモ帳やGmailを使ってスマホに送ります
✅️② SafariでURLを開きます。持ち物アプリが開きます!
💡ワンポイント💡
アドレスバーには https:// は入力不要です。〇〇〇〇.netlify.app の部分だけを貼り付ければ自動で補完されます。
✅️③ 画面右下の…ボタンをタップ
✅️④「共有」をタップ
✅️⑤下にスクロールして「ホーム画面に追加」をタップ
✅️⑥「Webアプリとして開く」をオンにして「追加」
✅️⑦ホーム画面にアイコンが追加される!
これで、いつでも1タップで持ち物チェックリストにアクセスできますね👍️
7. アイテムを追加・変更したいときは
「このアイテムも追加したい」「このカテゴリ名を変えたい」というときは、クロコちゃんに指示するだけで対応できます。
✅️① クロコちゃんにこのように指示します
🧑🏻「ジムのリストに『プロテイン』を追加して」
👩🏻「旅行の衣類カテゴリに『帽子』を追加して」
✅️② クロコちゃんがファイルを修正してくれます
✅️③ Netlifyの管理画面を開き、更新したフォルダをもう一度ドラッグ&ドロップするだけで完了です
URLは変わらず、スマホのアイコンも同じまま自動で更新されます✨️
💡ワンポイント💡
「スマホからアイテムを自分で追加・削除したい」という場合は、少し設定が複雑になります。詳しくは別記事で解説予定です🙏
8. おわりに
いかがでしたでしょうか?
今回はクロコちゃんを使って、自分専用の持ち物チェックアプリを無料で作る方法をご紹介しました。
✅️ 持ち物リストをテキストで渡すだけでアプリが完成
✅️ Netlifyで公開すればスマホでいつでも確認できる
✅️ 追加・変更もクロコちゃんへの一言で対応できる
この記事で、
⭕️ 旅行の準備が楽になった
⭕️ 忘れ物が減った
⭕️ Webアプリ開発のハードルが下がった
と感じていただければと思います😊
本記事が、皆様のAI活用の参考になれば嬉しいです!
他にも、以下の記事を投稿しています。宜しければご覧ください✨
参考記事
Claude Codeに複数のGoogleアカウントを連携する方法