added RSS feed

Author: Kyle-Undefined

astro.config.mjs

@@ -14,6 +14,7 @@ export default defineConfig({
     },
     smartypants: false,
   },
+  trailingSlash: "never",
   build: {
     format: 'file',
   },
@@ -46,4 +47,8 @@ export default defineConfig({
       },
     }),
   ],
+  i18n: {
+    defaultLocale: "en",
+    locales: ["en"]
+  }
 });

package-lock.json

@@ -10,9 +10,12 @@
   },
   "dependencies": {
     "@astrojs/prism": "^3.3.0",
+    "@astrojs/rss": "^4.0.15",
     "@tailwindcss/vite": "^4.1.18",
     "astro": "^5.16.11",
     "astro-favicons": "^3.1.5",
+    "markdown-it": "^14.1.0",
+    "sanitize-html": "^2.17.0",
     "tailwindcss": "^4.1.18"
   },
   "devDependencies": {

package.json

@@ -18,9 +18,17 @@
     </nav>
 
     <div class="flex items-center gap-4">
+      <a href="/rss.xml" target="_blank" rel="noopener noreferrer" class="text-slate-500 hover:text-slate-900 dark:text-blog-text dark:hover:text-blog-accent transition-colors">
+        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-rss-icon lucide-rss">
+          <title>RSS</title>
+          <path d="M4 11a9 9 0 0 1 9 9"/>
+          <path d="M4 4a16 16 0 0 1 16 16"/>
+          <circle cx="5" cy="19" r="1"/>
+        </svg>
+      </a>
       <a href="https://github.com/kyle-undefined" target="_blank" rel="noopener noreferrer" class="text-slate-500 hover:text-slate-900 dark:text-blog-text dark:hover:text-blog-accent transition-colors">
         <span class="sr-only">GitHub</span>
-        <svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-external-link w-5 h-5 text-slate-400 hover:text-blog-proj-link dark:hover:text-blog-proj-link">
+        <svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-external-link w-5 h-5 text-slate-400 hover:text-blog-accent dark:hover:text-blog-accent">
           <title>GitHub</title>
           <path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/>
         </svg>

src/components/Header.astro

@@ -31,6 +31,9 @@ const { title, description = "Kyle Undefined.dev, just a dude who enjoys writing
 		<meta property="twitter:url" content={Astro.url} />
 		<meta property="twitter:title" content={title} />
 		<meta property="twitter:description" content={description} />
+
+		<!-- RSS -->
+		<link rel="alternate" type="application/rss+xml" title="kyleundefined.dev" href={new URL("rss.xml", Astro.site).href} />
 
 		<title>{title}</title>
 

src/layouts/Layout.astro

@@ -0,0 +1,34 @@
+import rss from '@astrojs/rss';
+import { getCollection } from 'astro:content';
+import sanitizeHtml from 'sanitize-html';
+import MarkdownIt from 'markdown-it';
+import { site, i18n } from 'astro:config/client';
+
+const blog = (await getCollection('blog')).sort((a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf());
+const parser = new MarkdownIt();
+
+export async function GET(context) {
+    return rss({
+        title: 'kyleundefined.dev',
+        description: 'Just a dude who enjoys writing code and learning;',
+        trailingSlash: false,
+        site: context.site,
+        customData: ([
+            `<language>${i18n.defaultLocale}</language>`,
+            `<atom:link href="${new URL('rss.xml', site).href}" rel="self" type="application/rss+xml" />`,
+        ]).join(''),
+        xmlns: {
+            atom: 'http://www.w3.org/2005/Atom',
+            content: 'http://purl.org/rss/1.0/modules/content/'
+        },
+        items: blog.map((post) => ({
+            title: post.data.title,
+            description: post.data.description,
+            link: `/blog/${post.slug}/`,
+            pubDate: post.data.pubDate,
+            content: sanitizeHtml(parser.render(post.body), {
+                allowedTags: sanitizeHtml.defaults.allowedTags.concat(['img'])
+            }),
+        })),
+    });
+}