Docs/Glossary: Headless CMS entry (#20660)

* Docs/Glossary: Headless CMS entry

Add a brief overview of what a headless CMS is, how it's different
from a traditional CMS, and why you might choose it for your project.

Updated glossary, doc-links.yaml with links to Headless CMS article.

* Headless CMS: Use relative links to internal docs.

* Fix backend link

* Place headless CMS definition higher in the article.

Rewrite to contrast traditional and headless CMS.

* glossary/headless-cms: Fix frontmatter.

* glossary/headless-cms: Tweak wording.

Co-authored-by: Aisha Blake <[email protected]>

docs/docs/glossary.md

@@ -148,7 +148,7 @@ A [query](#query) language that allows you to pull data into your website or app
 
 A markup language that every web browser is able to understand. It stands for Hypertext Markup Language. [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) gives your web content a universal informational structure, defining things like headings, paragraphs, and more. It is also key to providing an accessible website.
 
-### Headless CMS
+### [Headless CMS](/docs/glossary/headless-cms)
 
 A [CMS](#cms) that only handles the [backend](#backend) content management instead of handling both the backend and [frontend](#frontend). This type of setup is also referred to as [Decoupled](#decoupled).
 

docs/docs/glossary/headless-cms.md

@@ -0,0 +1,22 @@
+---
+title: Headless CMS
+disableTableOfContents: true
+---
+
+Learn what a Headless CMS is, how it differs from traditional content management systems, and why you might choose a headless CMS for your project.
+
+## What is a Headless CMS?
+
+A _headless content management system_ or _headless CMS_, is a CMS in which the content is separated from its presentation. Content management systems such as WordPress and Drupal store content in a database, and use a collection of HTML-based template files to manage how that content gets presented to visitors.
+
+Headless content mananagement systems, on the other hand, return structured data from an [API](/docs/glossary/#api). Rather than merging templates and content to create HTML, a headless CMS returns JSON or unstyled XML. Content creators still use an editing interface to add content to a headless CMS, but the [backend](/docs/glossary#backend) management of the site's content is [_decoupled_](/docs/glossary#decoupled) from the [frontend](/docs/glossary#frontend) that displays it.
+
+When your content is available as structured data, it's available to any client or application that can consume that data whether a [JAMStack](/docs/glossary/jamstack) application, or a mobile device. You can use a headless CMS to provide [JSON content source](/docs/sourcing-content-from-json-or-yaml/) for your Gatsby site and your other content channels.
+
+With plugins, Gatsby supports several [headless CMS](/docs/headless-cms/) services, including [Contentful](https://www.contentful.com/), [Ghost](https://ghost.org/pricing/) and [Prismic](https://prismic.io/). If you use WordPress, there's no need to switch. You can use WordPress' [REST API](/docs/sourcing-from-wordpress/) as a headless CMS, so that your content team can continue to use the editing tools with which they're familiar.
+
+## Learn More
+
+- [What is a Headless CMS and How to Source Content from One](/docs/headless-cms/), from the Gatsby docs
+- [3 Free Headless CMS's for Your Next Project](/blog/2019-10-15-free-headless-cms/), from the Gatsby blog
+- [Building Sites with Headless CMSs](/blog/2018-2-3-sites-with-headless-cms/#reach-skip-nav), also from Gatsby blog

www/src/data/sidebars/doc-links.yaml

@@ -723,6 +723,8 @@
       items:
         - title: GraphQL
           link: /docs/glossary/graphql
+        - title: Headless CMS
+          link: /docs/glossary/headless-cms/
         - title: JAMStack
           link: /docs/glossary/jamstack
         - title: Node.js