decreased rss feed size, improved sitemap

components/CustomHead.tsx

@@ -1,9 +1,9 @@
-import { ReactElement } from 'react';
-import Head from 'next/head';
-import { useRouter } from 'next/router';
+import METADATA, { IMetadata, generateTitle } from '../constants/metadata';
 
-import METADATA, { generateTitle, IMetadata } from '../constants/metadata';
+import Head from 'next/head';
+import { ReactElement } from 'react';
 import { isLocal } from '..//utils/links';
+import { useRouter } from 'next/router';
 
 interface Props {
   title?: string;
@@ -15,6 +15,7 @@ export default function CustomHead(props: Props): ReactElement {
   const { title, metadata } = props;
   const pageTitle = generateTitle(title);
   const pageUrl = `${METADATA.HOST_URL}${router.asPath}`;
+  const canonicalUrl = metadata?.CANONICAL_URL ?? pageUrl;
 
   const imageALT = metadata?.OG_IMAGE?.ALT ?? METADATA.OG_IMAGE.ALT;
   let imageWidth = metadata?.OG_IMAGE?.WIDTH ?? METADATA.OG_IMAGE.WIDTH;
@@ -203,7 +204,7 @@ export default function CustomHead(props: Props): ReactElement {
         content={METADATA.THEME_COLOR}
       />
       {renderTags}
-      <link key="canonical" rel="canonical" href={pageUrl} />
+      <link key="canonical" rel="canonical" href={canonicalUrl} />
       <link
         key="image/png32x32"
         rel="icon"

constants/metadata.tsx

@@ -3,6 +3,7 @@ import { titleCase } from '../utils/text';
 export interface IMetadata {
   DESCRIPTION: string;
   TYPE?: string;
+  CANONICAL_URL?: string;
   OG_IMAGE?: {
     URL: string;
     WIDTH: number;

pages/api/sitemap.ts

@@ -1,11 +1,12 @@
-import { NextApiRequest, NextApiResponse } from 'next';
-import getConfig from 'next/config';
-import { readdirSync } from 'fs';
-
 import { CMS, METADATA, NAVIGATION } from '../../constants';
+import { NextApiRequest, NextApiResponse } from 'next';
+
 import { CmsApi } from '../../services/cms';
-import { isLocal } from '../../utils/links';
+import { IPost } from '../../types/cms';
 import { SideMenuItem } from '../../state/navigation';
+import getConfig from 'next/config';
+import { isLocal } from '../../utils/links';
+import { readdirSync } from 'fs';
 
 interface IRedirection {
   source: string;
@@ -39,6 +40,7 @@ export default async function handler(
         'faq.tsx',
         'api',
         'tag',
+        'preview',
       ].includes(page);
     })
     .map(pagePath => {
@@ -68,10 +70,23 @@ export default async function handler(
     },
   );
 
-  const {
-    entries: _blogPages,
-    total: totalBlogPages,
-  } = await cms.fetchBlogEntries();
+  const _blogPages: IPost[] = [];
+  let currentPage = 1;
+  let foundAllPosts = false;
+
+  // Contentful only allows 100 at a time
+  while (!foundAllPosts) {
+    const { entries: _posts } = await cms.fetchBlogEntries(100, currentPage);
+
+    if (_posts.length === 0) {
+      foundAllPosts = true;
+      continue;
+    }
+
+    _blogPages.push(..._posts);
+    currentPage++;
+  }
+
   const blogPages = _blogPages.map(page => {
     return {
       url: `${baseUrl}/blog/${page.slug}`,
@@ -80,22 +95,19 @@ export default async function handler(
   });
 
   const bloglistPages = [];
+  const totalBlogPages = currentPage + 1;
+
   for (let i = 1; i <= totalBlogPages; i++) {
     bloglistPages.push(`${baseUrl}/blog/${i}`);
   }
 
-  const tags = await cms.fetchTagList();
-  const taglistPages = [];
-  for (const tag of Object.keys(tags)) {
-    const { entries, total } = await cms.fetchBlogEntriesByTag(tag);
-    const pageCount = Math.ceil(total / CMS.BLOG_RESULTS_PER_PAGE);
-    const _pages = [];
+  const devUpdateUrl = `${baseUrl}/tag/dev-update`;
+  const { entries, total } = await cms.fetchBlogEntriesByTag('dev-update');
+  const pageCount = Math.ceil(total / CMS.BLOG_RESULTS_PER_PAGE);
+  const devUpdatePages = [devUpdateUrl];
 
-    for (let i = 1; i <= pageCount; i++) {
-      _pages.push(`${baseUrl}/tag/${tag}/${i}`);
-    }
-
-    taglistPages.push(..._pages);
+  for (let i = 1; i <= pageCount; i++) {
+    devUpdatePages.push(`${devUpdateUrl}/${i}`);
   }
 
   const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
@@ -105,7 +117,7 @@ export default async function handler(
         ...navigationPages,
         ...redirectPages,
         ...bloglistPages,
-        ...taglistPages,
+        ...devUpdatePages,
       ]
         .map(url => {
           return `

pages/blog/[[...page]].tsx

@@ -47,6 +47,7 @@ export default function Blog(props: Props): ReactElement {
         metadata={{
           TYPE: METADATA.BLOG_PAGE.TYPE,
           DESCRIPTION: METADATA.BLOG_PAGE.DESCRIPTION,
+          CANONICAL_URL: `${METADATA.HOST_URL}/blog`,
           OG_IMAGE: {
             URL: featuredPost?.featureImage.imageUrl ?? METADATA.OG_IMAGE.URL,
             WIDTH:

pages/index.tsx

@@ -1,12 +1,10 @@
 import { GetStaticProps, GetStaticPropsContext } from 'next';
 
-import { IPost } from '../types/cms';
 import { CMS } from '../constants';
 import { CmsApi } from '../services/cms';
-import generateRSSFeed from '../utils/rss';
-
 import { HomeHero } from '../components/HomeHero';
-import { HomeHeroBubble } from '../components/HomeHeroBubble';
+import { IPost } from '../types/cms';
+import generateRSSFeed from '../utils/rss';
 
 export default function Index() {
   return (

pages/tag/[...slug].tsx

@@ -48,6 +48,7 @@ export default function Tag(props: Props): ReactElement {
         metadata={{
           TYPE: METADATA.TAG_PAGE.TYPE,
           DESCRIPTION: METADATA.TAG_PAGE.DESCRIPTION,
+          CANONICAL_URL: `${METADATA.HOST_URL}/tag`,
           OG_IMAGE: {
             URL: posts[0]?.featureImage.imageUrl ?? METADATA.OG_IMAGE.URL,
             WIDTH:

utils/rss.ts

@@ -1,6 +1,6 @@
-import { Feed } from 'feed';
 import { mkdirSync, writeFileSync } from 'fs';
-import { documentToHtmlString } from '@contentful/rich-text-html-renderer';
+
+import { Feed } from 'feed';
 import { IPost } from '../types/cms';
 import { METADATA } from '../constants';
 
@@ -9,7 +9,7 @@ const date = new Date();
 const feed = new Feed({
   title: METADATA.TITLE,
   description: METADATA.DESCRIPTION,
-  id: baseUrl,
+  id: `${baseUrl}/`,
   link: baseUrl,
   language: 'en', // optional, used only in RSS 2.0, possible values: http://www.w3.org/TR/REC-html40/struct/dirlang.html#langcodes
   image: `${baseUrl}/android-chrome-192x192.png`,
@@ -30,12 +30,14 @@ METADATA.TAGS.forEach(tag => {
 
 export default function generateRSSFeed(posts: IPost[]) {
   posts.forEach(post => {
+    const postLink = `${baseUrl}/blog/${post.slug}`;
+    const postContent = `<p>${post.description}</p><p><a href="${postLink}">Read more</a></p>`;
     feed.addItem({
       title: post.title,
-      id: post.id,
-      link: `${baseUrl}/blog/${post.slug}`,
+      id: postLink,
+      link: postLink,
       description: post.description,
-      content: documentToHtmlString(post.body),
+      content: postContent,
       date: new Date(post.publishedDate),
     });
   });