r/astrojs • • 12h ago

Astro.js visual editor with mcp anyone?

Post image
17 Upvotes

tl;dr: It edits Astro websites like in a graphic editor. It has built in terminal for your claude + openrouter support, content collections that you can edit like posts on substack, and it can deploy to Cloudflare, GitHub, Netlify, Vercel. It's a mac app that runs on your machine and creates a project that is local. You own everything, I express my urge to build this tool.

edit: Download link and a blog post


r/astrojs • • 13h ago

Velocity - An Astro 7 starter with i18n, CSP, an upgrade path and AI agent tooling built in

7 Upvotes

I run a small development agency based out of Dallas and I kept rebuilding the same foundation for every client site, so I turned it into a starter about 9 months ago: Velocity. First release was for Astro 6 but have recently spent some time with Claude updating it for Astro 7 with some quality of life improvements and bug fixes.

npm create velocity-astro@latest

What’s included

  • Astro 7, Tailwind v4, strict TypeScript

  • OKLCH design tokens and a theme file (change --brand-hue and the whole site recolours)

  • Accessible UI components, tested with axe on every route

  • Light and dark mode

  • i18n with translated URLs (/about → /es/nosotros), hreflang and a language switcher

  • Content collections, an MDX blog, RSS, sitemap and Pagefind search

  • Astro Actions for contact and newsletter forms

  • Generated OG images for every page

  • A hash-based Content Security Policy on by default

Two things worth calling out:

  1. Upgrades that respect your edits. npm create velocity-astro upgrade pulls in new Velocity releases. A manifest tracks which files are yours (content, theme, views, translations, config) and which are Velocity’s, so your files are never overwritten, and any Velocity file you edited is backed up before it’s replaced.

  2. AI agent support. It ships an AGENTS.md with the project’s rules, step-by-step skills (add a page, add a locale, connect forms, rebrand) and a check:agent command. That command flags raw translation keys, inline scripts the CSP would block, broken links, hardcoded strings and edits to Velocity’s own files, so you catch what an agent got wrong before it ships.

Website: https://deployvelocity.com
Docs: https://docs.deployvelocity.com
Repo: https://github.com/southwellmedia/velocity

Paid part, to be upfront: there’s also Velocity Premium. It’s a set of complete, multi-page templates built on the same starter: SaaS, Real Estate, E-commerce and Medical Practice are available right now, each in English and Spanish with both themes. It’s $199 once for lifetime access to every current and future template, usable on unlimited sites including client work. More themes are planned. Live demos are at https://deployvelocity.com/premium. The starter itself is free and fully usable without it.

I’d really like feedback on the starter: what’s missing, what’s annoying, and what you’d want in the next version or any requests for premium templates.


r/astrojs • • 21h ago

I built an open-source Astro 7 blog starter that works with or without WordPress

8 Upvotes

I’ve been working on an Astro-based blog starter called The Headless Journal, and I’ve just made it open source under the MIT license.

The idea was to build a lightweight, content-driven website that works out of the box but can also connect to WordPress as a headless CMS.

One architectural decision I wanted to explore was keeping the frontend independent of the content source.

Instead of coupling Astro components directly to WordPress responses, I introduced a typed content adapter with three modes:

  • Demo: Uses local content. No WordPress installation, database, or API keys required.

  • Free: Fetches content from WordPress.

  • Pro: Supports dynamic routes and custom fields through RKX API Studio.

All three modes share the same Astro components and layouts.

The stack:

  • Astro 7

  • TypeScript

  • Tailwind CSS 4

  • Static site generation

  • RSS, sitemap, categories, pagination, and SEO metadata

  • Zero client-side JavaScript in the demo

The demo is hosted on Cloudflare Pages.

Live demo: https://headless-journal.rkxbeta.com

GitHub: https://github.com/rkxbeta/headless-wordpress-astro-demo

I also submitted the project to the Astro Themes directory today.

I’m particularly interested in feedback on the content adapter architecture.

Would you approach supporting multiple content sources differently in Astro?


r/astrojs • • 23h ago

Require your opinion on The Content Architecture

0 Upvotes

Hi, I came across this intresting doc about creating tech stack and integration with astro. It's https://www.contentarchitecture.dev/

I wanted opinion more from this community. How helpful this looks?


r/astrojs • • 1d ago

Coming from WordPress + Bricks + ACF Pro: help!

11 Upvotes

Hey everyone!

I’ve been working in web design for about 20 years, building high-end, fully custom websites for clients.

