Skip to content

A simple, single page, blog written in vanilla js that supports markdown, rss, podcasts and deploys to github pages (github.io).

Notifications You must be signed in to change notification settings

qualityshepherd/splog

Repository files navigation

Deploy static content to Pages

SPLOG

a simple, static, single page blog that features:

DEMO: https://qualityshepherd.github.io/splog/

  • Markdown support for posts (with YAML metadata)
  • simple #hash routing
  • index searching
  • vanilla js!
  • a post indexer: src/lib/genr8.js (ie. no DB)
  • load more-style pagination
  • blog rss builder
  • podcast rss builder
  • blog posts with future dates are not displayed in lists (blog, search, tag, etc...) but ARE displayed by post. This allows drafts (set date to future) and/or setting posts to publish in the future. You'll still need to push a change for it to index (or cron the indexer?)

Setup

assumes Node and Git...

  1. clone: git clone git@github.com:qualityshepherd/splog.git
  2. cd splog
  3. install dependencies: npm i
  4. add your markdown posts to /posts folder
  5. edit the package.json splog section with your details
  6. npm start to build index, rss and pack it
  7. run web server (if needed): npm run server - http://lvh.me:4242/

Updating

when you add posts or make changes

  1. run npm start
  2. you may need to clear your browser cache to see changes

Customizing

  • edit package.json splog section to change:
    • pathToIndex - splog's flatfile db
    • pathToPostsFolder - where you keep your .md posts
    • maxPosts - the number of posts to display per "page"
  • edit index.html (but leave #main)
  • add/edit views/pages in src/views to render html (injected into #main)
  • adjust add news views to src/router.js
  • add posts written in Markdown (must have .md ext) to /posts
  • run npm start to publish new posts (creates new index and webpack in /dist) and builds rss.xml

Podcast RSS

a script that builds an apple/spotify compatible rss xml file that you can submit to all the aggregators

  1. open lib/podRss.js and edit the pod information to match your podcast
  2. npm run pod or npm start to build the xml file podRss.xml
  3. submit the link to the file (eg. https://mydomain.com/podRss.xml) to aggregatrors (eg. Spotify)

About

A simple, single page, blog written in vanilla js that supports markdown, rss, podcasts and deploys to github pages (github.io).

Topics

Resources

Stars

Watchers

Forks