Tobias Ludwig
Start
ServicesWeb, Apps, Backend und KIPlanerBausteine wählen, Preis sofort sehenBranchen-DemosBeispielseiten für Handwerk, Praxis, GastroReferenzenKundenprojekte mit ErgebnisMatch-CheckPasst das Vorhaben zu mir?Über michWer hinter der Seite steht
ProjekteEigene Software und Open SourceProdukteFertige Apps und WerkzeugeFlutterPlugins und PaketeBlogNotizen aus der Praxis
ToolsKleine Helfer im BrowserTech-WikiWerkzeuge und Stacks, kurz erklärtShowcaseDemos, Shader, Inszenierungen
Support & HilfeHilfe zu laufenden ProjektenMein KontoTickets und Zugänge
Erstgespräch
Erstgespräch buchenKostenloser Kennenlern-CallKontakt schreibenNachricht per Formular
$whoami
Tobias Ludwig
DevOps · Application Manager · Software Engineer
$ls /pages
tobias-ludwig/projekte/kontakt/kalender/impressum/datenschutz/
$git remote
github.com/nexas105
online·next.js 16·hono·postgresql
© 2026 tjl·stay curious_
Ambient OFF
Weiter so… ↓↓ ← → ← → B A
/referenzen/elektrotechnik-m-m/Webentwicklung/Freelance

Case Study für Elektrotechnik M&M GbR, Elektrofachbetrieb und Ingenieurbüro in Bonn-Beuel

elektrotechnik-m-m.de

Relaunch der Website eines Elektrofachbetriebs in Bonn: Next.js mit eigenem CMS, Anfrage-Tickets, Terminkalender, 3D-Raumplaner und Chat-Helfer.

Live ansehen
case study

Snapshot

Elektrotechnik M&M GbR, Elektrofachbetrieb und Ingenieurbüro in Bonn-Beuel

Konzept, Design, Entwicklung und Betrieb

category

Webentwicklung

duration

seit September 2026 · laufend

team

1 Person

period

09/2026 -> laufend
Next.jsReactTypeScriptTailwind CSSSQLiteThree.jsDocker
Live ansehen
Next.jsReactTypeScriptTailwind CSSSQLiteThree.jsDockerCoolify
LiveStoryHighlightsDetails
00

Live Preview

https://www.elektrotechnik-m-m.de/
Öffnen
Vorschau lädt beim Scrollen
02

Story

Story

Scroll-Flow durch Challenge, Umsetzung und Wirkung

01 / 03
scroll →
challenge.md
01

01 / Problemraum

Herausforderung

Die alte WordPress-Seite widersprach sich bei Telefonnummer, E-Mail und Rechtsform, Anfragen kamen als lose Mails an. Der Betrieb wollte Inhalte selbst ändern, ohne Plugins pflegen zu müssen.

solution.md
02

02 / Umsetzung

Lösung

Next.js 16 mit eigenem CMS auf SQLite: Die Formulare im Admin entstehen aus den Standardinhalten, jede Änderung hat einen Verlauf mit Wiederherstellen. Jede Anfrage wird ein Ticket mit Statusverlauf, Kundenlink und PDF-Beleg aus einem eigenen PDF-Schreiber. WhatsApp-Business-Anbindung mit geprüftem Webhook, Termine als ICS-Abo, Raumplaner in Three.js mit Türen, Fenstern, Leitungsführung und Kosten je Raum. Deployment als Docker-Container auf Coolify, jeder Push geht automatisch live.

results.md
03

03 / Wirkung

Ergebnisse

Die Seite ist seit Ende September 2026 unter www.elektrotechnik-m-m.de live. Die Firmendaten sind gegen die Visitenkarte geklärt, Anfragen und Aufträge laufen über Tickets statt über das Postfach. Weiterentwicklung und Betrieb laufen über mich.

03

Highlights

impact.md
  • Eigenes CMS mit Verlauf, Mediathek und Website-Prüfung
  • Anfragen und Aufträge als Tickets mit Kundenlink und PDF-Beleg
  • Terminkalender mit Kalender-Abo und öffentlichen Terminen
  • 3D-Raumplaner für die Elektroplanung
  • Chat-Helfer mit vorbereiteten Antworten, optional über Claude
04

Projektbeschreibung

case-study.md

Für Elektrotechnik M&M, einen Elektrofachbetrieb mit Ingenieurbüro in Bonn-Beuel, habe ich die alte WordPress-Seite durch eine eigene Website ersetzt. Der Betrieb pflegt alle Inhalte selbst über ein eigenes CMS: Leistungen, Referenzen, Blog, FAQ, Preise, Einsatzorte und Firmendaten.

Kontaktanfragen und Aufträge landen als Tickets im Admin, mit geheimem Kundenlink, Antworten per Mail und PDF-Beleg. Dazu kommen ein Terminkalender mit Kalender-Abo, ein 3D-Raumplaner für die Elektroplanung und ein Chat-Helfer, der mit vorbereiteten Antworten oder auf Wunsch über Claude antwortet. Konzept, Gestaltung, Entwicklung und Betrieb liegen bei mir.

scope

Kunde

Elektrotechnik M&M GbR, Elektrofachbetrieb und Ingenieurbüro in Bonn-Beuel

Dauer

seit September 2026 · laufend

Rolle

Konzept, Design, Entwicklung und Betrieb

Team

1 Person

Kategorie

Webentwicklung

Stack

8 Technologien

links
Live ansehen
tech-stack
Next.jsReactTypeScriptTailwind CSSSQLiteThree.jsDockerCoolify
Vorigealexander-mittag.deNächsteSchmuckwerkstatt Mondstein