スマホで開く方法
この章でわかること: 顧客は多くの場面でスマホで見ます。作ったものをスマホで開く 3つの手段と、それぞれの向き・不向き。場面に応じて選べるようになります。
| 手段 | 速さ/手軽さ | 安定性 | 向いている場面 |
|---|---|---|---|
| デプロイ(Vercel) | ふつう(数分) | ◎ 安定・URLが残る | 商談・顧客に渡す・本番に近い確認 |
| 一時公開(ngrok等) | 速い | △ 一時的 | 作りかけを今すぐ自分のスマホで確認 |
| 同じWi-Fiで直接 | 最速 | △ 同一ネット限定 | 手元で素早く実機チェック |
① デプロイ(おすすめ・商談向け)
Section titled “① デプロイ(おすすめ・商談向け)”公開して共有するの通り Vercel に公開すれば、〇〇.vercel.app
のURLをスマホで開くだけ。URLが残り、誰のスマホでも安定して開けるので、顧客に
渡すならこれが基本です。限定共有したいときはBasic認証を。
② 一時公開(ngrok など)で今すぐ見る
Section titled “② 一時公開(ngrok など)で今すぐ見る”手元で動かしている開発中のもの(localhost)を、一時的にネットへ出す方法です。 ngrok のようなツールを使うと、その場で公開URLが発行され、スマホからアクセスできます。
- メリット: デプロイ前の作りかけを、すぐ自分のスマホで確認できる
- デメリット: URLは一時的(セッションを切ると消える)、無料枠に制限、 URLを知れば誰でも見られるので作りかけの共有範囲に注意
③ 同じWi-Fiで直接ひらく
Section titled “③ 同じWi-Fiで直接ひらく”パソコンとスマホが同じWi-Fiにあるなら、開発サーバーが表示する
「ネットワークURL」(例 http://192.168.0.5:3000)をスマホのブラウザに入れるだけで開けます。
- メリット: 設定不要で最速。サッと実機の見え方を確認できる
- デメリット: 同じネットワークにいる必要がある。会社やカフェのWi-Fiでは
遮断されて開けないことがある。
httpsではないため、カメラ等の一部機能は使えない
- 顧客に見せる/渡す → ① デプロイ(安定・URLが残る)
- 自分が今すぐ確認したいだけ → ③ 同じWi-Fi、ダメなら ② 一時公開
「PCで見た完璧」が、スマホで崩れることはよくあります。早い段階から実機で見る 習慣をつけると、商談で慌てません。スマホでの見え方チェックは 顧客に見せる前のチェックにも入れておきましょう。