feat: 🌐 add schema org for blog post

Author: kitos

src/components/seo.js

@@ -55,7 +55,16 @@ let SEO = ({ title, isBlogPost, schemaOrgItems = () => [] }) => (
 
           {/* Schema.org tags */}
           <script type="application/ld+json">
-            {JSON.stringify([baseSchema, ...schemaOrgItems({ url })])}
+            {JSON.stringify([
+              baseSchema,
+              ...schemaOrgItems({
+                url,
+                author: {
+                  '@type': 'Person',
+                  name: 'Nikita Kirsanov',
+                },
+              }),
+            ])}
           </script>
         </Helmet>
       )

src/pages/portfolio.js

@@ -13,7 +13,7 @@ let formatDate = format('MMMM, yyyy')
 let isMobile =
   typeof window !== 'undefined' && typeof window.orientation !== 'undefined'
 
-let buildSchemaOrg = projects => () => [
+let buildSchemaOrg = projects => ({ author }) => [
   {
     '@context': 'http://schema.org',
     '@type': 'CollectionPage',
@@ -22,26 +22,19 @@ let buildSchemaOrg = projects => () => [
       name: 'Projects',
       itemListOrder: 'http://schema.org/ItemListOrderDescending',
       itemListElement: projects.map(
-        ({ name, url, description, technologies, customer }) => {
-          let author = {
-            '@type': 'Person',
-            name: 'Nikita Kirsanov',
-          }
-
-          return {
-            '@type': url ? 'WebSite' : 'CreativeWork',
-            name,
-            url: url || undefined,
-            description: description || undefined,
-            author,
-            creator: author,
-            keywords: technologies.join(','),
-            funder: {
-              '@type': 'Organization',
-              name: customer,
-            },
-          }
-        }
+        ({ name, url, description, technologies, customer }) => ({
+          '@type': url ? 'WebSite' : 'CreativeWork',
+          name,
+          url: url || undefined,
+          description: description || undefined,
+          author,
+          creator: author,
+          keywords: technologies.join(','),
+          funder: {
+            '@type': 'Organization',
+            name: customer,
+          },
+        })
       ),
     },
   },

src/templates/blog-post.js

@@ -4,15 +4,36 @@ import { differenceInWeeks, format } from 'date-fns/fp'
 import { Box, Flex } from '@rebass/grid'
 
 import Tag from '../components/tag'
+import SEO from '../components/seo'
 
 let formatDate = format('MMMM dd, yyyy')
 
+let buildSchemaOrg = ({ title, createdAt, updatedAt, tags }) => ({
+  author,
+}) => [
+  {
+    '@context': 'http://schema.org',
+    '@type': 'BlogPosting',
+    dateModified: updatedAt,
+    datePublished: createdAt,
+    headline: title,
+    keywords: tags.join(', '),
+    author,
+  },
+]
+
 let BlogPost = ({
   data: {
     post: { title, createdAt, updatedAt, tags, content },
   },
 }) => (
   <>
+    <SEO
+      title={title}
+      isBlogPost
+      schemaOrgItems={buildSchemaOrg({ title, createdAt, updatedAt, tags })}
+    />
+
     <h1>{title}</h1>
 
     <small>{formatDate(createdAt)}</small>