Mennova
Start een gesprek
Alle cases

KampanYES

Overname & beveiliging

In deze case laat ik zien hoe ik een live folder-app van een vorig team heb overgenomen, beveiligd en verder ontwikkel.

KampanYES bundelt de digitale folders en aanbiedingen van winkels bij jou in de buurt in één app voor iOS en Android.

Beeld van KampanYES
Type
Mobiele appAdmin-dashboardBackend-API
Mijn rol
Software-architectFull-stack developerSecurityCI/CDOnderhoud & doorontwikkeling
Tijdlijn
2026 – heden
Opdrachtgever
KampanYES

Uitdagingen en doelen

KampanYES stond al live in de App Store en de Play Store toen ik het project overnam van een vorig ontwikkelteam. De app, het admin-panel en de API waren door verschillende ontwikkelaars gebouwd, met weinig documentatie en zonder de sleutels die nodig zijn om een app-update te publiceren.

Een security-review liet zien dat er meerdere problemen waren die binnen de OWASP Top 10 en bekende CVE's vielen. Die heb ik op ernst gerangschikt en als eerste opgelost, nog vóór nieuwe features.

Het doel: een veilig platform waar winkeliers en gebruikers op kunnen vertrouwen, en een stevige basis om weer rustig op door te bouwen.

Het winkelbeheer in het KampanYES admin-panel naast het inlogscherm van de mobiele app.
Winkeliers, beheerders en gebruikers delen één platform; veilige toegang voor elk van hen stond voorop.

Architectuur

De architectuur is opgebouwd rond een aantal uitgangspunten:

  • 01Één centrale API
  • 02Toegang per rol
  • 03Veilig als standaard
  • 04Beheer los van de app

De mobiele app en het admin-panel praten allebei met één REST API, die de data in MongoDB bewaart en pushmeldingen via Firebase verstuurt. Elke route controleert eerst wie je bent en welke rol je hebt, zodat beheerfuncties alleen voor beheerders bereikbaar zijn.

Diagram van de KampanYES-architectuur met de mobiele app, het admin-panel, de REST API, de database en de externe diensten.
App en admin-panel delen één API; externe diensten zijn met stippellijnen aangegeven.

Technieken

De backend is een REST API in Node.js en TypeScript, gebouwd met Express en MongoDB via Mongoose.

Inloggen gaat met JWT-tokens en per route wordt de rol gecontroleerd; pushmeldingen lopen via Firebase Cloud Messaging.

De app is gebouwd in Flutter, zodat iOS en Android uit één codebase komen, met Google Maps om je stad te kiezen.

Het admin-panel is een React- en TypeScript-applicatie met TanStack Query, Ant Design en Tailwind CSS, inclusief drag-and-drop om folders en categorieën te ordenen.

  • Flutter
  • Dart
  • GetX
  • Firebase
  • Google Maps
  • React
  • TypeScript
  • Vite
  • TanStack Query
  • Ant Design
  • Tailwind CSS
  • Node.js
  • Express
  • MongoDB
  • Mongoose
  • JSON Web Tokens
  • PM2
  • GitHub Actions
  • Biome

Agile / Scrum

Ontwikkelproces

Ik pak het werk per onderdeel aan: eerst de overdracht op orde, daarna de beveiligingsproblemen in volgorde van ernst en pas dan nieuwe features.

Elke bevinding kreeg een eigen plan met een testscenario, zodat ik na de fix kon aantonen dat het probleem echt verholpen was.

Beveiliging ging bewust vóór nieuwe functionaliteit. Nu die basis staat, is er weer ruimte voor doorontwikkeling, zoals een betere categorie-navigatie in de app.

Sprint01en weer opnieuw ↻
  1. Planning
  2. Analyseren
  3. Ontwerpen
  4. Implementeren
  5. Testen
  6. Onderhouden

Implementatie

Elke fix is als kleine, losse wijziging doorgevoerd, per bevinding te herleiden en apart te testen. Zo bleef de live app gewoon werken terwijl de API stap voor stap strenger werd.

Beheeracties zoals het versturen van pushmeldingen zijn nu alleen nog bereikbaar voor ingelogde beheerders.

Code-editor met beveiligde API-routes naast het scherm voor pushmeldingen in het KampanYES admin-panel.
Het versturen van een pushmelding is in de API alleen toegestaan voor beheerders.
Resultaten van contracttesten
Elke wijziging aan het admin-panel moet eerst foutloos bouwen voordat hij live kan.

Testen

Het admin-panel wordt bij elke push en pull request automatisch gebouwd in GitHub Actions, zodat een kapotte build nooit live gaat.

Voor elke beveiligingsfix is een vast testscenario uitgewerkt, waarmee ik controleer dat een oude aanvalsroute echt dicht is. Geautomatiseerde unit- en integratietesten voor de API staan als volgende stap op de planning.

Continuous development & integration

Iedere push en pull request op het admin-panel start een build in GitHub Actions. Wijzigingen op de main-branch worden daarna automatisch via SSH naar de server uitgerold. Zo gaat een fix live zonder handmatige stappen.

De API wordt met een deploy-script op de VPS bijgewerkt en draait onder PM2, dat het proces automatisch herstart als het onverwacht stopt. De mobiele app gaat via de App Store en de Play Store, waar elke update eerst door de review van Apple en Google gaat.

Diagram van de releasestraat voor het admin-panel, de backend-API en de mobiele app.
Het admin-panel rolt automatisch uit via GitHub Actions; API en app hebben elk hun eigen releaseroute.

01 / 03

Screenshots

Gebruikers zien de actuele folders in hun stad en bladeren er met één veeg doorheen.

kampanyes.mennova.nl

Verder kijken

Meer case studies

Bekijk alle cases

Mobiele app & API

Mektep

App voor aanwezigheidsregistratie bij een leerkring in Rijswijk: deelnemers checken met één tik in en sparen punten, beheerders plannen lessen.

Bekijk case

SaaS & automatisering

MijnDakje

Huurwoning-zoekplatform met automatisch reageren: MijnDakje doorzoekt bijna dertig verhuursites en meldt nieuwe matches binnen minuten.

Bekijk case

Mobiele app & productgids

Bellies Family

App voor de massage gun van Bellies Family: per klacht een instructievideo, het juiste opzetstuk, de snelheid en de duur, op iOS en Android.

Bekijk case

Een goed begin

Heb jij een digitaal vraagstuk dat verder mag?

Vertel me waar je aan werkt. Dan verken ik samen met jou wat er technisch nodig is om vooruit te komen.

Plan een kennismaking
vraag.tsroute.tscontact.ts

// Van vraag naar richtingconst route = { inzicht: true, richting: true, volgendeStap: 'helder',}plan(route)[klaar] tijd voor een kennismaking.