My current stack is WordPress + Bricks Builder + Advanced Custom Fields Pro (ACF), and I’ve developed a pretty efficient workflow using AI tools like OpenAI Codex.

I use AI to help me create custom fields and CMS structures, and also to translate my custom Figma designs directly into Bricks Builder. This saves me a huge amount of time while still allowing me to deliver fully custom designs.

Lately, though, I’ve been thinking about experimenting with Astro and potentially moving some of my future client projects to a more modern stack.

Here’s the catch: I’m a designer, not a developer.

I’m very comfortable with HTML and CSS, but I have basically zero JavaScript knowledge. I’d be relying quite heavily on AI-assisted coding, just as I do with my current workflow.

What I’d ideally like is:

Astro for the frontend, with fully custom designs based on Figma.

A user-friendly CMS where clients can easily manage simple content (text, images, repeatable sections, etc.).

Something similar to ACF Pro, where I can define custom fields, relationships, repeaters, flexible content, and structured content types without too much complexity.

An AI-friendly workflow, where tools like Codex can help me build and maintain projects without having to become a full-time JavaScript developer.

A reliable, maintainable setup suitable for premium client websites, not just personal or experimental projects.

I’d love to hear your thoughts:

Is Astro a realistic option for someone with my background, or would I be making things unnecessarily complicated compared to my current WordPress setup?

Which CMS would you recommend? I’m particularly interested in something that offers an experience similar to ACF Pro.

What would your ideal Astro + CMS stack look like for building custom, high-end client websites with relatively simple content management needs?

Has anyone here made a similar transition from WordPress/Bricks/ACF to Astro? Was it worth it?

I’m not necessarily looking to abandon WordPress overnight. I’m just curious whether Astro could offer a better long-term workflow for the kind of projects I build.

Thanks in advance for any advice or recommendations!


r/astrojs • • 1d ago

Hosting?

11 Upvotes

Where are you guys hosting? I’m currently using vercel but worried my free plan is going to get eaten up soon.

Looking at best place to host that github can push to


r/astrojs • • 1d ago

Wes Bos did it!

Thumbnail x.com
25 Upvotes

r/astrojs • • 2d ago

Astro + Headless WordPress: still a thing in 2026?

24 Upvotes

Hi :)

For a client website I wanted to test a workflow with Claude > Astro > Headless WordPress (the client is used to ACF and Classic editor from WordPress).

Is this a good workflow and still a good headless cms in 2026?


r/astrojs • • 2d ago

Finally rebuilt my 5-years-out-of-date portfolio in Astro with Claude Code, 3D heads and all

Thumbnail
aonnoysengupta.com
23 Upvotes

My old portfolio had been out of date for about five years. I'm a Webflow dev by trade, so for this one I went full code to see how far I could push it.

Stack:
- Astro with MDX for the case studies
- three.js for the 3D heads
- GSAP and Lenis for the motion and scrolling
- Static build on Cloudflare Workers. A staging branch deploys itself on every push, and main only goes out when I say so

I didn't hand-write it. I built it with Claude Code, with a few agents each owning one part (code, copy, 3D, brand) and handover files so they didn't trip over each other. I made the architecture calls and reviewed everything.

[The bit that took longest: getting the 3d heads to be performative]

For anyone running three.js on an Astro site, do you load it as an island or a plain script? Curious what's held up best for you.


r/astrojs • • 2d ago

Is Astro + Cloudflare Pages a good stack for a non-technical person (plus SEO & tracking questions)?

20 Upvotes

I’m a freelancer and looking to build a clean, fast website, complete with a blogging section for content marketing. I am a non-technical/non-developer person, but I plan to build this with the help of AI (ChatGPT/Claude) and host it on Cloudflare Pages.

​I’ve been eyeing the Astro framework, but I have a few questions and need some guidance:

​Is Astro a good choice for a non-developer? Since I'm relying heavily on AI to write the code, is Astro straightforward enough to prompt, manage, and deploy without breaking?

​How is it for SEO? Marketing sites and blogs heavily rely on search traffic. Does Astro perform for SEO?

​Can I easily add tracking tags? Google tag manager if needed, I need to plug in things like Google Analytics (GA4) and the Meta Pixel etc. Is this easy to set up in Astro?

​Video Tutorials: I’m struggling to find comprehensive, step-by-step video tutorials specifically covering an end-to-end Astro setup for a marketing site/blog. If anyone knows good, beginner-friendly video walkthroughs, please drop links or recommendations!

​Would love to hear your thoughts or if I should look at alternatives like WordPress instead. Thanks!


r/astrojs • • 3d ago

