Power Apps Code Apps: Wenn Low-Code nicht mehr reicht

Power Apps ist stark. Formulare, Workflows, Dashboards – in Stunden statt Wochen. Aber irgendwann stößt du an eine Wand.

Der Standard-Kalender sieht aus wie 2010. Der Außendienst will eine interaktive Karte. Marketing braucht ein Signaturfeld. Das Controlling will endlich einen richtigen Gantt-Chart statt einer Liste. Und Power Fx kommt an seine Grenzen, wenn Logik wirklich komplex wird.

Genau hier kommen Power Apps Code Apps ins Spiel.

Was sind Power Apps Code Apps?

“Code Apps” ist der Marketingbegriff – das technische Fundament heißt Power Apps Component Framework, kurz PCF.

PCF ist Microsofts offizielles Framework, mit dem Entwickler eigene Komponenten für Power Apps bauen können – mit echtem Code (TypeScript, HTML, CSS), beliebigen JavaScript-Libraries und dem vollen Zugriff auf den Browser-DOM. Diese Komponenten integrieren sich nahtlos in Canvas Apps und Model-Driven Apps, als wären sie normale Power Apps-Controls.

Der entscheidende Unterschied: Während Standard-Power-Apps auf vordefinierte Controls beschränkt ist, können PCF-Komponenten aussehen, sich verhalten und funktionieren wie du es willst.

Wie funktioniert PCF technisch?

Eine PCF-Komponente hat einen klaren Lifecycle – ähnlich wie ein React-Komponent:

init()         → Initialisierung (einmalig beim Laden)
updateView()   → Wird aufgerufen wenn Daten oder Properties sich ändern
getOutputs()   → Liefert Werte zurück ans Power Apps-Formular
destroy()      → Aufräumen beim Entladen

Entwickelt wird mit TypeScript (Pflicht), HTML/CSS nach Bedarf, und beliebigen externen Libraries wie React, Chart.js, Leaflet oder D3.js. Das Build-System basiert auf npm und dem Power Platform CLI.

Die zwei Komponenten-Typen

1. Field Components Ersetzen einzelne Felder in Formularen. Beispiel: Statt eines nackten Zahlenfelds für eine Bewertung erscheinen klickbare Rating-Sterne. Die Power App übergibt den Wert, die Komponente rendert das UI, und beim Ändern fließt der neue Wert zurück.

2. Dataset Components Ersetzen Listen und Views in Model-Driven Apps. Statt einer langweiligen Tabelle mit Terminen: ein vollwertiger Kalender. Statt einer Liste mit Aufgaben: ein Kanban-Board. Die Daten kommen aus Dataverse – was du damit machst, liegt bei dir.

Deployment: Einmal bauen, überall nutzen

Fertige Komponenten werden in eine Power Platform Solution gepackt (.zip-Datei) und über das Power Platform Admin Center oder das CLI deployed. Einmal in einer Umgebung verfügbar, kannst du sie in beliebig vielen Apps einsetzen – und bei Updates reicht ein neuer Solution-Import.

Wann PCF – und wann reicht Standard-Power-Apps?

Ehrliche Einschätzung:

Situation	Empfehlung
Schnelles Prototyping, Standard-UI	Canvas App ohne PCF
Kein Pro Developer im Team	Standard Power Apps, ggf. Community-Komponenten
Spezielle UI-Anforderung (Kalender, Karte, Chart)	PCF oder Community-Komponente aus pcf.gallery
Eigene Unternehmensstandards für UI	Eigene PCF-Komponente entwickeln
Komplexe Business-Logik, externe APIs	PCF (direkte HTTP-Calls möglich)
Wiederverwendung über viele Apps	PCF (einmal bauen, überall nutzen)

5 Anwendungsfälle aus der Praxis

1. Interaktiver Projektzeitplan (Gantt)

