Add RSS Feed

[swilgosz]

Overview

Implement automatic RSS feed generation.

Todo:

• Feedly should load content
• Ruby Land sources should not return error: http://rubyland.news/sources
• Publication date should be recognized properly
• The descriptions should be loaded properly.
• The feed thumbnail (feedly) should be properly recognized.

Useful links:

• https://www.drewbolles.com/blog/how-to-easily-add-an-rss-feed-to-a-nextjs-site-without-writing-xml-templates
• https://stackoverflow.com/questions/45854169/how-can-i-use-an-es6-import-in-node-js

Acceptance criteria:

We have 2 streams of content:

1. Episodes - official episodes, with YT videos
2. Stray - thoughts out of the main scope.

Write a RSS generator, that

• Loops through all content
• Merge two streams of content (articles and episodes)
• Sorts by FILE CREATION DATE (or if not possible, by ID from meta data)
• Generates RSS feed.
• Saves file in the public/rss.xml

NICE to have

• render the rss.xml file content under https://hanamimastery.com/rss (no extension) if possible

Dev notes

• Draft PR: #8
• Merge to the preview branch if you want to laung CI and see the deployment preview.
• Make sure URLS for episodes are: https://hanamimastery.com/episodes/<<SLUG>> and for stray articles: https://hanamimastery.com/articles/<<SLUG>>
• Make sure articles are ordered correctly. The newest article published is: https://hanamimastery.com/articles/hanami-architecture-explained, the previous one: https://hanamimastery.com/episodes/5-configure-anything-with-dry-configurable

[adamszwaba]

You're free to add any other fields, bulk of the stuff here is done in getRssData.

export async function getRssData() {
  const feed = new rss({
    title: "Hanami Mastery newest episodes!",
    description: "The best way to master Hanami ruby framework!",
    feed_url: "https://hanamimastery.com/rss.xml",
    site_url: "https://hanamimastery.com",
    image_url: "https://hanamimastery.com/logo-hm.jpeg",
    managingEditor: "Sebastian Wilgosz",
    webMaster: "Sebastian Wilgosz",
    copyright: "2021 Sebastian Wilgosz",
    language: "en",
    categories: ["Ruby", "Hanami", "Web development"],
    pubDate: new Date().toLocaleString(),
    ttl: "60",
  });

  const posts = await getAllFilesFrontMatter("stray");
  const episodes = await getAllFilesFrontMatter("episodes");
  const postsWithSlug = posts.map((item) => ({
    ...item,
    url: `https://hanamimastery.com/articles/${item.slug}`,
  }));
  const episodesWithSlug = episodes.map((item) => ({
    ...item,
    url: `https://hanamimastery.com/episodes/${item.slug}`,
  }));
  const items = postsWithSlug.concat(episodesWithSlug).sort((itemA, itemB) => {
    if (itemA.id > itemB.id) return -1;
    if (itemA.id < itemB.id) return 1;
    return 0;
  });
  items.map(({ author, tags, title, id, url }) => {
    feed.item({ author, title, categories: tags, guid: id, url });
  });
  return feed;
}

Regarding sorting via file creation date - it's always going to change. During deployment, will always be the same, since the repo is being built after having been downloaded onto Vercel's machines.

A good alternative - specify written_at or created_at in font matter and then sort by this. Let me know if you run into any issues, too - dealing with time and dates in js can be gruesome.

[swilgosz]

@adamszwaba here are some of the troubles I've noticed.

1. http://rubyland.news/sources - This rss reader has problems parsing my feed.

2. The content is not loaded (type HTML).
3. Feedly does not show the content, when you click the single episode.
4. Also, feedly shows ALL episodes, as published at the same time, currently 3h ago.

What I've noticed, is that all my strings/text is wrapped within the ![CDATA] blocks, which are basically comments ref

[swilgosz]

Closing for now, I'll open different issue for the RSS tweaks.