eleventy-rss-reader
eleventy-rss-reader copied to clipboard
5t3ph
Create a personal RSS Reader using Eleventy. Review recordings to learn how it was built!
Eleventy RSS Reader Starter
We built most of this project LIVE over on Twitch. Visit the announcement post to learn more.
This repo is now ready as an Eleventy starter! Review the recordings and customization section below to learn more about how it was built and how it works.
Subscribe to my newsletter to receive my weekly streaming schedule (and other news about my various projects + CSS tips).
Available Recordings
Final edited recordings will eventually be published to the 11ty Rocks YouTube Channel
📺 = moved to YouTube
- 📺 Project intro and creating the feature list
- 📺 Begin the 11ty architecture + add feedparser
- 📺 Reorganize, adjust feed output, and create dynamic views
- 📺 Enable method to determine "new", link views
- 📺 Filters and templating
- Part one of CSS styling
- Part two of CSS styling
Note that additional styling and further organization was completed outside of the streams to get the starter fully release-ready. Check the commit history if you're interested in the difference between streamed dev and post-stream dev.
Customization
Site Title
Edit src/_data/meta.js to update the siteTitle value.
Colors
Update the CSS custom properties values within src/sass/_theme.scss to quickly retheme the app.
RSS Sources
Modify, add, or remove the JSON files within src/feeds/ following the schema of:
{
"category": "Category Name",
"items": ["https://permalink.to/feed"]
}
Development Scripts
npm start
Run 11ty with hot reload at localhost:8080, including reload based on Sass changes
npm run build
Production build includes minified, autoprefixed CSS
Use this as the "Publish command" if needed by hosting such as Netlify.
Resources to extend this and learn 11ty
New to Eleventy? Get started with my written tutorial for beginners
Learn to build an 11ty site in 20 mins with my egghead video course and see how to add a blog and custom data.
Explore advanced setup of custom data through my tutorial on building a community site
Even more resources are available from 11ty.Rocks
5t3ph