simonplend / simonplend.com-poc

Astro proof-of-concept for simonplend.com

TODO

• Backwards plan launching a new version of simonplend.com
  • Migrate existing blog posts
    • Get URLs from https://simonplend.com/sitemap_index.xml
  • Set up 301 redirects for old URLs
  • What are good ways to avoid losing Google juice?

Features

Required features

• Deploy to Netlify
• Support for MDX so I can embed components
• Automatic jump links/table of contents from headings
• Code syntax highlighting
  • Built in to Astro
• [~] Support for Open Graph images and description
  • Check how it's set up in this theme
• ConvertKit form integration
• [~] Post tags and tag pages
  • Tidy up the layout
• Embed YouTube videos
• Embed Vimeo videos
  • Getting a 404 response from Vimeo (oEmbed)
  • https://developer.vimeo.com/api/oembed/videos
• [~] RSS feed
  • Check what's currently being generated for simonplend.com
    • https://simonplend.com/feed/ - includes full posts
  • Check what's being generated by this Astro site
  • Docs: https://docs.astro.build/en/guides/rss/
• [~] Sitemap
• Add a Creative Commons license
  • https://creativecommons.org/licenses/by/4.0/
  • 
    This work is licensed under a Creative Commons Attribution 4.0 International License.
• Add site analytics with Plausible
  • Copy and paste in their script tag
  • Only render in production build

Nice to have features

• Add IndieWeb features
  • Web mentions
  • What else?!
• Links to Edit page [on GitHub]
• Page Last updated
• Page version history
  • Generate automatically from git log?
• Heading anchors
• Automatically convert headers to links
• Show a # to the left on hover or focus
• Dynamically generate Open Graph images
  • Try out Vercel's OG library
• Estimated post reading time
  • Is this helpful?
• Support for line highlighting in code blocks
  • shikijs/shiki#259
  • withastro/astro#2587
• Site search
• Light mode / Dark mode
• Easy to embed StackBlitz

Blog inspiration

• https://ted.dev/
• https://daveceddia.com/

Astro blog templates

• Astro Starter Kit: Blog
• Charca/astro-blog-template
• AstroPaper

Astro integrations

Site structure

• @astrojs/sitemap
• Astro SEO - Meta and Open Graph tags
• astro-robots-txt
• @astrojs/image
• @astrojs/prefetch

Content

• astro-icon
• Astro ImageTools
• @astro-community/astro-embed-youtube
• @astro-community/astro-embed-vimeo

Markdown plugins

• Astro uses remark-gfm and remark-smartypants by default
• remark plugins
• rehype plugins
• remark-toc - Table of contents
• rehype-accessible-emojis - Not sure if it's for MDX only?
• markdown-it-anchor