- 投稿日：2026/04/15
Claudeコードでせっかく作ったアプリ✨
せっかくならスマホやタブレットでも使いたい！
と思ったのに、まさかのPC以外では使えない😭
…みたいなことありませんか？🥹
まさにわたしがそう😇
AirDrop（Apple製品の連携機能）で、iPadに共有しようとしたら、
「Macを起動しておかないと、アプリは使えません」
と言われてびっくり〜😇
結局、Macが必要なら意味ないじゃん！🤣
そこでClaudeに相談してみたところ、
「Netlifyという無料のホスティングサービスに置けばいいよ」
と教えてもらいました。
💻 サイトの種類
Claudeコードで作ったアプリの多くは、【静的サイト】です。
静的サイトとは、HTMLファイルだけで動くウェブページのこと。
サーバーが不要で、ブラウザさえあれば表示できます。
軽くてシンプルなのが特徴で、ホスティングサービスを使えば無料で公開できるんです😳
🌏 公開方法の比較
静的サイトを公開する方法はいくつかあります。
それぞれのメリット・デメリットをまとめました。
■ GitHub Pages
学長が最近ライブで言っていた、「ギットハブ」です🦁
メリット：
無料、Gitでバージョン管理できる
デメリット：
GitHubアカウントとコマンド操作が必要
初心者にはちょっとハードルが高め
■ Vercel
メリット：
高機能、自動デプロイが便利
デメリット：
GitHubとの連携が必要で設定がやや複雑
■ Netlify Drop ← 今回おすすめはこれ✨
メリット：
ドラッグ＆ドロップで終わる！
無料、アカウント登録もGoogleでOK！
デメリット：
公開URLがランダムな文字列になる
（カスタムドメインは有料）
初めての方には断然 Netlify Drop がおすすめです😊
💻 Netlifyでの公開方法
Netlifyの中でも、「Netlify Drop」という機能を使うと、ファイルをドラッグ＆ドロップするだけでインターネット上に公開できます✨
難しい設定やコマンド操作は一切不要です！
手順はとってもカンタン🙆♀️
①サイトを開く
https://app.netlify.com/drop を開く
② Googleアカウントでアカウント作成
③ HTMLのアプリファイルを、ドラッグ＆ドロップでアップロードする
四角の部分にファイルをドラッグ＆ドロップすると、アプリをアップロードできます。
アップロードが完了すると、URLが表示されます。
このURLをスマホやiPadのブラウザにコピペすればOK👌
🔄 アプリを継続的に更新したい人は、GitHub（ギットハブ）との連携もおすすめ！
「アプリをどんどん改良していきたい」
「色々試しながら修正していこう」
という人には、GitHubと連携しておくと、毎回ドラッグ＆ドロップし直す手間がなくなってとっても楽です。
⚠️ GitHubと連携しないと、Claudeコードでアプリを修正しても自動更新されません。
修正するたびに、Netlify Drop に手動で新しいファイルをアップロードする必要があります。
（↑Claudeコードが比較を出してくれました）
流れは以下の通り▼
◇◆━━━━━━━━━━━━━━━━━◆◇
① ClaudeコードとGitHubを連携する
② 作ったアプリをGitHubにアップロードする
③ NetlifyとGitHubを連携する
◇◆━━━━━━━━━━━━━━━━━◆◇
設定しておくと、アプリを更新するたびに自動でNetlifyにも反映されるようになります。
＝スマホなどで見ているものが更新されていきます！
興味がある方は、方法を以下に載せておきます🙏
① ClaudeコードとGitHubを連携する
左メニュー【カスタマイズ】→【コネクタ】から、「GitHub連携」を検索
→【連携させる】をクリック
GitHubのアカウントを持っていない方は、アカウント登録も行います。
使用するGoogleアカウントをクリック
【次へ】をクリック
【ユーザーネーム】を入力して、「Create abbount」をクリック
で、アカウント登録は完了です！
②「アプリをGitHubに入れてほしい！」と、コードに送る
Claudeコードに直接お願いしちゃいましょう！
③NetlifyとGitHubを連携する
Netlify Drop のこのページに戻って、左メニュー 「Project configuration」 をクリック
左メニューの 「Continuous deployment」 をクリック
「Link repository」をクリック→「Link to an exisiting repository」をクリック
「GitHub」をクリック
この画面が出たらOK✨
お疲れ様でした😆
📱スマホのホーム画面に置く方法
これでやっと、PC以外でも使えます👏
ここまで来たら、アプリみたいにホーム画面にも置きたいですよね！
iPhoneの場合で説明します。
①Safariでページを開いて、右下の「…」をタップ
②「共有」をタップ
③「もっと見る」をタップ
④「ホーム画面に追加」をタップ
ホーム画面に任意のアイコンが表示されて、まるでリアルアプリみたい✨
🐶 まとめ
Claudeコードで作ったアプリを、Netlify Dropを使えば、スマホやiPadからも使えるようになります😊
ドラッグ＆ドロップだけの操作なので、初心者でも安心👌
GitHubの連携は一旦しなくても大丈夫です🙆♀️
「アプリ作ったけどPCでしか使えないのか〜…」と思っていた方、まずは Netlify Drop から試してみてくださいね🙌
必要になったときにすぐ見返せるように、ブックマーク🔖をおすすめします😆
（わたしも自分の記事を見ながら、設定します🤣笑）
