Building Apisix Admin Panel

Apache APISIX is a powerful, flexible API gateway that's designed for high-performance cloud-native deployments. While APISIX comes with an official dashboard for managing routes, consumers, plugins, and other entities, it can sometimes be resource-heavy or lack certain features needed for specific use cases.

I started building an alternative admin panel with a different philosophy: lightweight, powerful, and secure by default. The motivation was to create something that could run efficiently even in resource-constrained environments while still providing a rich feature set for managing APISIX instances.

Design Philosophy

The project is built around three core principles:

Lightweight: The entire application uses only about 5MB of memory and compiles to roughly 25MB, making it suitable for edge deployments or environments where resource efficiency matters.

Powerful: Rather than being feature-complete only for the most basic use cases, it aims to support more functionality than the official dashboard. This includes supporting more plugins out of the box and handling both standalone and traditional deployment modes.

Secure: The API key is kept only on the server side, never exposed to the frontend. This means you don't need to worry about the API key leaking through browser DevTools or being cached in request logs.

Technology Stack

To achieve these goals, I chose an interesting mix of technologies:

Rust Backend: The core API server is written in Rust, which provides memory safety, excellent performance, and a great ecosystem for building web services. The small footprint and low memory usage are huge advantages here.

WebAssembly Frontend: Some of the frontend is compiled to WebAssembly from Rust, allowing reusable logic to run at near-native speeds in the browser. This approach might seem unconventional for a web UI, but it works well for performance-critical sections.

JavaScript/TypeScript Frontend: The UI itself is built with JavaScript/TypeScript and bundled into static files. This keeps the interface responsive and modern, allowing users to interact with the application smoothly.

This combination means you get the performance benefits of Rust on the backend, the speed of WebAssembly for complex computations, and the user experience polish of JavaScript frameworks for the UI.

Key Features

The admin panel currently supports:

• CRUD operations: Create, read, update, and delete routes, consumers, consumer groups, and other APISIX entities
• Plugin support: Works with most plugins out of the box, with the option to input raw JSON if a specific plugin isn't yet supported
• Multiple deployment modes: Handles both standalone deployments (via config file updates) and traditional deployments (via API requests)
• Authentication: Supports requiring authentication to the web UI itself via a form, adding an extra security layer
• Input validation: Client-side validation helps catch errors early

Development Experience

One of the nicest things about this project is how easy it is to get started for local development. After cloning the repository, you can run:

docker compose up -d

This spins up a local APISIX instance configured for testing. The monorepo structure keeps everything organized with separate directories for the core logic, plugins, the Wasm module, the server, and the web interface.

The project also uses Nix for reproducible development environments, Docker for containerization and deployment, and includes CI/CD workflows via GitHub Actions for automated testing and builds.

Deployment

Getting it running in your environment is straightforward via Docker:

docker run \
  --rm -it \
  --net host \
  -e PORT=3000 \
  --name apisix-admin-panel \
  igncp/apisix-admin-panel:latest

Then access it at http://localhost:3000/. You can customize the APISIX admin key via the APISIX_ADMIN_KEY environment variable to connect to your instance.

The official Docker Hub repository has more deployment options and documentation.