Headless WordPress · Next.js

Ein modernes Frontend. Ohne das bestehende CMS zu ersetzen.

Für das digitale ABB-Magazin „Destination Zukunft“ entwickelten wir eine neue Frontend-Architektur auf Basis von Next.js. Das bestehende WordPress-System blieb als Headless CMS erhalten. So konnte ABB die vorhandene Redaktionsinfrastruktur weiterverwenden, die Kosten einer vollständigen CMS-Migration vermeiden und zugleich die technische Grundlage für eine moderne Webanwendung schaffen.

Entwicklung eines digitalen Webmagazins für die ABB Group. Valanor realisierte die technische Umsetzung der Plattform mit interaktiven Funktionen für eine zeitgemäße Nutzung redaktioneller Inhalte.

Kunde
Ruess Group
Typ
Website
Status
Laufend
Leistungen
  • Platform Engineering
  • Software Engineering

Digitale Inhalte brauchen me

Technische Entwicklung des ABB-Webmagazins „Destination Zukunft“

Ein digitales Fachmagazin muss redaktionelle Inhalte übersichtlich darstellen, unterschiedliche Nutzungsgewohnheiten berücksichtigen und regelmäßig um neue Beiträge erweitert werden können. Gleichzeitig sollen bestehende Systeme und eingespielte Redaktionsprozesse möglichst erhalten bleiben.

Für die ABB Group entstand mit „Destination Zukunft“ ein digitales Magazin rund um Industrie, Energie, Digitalisierung und technologische Entwicklungen. Die Ruess Group verantwortete die Konzeption und Gestaltung des Magazins.

Valanor übernahm die technische Entwicklung. Unsere Aufgabe bestand darin, das vorgegebene Design als eigenständige Webanwendung umzusetzen, interaktive Funktionen zu integrieren und das bestehende WordPress-System für die Inhaltsverwaltung anzubinden.

Im Mittelpunkt stand eine Architektur, die neue Möglichkeiten für die Frontend-Entwicklung eröffnet, ohne eine vollständige Erneuerung der bestehenden Content-Infrastruktur zu erfordern.

Nicht jedes System muss ersetzt werden, um es zu modernisieren.

Bestehende Infrastruktur gezielt weiterentwickeln.

Ein vollständiger Wechsel des Content-Management-Systems hätte zusätzliche Kosten verursacht: Bestehende Inhalte hätten migriert, Redaktionsprozesse hätten angepasst und neue Abläufe hätten eingeführt werden müssen.

Dabei war WordPress als System zur Verwaltung redaktioneller Inhalte weiterhin geeignet. Die eigentlichen Anforderungen lagen in der Darstellung, der Nutzerführung und den zusätzlichen Funktionen des Magazins.

Deshalb entschieden wir uns für eine Headless-Architektur. WordPress blieb als CMS bestehen, während das Frontend unabhängig davon mit Next.js entwickelt wurde.

Durch diese Trennung konnten vorhandene Strukturen weiterverwendet und die Frontend-Entwicklung unabhängig vom klassischen WordPress-Theme-System umgesetzt werden.

Das Ergebnis der Architekturentscheidung: Die bestehende CMS-Infrastruktur blieb erhalten. Gleichzeitig entstand die technische Grundlage für ein individuell entwickeltes digitales Magazin – ohne die Kosten und Risiken einer vollständigen CMS-Migration.

Bestehende Systeme erhalten. Technische Grenzen auflösen.

Die technische Entwicklung konzentrierte sich auf vier Bereiche: die Weiterverwendung von WordPress als Headless-CMS, die Entwicklung eines unabhängigen Next.js-Frontends, die Integration zusätzlicher Magazin-Funktionen und die Reduzierung unnötiger Migrationskosten.

WordPress als Headless CMS weiterverwenden

WordPress blieb das zentrale System für die Verwaltung redaktioneller Inhalte. Statt Inhalte und Redaktionsprozesse auf eine neue Plattform zu migrieren, wurde das bestehende CMS an das eigenständige Frontend angebunden.

Die Redaktion konnte damit ihre gewohnte Arbeitsumgebung weiter nutzen, während die Darstellung der Inhalte unabhängig von WordPress entwickelt wurde.

Eigenständiges Frontend mit Next.js entwickeln

Mit Next.js entwickelten wir eine eigenständige Frontend-Anwendung für das digitale Magazin. Die Trennung zwischen Content-Verwaltung und Benutzeroberfläche ermöglicht es, Design, Navigation und Funktionen unabhängig von der klassischen WordPress-Architektur umzusetzen.

Das schafft mehr Flexibilität bei der Weiterentwicklung der Website, ohne gleichzeitig die Redaktionsinfrastruktur verändern zu müssen.

Interaktive Funktionen in das Magazin integrieren

Ein digitales Magazin soll unterschiedliche Formen der Nutzung unterstützen. Deshalb implementierten wir neben der Artikeldarstellung zusätzliche Funktionen wie Dark Mode, Benachrichtigungen, eine Merkliste und eine Vorlesefunktion.

So können Leser Inhalte nicht nur aufrufen, sondern für eine spätere Nutzung vormerken, ihre Darstellung anpassen oder sich Beiträge vorlesen lassen.

Migrationskosten durch gezielte Modernisierung vermeiden

Nicht jede technische Weiterentwicklung erfordert einen vollständigen Plattformwechsel. Da WordPress die Anforderungen an die redaktionelle Verwaltung weiterhin erfüllte, konnte das bestehende System erhalten bleiben.

Die Entwicklungsarbeit konzentrierte sich auf das neue Frontend und die erforderlichen Integrationen. Dadurch entfielen wesentliche Aufwände einer vollständigen CMS-Migration.

Modernisiert, ohne bei null anzufangen.

Das Ergebnis: Headless WordPress und Next.js im produktiven Einsatz.

Mit „Destination Zukunft“ entstand für ABB ein digitales Webmagazin, das die bestehende WordPress-Infrastruktur mit einem eigenständig entwickelten Next.js-Frontend verbindet.

Die Redaktion kann Inhalte weiterhin über WordPress verwalten. Gleichzeitig ermöglicht das entkoppelte Frontend eine individuelle Darstellung der Beiträge und die Integration interaktiver Funktionen.

Durch die Weiterverwendung des bestehenden CMS konnten zusätzliche Migrationskosten vermieden werden. Die Modernisierung konzentrierte sich auf die Teile der Plattform, die tatsächlich neue technische Anforderungen erfüllen mussten.

Das Projekt zeigt, wie sich bestehende Unternehmenssysteme gezielt weiterentwickeln lassen, ohne funktionierende Komponenten unnötig zu ersetzen.

Softwareentwicklung & Systemmodernisierung

Nicht jedes bestehende System muss ersetzt werden.

Ihre bestehende Plattform erfüllt ihren Zweck, aber neue Anforderungen lassen sich nur mit wachsendem Aufwand umsetzen? Ein vollständiger Systemwechsel ist nicht immer die wirtschaftlich sinnvollste Lösung.

Wir analysieren Ihre bestehende Architektur und entwickeln gezielt die Komponenten weiter, die Ihre Anwendungen ausbremsen. Ob Headless CMS, Frontend-Modernisierung oder die Integration bestehender Systeme – entscheidend ist, was erhalten bleiben kann und wo technische Veränderungen notwendig sind.

Technisches Erstgespräch vereinbaren

Aleksandar Basara

Managing Director

aleks@valanor.co

+49 (0) 711 16 44 6 83

Lindenspürstrasse 22, 70176 Stuttgart

Aleksandar Basara - Managing Director and CTO at VALANOR