Frontend Entwicklung
Performant, semantischFrontend-Entwicklung hat sich in den letzten Jahren zu einer eigenen Disziplin entwickelt, die von vielen klassischen Webdesignern nicht mehr beherrscht wird. Immer schneller werdende Hardware, hochauflösende Displays und mobile Endgeräte haben die Entwicklung vorangetrieben: Webfonts, Responsive Images, Parralax, HTML5 Video, Touch-Events, interaktive SVGs sind verbreitet. Die semantische Auszeichnung von Seitenelementen für technische Suchmaschinenoptimierung ist zur Minimalanforderung geworden.
Dank einfach zu erlernender CSS-Frameworks wie Bootstrap und Foundation lassen sich schnell ansehnliche Ergebnisse erzielen - doch wer die zugrundliegende Technologie-Prinzipien nicht beherrscht, läuft schnell in Probleme: Aufgeblähte CSS und JavaScript Dateien, dutzende unnötige HTTP-Requests, langsame Frontend-Performance und ruckelnde Webseiten sind das Ergebnis für den Besucher. Schlecht wartbarer Code, unzählige Bugs und veraltete Bibliotheken für den Entwickler.
Moderne Frontend-Entwicklung
Über 80% aller Webseiten setzen auf PHPModerne Frontend-Entwicklung setzt auf optimierte Asset-Pipelines, zur automatisierten Generierung von Bild-, CSS- und JavaScript Dateien. Die Anzahl der HTTP-Requests wird minimiert, blockierende Elemente vermieden. Animationen werden so gestaltet, dass der Großteil der Arbeit von dem schnellen Grafikprozessor erledigt wird. Die Neuberechnung des Layouts wird vermieden, um die Frontend-Geschwindigkeit zu verbessern.
Bei großen Projekten wird EcmaScript 6 oder Typescript eingesetzt, um bisherige Schwachstellen bei der JavaScript-Entwicklung zu umgehen. Automatisiertes Frontend-Testing sichert die Funktionsfähigkeit Ihrer Anwendung.
Auf Inhaltsebene werden OpenGraph Tags für Facebook-Sharing eingesetzt und dazugehörige Medieninhalte (dynamisch) erzeugt. Die semantische Anreicherung des Quelltexts Schema.org verbessert nachhaltig die Platzierung in Suchmaschinen.
Frameworks und Bibliotheken
Schnelle und sichere Software-EntwicklungAuch im Frontend-Bereich haben sich viele Frameworks etabliert. jQuery als Pionier der JavaScript-Bibliotheken wird auch heute noch häufig für kleinere Frontend-Anwendungen eingesetzt. Sobald jedoch Business-Logik umgesetzt werden soll, stößt jQuery an seine Grenzen. Spaghetti-Code ist häufig das Ergebnis, wenn nicht rechzeitig auf eine wartbare Alternative migriert wird.
Bei den JavaScript Frameworks spielen derzeit React und Angular die größte Rolle. Beide haben Ihre Vor- und Nachteile und erfordern eine gewisse Einarbeitungszeit von Entwicklern. Diese macht sich jedoch in größeren Projekt schnell bezahlt: Testbarkeit, Wartbarkeit und der modulare Software-Architektur eignen sich bestens für die Programmierung in Teams. Die älteren Bibliotheken Backbone.js und Ember.js kommen bei neuen Projekt kaum mehr zum Einsatz.
In der CSS-Ökosystem hat sich Bootstrap zum Quasi-Standard entwickelt: Das von Twitter ins Leben gerufene Framework erscheint 2016 in Version 4 - und erstmalig mit Sass als Build-System. Damit hat der CSS-Präprozessor Less sein Vorzeigeprojekt verloren, und wird damit wohl auch langfristig gegenüber dem Konkurrenten Sass den kürzeren ziehen.
Bower und NPM leben beide im Frontend-Bereich und werden häufig parallel eingesetzt: NPM für JavaScript Bibliotheken, die serverseitig ausgeführt werden und Bower für Komponenten, die überwiegend für den Browser bestimmt sind.
NPM und Bower pflegen beide eine eigene öffentliche Registry, können aber durch private Registries ergänzt werden. Der zusätzliche Aufwand eine eigene Registry zu pflegen, lässt sich aber nur in großen Enterprise-Umgebungen rechtfertigen, bei denen zentrale Bibliotheken unabhängig entwickelt werden.
Nach Grunt und Gulp ist nun Webpack das Build-System für den trendigen Webdeveloper. Dazu gibt es Lösungen mit Browserify und RequireJS, NPM-basierte Systeme und allerlei Shell-Scripts und selbst ANT-basierte Build-Pipelines werden heute noch eingesetzt.
Wir verwenden je nach Projekt das Buildsystem, das am besten zu den Anforderungen passt und achten darauf, dass der Overhead minimiert ist und das Build-System von jedem Developer verstanden und notfalls gepflegt werden kann.
Agile Softwareentwicklung
Anforderungs-Analyse
Zunächst klären wir mit Ihnen die Rahmenbedingungen Ihres Projekts: Zeitlicher Rahmen, Projektgröße, technische Anforderungen, Stakeholder und Involvierungsgrad ins Projekt.
MVP
Nachdem diese geklärt sind, wird der MVP geplant: Eine Minimalversion Ihrer Webanwendung, mit einem definierten Funktionsumfang der in kurzer Zeit umgesetzt werden kann.
Produkt-Backlog
Dazu entwickeln wir gemeinsam mit Ihnen Stories die den Kundennutzen erfassen. Falls Sie bereits Ihre Anforderungen definiert haben, helfen Ihnen wir Ihnen bei der Umsetzung Ihres Projekt-Backlogs.
Implementierung
In kurzen Sprints implementieren wir ein Produkt-Feature nach dem anderen. Dabei setzen wir auf Continuous-Integration, sodass Entwicklungen direkt online gehen und genutzt werden können.
Test-getriebene Entwicklung
Durch automatisierte Tests gewährleisten wir Funktionalität Ihrer Anwendung: Bei jeder Änderung werden einzelne Komponenten auf Korrektheit (Unit-Tests) und Ihre Anwendung auf Funktionalität (End-To-End-Tests) geprüft.
Direkte Kommunikation
In kurzen Sprints implementieren wir ein Produkt-Feature nach dem anderen. Dabei setzen wir auf Continuous-Integration, sodass Entwicklungen direkt online gehen und genutzt werden können.
Qualtitätssicherung
Neben den autoamtisierten Tests spielt auch die Qualitätssicherung durch den tatsächlichen Anwender eine entscheidende Rolle: Durch kontinuierlichen Abgleich mit der Erwartungshaltung Ihrer Zielgruppe wird schnell festgestellt, ob die Annahmen zutreffen und der Mehrwert für den Nutzer gegeben ist.
Retrospektive
Nach jedem Sprint wird mit dem Kunden eine Retrospektive durchgeführt: Sind die Erwartungen erfüllt worden, gab es Schwierigkeiten oder unvorhergesehene Probleme die man zukünftig vermeiden kann.
Durch kontinuierliche und direkte Kommunikation können Projekte frühzeitig in die richtigen Bahnen gelenkt werden - gerade wenn die Rahmenbedingungen sich verändern oder nicht optimal sind.
Referenzen
-
Identifikations-Management System zur revisionssicheren Authentifizierungen von Produkten, Dokumenten, Personen, Lieferketten.
-
Deutschlands größter Berater für interne Tarifwechsel nutzt CRM-Software von LeapHub GmbH
-
Informationsportal für den Schweizer Krankenversicherungsmarkt
-
Marketing Automation Platform zur Generierung und Qualifizierung von Leads mittels E-Mail-, Suchmaschinen- und Retargeting-Kampagnen.
Ihr starker Partner
Software-Entwicklung von LeapHubWenn Standard-Software trotz Anpassungen und Modifikationen Ihre Anforderungen nicht mehr erfüllen kann, entwickelt LeapHub für Sie individuelle Softwarelösungen. Auf Basis moderner Technologie entwickeln wir Ihre Webanwendung, die Ihre Anforderungen exakt abdeckt und in Ihre bestehende IT-Infrastruktur integrierbar ist.
Wir sind auf die Entwicklung von Webanwendungen spezialisiert und bieten unsere Dienstleistung auf breitem Spektrum an: Von der Anforderungsanalyse zum Quality-Testing.
Zu unseren Kunden gehören Unternehmen aus der Telekommunikations-Branche, Finanz- und Versicherungen, öffentliche Institutionen, eCommerce und Marketing.
Jetzt Projekt-Anfrage stellen