All projects
B
Environment / SaaS

React, Vite, OpenLayers, Tailwind CSS, Redux Toolkit, Zustand, Recharts

React frontend with Vite, OpenLayers mapping, Tailwind CSS, Redux Toolkit + Zustand state management, and Recharts charts.

React Frontend
OpenLayers Maps
Tailwind Styling
Dev Role

The frontend uses React with Vite for a fast development cycle and optimized builds. Mapping is built on OpenLayers, chosen for its flexibility in handling multiple layers and varied geographic projections. Each data layer is an independent OpenLayers layer, with visibility and opacity controls.

State management combines Redux Toolkit for global state (user, configuration, active filters) and Zustand for the local state of the map components (viewport, active layers, selection). This separation avoids a monolithic Redux store while keeping predictability for shared data.

Tailwind CSS structures the design system with native CSS tokens. Recharts generates the comparative charts with configurable axes and interactive tooltips. The whole codebase is typed with strict TypeScript to guarantee data consistency across the visualization layers.

Technical architecture

React with Vite for fast builds, TypeScript strict mode.

OpenLayers mapping with vector and raster layers, multiple projections.

Tailwind CSS for styling, reusable components.

State management: Redux Toolkit for global state, Zustand for local state.

Recharts visualization: real-time charts, sparklines, heatmaps.

Modular architecture with lazy loading and code splitting.

Technical highlights

React

Vite, strict TypeScript

OpenLayers

Advanced vector mapping

Redux + Zustand

Dual state management

Technical stack

React
TypeScript
Vite
OpenLayers
Tailwind CSS
Redux Toolkit
Zustand
Recharts
Role Frontend Developer
Duration 2025
Engagement Long-term contract (Tier B)

A similar technical engagement?

A brief, a repo, or a quick call - whatever works.