React Email Editor

これが正確には何なのか

React Email Editor（github.com/unlayer/react-email-editor）は、Unlayerのビジュアルメールビルダー用の公式Reactラッパーです。エディタのコンポーネントを一つ描画し、それへの参照を保持して、READMEに書かれた3つのメソッドを使います。loadDesign は保存済みテンプレートを画面に戻し、saveDesign はデザインをJSONで返し、exportHtml はレスポンシブHTMLとそのJSONを返します。JSONは利用者があとで編集できるように、HTMLは配信基盤が送るものとして、どちらも自分のデータベースに保存します。リポジトリは2017年から続いており、余裕をもって保守されています。v2.1.2は2026年8月11日に公開され、その中身は雑務ではなく実際の修正でした。サーバーサイドレンダリング時のハイドレーション不具合と、アンマウント時にエディタが破棄されないまま残る長年のリークです。

バージョン2は近代化リリースで、その移行メモは変更点について珍しく率直です。React 16.8とNode 18が下限になり、パッケージ内部への深いインポートはexportsマップで塞がれ、公開コードはES2019になりました。ES2019を解釈できない古いツールチェーンを抱えているなら1.x系に留まるべきだと明記されています。バンドルには "use client" ディレクティブが含まれるため、Next.jsのApp Routerでは例の動的インポートの回避策を使わず、クライアントコンポーネントから直接インポートできます。出力はGmail、Apple Mail、Outlook、Yahoo!メールで検証されています。手書きのメールHTMLが最も崩れやすい4つのクライアントです。

オープンなコンポーネント、ホスト型のエディタ——ライセンス行は二度読む

リポジトリはMITで、READMEもはっきりそう書いています。ただしMITが覆うのはReactコンポーネントであって、それが読み込むエディタではありません。開発者向けツールではよくある形ですが、意識的に扱う価値があります。バッジの上の「オープンソース」と、リスク台帳の上の「オープンソース」は、別々の問いに答えているからです。どこに何があるかを整理します。

メールビルダーは創業者のグロース構成のどこに置くか

何かを導入する前に決めるべき問いは、そのメールは誰のものかということです。利用者自身 がプロダクトの中でメールを書いて送るなら——CRM、ニュースレターツール、自社ブランドで確認メールを出したい予約システムなど——組み込みエディタはほぼ避けられず、自作は数か月の作業で、しかもその製品が買われた理由とは何の関係もありません。自分たち のトランザクションメールとライフサイクルメールだけなら、ビジュアルエディタは要りません。React Email のようにコードで書くテンプレートのほうが手間が少なく、バージョン管理にもはるかに向いています。

• 解くのは制作であって、配信ではない ビルダーはメールを速く作れるようにします。誰に届くのか、そのアドレスが到達可能か、そもそも送る価値があったかについては、何の意見も持ちません。
• 自分の机から行列を下ろせる 書き手が利用者である場合の本当の利点は、テンプレートの依頼が開発チケットとして届かなくなることです。これはグロースの論拠ではなくサポート負荷の論拠であり、その条件で買うのは正しい判断です。
• 開封率は決められない レイアウトはメール成果のなかでほぼ解決済みの唯一の部分です。件名、送る時刻、リストの質、送信レピュテーションは解決していませんし、そのどれもエディタには現れません。
• 実行時の依存が一つ増える 組み込み型のホストされたエディタは、プロダクトのクリティカルパスに入る第三者です。承知のうえで受け入れる価値はありますが、支払いをやめた日に保存済みデザインを開けるのかは確認しておくべきです。

AgentCeres——AIグロースオフィサー、agentceres.com——で自分たちのメールを運用してきた経験も同じ方向を指しています。そして効いた二つは、レイアウトでもツールでもありませんでした。一つ目は引き算です。登録して数分プロダクトに留まった人が、自動の初回リサーチがウェルカムメールと試用開始の案内に重なった結果、5分ほどのあいだにほとんど同じ内容のメールを3通受け取り得る状態になっていました。私たちはより良いメールを設計するのではなく、一通を削除しました。制約は制作ではなく、抑制の側にありました。二つ目は言語です。自動送信するメッセージはすべて、機械翻訳ではなく対象市場ごとに手書きした版を持っています。機械翻訳のままだと、まさに機械翻訳そのものに読めたからです。そしてそれは、どれほど優れたドラッグ＆ドロップエディタでも助けにならない種類の仕事でした。誰の手が触れるのかでビルダーを選び、浮いた時間は受け取る価値のあるライフサイクルメールに使ってください。