ブログができました。 ストアを追加します。 このウォークスルーは、どこにも正確に拾う ヘッドレスブログチュートリアル 消えます。 2つの新しいWordPressプラグイン、ルートグループが分割され、WPレンダリングされたページは独自のルートレイアウトと単一のヘッダーを取得します。 Cart-Token — Next.js セッションを WooCommerce の Store API にブリッジします。 ブログを提供しているのと同じアプリは、すでにインストールしたWooCommerce拡張機能を介して実行されているカートとチェックアウトで、ストアフロントにサービスを提供しています。 コンパニオンレポ: github.com/AxisTaylor/nextpress-woographql-quickstart. それはです nextpress-quickstart この投稿で適用されるすべての記事でブログチュートリアルから — クローン作成、実行 npm install && npm run devと、フロー全体が対向している woographqldemo.wpengine.comお問い合わせ お問い合わせ あなたは既存のNext.jsアプリを持っています – あなたのもの、またはブログチュートリアルに従って構築したもの。 商取引:製品、カート、チェックアウト、支払い、在庫、税金、配送、すべて。 最後の6つのものをスクラッチから書くことは興味がありません。 WooCommerceは、~5,000,000のライブストアフロントを実行し、エクステンションマーケットプレイスは、任意のオープンソースの取引プラットフォームで最大です。 ブログ用に構築されたヘッドレスWordPressのセットアップも、ヘッドレスWooCommerceセットアップです。同じバックエンド、同じプロキシ、もう2つのプラグインとレイアウトのリファクタです。 注意: 何もない このチュートリアルでは、 ゲスト専用 ストアフロント。 ログインページ、アカウントダッシュボードなし、JWTリフレッシュループなし。 ザ・オブ・ザ・ Cart-Token WooCommerceハンドバックは、セッション識別子です。ゲストは、カートをブラウズしたり、チェックアウトしたり、注文を何も表示したりできますが、請求メールや注文キーが確認から確認することができます。 ほとんどの店主にとって、幸せな道全体をカバーします。 認証された顧客アカウントが必要な場合は、 wp-graphql-headlessログイン または wp-graphql-jwt-authentication の使い方 別々に —…

20分 5つのファイル。 ツイート create-next-app プロジェクトはWordPressから投稿をWPGraphQLにインストールし、エディタはすべての段落を所有しています。 next build 静的なページを出荷する revalidate 必要な数にセットします。 下記のポイントを通り抜ける woographqldemo.wpengine.com — エンドで自分のドメインを交換し、同じ6つのステップが適用されます。 箱にあるもの @axistaylor/nextpress 1つのnpmパッケージと、約6,000行のTypeScriptです。 次の.js 16アプリに3枚のワイヤを転送します。 バックエンドの要件: WordPress と WPグラフQL アクティブ。 すべてのホストは、WPエンジン、パンテオン、ブルーホスト、セルフマネージドVPS – 限り /graphql お問い合わせ ステップ1 – 次のアプリをブートストラップ 株式について create-next-app TypeScript テンプレートで、次に追加します。 @axistaylor/nextpress npmから: ステップ2 — next.config.ts withWCR ベース・ネクスト・コンフィグ、WordPressの起源、およびパブリック・フェース・フロントエンド・オリジンの3つの引数を取ります。 wrapper は、エディタがフロントエンドの相対パスに承認したすべての絶対的な WordPress URL を書き換えるので、次のルートにレンダリングされた投稿コンテンツのランドバック中にリンクします。 ステップ3 — src/proxy.ts 次 16 名前を変更しました middleware.ts…