AdminLTE 4.0: Restart for the dashboard framework

Contents

With AdminLTE 4.0.0, a new major version of the open-source dashboard framework has been released. The project has fundamentally restructured its architecture for this: AdminLTE is now based on Bootstrap 5.3, completely dispenses with jQuery, and uses TypeScript instead. In addition to the modernized technical basis, the version brings numerous new example pages, extended documentation, and revised dark mode support.

AdminLTE is a UI template for web admin interfaces and dashboards. Developers use it as a basis for SaaS backends, CRM and e-commerce systems, monitoring dashboards, or internal tools. The project provides pre-made layouts, navigation structures, forms, tables, and dashboard components that can be integrated into custom web applications.

Abandoning jQuery and Switching to Bootstrap 5.3

The most important technical innovation is the complete abandonment of jQuery. Older admin templates often rely heavily on jQuery plugins and direct DOM manipulation. Modern frontend stacks, on the other hand, prefer component-based architectures and native browser APIs. AdminLTE is therefore replacing its previous jQuery components with TypeScript plugins.

In parallel, the project is switching to Bootstrap 5.3. This allows AdminLTE to adopt, among other things, the framework's native dark mode support, modernized utility classes, and the new data attributes from Bootstrap 5. However, for existing projects, this means breaking changes: the maintainers have renamed several central CSS classes, for example from .main-sidebar to .app-sidebar. Previously, attributes like data-toggle are now named data-bs-toggle in compliance with Bootstrap 5.

18 New Demo Pages and New Table Library

In addition, there are 18 new demo and example pages. These include templates for calendar views based on FullCalendar, Kanban boards with SortableJS, chat interfaces, file managers, project overviews, mailbox views, and multi-step form wizards with validation. Profile and settings pages, invoice views, and error pages for HTTP status codes like 404 and 500 are also included. The example pages are intended not only as a showcase but also directly as boilerplates for custom applications.

For tables, AdminLTE 4 relies on the Tabulator library. The new implementation works without jQuery and offers sorting, filtering, and virtual tables for larger amounts of data – features typically used in reporting or monitoring interfaces.

The project has also expanded support for color modes. The new version includes a light and dark mode switcher in the topbar by default. AdminLTE saves the selection in localStorage and can automatically adjust it to the browser's system setting via prefers-color-scheme.

Revised Documentation and Modernized Toolchain

The documentation has also been comprehensively revised. New chapters include migration from version 3, deployment scenarios, theming, RTL support, and recommended integrations. The FAQ is now available as a standalone page with live search and thematic categories. Furthermore, the project separates the navigation of the live demo from the actual documentation to keep the preview pages clearer.

The toolchain also sees an update. AdminLTE now uses TypeScript 6, ESLint 10, Stylelint 17, and Astro 6.3, among others. The maintainers have also removed several older ESLint configurations and switched to the Flat Config model. According to the developers, the dependency chain no longer contains any known vulnerabilities according to npm audit. A complete overview of all changes can be found by those interested in the release notes on GitHub.

Note on Productive Use

Finally, the project points out again that AdminLTE is merely a UI template and not a complete application system. In production environments, developers should only deploy the compiled production assets, but not the included demo and example pages. The maintainers refer to the older CVE-2021-36471, which they believe resulted from faulty deployments of example content.

(fo)