Add RSS feed (#41)

* Initial plan

* Add RSS feed for blog posts

Co-authored-by: garrytrinder <11563347+garrytrinder@users.noreply.github.com>

* Add RSS feed icon to navigation bar

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: garrytrinder <11563347+garrytrinder@users.noreply.github.com>
Co-authored-by: Garry Trinder <garry@trinder365.co.uk>

Author: Copilot

package-lock.json

@@ -10,6 +10,7 @@
     "astro": "astro"
   },
   "dependencies": {
+    "@astrojs/rss": "^4.0.15",
     "@tailwindcss/vite": "^4.1.18",
     "astro": "^5.17.2",
     "tailwindcss": "^4.1.18"

package.json

@@ -21,6 +21,7 @@ const ogImage = image ? new URL(image, Astro.site ?? 'https://devproxy.net').hre
     <meta name="description" content={description} />
     <meta name="generator" content={Astro.generator} />
     <title>{title} | Dev Proxy</title>
+    <link rel="alternate" type="application/rss+xml" title="Dev Proxy Blog" href={`${import.meta.env.BASE_URL}rss.xml`} />
 
     <!-- Open Graph -->
     <meta property="og:type" content="website" />
@@ -65,6 +66,11 @@ const ogImage = image ? new URL(image, Astro.site ?? 'https://devproxy.net').hre
                 <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
               </svg>
             </a>
+            <a href={`${import.meta.env.BASE_URL}rss.xml`} class="hover:text-purple-400 transition-colors" style="color: var(--text-muted);" title="RSS Feed" aria-label="RSS Feed">
+              <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path d="M6.18 15.64a2.18 2.18 0 012.18 2.18C8.36 19.01 7.37 20 6.18 20 5 20 4 19.01 4 17.82a2.18 2.18 0 012.18-2.18M4 4.44A15.56 15.56 0 0119.56 20h-2.83A12.73 12.73 0 004 7.27V4.44m0 5.66a9.9 9.9 0 019.9 9.9h-2.83A7.07 7.07 0 004 12.93V10.1z" />
+              </svg>
+            </a>
             <button id="theme-toggle" class="hover:text-purple-400 transition-colors cursor-pointer" style="color: var(--text-muted);" title="Toggle theme" aria-label="Toggle theme" type="button">
               <svg id="theme-icon-sun" class="w-5 h-5 hidden" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                 <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" />
@@ -83,6 +89,11 @@ const ogImage = image ? new URL(image, Astro.site ?? 'https://devproxy.net').hre
               <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" />
             </svg>
           </a>
+          <a href={`${import.meta.env.BASE_URL}rss.xml`} class="hover:text-purple-400 transition-colors" style="color: var(--text-muted);" title="RSS Feed" aria-label="RSS Feed">
+            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+              <path d="M6.18 15.64a2.18 2.18 0 012.18 2.18C8.36 19.01 7.37 20 6.18 20 5 20 4 19.01 4 17.82a2.18 2.18 0 012.18-2.18M4 4.44A15.56 15.56 0 0119.56 20h-2.83A12.73 12.73 0 004 7.27V4.44m0 5.66a9.9 9.9 0 019.9 9.9h-2.83A7.07 7.07 0 004 12.93V10.1z" />
+            </svg>
+          </a>
           <button id="theme-toggle-mobile" class="hover:text-purple-400 transition-colors cursor-pointer" style="color: var(--text-muted);" title="Toggle theme" aria-label="Toggle theme" type="button">
             <svg id="theme-icon-sun-mobile" class="w-5 h-5 hidden" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
               <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" />

src/layouts/Layout.astro

@@ -0,0 +1,22 @@
+import rss from '@astrojs/rss';
+import { getCollection } from 'astro:content';
+import type { APIContext } from 'astro';
+
+export async function GET(context: APIContext) {
+  const posts = (await getCollection('blog')).sort(
+    (a, b) => b.data.date.valueOf() - a.data.date.valueOf()
+  );
+
+  return rss({
+    title: 'Dev Proxy Blog',
+    description: 'Release announcements, how-to guides, and insights from the Dev Proxy team.',
+    site: context.site?.href ?? 'https://devproxy.net',
+    items: posts.map((post) => ({
+      title: post.data.title,
+      description: post.data.description,
+      pubDate: post.data.date,
+      author: post.data.author,
+      link: `${import.meta.env.BASE_URL}blog/${post.id.replace(/\.md$/, '')}/`,
+    })),
+  });
+}