Zurück zu den Projekten
CMSEigene Demo von VirtuoLab

ContentLab · Content-Management-System

Demo: ein CMS für die Website der fiktiven Verhoeven Installatietechniek, mit Artikeln, Stellenanzeigen, Produktseiten, Freigabe, Planung und Live-Vorschau.

Screenshot der Demo ContentLab · Content-Management-System (CMS), entwickelt von VirtuoLab

Über ContentLab · Content-Management-System

Art
Eigene Demo von VirtuoLab
Technologien
ReactNext.jsTypeScriptTailwind CSS

ContentLab ist eine Demo von VirtuoLab für ein Content-Management-System, gebaut für die Website von Verhoeven Installatietechniek, einem erfundenen niederländischen Installationsbetrieb für Wärmepumpen und Solaranlagen. Die Demo ist eine React-Seite mit Next.js und TypeScript. Erstens zeigt die Inhaltsliste 12 Beispielinhalte: Artikel, Stellenanzeigen, Produktseiten und feste Seiten, mit dem Status veröffentlicht, geplant, in Review oder Entwurf. Suche und Filter nach Typ, Status und Autor funktionieren. Zweitens öffnet ein Klick einen Editor mit Markdown-Werkzeugleiste, eigenen Feldern pro Inhaltstyp, einer Zusammenfassung, die auch als Meta-Beschreibung dient, und Knöpfen zum Veröffentlichen oder Planen. Außerdem aktualisiert sich eine Vorschau in Desktop- und Smartphone-Breite beim Tippen. Mobil zählt: Laut StatCounter stammten im September 2026 rund 60 % des Webtraffics in Deutschland und rund 65 % in den Niederlanden von Smartphones. ContentLab hat keine Datenbank: Änderungen bleiben bis zum Neuladen erhalten, und alle Inhalte sind Beispieldaten.

CMSRedaktionsablaufLive-Vorschau
01

Was zeigt die Demo ContentLab?

Die Demo ContentLab ist ein Content-Management-System für die Website von Verhoeven Installatietechniek, einem erfundenen Installationsbetrieb, das VirtuoLab mit React, Next.js und TypeScript gebaut hat. Ein Rundgang hat drei Schritte. Schritt 1 ist die Inhaltsliste mit 12 Beispielinhalten: Artikel, Stellenanzeigen, Produktseiten und feste Seiten, jeweils mit dem Status veröffentlicht, geplant, in Review oder Entwurf. Suche und Filter nach Typ, Status und Autor funktionieren. Schritt 2 ist ein Klick auf einen Inhalt, der den Editor mit einer Markdown-Werkzeugleiste öffnet, dazu ein Zähler für Wörter und Lesezeit. Jeder Inhaltstyp hat eigene Felder, etwa das Gehalt bei einer Stellenanzeige oder den Preis bei einem Produkt, und die Zusammenfassung dient auch als Meta-Beschreibung für Suchmaschinen wie Google. Schritt 3 ist das Veröffentlichen: sofort, zur Freigabe oder geplant auf Datum und Uhrzeit, mit Übersetzungen auf Niederländisch, Englisch und Deutsch pro Inhalt. Eine Vorschau in Desktop- und Smartphone-Breite aktualisiert sich beim Tippen. Außerdem runden Bildschirme für Medien, Inhaltstypen, Sprachen, Benutzer und Einstellungen die Demo ab. Änderungen bleiben bis zum Neuladen erhalten, denn ContentLab hat keine Datenbank.

02

Welches Problem löst ein individuelles CMS wie ContentLab, und für wen?

Ein individuelles CMS wie ContentLab löst das Problem von Redakteuren, die das Ergebnis einer Änderung erst sehen, wenn die Seite live ist. Am meisten profitieren Marketingteams, Verlage, Onlineshops mit vielen Produktseiten und Organisationen mit Inhalten in mehreren Sprachen. Ein Standard-CMS zeigt oft ein Formular mit Feldern, während die echte Seite auf dem Smartphone anders aussieht. Eine Live-Vorschau pro Gerät nimmt das Rätselraten weg und spart Korrekturrunden. Außerdem geben klare Status wie Entwurf, Review und veröffentlicht einem kleinen Team einen einfachen Freigabeprozess. In der Praxis lohnt sich ein individuelles CMS vor allem, wenn Inhalte eine feste Struktur haben, zum Beispiel Produkte, Stellenanzeigen oder Standorte, und ein allgemeiner Editor im Weg steht. Für eine einfache Unternehmenswebsite ist eine Website mit WordPress oft die bessere und günstigere Wahl. Laut W3Techs lief WordPress im Oktober 2026 auf 39,7 % aller Websites und auf 58,4 % der Websites mit bekanntem CMS. VirtuoLab berät zu beiden Optionen ehrlich und passend zum Budget.

03

Wie baut VirtuoLab ein Content-Management-System für ein echtes Unternehmen?

VirtuoLab baut ein Content-Management-System für ein echtes Unternehmen ausgehend vom Inhaltsmodell, nicht vom Editor. Schritt 1 ist ein Scope-Gespräch über Inhaltstypen, Felder, Sprachen, Rollen und den Freigabeprozess. Schritt 2 ist Design und Validierung: Editor und Vorschau werden mit echten Texten des Unternehmens getestet. Schritt 3 ist Entwicklung und Test, zum Beispiel als Headless-Aufbau mit Next.js für die Website und PostgreSQL oder MongoDB für die Inhalte. In einem echten Projekt ergänzt VirtuoLab einen echten Login mit Rollen, eine Datenbank, Medienspeicher und eine Versionshistorie, denn die Demo zeigt Rollen und Medien nur als Bildschirm. Medien verdienen Sorgfalt: Laut Web Almanac 2025 von HTTP Archive ist das Largest-Contentful-Paint-Element auf 76 % der mobilen Seiten ein Bild, deshalb sollten Uploads automatisch verkleinert werden. Schließlich ist Schritt 4 Launch und Support. Als Richtwert kostet eine mittelgroße Web-App 10.000 € bis 25.000 €, bei einer Projektdauer von 6 bis 12 Wochen. Der genaue Preis folgt nach einem kostenlosen Kennenlerngespräch.