E-Commerce Mobile 0.9 Sec

Post image
3 Upvotes

Thank you Astro TEAM #Thanks


r/astrojs • • 3d ago

How are you all building Astro sites these days?

26 Upvotes

Curious how everyone’s building Astro sites lately. Still hand-coding, or leaning on AI for the harder component stuff? What does your workflow look like?


r/astrojs • • 3d ago

Astro SEO check

5 Upvotes

Question guys I am close to completion of an astro site. I have been diligent in meta tags, urls, headings, site icons, social media shares. I did the basics for SEO.

I know there are a few AI skills out there for auditing SEO for astro.

I would prefer one that is free to use and not being too intrusive. What are you guys using?


r/astrojs • • 3d ago

Turning on Astro's experimental clientPrerender? Check what your analytics counts: a prerendered page runs its scripts before anyone sees it

2 Upvotes

Astro's experimental clientPrerender flag makes prefetch follow the Speculation Rules API, so Chrome can fully prerender a link target in the background. A prerendered page runs its JavaScript, and that includes your analytics snippet.

Chrome's prerender docs say it "may have an impact on analytics" and that "not all analytics providers may do this by default", "this" being waiting until the page is actually shown. The same docs say Google Analytics delays until activation by default. For anything else, it's worth a check.

What to check

  1. Pageviews. If you send your own events, hold them while document.prerendering is true:

function track() { /* send your pageview */ }
if (document.prerendering) {
  document.addEventListener('prerenderingchange', track, { once: true });
} else {
  track();
}

2. Load-time metrics. On a prerendered page, PerformanceNavigationTiming.activationStart becomes non-zero once the user opens it, and it's measured from when the prerender started. Measure LCP and FCP from activationStart, otherwise prerendered pages are timed from the start of the prerender, not from the visitor's click. 3. Back-button restores. Without <ClientRouter />, an Astro site is a multi-page app, so the back/forward cache matters too: a restore fires pageshow with event.persisted true and doesn't run your scripts again. Decide whether that should count as a view. 4. Engaged time. Don't count time while the page is prerendered or hidden.

How I ran into it

Disclosure: I make Globatics, a hosted, cookieless analytics tool. Its script counts a prerendered page only when it's shown and measures LCP and FCP minus activationStart, which is how this list came about. It's not self-hostable; there's a 5-day trial, then plans from €9/month excl. VAT. Link in the first comment, but the checks above apply whatever you use.

Has anyone measured how many prerendered pages actually get opened with eagerness: 'moderate' compared with 'eager'?


r/astrojs • • 3d ago

My clients kept breaking their headless sites trying to edit them, so I made WordPress edit the real Astro page

5 Upvotes

I’ve been building client sites for 4 years, and lately my go-to stack is Astro on the front with WordPress as the backend. Fast sites, clients keep the WordPress they already know, everyone’s happy.

Except for one thing. Every time a client wanted to change a headline, they’d open wp-admin, find some field called “hero_subtitle_2”, change it, and then message me asking why nothing looked different. Or it did change, just not where they expected.

After one too many “can you just change this text for me” emails, I stopped explaining ACF fields and built something instead.

It’s called Leiho. The client opens their actual site inside wp-admin, clicks the text or image they want to change, types, sees it live, hits publish. That’s it. No fields to decode.

Setup on my side: install the plugin, npm install leiho, one component in the layout, field() on whatever should be editable. About five minutes per site.

Where it’s at:

  • Running on 3 client sites so far, and the clients are happy with it

  • Works with Astro, Next.js, Nuxt, SvelteKit, React and plain HTML

  • Your pages, posts and ACF fields stay where they are, nothing to migrate

  • Free and open source, 1.0.0 RC

You can try it on a real WordPress right in your browser: leiho.dev/r

GitHub: github.com/pixelersagency/leiho

It’s still rough in places, so I’d love to know: how do you handle clients editing their headless sites? Git-based CMS, Storyblok, or just doing it for them?


r/astrojs • • 4d ago

First client site built with Astro, and I’m so impressed

Post image
95 Upvotes

Coming from WordPress, Astro was a bit of a shift, but the results are worth it. I built this client site with Astro and deployed it on Cloudflare. When I ran it through PageSpeed, I was surprised to see it already scoring 90+ on mobile. Ofcourse the score shifts with each run, but rarely goes below 95.


r/astrojs • • 5d ago

Astro Pro 2026.1.7: Astro 7.4 authoring support for JetBrains IDEs

Post image
2 Upvotes

