Coverage License: MIT Hex Hex Docs



Admin panels for Phoenix LiveView, built from your Ecto schemas.

๐Ÿš€ Live Demo โ€ข ๐Ÿ“š Documentation โ€ข ๐Ÿ› ๏ธ Installation Guide โ€ข ๐Ÿฉต Contribute

Backpex

Backpex turns your existing Ecto schemas into a complete admin panel: index, show, edit and create views with search, filters, actions, metrics and authorization. Each resource is a single Elixir module, a LiveResource, that lives in your Phoenix app, uses your changesets and renders in your layout. Everything runs on LiveView, so there is no separate frontend to build and no second app to deploy.

Backpex Screenshot

Try the Live Demo โ†’

Why Backpex?

A LiveResource in 30 Lines

defmodule MyAppWeb.PostLive do
  use Backpex.LiveResource,
    adapter_config: [
      schema: MyApp.Blog.Post,
      repo: MyApp.Repo,
      update_changeset: &MyApp.Blog.Post.update_changeset/3,
      create_changeset: &MyApp.Blog.Post.create_changeset/3
    ],
    layout: {MyAppWeb.Layouts, :admin}

  @impl Backpex.LiveResource
  def singular_name, do: "Post"

  @impl Backpex.LiveResource
  def plural_name, do: "Posts"

  @impl Backpex.LiveResource
  def fields do
    [
      title: %{module: Backpex.Fields.Text, label: "Title", searchable: true},
      published: %{module: Backpex.Fields.Boolean, label: "Published", index_editable: true},
      category: %{module: Backpex.Fields.BelongsTo, label: "Category", display_field: :name},
      inserted_at: %{module: Backpex.Fields.DateTime, label: "Created", only: [:index, :show]}
    ]
  end

  @impl Backpex.LiveResource
  def can?(assigns, :delete, _post), do: assigns.current_user.role == :admin
  def can?(_assigns, _action, _post), do: true
end

Mount it in your router and you get a searchable, sortable, paginated index with inline editing, plus show, edit and create views:

scope "/admin", MyAppWeb do
  pipe_through :browser

  backpex_routes()

  live_session :admin, on_mount: Backpex.InitAssigns do
    live_resources "/posts", PostLive
  end
end

Features

Resources and fields

Finding data

Actions and access control

Built for real use

Get Started

Backpex ships with an Igniter installer. Install the Igniter archive once, then run the installer in your Phoenix app:

mix archive.install hex igniter_new
mix igniter.install backpex

It configures PubSub, adds the JavaScript hooks, sets up daisyUI and Tailwind, adds the admin routes and creates an admin layout. Review the diff, then follow the installation guide for the remaining steps and your first LiveResource.

Prefer to set it up by hand? Add Backpex to your dependencies and follow the same guide:

def deps do
  [
    {:backpex, "~> 0.23"}
  ]
end

Requirements

Using Ash? The community project ash_backpex connects Backpex to Ash resources.

Build Backpex Apps with AI Agents

Backpex gives coding agents the context they need to write correct Backpex code:

See AI Assisted Development for details.

Learn More

Contributing

Bug reports, ideas and pull requests are welcome. Start with Contribute to Backpex and the contributing guide, and have a look at the open issues.

Backpex is built and maintained by naymspace.

License

Backpex is open-source software, licensed under the MIT License.