@graphcommerce/docs 6.0.0-canary.49 → 6.0.0-canary.50

package/CHANGELOG.md

@@ -1,5 +1,7 @@
 # Change Log
 
+## 6.0.0-canary.50
+
 ## 6.0.0-canary.49
 
 ## 6.0.0-canary.48

package/framework/plugins-react.md

@@ -102,7 +102,7 @@ component with a `Prev` prop. The `Prev` prop is the original component.
 
 When opening the React debugger you can see the plugin wrapped.
 
-<img width="263" alt="Scherm­afbeelding 2023-03-15 om 12 16 59" src="https://user-images.githubusercontent.com/1244416/225293707-1ce1cd87-108b-4f28-b9ee-0c5d68d9a886.png">
+<img width="263" alt="Scherm­afbeelding 2023-03-15 om 12 16 59" src="https://user-images.githubusercontent.com/1244416/225293707-1ce1cd87-108b-4f28-b9ee-0c5d68d9a886.png" />
 
 ### How are plugins loaded?
 

package/getting-started/create.md

@@ -71,8 +71,7 @@ https://user-images.githubusercontent.com/1251986/158647122-dc57002f-a9c2-4661-a
 3. `cp -R graphcommerce/examples/magento-graphcms/. my-project && rm -rf graphcommerce`
    — copy example, delete repo
 4. `cd my-project` — change directory to project folder
-5. `cp -R .env.example .env` — create .env file
-6. `rm CHANGELOG.md` — remove changelog
+5. `rm CHANGELOG.md` — remove changelog
 
 ## Step 2: Magento and Hygraph API keys
 

package/package.json

@@ -2,10 +2,10 @@
   "name": "@graphcommerce/docs",
   "homepage": "https://www.graphcommerce.org/docs",
   "repository": "github:graphcommerce-org/graphcommerce/docs",
-  "version": "6.0.0-canary.49",
+  "version": "6.0.0-canary.50",
   "sideEffects": true,
   "devDependencies": {
-    "@graphcommerce/prettier-config-pwa": "6.0.0-canary.49"
+    "@graphcommerce/prettier-config-pwa": "6.0.0-canary.50"
   },
   "prettier": "@graphcommerce/prettier-config-pwa"
 }

package/readme.md

@@ -10,10 +10,12 @@ metaDescription:
 
 # GraphCommerce
 
-GraphCommerce is a front-end framework used for building headless Magento
-e-commerce storefronts in React. It includes the structure, components, and
-tooling you need to get started so you can spend your time styling and designing
-high-end e-commerce progressive web apps (PWA).
+GraphCommerce is a front-end framework for building headless Magento (2)
+ecommerce storefronts in React and Next.js. It provides a best-in-class example,
+including components and utilities, for building high-quality and performant
+commerce PWA's (Progressive Web App).
+
+[Get started](./getting-started/create.md) with GraphCommerce in minutes
 
 <figure>
 

package/upgrading/graphcommerce-5-to-6.md

@@ -3,6 +3,46 @@
 Upgrading from GraphCommerce 5 to 6 is a major upgrade. Please follow the
 regular [upgrade steps first](./readme.md).
 
+1. [Migrating to graphcommerce.config.js](#migrating-to-graphcommerceconfigjs)
+2. [Product routing changes](#product-routing-changes)
+3. [Hygraph schema changes](#hygraph-schema-changes)
+4. [Replace next/link with GraphCommerce's new Link behavior](#replace-nextlink-with-graphcommerces-new-link-behavior)
+
+## Migrating to graphcommerce.config.js
+
+GraphCommerce 6 uses a new [configuration file](../framework/config.md) called
+`graphcommerce.config.js` this replaces the current configuration. When staring
+a dev server, GraphCommerce will notify you how to migrate your env variables to
+graphcommerce.config.js.
+
+## Product routing changes
+
+The route for the product has changed from `/product/[url]`,
+`/product/configurable/[url]`, etc. to `/p/[url]` by default. This is a
+singlular product page for all product types.
+
+You can keep using the old behavior by setting
+[legacyProductRoute](../framework/config.md#legacyproductroute-boolean) to true.
+This legacy routing will be removed in a future version.
+
+You can also change the product route from `/p/[url]` to something else by
+configuring [productRoute](../framework/config.md#productroute-string)
+
+## Hygraph schema changes
+
+Create an enumeration in Hygraph `RowLinksVariants`:
+
+<img width="712" alt="Scherm­afbeelding 2023-03-16 om 13 15 24" src="https://user-images.githubusercontent.com/1244416/225615372-1226a6a8-11c8-4939-9ea5-bb66f16c3bb3.png" />
+
+Create a RowLinks model:
+<img width="748" alt="Scherm­afbeelding 2023-03-16 om 13 15 34" src="https://user-images.githubusercontent.com/1244416/225615400-fc64c203-dce4-4971-8d21-c8777d085abe.png" />
+
+Add RowLinks to be included in the `content` of the `Page` Model:
+
+<img width="805" alt="Scherm­afbeelding 2023-03-16 om 13 21 13" src="https://user-images.githubusercontent.com/1244416/225615681-81035be8-a994-416e-bd7a-814493c132d7.png" />
+
+After this step you should be able to run `yarn codegen`.
+
 ## Replace next/link with GraphCommerce's new Link behavior
 
 Before GraphCommerce 6 (before Next.js 13), the next/link component needed to
@@ -32,19 +72,6 @@ function MyComponent() {
 }
 ```
 
-### Product routing changes
-
-The route for the product has changed from `/product/[url]`,
-`/product/configurable/[url]`, etc. to `/p/[url]` by default. This is a
-singlular product page for all product types.
-
-You can opt in to use the
-[legacyProductRoute](../framework/config.md#legacyproductroute-boolean) to keep
-the old behavior. This legacy routing will be removed in a future version.
-
-You can also change the product route from `/p/[url]` to something else by
-configuring [productRoute](../framework/config.md#productroute-string)
-
 ### Upgrading a Link that uses next/link props
 
 ```tsx

package/upgrading/readme.md

@@ -1,3 +1,7 @@
+---
+menu: Upgrading step by step
+---
+
 # Upgrading
 
 This guide describes how to upgrade your GraphCommerce project files and its