diff --git a/src/pages/docs/explanation/apollo-client-basics/index.mdx b/src/pages/docs/explanation/apollo-client-basics/index.mdx index b7fe6430..2a3dcaa0 100644 --- a/src/pages/docs/explanation/apollo-client-basics/index.mdx +++ b/src/pages/docs/explanation/apollo-client-basics/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Apollo Client Basics", + description: + "Learn about core Apollo Client concepts like queries, fragments, mutations, and caching as they relate to Faust.js and WordPress.", }; Faust.js uses `@apollo/client` under the hood to perform GraphQL operations against your WordPress backend. Having a solid understanding of Apollo Client queries, fragments, and mutations will help you get the most out of Faust.js. diff --git a/src/pages/docs/explanation/deploy-your-app/index.mdx b/src/pages/docs/explanation/deploy-your-app/index.mdx index dcec8142..0b49d9db 100644 --- a/src/pages/docs/explanation/deploy-your-app/index.mdx +++ b/src/pages/docs/explanation/deploy-your-app/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Deploying Your App", + description: + "Explains the various options for deploying your Faust.js App to production.", }; The following explains the various options for deploying your Faust.js App to production. diff --git a/src/pages/docs/explanation/index.mdx b/src/pages/docs/explanation/index.mdx index 79dd44f9..680d3db1 100644 --- a/src/pages/docs/explanation/index.mdx +++ b/src/pages/docs/explanation/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Explanation", + description: + "High-level conceptual guides that provide background information and understanding of Headless WordPress development.", }; I see you found the root of the Explanatory guides! Explanatory guides are a place where we step away from code and talk high-level concepts and import background information. If you are looking to grow your understanding of Headless WordPress, you are in the right place. diff --git a/src/pages/docs/explanation/migrating-to-typescript/index.mdx b/src/pages/docs/explanation/migrating-to-typescript/index.mdx index 100236ba..013e034c 100644 --- a/src/pages/docs/explanation/migrating-to-typescript/index.mdx +++ b/src/pages/docs/explanation/migrating-to-typescript/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Migrating to TypeScript", + description: + "Guide for migrating existing Next.js pages to TypeScript in a Faust.js project with resources and references.", }; If you have existing Next.js pages that you want to migrate to TypeScript, you can follow the [official TypeScript Docs](https://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html) for general TypeScript migration tips. diff --git a/src/pages/docs/explanation/telemetry/index.mdx b/src/pages/docs/explanation/telemetry/index.mdx index dde21906..6d4ce6c6 100644 --- a/src/pages/docs/explanation/telemetry/index.mdx +++ b/src/pages/docs/explanation/telemetry/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Telemetry", + description: + "Information about Faust's anonymous telemetry data collection, what data is collected, and how to opt out.", }; Faust collects completely anonymous telemetry data about general usage. Participation in this anonymous program is optional. For more information on how we handle this data, please read our [Privacy Policy](/privacy-policy). diff --git a/src/pages/docs/how-to/authentication/index.mdx b/src/pages/docs/how-to/authentication/index.mdx index 98b68d1a..4436dcc6 100644 --- a/src/pages/docs/how-to/authentication/index.mdx +++ b/src/pages/docs/how-to/authentication/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Auth", + description: + "Guide to implementing authentication in your Next.js app using Faust.js toolkit features.", }; Understanding authentication is crucial for protecting your application's data. This page will guide you through implementing features from the Faust.js toolkit into your Next.js app. diff --git a/src/pages/docs/how-to/basic-setup/index.mdx b/src/pages/docs/how-to/basic-setup/index.mdx index 13dac50f..c684dce2 100644 --- a/src/pages/docs/how-to/basic-setup/index.mdx +++ b/src/pages/docs/how-to/basic-setup/index.mdx @@ -1,5 +1,7 @@ export const metadata = { - title: "Basic Setup with Template Hierarchy", + title: "Basic Setup", + description: + "Step-by-step guide for setting up a WordPress backend and Next.js frontend to use Faust.js toolkit features.", }; In order to leverage any of the tools in the Faust.js toolkit, some preliminary setup needs to be done. Follow the steps below to get started. diff --git a/src/pages/docs/how-to/create-a-plugin/index.mdx b/src/pages/docs/how-to/create-a-plugin/index.mdx index 4b275e24..afd75ef3 100644 --- a/src/pages/docs/how-to/create-a-plugin/index.mdx +++ b/src/pages/docs/how-to/create-a-plugin/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Create A Plugin", + description: + "Learn how to create Faust.js plugins to extend or alter the framework's behavior using JavaScript/TypeScript actions and filters.", }; Faust plugins are a structured way to extend or alter the framework's behavior, very much like WordPress plugins do in a traditional WordPress environment. Instead of `PHP`, however, Faust's plugins are written in JavaScript/TypeScript, leveraging actions and filters to deliver similar flexibility in a headless architecture. diff --git a/src/pages/docs/how-to/generate-types-with-graphql-codegen/index.mdx b/src/pages/docs/how-to/generate-types-with-graphql-codegen/index.mdx index 361cfc7b..95f4290d 100644 --- a/src/pages/docs/how-to/generate-types-with-graphql-codegen/index.mdx +++ b/src/pages/docs/how-to/generate-types-with-graphql-codegen/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Generate types with GraphQL Codegen", + description: + "Guide to generating TypeScript definitions for your custom GraphQL queries and fragments using GraphQL Code Generator.", }; Faust.js provides built-in TypeScript support, including types for Templates, Blocks, and more. This guide will show you how to generate fully typed definitions for your custom GraphQL queries and fragments using [GraphQL Code Generator](https://the-guild.dev/graphql/codegen). diff --git a/src/pages/docs/how-to/index.mdx b/src/pages/docs/how-to/index.mdx index 5f4dfc13..d5bcb771 100644 --- a/src/pages/docs/how-to/index.mdx +++ b/src/pages/docs/how-to/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "How-to Guides", + description: + "Step-by-step guides for implementing specific features and achieving practical goals with Faust.js.", }; I see you found the root of the How-to guides! How-to guides are a place where we walk you through implementing specific features of Faust.js®. If you are looking to achieve a specific goal with Faust.js®, you are in the right place. diff --git a/src/pages/docs/how-to/post-previews/index.mdx b/src/pages/docs/how-to/post-previews/index.mdx index 1e218569..aa29667f 100644 --- a/src/pages/docs/how-to/post-previews/index.mdx +++ b/src/pages/docs/how-to/post-previews/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Post Previews", + description: + "Learn how to implement post preview functionality in your headless WordPress app using Faust.js.", }; When editing content in the [WordPress editor](https://wordpress.com/support/wordpress-editor/), content creators can click the **Preview** link to preview what the content will look like on the frontend before the post has been published. This docs page outlines how to set up post previews in a headless WordPress app. diff --git a/src/pages/docs/how-to/query-data-in-nextjs-routes/index.mdx b/src/pages/docs/how-to/query-data-in-nextjs-routes/index.mdx index 46a47d73..f010194c 100644 --- a/src/pages/docs/how-to/query-data-in-nextjs-routes/index.mdx +++ b/src/pages/docs/how-to/query-data-in-nextjs-routes/index.mdx @@ -1,6 +1,7 @@ export const metadata = { - title: "Query Data in Next.js Routes", - + title: "Query Data in Next.js Routes", + description: + "Guide to pre-fetching WordPress data in Next.js routes using getNextServerSideProps and getNextStaticProps helper functions.", }; When you want to pre-fetch WordPress data and render your pages outside of the Faust.js template hierarchy and instead use Next.js routes, either at **build time** or **on every request**, Faust provides two helper functions: diff --git a/src/pages/docs/how-to/query-data-in-the-browser/index.mdx b/src/pages/docs/how-to/query-data-in-the-browser/index.mdx index 55a01642..d4f7db34 100644 --- a/src/pages/docs/how-to/query-data-in-the-browser/index.mdx +++ b/src/pages/docs/how-to/query-data-in-the-browser/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Query Data in the Browser", + description: + "Learn how to perform client-side data fetching using Apollo's useQuery hook in your React components.", }; When you query data in the browser, you're leveraging Apollo's `useQuery` hook within your React components. diff --git a/src/pages/docs/how-to/sitemaps/index.mdx b/src/pages/docs/how-to/sitemaps/index.mdx index cd697775..c9f51fd5 100644 --- a/src/pages/docs/how-to/sitemaps/index.mdx +++ b/src/pages/docs/how-to/sitemaps/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Sitemaps", + description: + "Guide to implementing XML sitemaps in your headless WordPress site using Faust.js built-in sitemap functionality.", }; Sitemaps can be a complicated process when using WordPress in a headless environment. Thankfully, Faust takes care of all your sitemap needs through creation of a file within the pages directory. diff --git a/src/pages/docs/how-to/use-wpgraphql-smart-cache/index.mdx b/src/pages/docs/how-to/use-wpgraphql-smart-cache/index.mdx index 2adbd897..fb13c78c 100644 --- a/src/pages/docs/how-to/use-wpgraphql-smart-cache/index.mdx +++ b/src/pages/docs/how-to/use-wpgraphql-smart-cache/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Using WPGraphQL Smart Cache Network Caching", + description: + "Guide to optimizing GraphQL queries using WPGraphQL Smart Cache with Faust.js built-in network caching support.", }; WPGraphQL Smart Cache optimizes GraphQL queries by caching the results of your requests and automatically evicting outdated data whenever your WordPress content changes. Faust.js provides built-in support for [Network Caching](https://github.com/wp-graphql/wp-graphql-smart-cache/blob/main/docs/network-cache.md). This guide walks you through enabling Automatic Persisted Queries, using GET methods for network requests, and making one-off requests that override your default settings. diff --git a/src/pages/docs/index.mdx b/src/pages/docs/index.mdx index a9c00473..8657f486 100644 --- a/src/pages/docs/index.mdx +++ b/src/pages/docs/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Introduction", + description: + "Introduction to Faust.js, a toolkit for building headless WordPress applications with Next.js.", }; ## What is Faust.js®? diff --git a/src/pages/docs/reference/from-theme-json/index.mdx b/src/pages/docs/reference/from-theme-json/index.mdx index 0684e5f7..9fabac99 100644 --- a/src/pages/docs/reference/from-theme-json/index.mdx +++ b/src/pages/docs/reference/from-theme-json/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "fromThemeJson", + description: + "Reference for the fromThemeJson helper function that converts WordPress theme.json objects into compatible BlocksTheme objects.", }; The `fromThemeJson` is a helper function that is used to convert a WordPress theme's `theme.json` object into a compatible `BlocksTheme` object. diff --git a/src/pages/docs/reference/get-next-server-side-props/index.mdx b/src/pages/docs/reference/get-next-server-side-props/index.mdx index 0df92664..d5325d6e 100644 --- a/src/pages/docs/reference/get-next-server-side-props/index.mdx +++ b/src/pages/docs/reference/get-next-server-side-props/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "getNextServerSideProps", + description: + "Reference for the getNextServerSideProps function used to enable server-side rendering with WordPress data outside the template hierarchy.", }; The `getNextServerSideProps` function lets you server side render your page with WordPress data outside of the template hierarchy using Next.js file-based pages. The function should be returned from `getServerSideProps` which is required by Next.js to perform server-side rendering (SSR). diff --git a/src/pages/docs/reference/get-next-static-props/index.mdx b/src/pages/docs/reference/get-next-static-props/index.mdx index acc3d75b..f9700776 100644 --- a/src/pages/docs/reference/get-next-static-props/index.mdx +++ b/src/pages/docs/reference/get-next-static-props/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "getNextStaticProps", + description: + "Reference for the getNextStaticProps function used to build static sites with WordPress data outside the template hierarchy.", }; The `getNextStaticProps` function lets you build a static site with your WordPress data outside of the template hierarchy using Next.js file based pages. The function should be returned from `getStaticProps`. diff --git a/src/pages/docs/reference/get-site-map-props/index.mdx b/src/pages/docs/reference/get-site-map-props/index.mdx index e577a70f..76e083ad 100644 --- a/src/pages/docs/reference/get-site-map-props/index.mdx +++ b/src/pages/docs/reference/get-site-map-props/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "getSiteMapProps", + description: + "Reference for the getSitemapProps helper function used to proxy sitemaps from WordPress to your Faust frontend.", }; `getSitemapProps` is a server side helper function that facilitates the proxying of sitemaps from your WordPress site to your Faust frontend. It is a function that is returned from inside of a [`getServerSideProps`](https://nextjs.org/docs/basic-features/data-fetching/get-server-side-props) Next.js function. diff --git a/src/pages/docs/reference/get-styles/index.mdx b/src/pages/docs/reference/get-styles/index.mdx index f82003db..91d2e7d2 100644 --- a/src/pages/docs/reference/get-styles/index.mdx +++ b/src/pages/docs/reference/get-styles/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "getStyles", + description: + "Reference for the getStyles helper function used to calculate inline styles for WordPress blocks based on theme and block properties.", }; The `getStyles` is a helper function that is used to calculate the inline styles of a block given the current theme and block properties. This is mainly useful when developing blocks taken from the [core WordPress blocks list](https://developer.wordpress.org/block-editor/reference-guides/core-blocks/). diff --git a/src/pages/docs/reference/get-wordpress-props/index.mdx b/src/pages/docs/reference/get-wordpress-props/index.mdx index cae2f513..3e7cfd4a 100644 --- a/src/pages/docs/reference/get-wordpress-props/index.mdx +++ b/src/pages/docs/reference/get-wordpress-props/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "getWordPressProps", + description: + "Reference for the getWordPressProps function used to set up the Faust Template Hierarchy system in Next.js applications.", }; `getWordPressProps` is a function that should be returned within Next.js' `getStaticProps` or `getServerSideProps` to properly setup the Faust Template Hierarchy system. diff --git a/src/pages/docs/reference/index.mdx b/src/pages/docs/reference/index.mdx index 7edd735d..05aa9f44 100644 --- a/src/pages/docs/reference/index.mdx +++ b/src/pages/docs/reference/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Reference Guides", + description: + "API specifications and detailed documentation for Faust.js functions, components, and features.", }; I see you found the root of the Reference guides! Reference guides are a place where we provide API specs. If you are looking for information on specific APIs, you are in the right place. diff --git a/src/pages/docs/reference/set-config/index.mdx b/src/pages/docs/reference/set-config/index.mdx index 2b90285b..5f970566 100644 --- a/src/pages/docs/reference/set-config/index.mdx +++ b/src/pages/docs/reference/set-config/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "setConfig", + description: + "Reference for the setConfig function used to configure Faust.js settings in the faust.config.js file.", }; The `setConfig` function is used to set the configuration for Faust. It is used in the `faust.config.js` file to set the configuration options for Faust. diff --git a/src/pages/docs/reference/typescript/index.mdx b/src/pages/docs/reference/typescript/index.mdx index 4d5dfd4f..ce2b3113 100644 --- a/src/pages/docs/reference/typescript/index.mdx +++ b/src/pages/docs/reference/typescript/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "TypeScript", + description: + "Guide to using TypeScript with Faust.js components, hooks, and plugins, including common patterns and type definitions.", }; Faust has built-in TypeScript support, which means you can use TypeScript to type your Faust components, hooks, and plugins. This may not be exhaustive but should show you common patterns for typing your Faust code. diff --git a/src/pages/docs/reference/use-auth/index.mdx b/src/pages/docs/reference/use-auth/index.mdx index 194cf9af..a470f425 100644 --- a/src/pages/docs/reference/use-auth/index.mdx +++ b/src/pages/docs/reference/use-auth/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "useAuth", + description: + "Reference for the useAuth hook that provides authentication configuration and functionality in Faust.js applications.", }; ## Configuration diff --git a/src/pages/docs/reference/use-blocks-theme/index.mdx b/src/pages/docs/reference/use-blocks-theme/index.mdx index a38d8dc7..c0ed2502 100644 --- a/src/pages/docs/reference/use-blocks-theme/index.mdx +++ b/src/pages/docs/reference/use-blocks-theme/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "useBlocksTheme", + description: + "Reference for the useBlocksTheme hook that provides theme values from WordPressBlocksProvider for block rendering.", }; `useBlocksTheme` is a React hook that provides the theme value when passed in the `WordPressBlocksProvider` component. The theme value is sourced by a theme.json file when using the [fromThemeJson](/docs/reference/from-theme-json) helper function. diff --git a/src/pages/docs/reference/use-login/index.mdx b/src/pages/docs/reference/use-login/index.mdx index c85136ed..34e35643 100644 --- a/src/pages/docs/reference/use-login/index.mdx +++ b/src/pages/docs/reference/use-login/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "useLogin", + description: + "Reference for the useLogin hook that enables in-app authentication with WordPress without leaving your Faust.js application.", }; `useLogin` is a React hook that facilitates login to your headless WordPress site without having to leave your Faust app. @@ -94,4 +96,4 @@ export default function Login() { } ``` -It create some state values to keep track of the user email and password fields. It then uses the `useLogin` hook and extracts the return values. Based on the return values, it will either disable some fields when `loading=true` or return an error message when `data.generateAuthorizationCode.error` is not empty. +It creates some state values to keep track of the user email and password fields. It then uses the `useLogin` hook and extracts the return values. Based on the return values, it will either disable some fields when `loading=true` or return an error message when `data.generateAuthorizationCode.error` is not empty. diff --git a/src/pages/docs/reference/use-logout/index.mdx b/src/pages/docs/reference/use-logout/index.mdx index cd0d007f..552c295b 100644 --- a/src/pages/docs/reference/use-logout/index.mdx +++ b/src/pages/docs/reference/use-logout/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "useLogout", + description: + "Reference for the useLogout hook that provides functionality to log out users from your Faust.js application.", }; `useLogout` is a React hook that facilitates logging out from your Faust app. diff --git a/src/pages/docs/reference/with-faust/index.mdx b/src/pages/docs/reference/with-faust/index.mdx index d2b3e506..e1010ebb 100644 --- a/src/pages/docs/reference/with-faust/index.mdx +++ b/src/pages/docs/reference/with-faust/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "withFaust", + description: + "Reference for the withFaust helper function used to merge Next.js configuration with required Faust.js settings.", }; The `withFaust` helper function is used to merge your `next.config.js` config with necessary Faust.js configuration. diff --git a/src/pages/docs/reference/wordpress-blocks-provider/index.mdx b/src/pages/docs/reference/wordpress-blocks-provider/index.mdx index 138a58cb..6a3bc448 100644 --- a/src/pages/docs/reference/wordpress-blocks-provider/index.mdx +++ b/src/pages/docs/reference/wordpress-blocks-provider/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "WordPressBlocksProvider", + description: + "Reference for the WordPressBlocksProvider component that provides block data and configuration for WordPress block rendering.", }; `WordPressBlocksProvider` is a React [Context Provider](https://react.dev/reference/react/createContext#provider) that exposes the data that `WordPressBlocksViewer` needs to render WordPress blocks, namely which blocks have been defined as a part of your Faust app. diff --git a/src/pages/docs/reference/wordpress-blocks-viewer/index.mdx b/src/pages/docs/reference/wordpress-blocks-viewer/index.mdx index aabf2740..d7421e39 100644 --- a/src/pages/docs/reference/wordpress-blocks-viewer/index.mdx +++ b/src/pages/docs/reference/wordpress-blocks-viewer/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "WordPressBlocksViewer", + description: + "Reference for the WordPressBlocksViewer component that renders WordPress blocks using React components defined in WordPressBlocksProvider.", }; `WordPressBlocksViewer` is a component used to render blocks received from WordPress. It uses the React components passed to the `WordPressBlocksProvider` and matches them to the appropriate blocks received in the `editorBlocks` prop. diff --git a/src/pages/docs/tutorial/index.mdx b/src/pages/docs/tutorial/index.mdx index 0d90c6cb..404f3908 100644 --- a/src/pages/docs/tutorial/index.mdx +++ b/src/pages/docs/tutorial/index.mdx @@ -1,5 +1,7 @@ export const metadata = { title: "Tutorials", + description: + "Step-by-step tutorials for learning the basics and core features of Faust.js through hands-on examples.", }; I see you found the root of the Tutorial! Tutorials are a place where we walk you through learning the basics of Faust.js®. If you are looking to learn about what Faust.js® offers, you are in the right place.