astro
36 articles in this category.
Build a Comparison Page in Astro: Side-by-Side Content with Structured Schema
How to create a comparison page in Astro with Content Collections — schema design for two-product comparisons, winner display, verdict box, and a comparison table built with plain CSS.
Read →Build a Guide Page in Astro: Step-by-Step Content with Difficulty and Time Estimates
How to create a guide content type in Astro with difficulty badges, estimated reading time, and a structured step-by-step layout — using Content Collections and plain CSS.
Read →Cloudinary in Astro: External Image CDN for Content Sites That Scale
What Cloudinary is, how to use it in Astro, how URL-based transforms work, and when to switch from local images to an external CDN — with real examples from astro-content-lab.
Read →Images in Astro: How to Add, Optimize and Manage Local Images
How Astro handles images differently from WordPress — the Image component, heroImage in frontmatter, Markdown syntax vs MDX component, and a practical workflow for managing image files.
Read →MDX in Astro: Use Components Inside Your Content Without Touching Raw Code
What MDX is, how it differs from Markdown, how to install it in Astro, and why it changes what's possible inside a blog post — with real component examples.
Read →Build a Review Page in Astro: Schema, Layout and Components
How to create a structured review page in Astro with Content Collections — schema design, pros/cons display, rating stars, and a verdict box. With plain CSS and a promise of what's coming.
Read →Dynamic Routes in Astro: How One Template Generates Hundreds of Pages
How getStaticPaths works, what dynamic routes are, and how to build a blog listing page and detail page from Astro Content Collections.
Read →Writing Content with Markdown in Astro: What WordPress Developers Need to Know
How Markdown works in Astro, what frontmatter is, and why plain text content can feel cleaner than WordPress for developer-owned sites.
Read →Content Collections in Astro: The Right Way to Manage Structured Content
Why Content Collections exist, how to set them up with the modern Astro content API, and how Zod schema validation keeps content reliable.
Read →How to Deploy Astro to Vercel: GitHub, Auto-Deploy, and Custom Domains
Step-by-step guide to deploying a static Astro site to Vercel, connecting GitHub, understanding production and preview deployments, adding a custom domain, and troubleshooting failed builds.
Read →My First Two Days Learning Astro as a WordPress Developer
An honest two-day Astro learning diary from a WordPress developer, covering local development, VS Code, pages, layouts, and the real beginner mistakes that made the workflow finally click.
Read →Astro Pages, Layouts and Components: The First Three Concepts to Learn
How Astro's file-based routing, shared layouts, and reusable components work, explained for WordPress developers who think in themes, templates and shortcodes.
Read →Styling in Astro: Start with Plain CSS Before Reaching for Tailwind
How CSS works in Astro, including scoped styles, global CSS, CSS variables, and why a clean layout doesn't need a framework. With the actual CSS used to build this demo site.
Read →How to Set Up Your First Astro Project: A Step-by-Step Beginner Guide
Step-by-step Astro setup guide for beginners and WordPress developers, covering Node.js, Git, VS Code, localhost, GitHub, and common first-project mistakes.
Read →Static Site Generation Explained: How Astro Pre-Builds HTML
Learn how static site generation works, how Astro builds HTML before visitors arrive, and when SSG offers a simpler performance model than WordPress.
Read →What is Astro? A WordPress Developer's Honest Take
Astro explained by someone who spent 10+ years building WordPress sites. What Astro is, what it is not, when it beats WordPress, and when WordPress is still the better choice.
Read →A 100 Lighthouse Score Is Not an SEO Strategy
A 100 Lighthouse score is useful technical hygiene, but it is not an SEO strategy without search intent, content quality, authority, and internal links.
Read →Astro Lighthouse Scores Are Not Automatic
Astro Lighthouse scores are not automatic. Real production sites still need image optimization, gzip, font cleanup, delayed analytics, and accessibility fixes.
Read →Astro Lighthouse Optimization: How I Got to 100
Astro Lighthouse optimization case study: how I fixed gzip, Google Fonts, analytics, accessibility, and Sharp images to reach cleaner 98-100 Lighthouse scores.
Read →Remove Google Fonts from Astro? What I Learned
Should you remove Google Fonts from Astro? A practical font performance case study covering system fonts, CSS @import, preconnect, and display=swap tradeoffs.
Read →Serve Astro with Nginx: Production Settings
How to serve Astro with Nginx on a VPS: dist folder deploys, HTTPS redirects, try_files, gzip, cache headers, security headers, curl tests, and 404 pages.
Read →Astro Image Optimization with Sharp
Astro image optimization with Sharp: responsive WebP variants, srcset, lazy loading, hero priority, and automated build-time image generation for Lighthouse.
Read →JSON-LD Schema in Astro: Article, Review, Person, and Breadcrumbs
Build reusable JSON-LD schema in Astro for articles, reviews, authors, publishers, and breadcrumbs while avoiding hardcoded identity data.
Read →llms.txt in Astro: Auto-Generate It Without Pretending It Is SEO
Auto-generate llms.txt and llms-full.txt from Astro Content Collections while understanding the proposal's limits and lack of Google Search benefit.
Read →Sitemap and robots.txt in Astro: Package or Custom Route?
Build sitemap.xml and robots.txt in Astro, compare the official sitemap integration with a custom route, and use accurate content modification dates.
Read →Meta Tags and Open Graph in Astro: Build One Reusable SEO Component
Build an Astro SEO component for canonical URLs, meta descriptions, Open Graph, and social cards without hardcoding site-wide values.
Read →Tailwind CSS in Astro: Refactoring Every Page and Fixing What Breaks
Refactor Astro pages and components to Tailwind CSS v4, fix scoped-style leaks, handle generated Markdown, and avoid dynamic class build failures.
Read →How I Switched an Astro Site from Plain CSS to Tailwind v4
Install Tailwind CSS v4 in Astro, choose a safe migration strategy, and refactor global styles and layouts using lessons from a real content site.
Read →Astro for WordPress Developers: When Static Sites Make More Sense
A practical Astro guide for WordPress developers who want to understand static site frameworks — what changes, what you gain, what you give up, and when the trade is worth making.
Read →WordPress vs Modern Stack: When to Use WordPress, Astro, Webflow, or Next.js
A practical guide to choosing between WordPress, Astro, Webflow, and Next.js — from a developer who has built with WordPress and Astro, and studied the others as practical alternatives.
Read →Where to Go From Here — What This Series Covered and What's Next
A recap of everything built in From Zero to VPS, honest reflection on what was hard, what surprised you, and where to go next depending on what you want to build.
Read →Astro vs Next.js: Which Framework Should You Use in 2026?
Practical comparison of Astro and Next.js for content sites and React apps. From a developer who builds with Astro in production and knows Next.js well enough to tell you when to use it instead.
Read →Best Hosting for Astro Sites in 2026: Tested Options for Every Budget
Where to host your Astro site, from free static hosting to VPS. A practical breakdown for developers who want fast, simple, low-cost deployments.
Read →When Should You NOT Use WordPress? A Developer's Honest Take
WordPress powers 43% of the web, but it is the wrong tool for plenty of projects. Here's when to skip it and what to use instead.
Read →Should You Migrate from WordPress to Astro?
A practical guide to deciding whether migrating your WordPress site to Astro makes sense — and what the process actually involves.
Read →WordPress vs Astro: Full Platform Comparison
A detailed head-to-head comparison of WordPress and Astro covering performance, CMS features, developer experience, and which to choose.
Read →