Das ist unser Tech Stack!

/ Cyberhouse - ZurĂŒck zur Übersicht

Kundenprojekte bringen neben funktionalen und konzeptionellen Anforderungen auch stets neue technische Herausforderungen mit sich. Web-Technologien und moderne Frameworks helfen uns diese umzusetzen. Im Zentrum steht im Cyberhouse immer das Open Source Enterprise Content Management System TYPO3 (www.typo3.com). Dabei liegen unsere StĂ€rken in der Integration von digitalen Services, der Anbindung von diversen Schnittstellen und der nahtlosen Integration von anderen E-Commerce Systemen. In diesem Artikel erfĂ€hrst du mehr ĂŒber unseren Tech Stack und die Tools, mit welchen wir arbeiten.

First things first: was ist ĂŒberhaupt ein Tech Stack?

Tech Stack steht fĂŒr Technology Stack und fasst eine Sammlung von verschiedenen Anwendungen, Tools und Werkzeugen zusammen, mit denen zum Beispiel eine Webagentur Websites umsetzt. Doch nicht nur die konkreten Programmiersprachen oder spezielle Frameworks zĂ€hlen zum Tech Stack - auch alle Anwendungen rundherum wie das Ticketsystem zur Verwaltung der Tasks, die Plattform zur Dokumentation oder SEO Tools gehören dazu.

Welche Technologien, Programmiersprachen und Frameworks werden allgemein fĂŒr die Programmierung eingesetzt?

Wie bereits erwĂ€hnt, steht im Zentrum unseres Tuns das Open Source CMS TYPO3. Unsere TYPO3-Projekte basieren auf unserem Cyberhouse-internen TYPO3-Base-Projekt, welches fĂŒr neue Projekte eine gut strukturierte Basis bietet. Wir arbeiten laufend an der Weiterentwicklung und bringen gewonnene Erfahrungen ein. So bleibt unser TYPO3-Base nicht nur technologisch auf aktuellstem Stand. TYPO3 im Allgemeinen basiert auf der Skriptsprache PHP und folgt dem Model-View-Controller-Paradigma. Als Template-Engine kommt Fluid zum Einsatz und mittels TypoScript und YAML werden diverse Konfigurationen im CMS gesetzt.

Das Webdesign wird von der Frontend-Entwicklung mittels HTML, CSS und JavaScript in eine fĂŒr den Browser verstĂ€ndliche Sprache ĂŒbersetzt. Dabei setzen wir auf SCSS, die Templating Language Nunjucks und das Framework Bootstrap. Browserstack ermöglicht uns, einfaches Crossbrowser-Testing durchzufĂŒhren und so sicherzustellen, dass unsere Produkte in unterschiedlichen Browsern einsatzfĂ€hig sind.

Die Teams - sowohl Frontend als auch Backend - arbeiten auf lokalen Entwicklungsumgebungen und die Kundenprojekte laufen somit lokal in virtuellen Docker-Containern. SĂ€mtlicher Code ist in git versioniert und wird zentral via Bitbucket verwaltet und auf die unterschiedlichsten Umgebungen ausgeliefert. So können verschiedene DatenstĂ€nde schnell und unkompliziert auf den unterschiedlichen Systemen ausgespielt werden. Als IDE (Integrated Development Environment) oder auf Deutsch „Integrierte Entwicklungsumgebung“ wird auf PhpStorm vertraut.

Ganz allgemein gibt es fĂŒr jedes Projekt neben dem Produktivsystem auch ein fĂŒr den Kunden zugĂ€ngliches STAGING-System, auf welchem neue Features vorab und losgelöst vom Produktivsystem getestet und freigegeben werden können.

Bei Hosting setzen wir primÀr auf 


Mittwald, da dort speziell fĂŒr TYPO3-Projekte optimierte Packages seit der ersten Stunde zur VerfĂŒgung gestellt werden. Auf TYPO3 abgestimmte Pakete, schneller Service sowie hohe Performance bestĂ€rken uns immer wieder in der Auswahl von Mittwald, als Webhoster. In Abstimmung mit Kunden und in AbhĂ€ngigkeit von den erwarteten Zugriffszahlen wird ein performantes Paket ausgewĂ€hlt.

NatĂŒrlich stehen wir aber auch anderen Webhosting-Anbieter offen gegenĂŒber – je nach Anforderung des Kunden. FĂŒr eine schnelle und performante VerfĂŒgbarkeit setzen wir auf spezielle CDN-Anbieter, wie bunny.net.

Aller guten Dinge sind drei: Grafik als Dritte im Bunde.

Individuellen Webdesigns und Grafiken fĂŒr unsere Kund:innen werden durch den gesamten Design- und Konzeptionsprozess laufend weiterentwickelt. FĂŒr die Umsetzung unserer grafischen Produkte wird in erster Linie Sketch verwendet und anschließend mittels Invision unseren Kunden prĂ€sentiert. DarĂŒber hinaus ist auch die Adobe Creative Cloud mit Photoshop, Illustrator und InDesign im Einsatz.

Und was verwenden wir sonst noch?

FĂŒr die laufende Kommunikation untereinander verwenden wir intern MS Teams. FĂŒr Jour Fixes, Abstimmungen und den tĂ€glichen Kaffeetratsch ist ebenfalls MS Teams unser Tool der Wahl. FĂŒr die Kommunikation innerhalb der E-Conomix Group kommen auch Slack und Google Meets gelegentlich zum Einsatz.

Unsere Ressourcenplanung, Zeitbuchungen und Kundenverwaltung lĂ€uft ĂŒber Teambox und fĂŒr die Ticketverwaltung und Dokumentation setzen wir Produkte von Atlassian (Jira und Confluence) ein.

Last but not least: SEO-Tools, damit die Websites auch gefunden werden.

FĂŒr eine gute Sichtbarkeit in Suchmaschinen und Analysen arbeiten wir mit der Google Search Console, Google Analytics, sowie Google My Business und Google Lighthouse. Aber nicht nur Google ist bei uns im Einsatz. Auch Google Analytics Alternativen wie zum Beispiel Matomo sind im Einsatz. FĂŒr Reports und Analysen zur Verbesserung der Websites nutzen wir zudem Semrush.

Alles schön und gut. Aber wieso arbeiten wir so strukturiert und einheitlich?

Nachvollziehbare und dokumentierte CodestĂ€nde sowie standardisierte Arbeitsweisen und Tools quer ĂŒber das Team hinweg reduzieren die FehleranfĂ€lligkeit in der kollaborativen Entwicklung eines Projektes auf ein Minimum. So kann sich dieses auf die wesentlichen TĂ€tigkeiten sowie den Projektfortschritt fokussieren.

Du bist interessiert an einem Job bei Cyberhouse? Dann bewirb dich jetzt!