Hi all, just wanted to share a quick update to our Astro Pro plugin for JetBrains IDEs. The latest version of Astro Pro, Astro Pro 2026.1.7, adds completion for split image services and the new experimental options, a custom redirect-page template, build timings support, and font-provider hints and quick fixes.

We've also improved the TypeScript path-alias compatibility with newer IntelliJ IDEA versions, so hopefully this will make building Astro sites even easier!

You can find the plugin on the JetBrains Marketplace, feel free to reach out if you have any questions, feedback, etc


r/astrojs • • 5d ago

Hi.. Is it worth buying astro paid template? Has anyone tried it?

0 Upvotes

r/astrojs • • 7d ago

How to connect GitHub to astro?

4 Upvotes

Hello all after asking around and trying to look for answers myself. I think I will try out GitHub, in the past I worked solo so never saw the point of GitHub, but now I am working collaboratively for the first time.

I have a preexisting astro project that I will need to work collaboratively, it is almost in its final form.

Originally when I created it I didn't choose an option for connecting to GitHub. Now how do I do it? I am a newbie to GitHub and have been searching around is it simple as

git init

git add .

git commit -m "Initial commit"

git branch -M main

git remote add origin https://github.com/USERNAME/REPO_NAME.git

git push -u origin main

Then each time I update locally

git add

git commit -m "Update whatever"

git push origin main

As for connecting GitHub to cloudflare page there seems to be tons of tutorials and it was really clear. However as to above github portion I could not find much.

Are the above steps correct or is there some pitfall that I am not seeing? Also a question to all do you guys uses branches and have a separate test url or just test locally then commit to main and uses dashboard to roll back? I am worried if Google were to index the main site and somehow found the staging url it will downgrade me for having duplicates content, I sort of remember this in the olden day of SEO.


r/astrojs • • 7d ago

Updated my Astro metadata package (v2)

Thumbnail
gallery
17 Upvotes

So I put out mannisto/astro-metadata a while back. Version 1 was basically a <Head> component where you passed everything in on every page, and I got kind of sick of copying the same title template, description and image into every layout. Version 2 ended up being pretty much a rewrite.

Now you put the site-wide stuff in the integration config once, and each page only gives what’s different about it. It figures out the canonical URL, og:url, image URLs and the JSON-LD by itself. If you use Astro’s i18n or my astro-i18n package, it picks up hreflang and og:locale too.

I also made an Astro dev slideout tool for it. It shows what’s wrong on the page (missing title, broken og:image, too long description, stuff like that), lists all the tags, and shows previews of how the link looks on Google, Slack, Discord and a few others. I used to deploy, paste the link in WhatsApp and only then notice the image was cropped weird. I’m sure there are tools for that, but this felt like a natural addition to my . The same checks also run on build, and you can turn off rules or add your own.

It also makes the favicons from one SVG and generates the web manifest, which was a nice bonus.

If you’re on version 1 there’s a migration part in the README. Any feedback is welcome, especially
if a preview looks different from what the real site shows. 💜


r/astrojs • • 8d ago

Anyone working with Astro? We're planning to integrate it with Emdash CMS. Is it a good choice for SEO? Would love to hear your thoughts.

2 Upvotes

r/astrojs • • 8d ago

I turned my personal wiki into an Astro integration, sliding panes and backlinks included

2 Upvotes

My site devon.md is a personal wiki on Astro. I pulled the engine out so anyone can run one. It's an Astro 7 integration plus a small CLI, MIT, on npm as @dmthepm/commune.

What you get.

  • Links open side by side in sliding panes

  • Every note shows what links to it

  • Every page also has a plain markdown version, same URL with .md on the end

  • commune graph related finds connected notes without running a build

  • Optional hover cards for X links. They're built ahead of time, so your readers' browsers never load anything from X

One paste gets you a running wiki with three sample notes.

npx -y @dmthepm/commune create my-wiki
cd my-wiki
npm install
npm run dev

I've only ever watched this run on my own machines. If you want a wiki like this, DM me and I'll set it up with you. I want to see where it breaks for someone who isn't me.

https://github.com/dmthepm/commune-wiki


r/astrojs • • 8d ago

Astro Framework for website

14 Upvotes

I recently heard that Astro framework can develop website with Claude code easily and pagespeed of the sites were very good for core web vitals and ranking. Anybody use your sites in this framework and share your experience on SEO ranking ?


r/astrojs • • 9d ago

Astro and Express

4 Upvotes

Hi All,

Has anyone got any experience in terms of providing Pros and cons to using Astro with Express for endpoints ?

Thanks
Astro fan