無料で登録
bolt.newからHubSpotへ

Bolt.newから​HubSpotへ：​プロンプトから​HubLモジュールへ。

bolt.newでプロンプトからフルスタックアプリを作りましたか？transjtはbolt.newからHubSpotへの変換を自動で行います。ブラウザー内で作ったものがStackBlitzのWebContainerから出て、マーケターがページを組み立てられるネイティブなモジュールになります。

無料で始めるデモを予約

プレビュー後にお支払い

transjtのテーマで作ったホームページを表示したHubSpotのページエディターと、その横に並ぶモジュール

代理店、フリーランス、マーケティングチームに選ばれています

変換すべきとき

bolt.newを​HubSpotへ​変換すべき​とき

bolt.newのプロジェクトを作った場所に置いたままにせず、チームがHubSpotへ移す6つの状況。

  • デモで納得してもらえた。次は運用です。

    説得力のあるものを素早く作ることにかけて、bolt.newに並ぶものはありません。それを会社で実際に運用できるページにするには、マーケティングチームがすでに使っているCMSに載せる必要があります。transjtが行うのは、その変換です。

  • キャンペーンページを開発部門経由にはできない

    プロンプトで作ったアプリでは、ランディングページを作るたびにコードの変更が必要です。モジュールに変換すれば、チームはすでにデザインしたコンポーネントから、ドラッグ＆ドロップエディターで、デプロイなしに新しいキャンペーンページを作れます。

  • サイトをCRMと連携させたい

    外部でホストされたアプリでは、コンタクトを作成するフォームも、ライフサイクルステージに応じて変わるコンテンツも、実際のパイプラインに結びついたレポートも使えません。ページがネイティブなHubSpotコンテンツになれば、そのすべてが追加費用なしで使えます。

  • このためにHubLを学ぶ人はいない

    HubSpotのテンプレート言語はHubSpotの中にしか存在せず、サイトを1つ公開するためだけに学ぶ時間は誰にもありません。transjtがその層を書くので、専門家が必要だった作り直しが、エクスポートの1ステップになります。

  • もう必要のないバックエンドまでプロンプトで作ってしまった

    bolt.newは、APIルートやデータ処理を標準で用意します。HubSpotにはフォーム、コンタクト、コンテンツの保存がすでにあるので、変換すれば、インターフェースはそのままに、保守するつもりのなかったバックエンドのコードを捨てられます。

  • アトリビューションは初日から機能させたい

    どのページがどの取引を生んだかを知るには、ページがHubSpotのコンテンツである必要があります。bolt.newで作ったサイトがネイティブテーマになれば、セッションやフォーム送信は追加の計測なしでレポートされ、ほかのすべてのタッチポイントも同様です。

計算してみる

bolt.newで​いくつの​コンポーネントを​作りましたか？

transjtでサイトを公開

費用を節約
$8,100*
時間を節約
81時間*手作業で10.1作業日
すぐに結果が出る
1.5〜3時間*テーマ全体で
無料で始める

*ReactからHubSpotへの手作業での移行時間に基づく概算です。コンポーネントあたり約4.5時間、1時間あたり$100、1日8時間で計算しています。transjtは、リポジトリから約1.5〜3時間でテーマを構築します。

仕組み

bolt.newを​HubSpotへ、​4つの​ステップで​変換。

bolt.newのプロジェクトから、GitHubを経由してネイティブなHubSpotテーマへ。

  1. bolt.newでプロンプトからサイトを作る

    フロントエンドが固まるまで、ブラウザーで繰り返し調整します。きれいに変換するには、bolt.newに、サーバーサイドレンダリングなしのReactとVite（またはNext.jsの静的エクスポート）を使うよう指示してください。HubSpotはHubLを自社のサーバーでレンダリングするため、きれいに変換できるのはクライアントレンダリングのフロントエンドです。

  2. プロジェクトをGitHubにエクスポート

    bolt.newはエディターから直接リポジトリにプッシュします。このエクスポートでコードがWebContainerの外に出て、transjtが読み取って変換できるようになります。

  3. リポジトリをtransjtに接続

    transjtのプロジェクトでGitHubを認証し、リポジトリを選びます。transjtはコンポーネントツリーを読み取り、どの部分をHubLテンプレートにし、どの部分をマーケターが管理するモジュールフィールドにするかを判断します。

  4. HubSpotにエクスポート

    HubSpotを選び、プレビューを確認します。確定すると、transjtが、デザインマネージャーからアップロードできるネイティブテーマを作成します。アップロード後、モジュールはすぐに使える状態でページエディターに表示されます。

