AdminForth

AdminForth is an open-source, agent-first admin panel framework for TypeScript and Vue.js that generates full CRUD interfaces from an existing database connection in minutes.

What is AdminForth?

AdminForth is a free, open-source admin panel framework built on TypeScript and Vue.js. It takes a database URL as input and produces a fully functional admin UI with filtering, creating, editing, and removing records for every imported table. The project is developed by devforth and runs on Node.js, with support for Postgres, MySQL, MongoDB, SQLite, and Clickhouse databases. It is branded as "agent-first" because it ships with plugins for AI-powered writing and image generation inside the admin panel.

What makes AdminForth stand out?

• CLI scaffolding — Run npx adminforth create-app with a database URL to generate a project, then npx adminforth resource to import existing tables and get CRUD screens automatically.
• Database support — Works with Postgres, MySQL, Mongo, SQLite, and Clickhouse, covering both relational and document stores.
• Vue component injection — Use npx adminforth component to define custom Vue 3 components that replace data cells, edit fields, add elements above tables, or inject content into the header and sidebar.
• AFCL component library — AdminForth's built-in component library (AdminForth AFCL) provides pre-made blocks that follow the active theme.
• Plugin ecosystem — Includes plugins for audit logging, file/image upload, TOTP two-factor authentication, I18N, and Copilot-style AI writing and image generation.
• Express API integration — Define Express APIs and call them from your components and custom pages.
• Tailwind-style theming — The UI uses a Tailwind-inspired approach for quick visual adjustment.

Who should use AdminForth?

AdminForth is for developers who need a back-office for an existing or new application without writing CRUD boilerplate. A full-stack developer can point the CLI at their production database and get an admin panel for editing records within minutes. A team that needs AI-assisted content management can use the Copilot plugins to write or generate images directly inside their admin. An agency building custom admin panels can extend the generated UI with Vue components and Express APIs for client-specific workflows.

What can you do with AdminForth?

• Backend teams: connect a Postgres or MySQL database and immediately get filterable, editable data tables with create/update/delete actions for every imported resource.
• Product managers: use the I18N plugin and custom Vue components to shape an admin panel that matches internal business workflows without writing full frontends.
• Content operations teams: leverage the Copilot-style AI writing and image generation plugins to produce and edit copy or visuals directly inside the admin panel.
• SaaS founders: use the audit log and TOTP two-factor authentication plugins to secure customer-facing back-office areas.

How does AdminForth work?

You initialize a project with npx adminforth create-app --app-name myadmin --db "postgresql://...", which connects to your database without creating schema migrations for it. Next, npx adminforth resource introspects your existing tables and generates resource files that enable full CRUD UI. For a new database, you can omit the --db flag to scaffold a standalone app with a default SQLite database, and then create migrations with pnpm makemigration and pnpm migrate:local. Custom Vue components and Express APIs are added through npx adminforth component and standard Express route definitions.

Pricing

AdminForth is always free and open-source, with no paid versions and no cloud subscription—the project README explicitly states this.

Alternatives

React Admin is a comparable admin framework but is built on React rather than Vue. Refine is another React-based meta-framework for admin panels, offering headless UI and more framework adapters.

FAQ

Is AdminForth free?

Yes. The README states that AdminForth is always free and open-source, with no paid versions and no cloud subscription requirements.

What databases does AdminForth support?

AdminForth supports Postgres, MySQL, Mongo, SQLite, and Clickhouse. You provide a database URL when running npx adminforth create-app, and the framework generates the CRUD UI against that database.

How do I create an admin panel with AdminForth?

Run npx adminforth create-app --app-name myadmin --db "your-database-url", then run npx adminforth resource to import existing tables. This produces a working admin UI with filtering, create, edit, and remove actions.

Can I add custom components?

Yes. Use npx adminforth component to define Vue components that control data cells, edit fields, content above tables, and header/sidebar injections. You can also define Express APIs and call them from your components.