SEO-Friendly Blogging with Automatic Social Images
vibestacks now includes a complete blog system with dynamic OG image generation, proper metadata handling, and MDX support out of the box.
One of the most requested features is now live: a complete, SEO-optimized blog system that handles the tedious stuff automatically.
What's Included
MDX Support
Write posts in MDX. That's markdown with the ability to embed React components when you need them. Syntax highlighting, custom callouts, embedded demos. Whatever your content needs.
Automatic OG Images
Share a post on Twitter, LinkedIn, or Slack and get a properly branded preview image. No Figma. No Canva. No manual export per post.
The image pulls from your post's title, description, and author. Uses your brand colors and logo automatically.
Smart Related Posts
Every blog post automatically displays related articles based on shared tags and recency. No orphan pages. No manual "you might also like" curation.
Search engines penalize pages with poor internal linking. Tools like Ahrefs flag "1 incoming internal link" as an issue. vibestacks solves this by default. Every post links to relevant content automatically.
Proper Metadata
Every post gets the right meta tags for search engines and social platforms:
- Title and description
- Canonical URLs
- Open Graph tags
- Twitter card tags
- Author attribution
- Keywords from tags
All generated from your post's frontmatter. Write once, metadata everywhere.
SEO That Just Works
No plugins to configure. No checklist to follow. Sitemap generation, structured data (JSON-LD), proper heading hierarchy, image alt text, canonical URLs, 404 pages. All automatic. All updated at build time.
Run your site through Ahrefs or Screaming Frog. Zero issues out of the box.
Author Profiles
Add team members to a simple config. When they write posts, their name, avatar, and social links appear automatically. Both on the post and in the generated social image.
Tag Filtering
Readers can filter posts by tag. Clean URL structure (/blog?tag=Feature) that's bookmarkable and shareable.
Why This Matters
Blogging is one of the best ways to drive organic traffic to a SaaS. But setting up a proper blog system takes time:
- Configuring MDX processing
- Building the OG image generator
- Getting metadata right for SEO
- Designing the listing and post pages
- Adding author support
- Implementing filtering
- Setting up internal linking
- Sitemaps, structured data, alt text, canonicals...
Two weeks of work minimum to do it proper system (not AI generated sh*t). And that's if you've done it before.
Now it's just there. Write your first post and publish.
The Developer Experience
Creating a post:
- Add an MDX file to the content folder
- Fill in the frontmatter (title, description, date, tags, author)
- Write your content
- Deploy
That's it. Routing, metadata, social images, internal linking, styling. All handled.
Rebranding? Update the config file with your name, colors, and Twitter handle. Deploy. Every page, every social image, every meta tag updates automatically.
What's Next
What I'll be implementing soon:
- RSS feed generation
- View counts and analytics
- llms.txt for AI discoverability
As AI search grows (ChatGPT, Perplexity, Claude), sites need to be readable by LLMs, not just Google.
The goal is simple: you focus on writing content that brings in customers. The infrastructure stays out of your way.
Read more
Tailwind CSS v4: What Changed and Why It's Better
No more tailwind.config.ts. Tailwind v4 moves configuration to CSS, drops JavaScript, and ships 2x faster. Here's everything that changed.
Why We Use cn() and cva() for Component Styling
String concatenation for Tailwind classes is a mess. Here's how cn() and cva() make conditional styling clean, type-safe, and maintainable.
Stop Trusting process.env: Type-Safe Env Variables in Next.js
process.env fails silently and leaks secrets. Here's how t3-env catches missing env vars at build time, not production.