無料で始めるデモを予約
bolt.new以外にも

ほかの​コーディングツールも​接続できます。

すべてのAIビルダーを1ページにまとめています：AIからHubSpotへ。

お客様の声

お客様の声。

アーティストのアトリエで机に向かう男性お客様
“We’d seen plenty of tools promise magic for page and theme creation, but they always under-delivered. Transjt proved to be the exception.”
KevinThinkFuel
  • 95–99%完成コードの割合（構成の整ったファイルの場合）
  • ∞取り込めるAIビルダー（Figmaにも対応）
  • 2ネイティブ対応のCMS：HubSpotとWordPress
  • 1クリックでエクスポート。数分後にはテーマがアカウントに届きます
得られるもの

bolt.newで​作ったサイトを、​HubSpotへ​移しませんか？

bolt.newから作ったHubSpotテーマに実際に含まれるもの

HubSpotのCMSは、マーケターがコードを開かずにページを並べ替え、CRMデータに合わせてパーソナライズできるように作られています。だからこそ、プロンプトで作ったReactアプリは、そのままでは入りません。まずコンポーネントを、編集可能なフィールドが定義されたHubLモジュールにする必要があります。transjtはその変換を自動化するので、ブラウザーのタブで作ったプロジェクトが、レベニューチームがすでに使っているシステムの中で、ネイティブテーマとして動きます。

無料で始めるデモを予約
対象

企業、​代理店、​フリーランスの​ために。

明るいオフィスのロビーでタブレットを持って微笑むビジネスウーマン企業社内チームでWebサイトのリニューアルを進められます。長い木のテーブルを囲んで打ち合わせをするチーム代理店チームを増やさずに、クライアントのサイトを完璧に仕上げます。共有スタジオでノートパソコンに向かう、眼鏡に赤いニット帽のデザイナーフリーランスtransjtがプロジェクトを作っている間、チャイラテでもどうぞ。
FAQ

Bolt.newから​HubSpotへの​よくある質問。

bolt.newのプロジェクトをHubSpotテーマに変換するときに知っておきたいこと。

デモを予約

  • bolt.newはブラウザー内でプロジェクトを構築・プレビューし、GitHubにエクスポートします。transjtはそのリポジトリを読み取り、フロントエンドをネイティブなHubLモジュールに変換します。これで、サンドボックスのプレビューだったプロジェクトが、マーケティングチームが編集できるページになります。

  • いいえ。変換後のテーマは、HubSpotがホストする通常のHubSpotコードです。bolt.newは次のバージョンのデザインには引き続き役立ちますが、公開中のサイトでStackBlitzのインフラに依存する部分はありません。

  • 引き継がれません。また、一般的には引き継ぐべきでもありません。HubSpotはフォーム、コンタクトレコード、コンテンツの保存を標準で備えているので、ページがHubSpotのコンテンツになれば、bolt.newが用意した部分はたいてい不要になります。

  • はい。だからこそ、プロジェクトを埋め込むのではなく変換します。transjtは編集可能なフィールドを持つモジュールを出力するので、文章、画像、セクションの順序はすべて、bolt.newのソースに触れずにドラッグ＆ドロップエディターで変更できます。

  • カスタムテーマのアップロードには、カスタムコードファイルを使えるContent Hubのエディションが必要で、Starterエディションでは制限があります。テーマ自体にはそれ以上の要件がないので、変換前にプランを確認しておくとよいでしょう。

  • プロジェクトをGitHubにエクスポートすれば、ページ数にもよりますが、transjtは通常数時間で、公開できるHubSpotテーマを用意します。

今日​デザインして、​明日​公開。

transjtでは一秒一秒が大切です。だから私たちの使命はシンプル。あなたの時間を節約し、ワークフローの手間をなくすことです。

無料で始めるデモを予約