Ein Projektmanagement-Tool in Power Apps – aber die Liste reicht nicht. Mit einer PCF-Komponente (z.B. auf Basis von dhtmlxGantt) wird aus der flachen Tabelle ein echtes Gantt-Diagramm, das Projektleiter intuitiv bedienen können.

Wo eingesetzt: Model-Driven App auf Basis Dataverse, Projektdaten direkt aus Dataverse geladen.

2. Außendienst-App mit Karten

Servicetechniker sollen Kundenstandorte auf einer Karte sehen und direkt aus der Karte heraus Aufträge öffnen. Mit Leaflet.js in einer PCF Dataset-Komponente: Pins auf der Karte statt einer Adressliste.

Wo eingesetzt: Canvas App, Kundendaten aus Dataverse oder SharePoint.

3. Signaturfeld für Abnahmen

Lieferungen, Serviceberichte, Abnahmedokumente – alles braucht eine Unterschrift. Eine PCF Field-Komponente rendert ein Zeichenfeld (canvas-basiert), speichert die Signatur als Base64-String direkt in Dataverse.

Wo eingesetzt: Canvas App auf Tablets für den Außendienst.

4. Rich-Text-Editor in Formularen

Angebote und Servicebeschreibungen direkt in Power Apps schreiben – aber mit Formatierung, Listen, Fettdruck. Eine PCF-Komponente bindet z.B. den Quill-Editor ein und speichert HTML-formatierten Text in Dataverse.

Wo eingesetzt: Model-Driven App, Verkaufschancen oder Servicefälle.

5. Barcode-Scanner ohne native App

Lagerbestandserfassung per Smartphone-Kamera direkt in einer Canvas App. Eine PCF-Komponente greift auf die Kamera zu, scannt Barcodes (via ZXing.js) und übergibt den gescannten Wert an Power Apps – kein nativer App-Download nötig.

Wo eingesetzt: Canvas App, Lagerverwaltung in SharePoint/Dataverse.

Developer-Erfahrung: Was brauche ich zum Starten?

Der Einstieg ist überschaubar:

Tools:

Visual Studio Code + “Power Platform Tools” Extension
Node.js LTS
Power Platform CLI (pac)
.NET Build Tools

Erster Schritt:

pac pcf init --namespace WITC --name MyComponent --template field --run-npm-install
code .

Das war’s. Du hast ein vollständiges Komponenten-Gerüst mit Manifest, TypeScript-Datei und Test Harness. Lokales Testen läuft ohne Power Apps-Umgebung direkt im Browser.

Community-Ressourcen:

pcf.gallery – hunderte fertiger Komponenten, viele Open-Source
GitHub: PowerApps-Samples – offizielle Microsoft-Samples
PCF Builder für XrmToolBox – visueller Build-Helfer

Kosten und Lizenzen

PCF selbst ist kostenlos und Open-Source. Was Geld kostet:

Canvas Apps mit PCF: Power Apps per-user (ab ~15 €/Monat/User) oder per-app Plan
Model-Driven Apps mit PCF: Power Apps Premium oder Dynamics 365 Plan
Entwicklung: Einmalig für eine Komponente, dann beliebig oft wiederverwendbar

Für Unternehmen mit Power Apps Lizenzen entstehen in der Regel keine Zusatzkosten – PCF ist im Lizenzumfang inklusive.

Fazit: Low-Code und Code-First gehören zusammen

Power Apps Code Apps sind kein Widerspruch zu Low-Code – sie sind die natürliche Erweiterung. Der typische Weg in Projekten: Schneller Start mit Standard-Power-Apps, dann gezielte Erweiterung mit PCF-Komponenten dort, wo’s wirklich nötig ist.

Das Ergebnis: Business-Apps, die wirklich zur Arbeitsweise deiner Leute passen. Nicht umgekehrt.

Du willst wissen, ob PCF für euren nächsten Power-Apps-Einsatz das Richtige ist? Dann lass uns kurz sprechen.

Dieser Artikel wurde #CoCreatedWithAI erstellt und von Gerrit Walther geprüft.