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

moonshine-frontend-v4

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

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps AI agents implement MoonShine v4 frontend behavior correctly when working with API mode, JWT auth, SDUI, Alpine.js events, async responses, and reactive UI updates, instead of relying on outdated assumptions.

Core Features & Use Cases

  • API Mode: Return JSON from CRUD routes for headless admin workflows and custom clients.
  • JWT Authentication: Configure token-based access for secure API-first MoonShine deployments.
  • SDUI and Alpine.js: Drive server-rendered component trees, custom JavaScript components, and event-based UI updates.
  • Async and Reactive Flows: Use callbacks, fragments, table refreshes, and reactive fields to keep interfaces responsive.
  • Use Case: A team building a mobile companion app for MoonShine can use this Skill to expose structured UI, authenticate users with JWT, and synchronize updates after edits without guessing the framework’s frontend conventions.

Quick Start

Ask the AI to implement a MoonShine v4 frontend flow using the API mode, JWT, SDUI, and Alpine.js guidance from this Skill.

Frequently Asked Questions about moonshine-frontend-v4

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

FAQPage Schema
How do I configure MoonShine v4 API mode to return JSON from CRUD routes?▼

MoonShine v4 API mode configures CRUD routes to return JSON responses for headless admin workflows. You apply specific request headers and JSON response handling conventions to expose structured data to custom clients.

Does MoonShine v4 support JWT authentication for headless admin interfaces?▼

Yes, MoonShine v4 supports JWT authentication to secure API-first deployments. You configure token-based access to authenticate users interacting with the headless admin interface from external clients.

How do I update reactive UI fields using MoonShine Alpine.js events?▼

Updating reactive UI fields in MoonShine uses the Alpine.js event system and JsEvent conventions. You dispatch events to trigger fragment updates and AsyncCallback hooks for responsive server-driven UI behavior.

What is SDUI in MoonShine v4 and how does it drive server-rendered component trees?▼

SDUI in MoonShine v4 drives server-rendered UI component trees to custom frontend clients. It uses specific request headers and JSON response handling to synchronize server-driven interface updates dynamically.

Can I use MoonShine v4 async callbacks to refresh tables without full page reloads?▼

Yes, MoonShine v4 async callbacks refresh tables and update fragments without full page reloads. You configure AsyncCallback hooks and Alpine.js events to process JSON responses and maintain responsive interfaces.

What are the limitations of using MoonShine v4 frontend conventions for custom JavaScript integrations?▼

MoonShine v4 frontend conventions require strict adherence to JsEvent, Alpine.js event system, and SDUI request headers. Custom JavaScript integrations fail if JSON response handling and AsyncCallback hooks are not correctly mapped.

Related Skills

Explore More Software Engineering Skills→
agarzonagarzon
2

moonshine-setup-v3

Automates MoonShine v3 setup and configuration in Laravel projects.

Community
Intermediate
sametozkalesametozkale

svelte

Convert json-render specifications into Svelte component trees.

Community
Intermediate
agarzonagarzon
2

moonshine-frontend-v3

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

Community
Advanced
agarzonagarzon
4

moonshine-v4

Route MoonShine v4 task requests to the correct skill module.

Community
Advanced