SEO: add description to docs (#9168)

* SEO: add `description` to docs Signed-off-by: Tuval <tuval.simha@gmail.com> * prettier Signed-off-by: Tuval <tuval.simha@gmail.com> --------- Signed-off-by: Tuval <tuval.simha@gmail.com>
dotansimha · Mar 15, 2023 · 45e26e6 · 45e26e6
1 parent b883375
commit 45e26e6
Show file tree

Hide file tree

Showing 91 changed files with 202 additions and 0 deletions.
diff --git a/website/src/pages/docs/advanced/document-transform.mdx b/website/src/pages/docs/advanced/document-transform.mdx
@@ -1,3 +1,7 @@
+---
+description: Document transform is a feature that allows you to modify documents before they are used by plugins.
+---
+
 import { Callout } from '@theguild/components'
 
 # Document Transform

diff --git a/website/src/pages/docs/advanced/generated-files-colocation.mdx b/website/src/pages/docs/advanced/generated-files-colocation.mdx
@@ -1,3 +1,6 @@
+---
+description: Generate types near your GraphQL operations. Colocate your generated files with your original GraphQL operations.
+---
 import { PackageCmd, Callout } from '@theguild/components'
 
 # Generated files colocation

diff --git a/website/src/pages/docs/advanced/how-does-it-work.mdx b/website/src/pages/docs/advanced/how-does-it-work.mdx
@@ -1,3 +1,6 @@
+---
+description: GraphQL Introspection allows fetching the types defined in the target GraphQL API. GraphQL AST allows to navigate through both client-side operations and remote schema types.
+---
 # How does GraphQL Code Generator Work?
 
 In order to generate code and types, GraphQL Code Generator relies on 2 main core concepts of GraphQL:

diff --git a/website/src/pages/docs/advanced/profiler.mdx b/website/src/pages/docs/advanced/profiler.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator CLI provides a flag that enables the profiler mode. This allows you to identify performance bottlenecks in your codegen configuration.
+---
+
 import { PackageCmd } from '@theguild/components'
 
 # GraphQL Code Generator Profiler

diff --git a/website/src/pages/docs/advanced/programmatic-usage.mdx b/website/src/pages/docs/advanced/programmatic-usage.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator also provides a complete programmatic API. The programmatic API can be used if you need to customize the execution flow or write a tool that uses the codegen.
+---
+
 import { Callout } from '@theguild/components'
 
 # Programmatic Usage

diff --git a/website/src/pages/docs/config-reference/codegen-config.mdx b/website/src/pages/docs/config-reference/codegen-config.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to configure GraphQL Code Generator to generate code from your GraphQL schema and documents.
+---
+
 import { PackageCmd, Callout } from '@theguild/components'
 
 # `codegen.ts` file

diff --git a/website/src/pages/docs/config-reference/config-field.mdx b/website/src/pages/docs/config-reference/config-field.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to configure GraphQL Code Generator to fit your needs. The `config` field is used to pass configuration to Plugins.
+---
+
 import { Callout } from '@theguild/components'
 
 # `config` field

diff --git a/website/src/pages/docs/config-reference/documents-field.mdx b/website/src/pages/docs/config-reference/documents-field.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to specify the documents field in your GraphQL Code Generator config file.
+---
+
 import { Callout } from '@theguild/components'
 
 # `documents` field

diff --git a/website/src/pages/docs/config-reference/lifecycle-hooks.mdx b/website/src/pages/docs/config-reference/lifecycle-hooks.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to use the GraphQL Code Generator CLI to generate code from your GraphQL schema and operations.
+---
+
 import { Callout } from '@theguild/components'
 
 # Lifecycle Hooks

diff --git a/website/src/pages/docs/config-reference/multiproject-config.mdx b/website/src/pages/docs/config-reference/multiproject-config.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to use GraphQL Code Generator with multiple projects in the same config file.
+---
+
 # Multi Project
 
 In some cases, it's useful to have multiple projects in the same config file.

diff --git a/website/src/pages/docs/config-reference/naming-convention.mdx b/website/src/pages/docs/config-reference/naming-convention.mdx
@@ -1,3 +1,7 @@
+---
+description: 'GraphQL Code Generator is a tool for generating code from GraphQL schema and operations.'
+---
+
 # Naming Convention
 
 GraphQL Code Generation provides a `namingConvention` option to control the naming convention of the different code elements generated (types, enum values, …).

diff --git a/website/src/pages/docs/config-reference/require-field.mdx b/website/src/pages/docs/config-reference/require-field.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to use the require field to load external files without transpiling them.
+---
+
 import { Callout } from '@theguild/components'
 
 # `require` field

diff --git a/website/src/pages/docs/config-reference/schema-field.mdx b/website/src/pages/docs/config-reference/schema-field.mdx
@@ -1,3 +1,7 @@
+---
+description: How to specify your GraphQL Schema in GraphQL Code Generator. Learn how to load your schema from a remote server, local file, or multiple files.
+---
+
 import { Callout } from '@theguild/components'
 
 # `schema` field

diff --git a/website/src/pages/docs/custom-codegen/contributing.mdx b/website/src/pages/docs/custom-codegen/contributing.mdx
@@ -1,3 +1,7 @@
+---
+description: Create a new GraphQL Code Generator plugin for your favorite language or platform.
+---
+
 import { Callout } from '@theguild/components'
 
 # Contributing

diff --git a/website/src/pages/docs/custom-codegen/extend-schema.mdx b/website/src/pages/docs/custom-codegen/extend-schema.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to create a custom plugin for GraphQL Code Generator. How to extend the GraphQL Schema?
+---
+
 # How to extend the GraphQL Schema?
 
 Each plugin can also specify `addToSchema` field, and to extend the `GraphQLSchema` with more types:

diff --git a/website/src/pages/docs/custom-codegen/index.mdx b/website/src/pages/docs/custom-codegen/index.mdx
@@ -1,3 +1,7 @@
+---
+description: The general purpose of GraphQL Code Generator is to parse GraphQL syntax, transform it into an AST and then output it into desired formats which can vary.
+---
+
 # What are Plugins?
 
 The general purpose of GraphQL Code Generator is to parse GraphQL syntax, transform it into an AST and then output it into desired formats which can vary.

diff --git a/website/src/pages/docs/custom-codegen/plugin-structure.mdx b/website/src/pages/docs/custom-codegen/plugin-structure.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to write your own GraphQL Code Generator Plugin. You can use it to generate custom output, or to extend the existing plugins.
+---
+
 import { Callout } from '@theguild/components'
 
 # Write your first Plugin

diff --git a/website/src/pages/docs/custom-codegen/using-visitor.mdx b/website/src/pages/docs/custom-codegen/using-visitor.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to write your own plugins for GraphQL Code Generator. Most of the codegen's plugins are written with a design-pattern called Visitor.
+---
+
 # Visitor Pattern
 
 Most of the codegen's plugins are written with a design-pattern called [Visitor](https://en.wikipedia.org/wiki/Visitor_pattern).

diff --git a/website/src/pages/docs/custom-codegen/validate-configuration.mdx b/website/src/pages/docs/custom-codegen/validate-configuration.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to create your own plugins for GraphQL Code Generator. You can use plugins to generate code, documents, or even to modify the schema.
+---
+
 import { Callout } from '@theguild/components'
 
 # Validate Plugin Configuration

diff --git a/website/src/pages/docs/getting-started/development-workflow.mdx b/website/src/pages/docs/getting-started/development-workflow.mdx
@@ -1,3 +1,7 @@
+---
+description: How to integrate GraphQL Code Generator into your development workflow. Learn how to run it in watch mode, or as part of your CI flow.
+---
+
 # Development workflow
 
 GraphQL Code Generator should be integrated as part of your development workflow.

diff --git a/website/src/pages/docs/getting-started/esm-typescript-usage.mdx b/website/src/pages/docs/getting-started/esm-typescript-usage.mdx
@@ -1,5 +1,6 @@
 ---
 title: ESM TypeScript Usage
+description: How to use ESM with TypeScript. ESM is an important step in the JavaScript ecosystem because it allows static analysis of the dependency tree.
 ---
 
 # ESM TypeScript Usage

diff --git a/website/src/pages/docs/getting-started/index.mdx b/website/src/pages/docs/getting-started/index.mdx
@@ -1,5 +1,6 @@
 ---
 title: Introduction
+description: GraphQL Code Generator is a plugin-based tool that helps you get the best out of your GraphQL stack. From back-end to front-end, GraphQL Code Generator automates the generation of typed Queries, Mutations and, Subscriptions for React, Vue, Angular, Next.js, Svelte, whether you are using Apollo Client, URQL or, React Query.
 ---
 
 import { Tabs, Tab, Callout, PackageCmd } from '@theguild/components'

diff --git a/website/src/pages/docs/getting-started/installation.mdx b/website/src/pages/docs/getting-started/installation.mdx
@@ -1,3 +1,7 @@
+---
+description: 'GraphQL Code Generator is a tool for generating code from GraphQL schema and operations. It can generate code for various platforms, such as React, Angular, Node, and more.'
+---
+
 import { Callout, PackageCmd } from '@theguild/components'
 
 # Installation

diff --git a/website/src/pages/docs/guides/angular.mdx b/website/src/pages/docs/guides/angular.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator provides the @graphql-codegen/typescript-apollo-angular plugin that generates full-typed Apollo GraphQL services.
+---
+
 import { PackageCmd, Callout } from '@theguild/components'
 
 # Guide: Angular

diff --git a/website/src/pages/docs/guides/api-testing.mdx b/website/src/pages/docs/guides/api-testing.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator can generate typed results for your GraphQL operations. This tutorial uses GraphQL Yoga, but the practices are applicable to testing any GraphQL server.
+---
+
 import { Callout, PackageCmd } from '@theguild/components'
 
 # Guide: API Testing

diff --git a/website/src/pages/docs/guides/flutter-freezed.mdx b/website/src/pages/docs/guides/flutter-freezed.mdx
@@ -1,3 +1,7 @@
+---
+description: Boost 🚀 your development of Dart/Flutter apps using a GraphQL API by generating models directly from your GraphQL Schema.
+---
+
 import { PackageCmd, Callout } from '@theguild/components'
 
 # Guide: Dart/Flutter

diff --git a/website/src/pages/docs/guides/further-reading.mdx b/website/src/pages/docs/guides/further-reading.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator is a tool for generating code from your GraphQL schema and operations. It's a great way to get type-safety and auto-completion in your code.
+---
+
 # Further Reading
 
 Our guides helps you getting started with the most popular frameworks, GraphQL clients and servers.

diff --git a/website/src/pages/docs/guides/graphql-modules.mdx b/website/src/pages/docs/guides/graphql-modules.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator's `@graphql-codegen/graphql-modules-preset` plugin helps to generate resolvers type for each module of a GraphQL Modules GraphQL API.
+---
+
 import { PackageCmd } from '@theguild/components'
 
 # Guide: GraphQL Modules

diff --git a/website/src/pages/docs/guides/graphql-server-apollo-yoga-with-server-preset.mdx b/website/src/pages/docs/guides/graphql-server-apollo-yoga-with-server-preset.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator's server preset, `@eddeee888/gcg-typescript-resolver-files`, helps GraphQL APIs work at any scale by enforcing best practices such as type-safety and schema module conventions.
+---
+
 import { PackageCmd, Callout, Tabs, Tab } from '@theguild/components'
 
 # Guide: GraphQL Yoga / Apollo Server with Server Preset

diff --git a/website/src/pages/docs/guides/graphql-server-apollo-yoga.mdx b/website/src/pages/docs/guides/graphql-server-apollo-yoga.mdx
@@ -1,3 +1,6 @@
+---
+description: GraphQL Code Generator's `@graphql-codegen/typescript-resolvers` plugin generates TypeScript types for your GraphQL API's resolvers.
+---
 import { PackageCmd, Tabs, Tab, Callout } from '@theguild/components'
 
 # Guide: GraphQL Yoga / Apollo Server

diff --git a/website/src/pages/docs/guides/react-vue.mdx b/website/src/pages/docs/guides/react-vue.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator is a tool that generates code from your GraphQL schema and operations. It can generate TypeScript, Flow, Swift, Kotlin, and more.
+---
+
 import { Tabs, Tab, Callout, PackageCmd } from '@theguild/components'
 
 # Guide: React and Vue

diff --git a/website/src/pages/docs/guides/svelte.mdx b/website/src/pages/docs/guides/svelte.mdx
@@ -1,3 +1,7 @@
+---
+description: Generate typed code for SvelteKit and Apollo. GraphQL Code Generator and the community provide typed code generation for Apollo, SvelteKit _native_, and other clients.
+---
+
 import { Callout, PackageCmd } from '@theguild/components'
 
 # Guide: Svelte / Kit

diff --git a/website/src/pages/docs/integrations/apollo-local-state.mdx b/website/src/pages/docs/integrations/apollo-local-state.mdx
@@ -1,3 +1,7 @@
+---
+description: Apollo Local State. Suppose you are using apollo-client >2.5 or older, with apollo-link-state to manage your app state with GraphQL. In that case, you're probably using a client-side only GraphQL schema and client-side directives such as `@client`.
+---
+
 # Apollo Local State
 
 Suppose you are using [apollo-client](https://apollographql.com/docs/react/v2/data/local-state) >2.5 (or older, with [apollo-link-state](https://apollographql.com/docs/link/links/state.html)) to manage your app state with GraphQL. In that case, you're probably using a client-side only GraphQL schema and client-side directives such as `@client`.

diff --git a/website/src/pages/docs/integrations/create-react-app.mdx b/website/src/pages/docs/integrations/create-react-app.mdx
@@ -1,3 +1,7 @@
+---
+description: Codegen for React Apollo with TypeScript. Generates React Hooks and TypeScript types.
+---
+
 # Create-React-App
 
 Since v2 of [Create-React-App](https://github.com/facebook/create-react-app), you can use TypeScript without the need to eject from the basic scripts packages.

diff --git a/website/src/pages/docs/integrations/federation.mdx b/website/src/pages/docs/integrations/federation.mdx
@@ -1,3 +1,7 @@
+---
+description: Generate TypeScript resolvers signatures for your GraphQL schema. Supports Apollo Federation.
+---
+
 # Apollo Federation
 
 The `typescript-resolvers` plugin also supports [Apollo Federation](https://apollographql.com/docs/apollo-server/federation/introduction).

diff --git a/website/src/pages/docs/integrations/gatsby.mdx b/website/src/pages/docs/integrations/gatsby.mdx
@@ -1,3 +1,7 @@
+---
+description: GraphQL Code Generator is a tool for generating code based on your GraphQL schema and operations.
+---
+
 # Gatsby
 
 If you build apps using [Gatsby](https://gatsbyjs.com), you can use its built-in feature called [GraphQL Typegen](https://gatsbyjs.com/docs/how-to/local-development/graphql-typegen). Under the hood it uses the GraphQL Code Generator to generate TypeScript types, but you don't need to set anything up other than enabling an option.

diff --git a/website/src/pages/docs/integrations/prettier.mdx b/website/src/pages/docs/integrations/prettier.mdx
@@ -1,3 +1,7 @@
+---
+description: Learn how to use Prettier and other linters with GraphQL Code Generator to apply your custom code style and formatting rules.
+---
+
 import { Callout } from '@theguild/components'
 
 # Prettier & Linters

diff --git a/website/src/pages/docs/integrations/vscode.mdx b/website/src/pages/docs/integrations/vscode.mdx
@@ -1,3 +1,7 @@
+---
+description: Code generation for your GraphQL operations. Generate code from your GraphQL queries, mutations, subscriptions, fragments, and schema.
+---
+
 # VSCode
 
 In VSCode, you can install a lightweight extension to get your codegen on every save effortlessly.

diff --git a/website/src/pages/docs/migration/from-0-13.mdx b/website/src/pages/docs/migration/from-0-13.mdx
@@ -1,3 +1,7 @@
+---
+description: Migrating from 0.13 to 0.18. What has changed? How to migrate? What are the new features?
+---
+
 import { Callout } from '@theguild/components'
 
 # Migration from 0.13 to 0.18

diff --git a/website/src/pages/docs/migration/from-0-18.mdx b/website/src/pages/docs/migration/from-0-18.mdx
@@ -1,3 +1,7 @@
+---
+description: Migrating to 1.0.0. What has changed? How to migrate? What are the new features?
+---
+
 import { Callout, Tabs, Tab, PackageCmd } from '@theguild/components'
 
 # Migration to 1.0.0

diff --git a/website/src/pages/plugins/c-sharp/c-sharp-operations.mdx b/website/src/pages/plugins/c-sharp/c-sharp-operations.mdx
@@ -1,5 +1,6 @@
 ---
 title: c-sharp-operations
+description: C# operations plugin. Generates C# methods for the resolvers' signature. Works with GraphQL.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/dart/flutter-freezed.mdx b/website/src/pages/plugins/dart/flutter-freezed.mdx
@@ -1,5 +1,6 @@
 ---
 title: flutter-freezed
+description: Flutter plugin for generating Dart classes from GraphQL queries. It uses the freezed package.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/flow/flow-operations.mdx b/website/src/pages/plugins/flow/flow-operations.mdx
@@ -1,5 +1,6 @@
 ---
 title: flow-operations
+description: Flow Operations plugin. This plugin allows you to create and manage operations in your Flow blockchain.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/flow/flow-resolvers.mdx b/website/src/pages/plugins/flow/flow-resolvers.mdx
@@ -1,5 +1,6 @@
 ---
 title: flow-resolvers
+description: Flow plugin for GraphQL Code Generator. Generates Flow types for your GraphQL resolvers.
 ---
 
 import { Callout } from '@theguild/components'

diff --git a/website/src/pages/plugins/java/java-apollo-android.mdx b/website/src/pages/plugins/java/java-apollo-android.mdx
@@ -1,5 +1,6 @@
 ---
 title: java-apollo-android
+description: GraphQL Code Generator plugin for generating Java code for Apollo Android.
 ---
 
 import { Callout, PackageCmd } from '@theguild/components'

diff --git a/website/src/pages/plugins/java/java-resolvers.mdx b/website/src/pages/plugins/java/java-resolvers.mdx
@@ -1,5 +1,6 @@
 ---
 title: java-resolvers
+description: Java Resolvers Plugin. Generate Java interfaces for your resolvers. Works with graphql-java library.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/java/java.mdx b/website/src/pages/plugins/java/java.mdx
@@ -1,5 +1,6 @@
 ---
 title: java
+description: Java plugin. Generate Java classes from your GraphQL schema. Use it in your resolvers.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/java/kotlin.mdx b/website/src/pages/plugins/java/kotlin.mdx
@@ -1,5 +1,6 @@
 ---
 title: kotlin
+description: Kotlin plugin for GraphQL Code Generator. Generate Kotlin classes for Enums and Input types.
 ---
 
 import { Callout, PackageCmd } from '@theguild/components'

diff --git a/website/src/pages/plugins/other/add.mdx b/website/src/pages/plugins/other/add.mdx
@@ -1,5 +1,6 @@
 ---
 title: add
+description: Adds custom text to your output file. You can use this plugin to add custom code, imports, comments and more to your output file.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/other/fragment-matcher.mdx b/website/src/pages/plugins/other/fragment-matcher.mdx
@@ -1,5 +1,6 @@
 ---
 title: fragment-matcher
+description: Generate fragment matcher for Apollo Client. This plugin is required for using fragments with Apollo Client.
 ---
 
 import { Callout, Tabs, Tab } from '@theguild/components'

diff --git a/website/src/pages/plugins/other/hasura-allow-list.mdx b/website/src/pages/plugins/other/hasura-allow-list.mdx
@@ -1,5 +1,6 @@
 ---
 title: hasura-allow-list
+description: Generate hasura allow list metadata from graphql files.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'

diff --git a/website/src/pages/plugins/other/introspection.mdx b/website/src/pages/plugins/other/introspection.mdx
@@ -1,5 +1,6 @@
 ---
 title: introspection
+description: Introspection plugin for Prisma. This plugin allows you to introspect your database and generate a Prisma schema from it.
 ---
 
 import { PluginApiDocs, PluginHeader } from '@/components/plugin'