bolt.newの成果物を「URLで渡したい」ときの悩み
bolt.newはブラウザ上で対話しながらアプリを組み立てられるツールで、プレビュー画面ですぐ動きを確認できます。ところが、いざ上司やクライアントに見せようとすると、開発画面そのものを共有するのは現実的ではありません。相手にログインや操作を強いてしまいますし、編集中の状態が見えてしまうこともあります。
一般的な選択肢としては、コードをGitHubに上げてホスティングサービスへデプロイする方法があります。ただ、ビルド設定やドメインの準備など、確認だけのために覚えることが多く、非エンジニアには負担が大きいのが正直なところです。
この記事で前提にするのは、bolt.newから書き出せる成果物が基本的に静的なファイル（HTML・CSS・JS・画像）であるという点です。サーバー側の処理を伴わない確認用の共有であれば、もっと手軽な道があります。
まずbolt.newから成果物を書き出す
共有の前準備として、表示に必要なファイル一式を手元にそろえます。bolt.newではプロジェクトをローカルにダウンロードできるため、まずはそれを取得しましょう。
ダウンロードしたものはソースコード一式になっていることが多いので、ブラウザがそのまま表示できる形に整えるのがポイントです。HTMLファイルを開いてレイアウトや画像が崩れていないか、手元で一度確認しておくと安心です。
- bolt.newでプロジェクトをローカルにダウンロードする
- ビルドが必要なアプリはビルドして表示用の成果物を作る
- index.htmlを直接開き、表示崩れがないか確認する
- 共有に使う画像やCSSなど必要なファイルがそろっているか見る
AI生成HTMLを共有する前の安全チェック
bolt.newで作ったアプリをURLで共有では、AIツールの画面上で完成して見えても、共有用HTMLとして安全とは限りません。外部script、form送信先、APIキーらしき文字列、画像パス、ダミーデータではない個人情報を分けて確認します。
ツールの書き出し形式や共有機能は時期・プラン・作り方で変わります。この記事では特定機能の有無を断定せず、静的HTMLやZIPとして取り出せた成果物を安全に見せる前提で進めます。安全チェックが終わったら、HTMLまたはZIPをアップロードし、必要に応じて認証と期限を付けたURLとして共有します。
- 外部送信: form action、fetch、script src、iframeの向き先を確認する
- 秘密情報: APIキー、トークン、社内URL、顧客名が残っていないか検索する
- 表示再現: 画像・CSS・フォントが公開URLでも読み込めるか見る
- 共有設定: 相手、期限、認証方式、差し替え時の連絡方法を決める
認証付きURLとして公開する手順
ファイルが用意できたら、共有用のURLを発行します。ここでは「ギガサイト便」を例に、書き出した成果物をそのままアップロードして共有URLにする流れを紹介します。サーバー構築やデプロイ設定は不要で、ファイルを渡すだけで公開できるのが特徴です。
急ぎで一度だけ見せたいなら、トップページにファイルをドロップすれば登録なしでもその場で共有URLが発行できます。ただしこの匿名公開は検索除けの「noindex」が付き、7日間の公開期限が決まっているため、継続して使うなら無料アカウントを作ってサイト一覧から管理する方法がおすすめです。
- 表示用ファイル一式をZIPにまとめる
- トップページにZIPをドロップして共有URLを発行する
- 継続利用なら無料アカウントを作り、サイト一覧から管理する
- 誰に見せるかに合わせて認証方式を選ぶ
- 公開期限を設定し、必要に応じてスラッグ（URL末尾）を整える
- 発行されたURLを関係者に送る
「誰に見せるか」を認証方式で選ぶ
共有で意外と差が出るのが、閲覧できる人をどう絞るかという点です。社外には見せたくない試作や、特定の相手だけに確認してほしい成果物では、リンクを知っていれば誰でも見られる状態だと不安が残ります。
選べる認証方式は用途に応じて使い分けられます。気軽に共有したいときと、本人確認までしたいときで、ちょうどよい強さを選びましょう。
- URLのみ: リンクを知っていれば誰でも閲覧できる気軽な共有
- パスワード認証: 合言葉を知っている人だけに限定する
- メール認証: 指定したメール宛のワンタイムで本人確認する
- 会社ドメイン認証: 特定の社内ドメインを持つ人だけに見せる
渡したあとも安心して運用するコツ
共有はURLを送って終わりではありません。フィードバックを受けて成果物を直すたびにリンクを送り直すのは、相手にも手間をかけます。同じURLのままファイルを差し替えられれば、最新版を見てもらう手間が大きく減ります。
公開期限を設定しておくと、期限が切れたあとは自動的に閲覧できなくなるため、いつまでも残り続ける心配がありません。誰がいつ見たかを把握したいときはアクセスログを確認できます。
アップロード時にはセキュリティスキャンが走り、APIキーらしき文字列や外部スクリプトへの依存、静的公開には不要なファイルなどの兆候を検出して警告します。AIが生成したコードには思わぬ記述が混ざることもあるため、内容を理解したうえで公開するかどうかを判断できるのは心強いところです。なお、検索除けのnoindexはアクセス制御ではない点には注意しておきましょう。
用途に合わせて共有手段を選ぶ
bolt.newの成果物を本番運用に乗せたい場合と、確認のために一時的に見せたい場合では、適した道具が違います。サーバー処理やデータベース連携を伴う本格運用なら、ホスティングサービスへのデプロイが向いています。一方で、静的な画面の確認やレビュー依頼であれば、認証付きの共有URLのほうが準備も後片付けも軽くなります。
得意領域が違うだけなので、目的に合わせて選ぶのが結局いちばんの近道です。「とにかく早く、安全に見せたい」という確認フェーズでは、ファイルを渡すだけで認証も期限も整えられる共有URLが、bolt.newとの相性のよい選択肢になります。
開発プレビューURLとレビュー用URLを分ける理由
bolt.newの開発画面や一時プレビューは、作業者が直すたびに状態が変わります。関係者レビューでは、開発中の画面をそのまま送るより、確認してほしい時点のHTMLを固定したレビュー用URLとして渡すほうが話がずれにくくなります。
レビュー用URLを分けておくと、相手は「今見ている版」がどれかを意識せずに確認できます。修正後は同じURLの中身を差し替えれば、依頼文や過去のスレッドを再送しなくても更新版を見てもらえます。
- 開発中の実験版と、確認依頼に出す版を分ける
- レビュー用URLには期限と認証を付ける
- 修正後は同じURLを差し替え、変更点だけを相手に伝える
- 不要になった確認URLは閉じて、古い版が残らないようにする
よくある質問
bolt.newで作ったアプリはそのまま公開できますか
bolt.newから書き出した成果物が静的なHTML・CSS・JS・画像であれば、ファイルをアップロードするだけで共有URLとして公開できます。ただしサーバー側の処理を伴うアプリは静的公開では動かないため、確認用途であればまず表示用ファイル一式を用意してください。
bolt.newの共有URLを特定の人だけに見せられますか
はい。認証付きの共有URLを使えば、URLを知っている人だけ、パスワードを知っている人だけ、指定したメール宛の本人だけ、特定の会社ドメインを持つ人だけ、といった形で閲覧範囲を選べます。社外秘の試作などには認証を付けると安心です。
成果物を修正したらURLは送り直しが必要ですか
同じURLのままファイルを差し替えられる仕組みを使えば、リンクを送り直す必要はありません。フィードバックを反映して更新しても、相手は同じURLから常に最新版を確認できます。
公開したアプリは検索結果に出てしまいますか
一時公開のページにはnoindexが付くため、通常は検索結果に表示されません。ただしnoindexは検索除けであってアクセス制御ではないので、見せる相手を厳密に絞りたい場合はパスワードやメール認証などの認証方式を併用してください。
AIツールで作ったHTMLはそのまま共有しても安全ですか？
そのまま共有せず、外部送信先、フォーム、APIキー、社内URL、画像パスを確認してからURL化します。ツールの共有機能や書き出し仕様は変わるため、最新画面も確認してください。
bolt.newのプレビューURLをそのままレビューに使うのは避けたほうがよいですか？
小さな社内確認なら使える場合もありますが、社外レビューや期限付き確認では、書き出した成果物をレビュー用URLとして固定するほうが安全です。認証・期限・差し替えの運用を分けられるため、開発作業中の変更に相手が巻き込まれにくくなります。