feat(gatsby-recipes): Add Gatsby react helmet recipe (#23495)

* feat(gatsby-recipes): Add Gatsby react helmet recipe

* Adding react-helmet

* Update gatsby-plugin-react-helmet.mdx

Co-authored-by: Kyle Mathews <mathews.kyle@gmail.com>

packages/gatsby-recipes/recipes/gatsby-plugin-react-helmet.mdx

@@ -0,0 +1,41 @@
+# Setup React Helmet
+
+React Helmet is a reusable React component will manage all of your changes to the document head.
+
+Helmet takes plain HTML tags and outputs plain HTML tags. It's dead simple, and React beginner friendly.
+
+[gatsby-plugin-helmet](https://www.gatsbyjs.org/packages/gatsby-plugin-react-helmet/?=react%20helmet) makes it easy to use React Helmet inside Gatsby projects as it automatically adds title and meta tags to the HTML during SSR.
+
+---
+
+Install necessary NPM packages
+
+<NPMPackage name="gatsby-plugin-react-helmet" />
+<NPMPackage name="react-helmet" />
+
+---
+
+Install the React Helmet plugin in gatsby-config.js
+
+<GatsbyPlugin name="gatsby-plugin-react-helmet" />
+
+---
+
+Great, now it's ready to go!
+
+It's also common to have a `<SEO>` component which helps ensure pages have the necessary title and meta tags.
+
+We'll write out one now.
+
+<File
+  path="src/components/seo.js"
+  content="https://gist.githubusercontent.com/devrchancay/72e6958a16cffb5dd549b831f903955a/raw/6abf03138eb342d532ebbeafb8493cc0b9482b1b/Seo.js"
+/>
+
+---
+
+Read more about Gatsby React Helmet here:
+https://www.gatsbyjs.org/packages/gatsby-plugin-react-helmet
+
+You can also read about the "SEO" component here:
+https://www.gatsbyjs.org/docs/add-seo-component/