As part of a modernization initiative for Landbrugslotteriet's website, I built a reusable interactive map section that displays insect hotel locations across Denmark. This feature was designed to be modular and CMS-configurable, allowing editors to insert it anywhere on the site without needing developer involvement. The project involved full-stack development using C#, .NET with Razor Pages on the backend, and modern JavaScript (ES6), Sass, and Bootstrap on the frontend.
One of the key challenges was handling the dynamic rendering of a large number of map points while maintaining performance and UX quality. I implemented a system where hotels are grouped by city, and only relevant clusters are shown as the user navigates. When a map point is clicked, a side panel opens showing detailed information, including address and description, pulled directly from Umbraco's CMS. The UI updates responsively to match the user's interactions, and the panel stays in sync with the map state.
Another critical aspect was the submission flow. Users could submit their own insect hotel via a built-in form in the side panel. I configured this form using Umbraco Forms, triggering a custom workflow that creates new content nodes inside the CMS. Submissions are then routed for approval through Umbraco's built-in moderation system. This gave the client a self-service, structured way to expand their map organically.
This project demonstrates my ability to deliver production-level features in a legacy tech stack, while still introducing modern, modular frontend patterns. It also highlights experience with CMS integrations, reusable component design, and performance-sensitive UI work — all crucial for real-world, user-facing web applications.
