Enfyra App and Extension Documentation

This section covers UI and extension work that runs inside Enfyra Admin: pages, widgets, forms, permissions, menus, header actions, and operator workflows.

If you are building a separately deployed web app, mobile backend, CLI, or service, use the SDK documentation. SDK applications and Enfyra Admin extensions have different runtime APIs.

The app is a pure API client: it never connects directly to your database. All data comes from the Enfyra Server (port 1105) via HTTP APIs.

New to Enfyra? Start with the Installation Guide to set up your app + server workspace.

Quick Navigation

• Extension API Integration

• API Integration – Call backend APIs from pages, widgets, and extensions running inside Enfyra Admin

• Extensions & Widgets

• Extension System – Create custom pages, widgets, and global shell extensions with Vue components

• Header Actions – Inject custom buttons into the app header and sub-header

• Forms & Data Entry

• Form System – Auto-generated forms, validation, relations, and change tracking
• Relation Picker – Selecting related records inside forms

• Filter System – Advanced filtering for tables and pickers

• Permissions & Visibility

• Permission Builder – Visual permission rule builder

• Permission Components – PermissionGate component and usePermissions composable

• Validation

• Column Rules – Attach min/max, length, pattern, format constraints to columns; rules are enforced server-side on POST/PATCH

• Navigation & Layout

• Menu Management – Sidebar and menu configuration
• Method Management – HTTP method records and badge colors used by route forms

• Page Header – Page headers with stats and gradients

• Hooks, Handlers & Packages (UI side)

• Hooks – Managing hooks from the app UI
• Custom Handlers – Managing custom handlers from the app UI

• Package Management – Installing NPM packages for hooks and handlers

• Storage & Files

• Storage Management – File uploads, folders, and storage configurations

• Operations

• Server Logs – Trace database-backed system errors and user script logs by correlation ID
• Runtime Monitor – Process, database, queue, websocket, and Redis visibility

Frontend Learning Path

If you are building on top of the Enfyra App UI, this is a suggested order:

1. Understand the architecture
2. Architecture Overview – How frontend and backend work together

3. Server Overview – Server-side concepts and APIs

4. Work with data from the app

5. Form System – How forms are generated from tables
6. Filter System – Filtering data in tables and relation pickers

7. API Integration – Calling APIs from pages, extensions, and widgets

8. Build custom UI and workflows

9. Extension System – Custom pages, widgets, and global shell extensions
10. Header Actions – Custom header actions

11. Menu Management – Connecting extensions to menus

12. Secure and control the UI

13. Permission Builder – Define permission rules
14. Permission Components – Hide/show UI based on permissions

15. Permission Builder – Backend permission evaluation (see Permission Builder for details)

16. Go deeper into backend customization (from the app UI)

17. Hooks – Configure hooks that run on the server
18. Custom Handlers – Override default CRUD behavior
19. Package Management – Install NPM packages for hooks/handlers
20. Server Hooks & Handlers – Full server-side behavior

How This Relates to the Server Docs

• The Server docs (../server/README.md) describe what APIs exist and how they behave.
• The App docs (this folder) describe how the admin app uses those APIs through forms, tables, extensions, and permissions.
• The SDK docs (../sdk/README.md) describe how a separately deployed third-party application uses Enfyra as its backend.

When in doubt:

• If you are asking “Which endpoint / field / filter can I use?” – go to the server docs.
• If you are asking “How do I show this in the UI / extension?” – stay in the app docs.
• If you are asking “How does my own Nuxt, Vue, React, Node.js, or mobile-facing service call Enfyra?” – go to the SDK docs.