add rss and webring it

app/feed.xml/route.ts

@@ -0,0 +1,47 @@
+import RSS from "rss";
+import { getAllPosts } from "../../lib/api";
+
+export async function GET() {
+  const feed = new RSS({
+    title: "Eh I Could Eat",
+    description:
+      "Jacob Aronoff's food blog, recording what I eat and what I make.",
+    generator: "RSS for Node and Next.js",
+    feed_url: "https://ehicouldeat.com/feed.xml",
+    site_url: "https://ehicouldeat.com/",
+    managingEditor: "[email protected] (Jacob Aronoff)",
+    webMaster: "[email protected] (Jacob Aronoff)",
+    copyright: `Copyright ${new Date().getFullYear().toString()}, Jacob Aronoff`,
+    language: "en-US",
+    pubDate: new Date().toUTCString(),
+    ttl: 60,
+  });
+
+  const allPosts = getAllPosts([
+    "title",
+    "date",
+    "excerpt",
+    "coverImage",
+    "slug",
+    "rating",
+  ]);
+
+  if (allPosts) {
+    allPosts.map((post) => {
+      feed.item({
+        title: post.title,
+        description: post.description,
+        url: `https://ehicouldeat.com/posts/${post.slug}`,
+        categories: post.tags || [],
+        author: "Jacob Aronoff",
+        date: post.date,
+      });
+    });
+  }
+
+  return new Response(feed.xml({ indent: true }), {
+    headers: {
+      "Content-Type": "application/xml; charset=utf-8",
+    },
+  });
+}

app/globals.css

@@ -1,3 +1,50 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+.blogs {
+    margin: 0 0 15px 0;
+    list-style: none;
+    padding: 0;
+}
+
+.blog {
+    display: flex;
+    margin-bottom: 5px;
+}
+
+.blog--meta {
+    font-size: 0.75em;
+}
+
+.blog--text {
+    max-width: 100%;
+}
+
+.blog--title {
+    display: block;
+    font-size: 1.2em;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    width: 100%;
+
+    @include on-mobile {
+        font-size: 1em;
+        text-overflow: inherit;
+        white-space: inherit;
+        overflow: auto;
+    }
+}
+
+.blog--emoji {
+    display: flex;
+    margin-right: 15px;
+    align-items: center;
+    font-size: 1.5em;
+}
+
+.blog--description {
+    color: $color-dark;
+    font-size: 0.75em;
+}

app/webring/page.tsx

@@ -0,0 +1,82 @@
+type Blog = {
+  name: string;
+  year: number;
+  url: string;
+  emoji: string;
+  description: string;
+};
+
+export default function Webring() {
+  const ring: [Blog] = [
+    {
+      name: "Steve Gattuso",
+      year: 2013,
+      url: "https://www.stevegattuso.me",
+      rss_url: "https://www.stevegattuso.me/feed.xml",
+      emoji: "💌",
+      description:
+        "My blog and personal wiki. Step right up for thoughts on programming, vegan cooking, urbanism, and whatever else pops into my mind.",
+    },
+    {
+      name: "Ray Berger",
+      rss_url: "https://blog.rayberger.org/rss.xml",
+      year: 2018,
+      url: "https://www.rayberger.org/",
+      emoji: "🍔",
+    },
+    {
+      name: "Shy Ruparel",
+      year: 2014,
+      url: "https://shy.dev",
+      emoji: "🫗",
+    },
+    {
+      name: "Kevin Liao",
+      year: 2018,
+      url: "http://liaokev.in",
+      rss_url: "http://liaokev.in/feed.xml",
+      emoji: "🚌",
+      description:
+        "Personal blog. Rarely updated. Want it to be a space for thoughts on urbanism, Taiwan, language learning, and progressive Christian theology.",
+    },
+    {
+      name: "Jacob Aronoff",
+      year: 2017,
+      url: "https://ehicouldeat.com/",
+      emoji: "🥪",
+      description:
+        "Food blog where I talk about all the things I cook and eat. Tech blog with some random content at https://jaronoff.com/",
+    },
+  ];
+  /*
+
+  */
+
+  return (
+    <div className="container mx-auto px-5">
+      <h1 className="text-center text-3xl">Webring</h1>
+      <h2 className="text-center">
+        This is the hackNY webring. A list of blogs from hackNY alums
+      </h2>
+      <div className="h-12"></div>
+      <div className="grid grid-cols-1 gap-8 md:grid-cols-2 lg:gap-32">
+        <ul>
+          {ring.map((blog: Blog, index: number) => (
+            <li key={`blog-${index}`} className="blog">
+              <span className="blog--emoji">{blog.emoji}</span>
+              <div className="blog--text">
+                <a className="blog--title" href={blog.url} target="_blank">
+                  {blog.name}
+                </a>
+                <div className="blog--meta">
+                  by <a href={blog.url}>{blog.name}</a>
+                </div>
+                <div className="blog--description">{blog.description}</div>
+              </div>
+            </li>
+          ))}
+        </ul>
+      </div>
+    </div>
+  );
+}

components/Navbar.tsx

@@ -14,6 +14,9 @@ export default function Navbar() {
           <li>
             <NavLink href="/archive">Archives</NavLink>
           </li>
+          <li>
+            <NavLink href="/webring">Webring</NavLink>
+          </li>
           <li>
             <NavLink href="https://github.com/jaronoff97/icouldeat">
               Github

package.json

@@ -22,17 +22,19 @@
     "react": "^18",
     "react-dom": "^18",
     "remark": "^15.0.1",
-    "remark-html": "^16.0.1"
+    "remark-html": "^16.0.1",
+    "rss": "^1.2.2"
   },
   "devDependencies": {
-    "typescript": "^5",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
+    "@types/rss": "^0.0.32",
     "autoprefixer": "^10.0.1",
+    "eslint": "^8",
+    "eslint-config-next": "14.0.4",
     "postcss": "^8",
     "tailwindcss": "^3.3.0",
-    "eslint": "^8",
-    "eslint-config-next": "14.0.4"
+    "typescript": "^5"
   }
 }