skills.rest
agarzon
agarzonCOMMUNITY
Explore all skills by this author →
GitHub

moonshine-frontend-v3

Integrate MoonShine v3 frontend with API mode, JWT authentication, and Alpine.js.

2|Updated Mar 2, 2026
Search Tags:#frontend#api#jwt#alpine.js#sdui#moonshine#moonshine-v3
One-click install
npx skills add https://github.com/agarzon/moonshine-v3-skills --skill moonshine-frontend-v3
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: moonshine-frontend-v3
Source: https://github.com/agarzon/moonshine-v3-skills/tree/main/moonshine-frontend-v3
Command: npx skills add https://github.com/agarzon/moonshine-v3-skills --skill moonshine-frontend-v3

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

MoonShine v3 frontend presents a complex blend of API modes, JWT-based authentication, SDUI delivery, and Alpine.js-driven interactivity. This skill provides structured guidance to help developers implement and maintain consistent, robust frontend MoonShine experiences.

Core Features & Use Cases

  • Standard HTML rendering with Alpine.js reactivity and MoonShine's JS helpers
  • API mode with Accept: application/json to return JSON CRUD responses
  • SDUI support to render a JSON component tree for mobile or custom clients
  • JWT authentication integration and pipelines for stateless API security
  • Reactive fields, async UI updates, and event-driven UI orchestration

Quick Start

Start by enabling API mode, wiring JWT authentication, and loading MoonShine's Alpine.js components, then use the provided frontend helpers to build interactive admin interfaces.

Frequently Asked Questions about moonshine-frontend-v3

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I integrate MoonShine v3 APIs with a frontend using JWT authentication?▼

To integrate MoonShine v3 APIs with JWT authentication, wire the JWT authentication pipeline for stateless API security and load MoonShine's Alpine.js components to build interactive admin interfaces.

What's the best way to render a MoonShine SDUI component tree for custom clients?▼

Rendering a MoonShine SDUI component tree involves using the built-in SDUI support to deliver a JSON component tree, enabling mobile or custom clients to consume structured UI data.

How does Alpine.js event handling work with MoonShine reactive fields?▼

Alpine.js event handling with MoonShine reactive fields enables async UI updates and event-driven UI orchestration by wiring Alpine.js reactivity directly into MoonShine's JS helpers.

Can I use MoonShine API mode to return JSON CRUD responses instead of HTML?▼

Yes, you can enable MoonShine API mode by setting the Accept: application/json header, which configures the backend to return JSON CRUD responses instead of standard HTML rendering.

Do I need Alpine.js to build reactive admin dashboards with MoonShine v3?▼

Yes, Alpine.js is required to build reactive admin dashboards with MoonShine v3, as it provides the client-side reactivity and event wiring necessary for async UI updates and interactive interfaces.

Related Skills

Explore More Software Engineering Skills→
codewithlaiba28codewithlaiba28
1

better-auth-jwt-integration

Implement JWT authentication with Better Auth and FastAPI middleware.

Community
Advanced
TomasxwavTomasxwav

vue

Convert JSON UI specifications into Vue 3 component trees with data binding and event actions.

Community
Intermediate
agarzonagarzon
4

moonshine-frontend-v4

Configure MoonShine v4 frontend API mode, JWT auth, SDUI, and Alpine.js events.

Community
Advanced
Ankish8Ankish8

myoperator-design

Generate React/Tailwind UI code using the myOperator design system.

Community
Intermediate