"This weekend I had some fun building a little Astro site for RSS aggregation. It works by the individual user defining a set of feeds they care about and works with a server-side Astro route to handle getting and parsing the feeds. Here's a quick example. On hitting the site, it notices you haven't defined any feeds and prompts you to do so:"
"The entire application really comes down to two routes. The first being just the home page, which is pretty slim: --- import BaseLayout from '../layouts/BaseLayout.astro'; --- <BaseLayout pageTitle="Your Feeds"> <div id="content"> </div> <dialog id="manageFeedsDialog"> <button autofocus style="float: right;margin-bottom: 15px">Close</button> <table id="feedsTableDialog"> <thead> <tr> <th>Feed URL</th> <th>Actions</th> </tr> </thead> <tbody> </tbody> </table> <p> <input type="url" id="feedUrl" placeholder="Enter Feed URL" /> <button id="addFeedButton">Add Feed</button> </p> </dialog> <script src="/app.js" is:inline></script> </BaseLayout>"
The project is an Astro-based RSS aggregator where each user defines feeds and a server-side Astro route fetches and parses them. The UI prompts users who have no feeds, and a Manage Feeds dialog built with the native dialog element allows adding and deleting feed URLs. The server-side handler retrieves and parses feeds, mixes items together, and returns them sorted by date. Simple.css provides a simple, clean style. The site uses a BaseLayout wrapper for HTML scaffolding and a small home route plus client-side app.js to handle dialog interactions and feed management.
Read at Raymondcamden
Unable to calculate read time
Collection
[
|
...
]