We have released NextGIS Frontend 4.0, a major update to our collection of JavaScript libraries for building custom web mapping applications with NextGIS Web.
Version 4 brings updated support for the NextGIS Web API, more consistent behavior across Leaflet, OpenLayers, and MapLibre GL JS, improved React integration, and new libraries for working with QuickMapServices.
We have also significantly updated the examples and documentation to better reflect modern web development workflows.
The main use case for NextGIS Frontend is simple: keep your geospatial data and project structure in NextGIS Web, while building the user-facing application you need with JavaScript.
For example, NextGIS Web can provide the layers, styles, permissions, and web map configuration. A separate application implements a geoportal, operator interface, customer dashboard, monitoring application, or another specialized information system.
NextGIS Frontend handles much of the integration layer between the application and NextGIS Web, so developers do not have to implement the same Web GIS interaction mechanisms from scratch for every project.
Depending on the task, you can work at different levels of abstraction:
This makes NextGIS Frontend suitable both for quickly adding an interface around an existing web map and for building larger applications from individual components.
NextGIS Frontend 4 adds support for recent NextGIS Web API capabilities, including new filtering expressions for vector and raster layers, Boolean fields, and web map layer-group states.
Applications can therefore reproduce the structure and configuration of projects prepared in NextGIS Web more accurately.
The example gallery covers many common scenarios and is not just a showcase. The examples are designed to serve as reusable starting points for real projects, including layer filtering and loading complete NextGIS Web web maps.
Many web GIS applications implement the same basic interactions:
We have paid particular attention to these workflows in version 4. Dynamic filtering, feature selection and deselection, event handling, popups, and visualization of selected features have all been improved.
As a result, common interactions require less application-specific code and can be reused more easily between projects.
NextGIS Frontend provides a common way to perform many mapping operations regardless of the underlying mapping library.
Version 4 makes this behavior more consistent across Leaflet, OpenLayers, and MapLibre GL JS, including feature selection and highlighting, filtering, popups, zooming, and map controls. The goal is to keep a significant part of the application logic independent of the selected engine.
You can then choose the mapping framework that best matches the project:
Leaflet is a strong option for straightforward, lightweight mapping interfaces.
OpenLayers is well suited to more advanced engineering and GIS-oriented applications.
MapLibre GL JS provides WebGL rendering, vector tiles, powerful styling, modern visualization capabilities, and 3D functionality.
And when an application needs functionality specific to one of these libraries, developers can access the underlying mapping framework directly.
In other words, you can choose the mapping engine based on the requirements of your application without rebuilding the NextGIS Web integration each time.
Previously, each mapping adapter used its own approach to controls such as buttons, switches, and toolbars. That made interfaces harder to develop consistently across different mapping engines. NextGIS Frontend 4 introduces a common controls architecture.
Controls can now be created and arranged in a similar way regardless of the underlying map framework. They can be grouped, combined with group switches, arranged horizontally or vertically, and positioned as required by the application.
This is especially useful for projects that share UI components between applications or support several mapping stacks.
React components now follow the same common architecture as the rest of NextGIS Frontend, including universal map controls and the shared approach to map interaction.
This allows React developers to concentrate on application logic and UI while leaving low-level NextGIS Web communication and mapping-engine specifics to the libraries.
The result is a cleaner separation between the application itself and its GIS infrastructure.
Version 4 also introduces dedicated QuickMapServices packages for Leaflet, OpenLayers, and MapLibre GL JS.
QuickMapServices can be used not only to add a basemap programmatically but also to provide an interface where users can browse the QMS catalog and search for available map services directly from an application.
This is useful for applied GIS applications where users need to choose an appropriate basemap without asking a developer to configure every option in advance.
The QMS libraries are independent of NextGIS Web, so they can also be used in other Leaflet, OpenLayers, or MapLibre applications.
We have substantially redesigned and expanded the NextGIS Frontend example gallery.
Examples are serve as practical starting points. Each example is available in both JavaScript and TypeScript, making it easier to copy the relevant code into an existing project.
The examples website now also supports a system-aware dark theme and has improved navigation and presentation.
The API documentation has been expanded with an overview of the package architecture and LLM-friendly documentation, including an llms.txt index that can be supplied to AI coding tools such as Claude Code, Cursor, and similar development assistants when working with NextGIS Frontend.
One of the most important technical changes in version 4 is support for generating API request types for a particular NextGIS Web instance.
TypeScript declarations for NgwConnector.route() can be generated directly from the server being used:
npx @nextgis/ngw-types-loader
The generated types correspond to the components and API routes that are actually available on that NextGIS Web instance.
For developers maintaining existing NextGIS Frontend applications, the main migration areas to review are changes to propertiesFilter, support for MapLibre GL JS 6, and the new common controls architecture.
NextGIS Frontend 4 is designed to make the boundary between your application and GIS infrastructure simpler.
Use NextGIS Web to manage geospatial data, layers, permissions, styles, and web maps. Choose Leaflet, OpenLayers, or MapLibre GL JS for the frontend. Then use NextGIS Frontend to connect the two without rebuilding the integration layer yourself.
If you already use NextGIS Frontend, version 4 is a good time to update your project.
And if you are starting a new application, explore the live examples, choose the mapping framework that fits your requirements, and use an existing example as the foundation for your own interface.
