PlugWiki

clerk-astro-patterns Skill: What It Does and How to Install It

Makes your coding agent add Clerk sign-in to an Astro 5 site: middleware, SSR pages, islands and API routes.

Installs
14.5K
on skills.sh
Stars
89
on GitHub
Files
13
besides SKILL.md
Updated
Oct 2026
last repo commit

The SKILL.md tells the agent to use @clerk/astro v4+ with Astro 5+. It explains that SSR pages read auth with Astro.locals.auth(), static pages skip the middleware, and islands use hooks from @clerk/astro/react. It also says createRouteMatcher was removed in @clerk/astro 4.0, so each page and API route checks for itself.

It loads on Astro Clerk middleware, protected pages, island components and API route auth questions. You need a Clerk publishable key and secret key.

Good for

  • Astro developers adding Clerk
  • Teams mixing static and server-rendered pages
  • Anyone protecting Astro API routes

Install clerk-astro-patterns

Claude Code

  1. 1

    Copy this prompt.

    Install the clerk-astro-patterns skill in Claude Code. Run this command:
    
    /plugin marketplace add clerk/skills
    /plugin install clerk@clerk-skills
    
    Then check that it loaded and tell me how to use it.
  2. 2

    Paste it into Claude Code. It shows the change and asks before running it.

Pick one route. The plugin installs all 20 skills in the Clerk repo (counted from the repo tree) and adds the Clerk MCP server from the repo's .mcp.json, which points at https://mcp.clerk.com/mcp. The skills-only routes install just this skill and no MCP server config. The README says to open /plugin, go to Marketplaces, select clerk-skills and enable auto-update if you want updates.

From the project README. Source.

What's in the skill

When it loads

Astro patterns with Clerk — middleware, SSR pages, island components, API routes, static vs SSR rendering. Triggers on: astro clerk, clerk astro middleware, astro protected page, clerk island component, astro API route auth, clerk astro SSR.

Sections in SKILL.md

  1. What Do You Need?
  2. Mental Model
  3. Setup
  4. astro.config.mjs
  5. src/middleware.ts
  6. SSR Page Auth
  7. API Route Auth
  8. Common Pitfalls
  9. Import Map
  10. Env Variables
  11. See Also
  12. Docs

Key facts

Installs on skills.sh
14,528 (Nov 2, 2026)
Last repo commit
Oct 30, 2026

What it includes

  • Add the clerk() integration and a bare clerkMiddleware().

    Sets output to server in astro.config.mjs and exports clerkMiddleware from src/middleware.ts. Source: SKILL.md and references/middleware.md.

    Try: “Add Clerk to my Astro site”

    Write · Integration and middleware

  • Redirect signed-out visitors using Astro.locals.auth().

    Covers basic auth checks, organization-scoped pages, fetching the current user and getToken for external APIs. Source: references/ssr-pages.md.

    Try: “Protect my /dashboard Astro page with Clerk”

    Write · SSR page auth

  • Use useAuth and prebuilt UI in React, Vue or Svelte islands.

    Covers hooks in islands, client directives and prebuilt components. Source: references/island-components.md.

    Write · Island components

  • Return 401 from API routes when no user is signed in.

    Covers basic checks, organization checks, permission checks and clerkClient. Source: references/api-routes.md.

    Try: “Require sign-in on my POST /api/data route”

    Write · API route auth

  • Add the React integration and use Clerk components in React files.

    Covers setup, which includes an `npx astro add react` command, and the difference between Astro and React Clerk components. Source: references/astro-react.md.

    Runs code · Astro with React

  • Fix undefined Astro.locals.auth and wrong import paths.

    A symptom table and an import map for @clerk/astro/server, /react, /client and /components.

    Read · Pitfalls and import map

From the official docs

Permissions

Low risk

The skill makes an agent change code in your project and add Clerk keys to your env file, so a wrong edit lands in your own app. Review the diff before you commit it and keep the secret key out of git.

What it can do

  • Read your data
  • Create and change things
  • Delete things
  • Read-only mode

Watch out for

  • It edits files in your project

    The SKILL.md and its references can have the agent edit `astro.config.mjs`, `src/middleware.ts` and pages, and run `npx astro add react` for the React setup. Review the diff and keep CLERK_SECRET_KEY out of version control. github.com

  • The plugin route also adds the Clerk MCP server

    The plugin's .mcp.json registers https://mcp.clerk.com/mcp. Use the skills CLI route if you only want this skill. github.com

Security advisories

No published security advisories as of Nov 2, 2026.

Technical details
Turning on read-onlyNo read-only mode.
Talks toWebFetch tool (the frontmatter allows it; the SKILL.md links point at clerk.com/docs)
Sign-in and keysThe SKILL.md shows Clerk keys going into your project's env file.
Scopes
  • Your project files

  • Clerk keys in your env file

Questions

What does clerk-astro-patterns do?

It makes your coding agent write Clerk sign-in code for an Astro site: middleware, protected SSR pages, island components and API route checks.

How do I install clerk-astro-patterns?

Use the install box above. The Claude Code plugin route installs every Clerk skill and the Clerk MCP server, and the skills CLI route installs only this skill. Pick one route, not both, or you get the skills twice.

Is clerk-astro-patterns official?

Yes. It is published in Clerk's own clerk/skills repository, and the plugin.json in that repo lists Clerk as the author.

Does clerk-astro-patterns work in the Claude app or Codex?

Codex, Cursor and GitHub Copilot CLI each have a plugin install in the README. The README does not document uploading Clerk skills to the Claude app, and this skill's job is to change code in a local project, so the install box has no Claude app tab.

Does it need a Clerk account or API key?

You need a Clerk publishable key and secret key for the app you are building. The SKILL.md shows them in .env as PUBLIC_CLERK_PUBLISHABLE_KEY and CLERK_SECRET_KEY.

Is clerk-astro-patterns safe to install?

Its SKILL.md makes the agent change files in your project and use Clerk keys from your env file, and its frontmatter allows the WebFetch tool. Our advice: read each change before you commit it, and keep the secret key out of git.

How does it handle static pages?

Static pages marked prerender = true skip the Clerk middleware, so the SKILL.md says to use client-side hooks in an island or set prerender = false for pages that need auth.

Information

updated Nov 2, 2026

Repository
clerk/skills
Folder
skills/clerk-astro-patterns

clerk/skillsskills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 4
  1. clerk-astro-patterns SKILL.md · github.com
  2. clerk/skills README · github.com
  3. clerk plugin.json · github.com
  4. clerk .mcp.json · github.com

Updated Nov 2, 2026.