React／JavaScript の従来 API から、Preact ＋ Polaris web components ＋ グローバル shopify オブジェクトへ。60 以上のコンポーネント別ページと、checkout → cart メタフィールド移行手順までまとめて公開。
shopify オブジェクトへ書き換えるための、公式移行ガイドが新たに公開された。
React／JS の extension API から、Preact ／ Polaris web components ／ グローバル shopify オブジェクトへ書き換えるための手順。
Button／Checkbox／TextField／Banner／View 等、コンポーネント単位での移行手順を個別ページ化。
checkout メタフィールド → cart メタフィールドへの移行手順も同時公開。
shopify オブジェクトで動く新しい extension モデルの土台になる。| ガイド | 内容 | 対象作業 |
|---|---|---|
| 全体移行ガイド | React／JavaScript の extension API から、Preact ＋ Polaris web components ＋ グローバル shopify オブジェクトへの移行手順 |
全体方針 アーキテクチャ刷新 |
| コンポーネント別ページ（60+） | Button／Checkbox／TextField／Banner／View など、コンポーネント単位の旧→新マッピング | 部品単位 個別書き換え |
| メタフィールド移行 | checkout メタフィールドから cart メタフィールドへの移行手順 | データ層 スキーマ移行 |
| Checkout UI extensions 移行ガイド | Checkout UI extension に特化した入口ページ | 入口 ここから着手推奨 |
| Customer Account UI extensions 移行ガイド | Customer Account UI extension に特化した入口ページ | 入口 ここから着手推奨 |
チェックアウト画面にカスタム UI を差し込むための extension。今回の移行ガイドの主対象。
顧客アカウントページにカスタム UI を差し込むための extension。Checkout と同じく対象。
Checkout または Customer Account の移行ガイドからスタート。
React／JS から Preact ＋ グローバル shopify へ書き換え。
Button／TextField／Banner 等を、Polaris WC の個別ページに沿って置換。
checkout メタフィールドを cart メタフィールドへ置換。
Polaris web components が default になるのは 2025-10。それ以前を使う extension は本ガイドの対象になる、と明示されている。
UI フレームワークが Preact ＋ Polaris web components に統一される。React 固有の hooks エコシステムや HOC は素直には持ち込めない。
shopify オブジェクトextension API へのアクセスがグローバル shopify 経由に集約される。従来 React Hooks 経由で取っていた値の取り口がここに変わる。
Button／Checkbox／TextField／Banner／View などコンポーネント単位で個別ページが用意されているため、差分は 1 つずつ突き合わせて潰す形式が現実的。
UI 層の刷新と並行して、データの置き場所も checkout メタフィールド → cart メタフィールドへ移る。チェックアウト中だけ持っていたカスタムデータの保存場所が変わるため、リード／ライトの参照箇所をすべて洗い出す必要がある。
shopify への書き換えを段階的に実施。shopify 構成に統一。