無料で登録
AIからHubSpotへ

AIから​HubSpotへ：​お使いの​AIビルダーから、​1回の​変換で。

Lovableでプロンプトから作った、Figma Makeで生成した、Claude Codeで書いた。フロントエンドがどう作られたものでも、transjtは、マーケティングチームがドラッグ＆ドロップエディターで並べ替えられるネイティブなHubLモジュールに変換します。下から、使ったツールを選んでください。

無料で始めるデモを予約

プレビュー後にお支払い

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

AIビルダーAIビルダーをすべて比較

transjtが​HubSpotへ​変換できる、​すべての​AIビルダー。

どのツールで作っても、変換エンジンは1つです。お使いのツールを選ぶと、セットアップの手順、技術スタックの要件、デザインマネージャーに届く内容を確認できます。

  • Claude CodeからHubSpotへ

    ターミナルで書かれ、すでにgitに入っているので、エクスポートは不要です。transjtは、クライアントに渡す前に読んで確認できるHubLテンプレートとモジュール定義を返します。

    詳しく見る

  • ChatGPT / CodexからHubSpotへ

    リポジトリで作業するOpenAIのコーディングエージェント、またはChatGPTと一緒に組み上げたコード。ReactとViteの構成のままGitHubにプッシュすれば、transjtが、クライアントに渡す前に確認できるHubLテンプレートとモジュール定義を返します。

    詳しく見る

  • bolt.newからHubSpotへ

    StackBlitzのWebContainers上で、ブラウザからプロンプトで作成。変換すれば、見栄えのするデモが、マーケティングチームが実際に運用し、レポートを取れるページになります。

    詳しく見る

  • ReplitからHubSpotへ

    クラウドのワークスペースで、ほかのシステムとは切り離して作成。変換すれば、チームが普段使っているCRM、メール、レポートと同じ場所にサイトが並びます。

    詳しく見る

  • v0からHubSpotへ

    プロンプトからUIを作るVercelのツールで、Tailwindとshadcn/uiを多用します。最初に知っておきたいのは、v0の標準がNext.jsのサーバーコンポーネントであるのに対し、HubSpotではHubLがサーバーサイドでレンダリングされる点です。

    詳しく見る

  • LovableからHubSpotへ

    Lovableはもともと、ReactとViteの構成で出力し、自分でGitHubに同期するので、最も始めやすいツールです。変換の前に設定し直すものは何もありません。

    詳しく見る

  • Builder.ioからHubSpotへ

    ビジュアルエディターで作ったページと、Visual Copilotの出力に対応。変換するとSDKが外れ、HubSpotにネイティブなモジュールが入ります。CRMのパーソナライズとアトリビューションが機能するのも、そのためです。

    詳しく見る

  • Figma MakeからHubSpotへ

    静的なフレームではなく、デザインファイルから作られた本物のReactコンポーネント。だから、マーケターが使うモジュールには、近似ではなく、実際のタイプスケールと余白がそのまま引き継がれます。

    詳しく見る

  • RocketからHubSpotへ

    rocket.newで、完全なアプリケーションとして生成。変換ではフロントエンドを残し、フォーム、コンタクト、コンテンツの保存は、もともとそれらを備えているHubSpotに任せます。

    詳しく見る

  • base44からHubSpotへ

    base44で、独自のバックエンドを持つフルスタックアプリとして、プロンプトから作成。変換するとフロントエンドがHubSpotに入り、訪問者が見るページはネイティブなHubLモジュールになります。アプリ側は独自のデータ層をそのまま保ちます。

    詳しく見る

  • ほかのツールで作りましたか？

    GitHubリポジトリにあるReactとViteの構成なら、transjtが同じように、ネイティブなHubLモジュールに変換します。

  • AIで作ったサイトで試してみましょう。

    無料で始められます。クレジットカードは不要です。

    無料で始めるデモを予約
お客様の声

お客様の声。

アーティストのアトリエで机に向かう男性お客様
“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クリックでエクスポート。数分後にはテーマがアカウントに届きます
仕組み

リポジトリから、​HubSpotテーマへ。

GitHubリポジトリを持ち込んで、プロジェクト全体を、すぐにアップロードできるHubSpotテーマに変換します。

  1. リポジトリを同期

    GitHubを元データにすれば、手作業でHubLを組む工程を挟まずに、動作するHubSpotテーマができあがります。

  2. transjtがテーマを作成

    transjtはリポジトリを読み込み、クリーンでセマンティックなマークアップを生成してから、Content Hubが必要とするHubLテンプレートとモジュールのフィールドを書き出します。

  3. HubSpotへデプロイ

    完成したテーマをHubSpotのデザインマネージャーへ直接プッシュすれば、すぐにページエディターで使えます。どの工程でも、手でコードを書く必要はありません。

無料で始めるデモを予約
変換する理由

そもそも、​AIが生成した​コードを​変換する​必要が​あるのはなぜか。

このページで紹介しているツールは、どれもReactを出力します。一方、HubSpotがレンダリングするのはHubLです。AIで作ったサイトをそのままアップロードできないのは、この1つの食い違いのためです。誰かが、コンポーネント、スタイル、レイアウトを、HubSpotのテーマ層が理解できるHubLのテンプレートとモジュールとして書き直す必要があり、通常は開発者が2週間かけて行う作業です。

transjtはこの変換を自動化します。できあがるのは、マーケティングチームが開発者なしで編集できる、ドラッグ＆ドロップ対応のモジュールを備えたネイティブなHubSpotテーマです。手作業で進める場合は、AIで作ったサイトをHubSpotモジュールに変換する方法をお読みください。Claudeで作った場合は、ClaudeからHubSpotへをご覧ください。

Figmaでデザインした場合は、FigmaからHubSpotへをご覧ください。

対象

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

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

AIから​HubSpotへの​変換に​ついての​質問。

要点だけをまとめた回答です。それ以外のことは、デモを予約してお尋ねください。

デモを予約GitHubからHubSpotへのよくある質問をすべて見る

  • ReactとViteの構成です。v0、bolt.new、Claude Code、Replitでは、Next.jsの静的エクスポートも使えます。静的エクスポートなら、transjtが変換しないサーバー側のコードが入りません。

  • 今の場所にそのまま残ります。transjtが変換するのはフロントエンドです。訪問者が見るページはネイティブなHubLモジュールになり、独自のバックエンドを持つアプリは、そのデータ層を保ちます。

  • はい。transjtが読み取るのはGitHubリポジトリです。Lovableは単体でGitHubと同期でき、Claude Codeはもともとgitで作業します。

  • はい。更新したリポジトリを同期して、もう一度エクスポートしてください。追加料金はかかりません。トークンを使うのは、新しい取り込みの分だけです。

  • はい。すべてのセクションが、テキスト、画像、リンク、ボタンのフィールドを備えたHubSpotモジュールになり、チームはドラッグ＆ドロップエディターでそれらを配置できます。

  • はい。テーマのファイルはすべてお手元に残ります。開発者が読んで拡張できる標準的なHubSpotの構造で、独自仕様のものは一切ありません。

次に読む

さらに​詳しく。

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

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

無料で始めるデモを予約