Sie sagen es, wir coden es!

Wie sehen die unterschiedlichen Framework-Typen zur Testautomatisierung aus? Das sind die wichtigsten Vor- und Nachteile

In unserem letzten Beitrag Framework – Das Gerüst der Softwareentwickler haben wir euch in das Thema Frameworks eingeführt, eine ausführliche Beschreibung des Begriffs gegeben und dargestellt, wie das Team um we {code} it Informatikstudenten auf ihren Karriereweg aktiv unterstützt. Heute wollen wir etwas tiefer in die Materie eindringen und die unterschiedlichen Framework-Typen von Testautomatisierung mit ihren Vor- und Nachteilen vorstellen.

 

Moment. Was genau ist nochmal ein Framework?

In der Informatik ist ein Framework eine Schichtstruktur, die angibt, welche Programme gebaut werden können oder sollten und wie diese zusammenhängen würden. Es stellt bestimmte Funktionen als Teil einer größeren Softwareplattform zur Verfügung, um die Entwicklung von Produkten, Lösungen und anwendungsspezifischer Software zu erleichtern. Ein Framework wird als Kombination betrachtet und ist in der Regel umfassender als ein Protokoll und präskriptiver als eine Struktur.

 

Weit verbreitete Frameworks zur Testautomatisierung mit ihren Vor- und Nachteilen:

Bevor wir in die gängigsten Automatisierungsframeworks eintauchen, wollen wir zunächst klären, was ein Framework zur Testautomatisierung eigentlich ist. In einfachen Worten dienen Testautomatisierungstools zur Erstellung und Durchführung von automatisierten Testfällen. Unter anderem unterstützen sie den Tester dabei, Ressourcen effizient zu nutzen. Automatisierte Code-Tests liefern Daten, validieren Testergebnisse, erhöhen die Tiefe und den Umfang der Tests, um die Code-Qualität zu optimieren. Sobald ein Skript erstellt wurde, das all dies tut, reduziert es die Ausführungs- und Berichtszeit. Je ausgereifter ein Automatisierungsskript ist, desto besser sind auch die Erfolgsaussichten.

1) Linear Automation Framework:

Dank des unkomplizierten Designs, müssen Tester keinen Code schreiben, um Funktionen zu erstellen – sie zeichnen jeden Schritt wie Navigation, Benutzereingaben oder Checkpoints einfach manuell auf. Das einfachste Framework ist am besten ausgestattet, um Situationen zu überprüfen in denen der Wunsch besteht einen gleichwertigen Prozess mehrfach zu wiederholen. Einige Anwendungsbeispiele hierfür sind Auftragsverwaltungssysteme oder Aktenverwaltung.
• Vorteile: Hierbei handelt es sich um eine der schnellsten Möglichkeiten Testskripte zu erstellen. Es sind keine fortgeschrittenen Programmierkenntnisse erforderlich und Informatiker müssen nicht zwangsweise benutzerdefinierte Codes schreiben.
• Nachteile: Mit diesem Framework entwickelte Skripte können nicht wiederverwendet werden. Die Wartung ist sehr schwierig und es können Synchronisationsprobleme auftreten, da die Daten im Testskript fest codiert sind und jede Änderung an der Anwendung eine Menge Nacharbeit erfordert.

2) Modul Based Testing Framework:

Die Implementierung eines modularen Frameworks erfordert, dass die Tester die zu testende Anwendung in einzelne Module, Funktionen oder Abschnitte aufteilen, die jeweils einzeln getestet werden. Nach der Aufteilung der Anwendung wird für jedes Modul ein Testskript erstellt und anschließend zu einem größeren Test zusammengefasst.
• Vorteile: Bei Änderungen der einzelnen Abschnitte wird das übergreifende Modul nicht beeinflusst. Die Implementierung von Testfällen nimmt weniger Zeit und Aufwand in Anspruch, da Testskripte wiederverwendet werden können.
• Nachteile: Die Daten sind fest im Testskript codiert, da die Tests separat ausgeführt werden. Es können nicht mehrere Datensätze verwenden werden.

3) Library Architecture Testing Framework:

Die Bibliotheksarchitektur basiert auf dem modularen Framework, hat aber einige zusätzliche Funktionen. Hierbei besteht der Ansatz darin, ähnliche Aufgaben innerhalb der Skripte zu identifizieren und später nach Funktionen zu gruppieren, anstatt die zu testende Anwendung in verschiedene Testskripte aufzuteilen. Es wird eine gewöhnliche Bibliothek erstellt, die die üblichen Funktionen für die zu prüfende Anwendung enthält und bei Bedarf verwendet werden kann.
• Vorteile: Testaufbewahrung und Skalierbarkeit sind einfacher und kostengünstiger. Das Framework trägt zu einer höheren Wiederverwendbarkeit bei, da es eine Bibliothek mit gemeinsamen Funktionen gibt, die von mehreren Testskripten verwendet werden können.
• Nachteile: Die Testdaten sind auch hier fest im Skript codiert. Änderungen an den Daten erfordern Änderungen an den Skripten. Für das Schreiben und Analysieren der gemeinsamen Funktionen ist technisches Know-how erforderlich.

4) Data-Driven Framework:

Bei diesem Framework werden die notwendigen Eingaben und erwarteten Ergebnisse in separaten Dateien gespeichert. Jede Aktion, die sich aus einer externen Quelle (wie z.B. Excel) ergibt, wird als Aufruf der Informationen erkannt.
• Vorteile: Tests können mit mehreren Datensätzen durchgeführt werden. Die Testdaten werden separat gespeichert, sodass es einfacher ist ein anderes Framework – als das Prüfskript – zu erstellen.
• Nachteile: Der Aufbau nimmt viel Zeit in Anspruch. Es müssen externe Datenquellen identifiziert, formuliert und in Code geschrieben werden, der die Tests nahtlos mit den externen Datenquellen verbindet.

5) Keyword-Driven Framework:

Hierbei werden sämtliche Funktionen der zu testenden Anwendung in einer Tabelle dargestellt. Bei diesem Ansatz werden die Schlüsselwörter auch in einer externen Datenquelle gespeichert, sodass sie unabhängig von dem automatisierten Testwerkzeug sind. Sobald die Tabelle eingerichtet ist, müssen die Tester nur noch den Code schreiben, der anhand der Schlüsselwörter die erforderliche Aktion auslöst.
• Vorteile: Schlüsselwörter als auch der Code an sich können über mehrere Testskripte hinweg wiederverwendet werden. Testfälle können unabhängig von der zu testenden Anwendung erstellt werden und sind einfach zu ändern.
• Nachteile: Das Framework ist zeitaufwendig, komplex und ist mit hohen Anfangskosten verbunden. Schlüsselwörter können bei der Skalierung eines Testvorgangs problematisch sein.

6) Hybrid Testing Framework:

Wie der Name schon andeutet, ist ein hybrides Framework eine Kombination aus den zuvor genannten Frameworks. Es kombiniert die Vorteile und mildert die Schwächen aller integrierten Frameworks. Dabei sind sämtliche Anwendungen und jeder Prozess anders.
• Vorteile: Ein hybrides Framework kann leichter implementiert und erweitert werden, um die besten Testergebnisse zu erzielen. Es ist unabhängig von Testdesign, Technologie oder Plattform.

 

Wenn ihr euch für ein automatisiertes Framework entscheidet, solltet ihr darauf achten, dass es möglichst flexibel ist und eine Vielzahl von Anwendungen und Sprachen unterstützt.

Framework – Das Gerüst der Softwareentwickler

Für Informatiker stehen neben der Programmiersprache auch die Programmierumgebung, die sehr umfangreich und damit für den Anfang auch etwas komplex ist, im Mittelpunkt. Wer sich in die Programmierung von Code einarbeitet, stößt recht schnell auf den Begriff „Framework“.

Zunächst wollen wir eine ausführliche Beschreibung des Begriffs geben sowie die wichtigsten Eigenschaften von Frameworks nennen. Anschließend erläutern wir in welcher Hinsicht we {code} it Informatikstudenten bei der Praxiserfahrung unterstützt und was diese bei uns lernen können.

 

Framework! Was ist das, wer braucht das?

Ein Code setzt sich aus vielen kleinen Bausteinen zusammen. Um das Coden bequemer zu machen und Zeit zu sparen, gibt es sogenannte Frameworks.

Ein Framework ist eine Vorprogrammierung, die dem Programmierer als Grundstruktur für die Entwicklung von Softwareanwendungen dient. Es bildet eine Grundlage, auf der Softwareentwickler Programme für eine bestimmte Plattform erstellen und wiederverwenden können. Beispielsweise kann ein Framework vordefinierte Funktionen oder abstrakte Klassen enthalten, mit denen Eingaben vorbereitet, die Designstruktur bestimmt und Softwaresysteme integriert werden können. Einige Anwendungsbeispiele sind: grafische Editoren, dynamische Webseiten, Buchhaltungsprogramme und Online-Shops.

Der Entwicklungsprozess wird um ein Vielfaches vereinfacht, da Coder das „Rad“ nicht jedes Mal neu erfinden müssen, wenn sie eine Anwendung entwickeln. Entscheidend ist: Das Framework an sich ist kein eigenständiges Programm, sondern nur ein Entwurfsmuster. Ein Framework ähnelt einem Application-Programming-Interface (API, dt. Schnittstelle zur Anwendungsprogrammierung), obwohl technisch gesehen ein Framework eine API beinhaltet. Ein Framework dient als Basis für die Programmierung, während eine API anderen Programmen den Zugriff auf die vom Framework unterstützten Elemente ermöglicht.

Frameworks können Sammlungen von Bibliotheken, einen Compiler oder andere Basisbausteinen beinhalten, die im Softwareentwicklungsprozess verarbeiten werden. In vielen Fällen wird ein Framework nativ von einem Betriebssystem unterstützt. Beispielsweise läuft ein für das Android-Framework geschriebenes Programm auf einem Android-Gerät, ohne dass weitere Dateien installiert werden müssen. Einige Anwendungen benötigen jedoch ein spezielles Framework, um laufen zu können. Während sich Frameworks im Allgemeinen auf breite Software-Entwicklungsplattformen beziehen, kann der Begriff auch verwendet werden, um ein bestimmtes Framework innerhalb einer größeren Programmierumgebung zu beschreiben – so können mehrere Java-Frameworks wie Spring, ZK und das Java Collections Framework (JCF) verwendet werden, um Java-Programme zu erstellen. Der eine oder andere ist sicherlich schon auf den Begriff .NET Framework gestoßen. Das ist das Framework für Microsoft-Anwendungen. Microsoft .NET ist notwendig, um eine Vielzahl von Microsoft-Programmen nutzen zu können. Des Weiteren hat Apple mehrere spezielle Frameworks entwickelt, die auf die OS X-Programme zugreifen können.

 

Der Entwickler von heute codet seine eigene App. Wie kann we {code} it helfen?

Im Informatikstudium bekommt man einen riesigen Haufen Theorie eingeimpft. Man darf dann ein paar Mal für eine Übung etwas programmieren und am Ende kann man doch noch nicht so richtig coden. Die Motivation, sich mit Frameworks auseinanderzusetzen, sollte nicht durch zu viel Theorie gebremst werden. Mit Framework kann man in die richtige Richtung gelenkt werden und vom Wissen anderer profitieren. Man kann aber auch so am Framework vorbei programmieren, sodass anschließend gar nichts mehr passt. we {code} it hilft. Um die eigenen Programmierfähigkeiten zu verbessern, bieten wir Schulungen in Form von Praktika oder Projekten für Informatikstudenten an. Als ITler bekommst du die Möglichkeit zu lernen, wie Ressourcen und Grundlagen aus der Universität in Praxis umgesetzt werden können, selbstständig eine Lösung zu erarbeiten und das Know-how in ein konkretes Projekt zu gießen. Einige unter euch haben sicherlich konkrete Anforderungen, also Projekte oder eigene Ideen, die ihr mitbringt und mit anderen Entwicklern teilen wollt. In diesen Fällen ist das Einsteigen mit einem Framework zweifellos nicht zu verachten.

Bist du etwas fitter im Programmieren, dann kannst du abwechslungsreiche und herausfordernde Aufgaben ebenso spannende Projekte für unsere Kunden und Partner übernehmen. Dabei arbeiten wir mit unterschiedlichen Frameworks – wobei Symfony am häufigsten eingesetzt wird. Das Framework Symfony zählt zu den bekanntesten PHP-Frameworks, das als Basisgrundlage zur Entwicklung von Webanwendungen verwendet wird. Du kannst Symfony kostenfrei aus dem Internet heruntergeladen und zum Programmieren nutzen. Wir helfen dir Entwicklungen mit der Fülle von Leistungsmerkmalen effizient und möglichst komfortabel aufzustellen.

Schlussendlich ist Programmieren eine Mischung aus Lesen, Austausch mit anderen und Erfahrung.

 

Info:
Ihr wollt mehr über Framework erfahren?
Dann könnt ihr zunächst unter Frontend Frameworks – Teil 1 nachlesen, auf welche Faktoren es bei der Auswahl eines Frameworks ankommt und wie ihr das Richtige für euch speziell ermitteln könnt. Als Coding-Beginner und Berufseinsteiger kann es sich lohnen, sich auf Frontend Frameworks – Teil 2 über gängige und alternative Möglichkeiten zu informieren. Auch für Programmierer mit Berufserfahrung gibt es hier viel zu entdecken: Frontend Frameworks – Teil 3 stellt die anspruchsvolleren Frameworks vor, die für die erfahrenen Coder unter euch interessant sein könnten.

Die Angst um das Ende von React bringt alte Bekannte zurück: Angular vs. Vue.js vs. Ember

Python, JavaScript, PHP, Java, C# – die Wahl der richten Programmiersprache und der passenden Frameworks stellt für Entwickler in manchen Augenblicken die Qual der Wahl dar. So gibt es für unterschiedliche Anforderungen und Schwerpunkte bestimmte Sprachen und Programme, die dafür am besten geeignet sind. Nichtsdestotrotz existieren einige Top-Acts, die die Liste anführen. So hat IT-Gigant IBM JavaScript zur besten Erlern-Programmiersprache 2017 gekürt.
Doch auch da ist die Auswahl für Frameworks riesig. Nachdem nun React für manche mehr oder weniger abgehakt werden kann – siehe dazu unseren letzten Blogbeitrag – wollen wir euch nun drei Alternativen dazu vorstellen. Diese lauten Angular, Vue.js und Ember.

Wer sind sie?

Alle drei Frameworks sind clientseitig, basieren auf dem MVVM (Model View ViewModel) Model, werden für das Erstellen von SPAs (Single Page Applications) verwendet und sind (mehr oder weniger) in JavaScript geschrieben. Angular wurde von Google entwickelt und gehört mit seiner Vorgängerversion AngularJS zu den am meisten verwendete JS Framework für SPAs. Angular 2 ist in Typescript geschrieben, das auf JavaScript, Java und C# basiert. Seit Ende März ist Version 4 auf dem Markt. Vue.js ist ein relativ junger Newcomer, der vorgibt, das Beste aus Angular und React herauszuholen. Ember wurde 2015 als das beste JavaScript Framework angepriesen und findet zum Beispiel bei Netflix, Yahoo und LinkedIn Verwendung.

Was können sie?

Bei allen drei Frameworks fällt durch das MVVM die Controller Einheit weg und es wird stattdessen eine Verbindung der Darstellungs- und Logikebene hergestellt. Interaktionen können so schneller und einfacher umgesetzt werden. Angular wird vor allem aufgrund der Einfachheit der Nutzung von den Entwicklern präferiert. Es kann somit mit WordPress’ Konzept verglichen werden – sehr einfach zu verwenden, aber in der technischen Umsetzung nicht so extravagant. Bei Vue.js lag der Fokus darauf ein schnelles und schlankes Frontend Framework zu entwickeln. Ähnlich wie bei React wird hier eine virtuelle DOM Implementierung genutzt, die die Rendering Geschwindigkeit und den Speicherverbrauch laut Entwicklern um bis zu das Vierfache verbessert haben soll. Vue.js lässt ebenso dem Programmierer die Wahl zwischen Templates und JSX/Hyperscript. In Version 2 gibt es zusätzlich eine Redone-Rendering Schicht, die für eine bessere Performance sorgen soll. Ebenso ist das Framework mit der neuen Version auch (besser) auf die Entwicklung von mobilen Apps ausgerichtet. Ember folgt dem DRY Prinzip und ist nach dem Grundsatz data down, actions up aufgebaut. Das Framework nutzt Web Compoments, und will langfristig die Controller und Templates durch diese ersetzen.

Wie gut sind sie?

Angular stellt die beste Option für Unternehmensbasierte Apps und Programmierlandschaften mit hohen Lesbarkeits-Standards dar. Die bessere Wahl für die schnelle Entwicklung von betriebssystemübergreifenden Lösungsansätzen ist jedoch Vue.js. Das Framework punktet zudem durch eine einfache Handhabung. Ember wird demgegenüber vornehmlich für komplexe Webapplikationen und Websites mit vielen Features verwendet. So sind dynamische Apps und Websites bei Ember gut aufgehoben. Es ist das Framework, das einen, wenn man es verstanden hat, dazu befähigen kann, sehr produktiv zu sein. Jedoch heißt dies, dass die Lernkurve auch sehr hoch ist und es somit gleich zu Beginn viel zu lernen gibt.

Fazit

Alle drei Frameworks können zwar als Konkurrenten angesehen werden, jedoch besitzt keines davon einen signifikanten Vorteil gegenüber den anderen. Alle besitzen die gleiche Grundlage – sie sind ein JavaScript Framework. Das bedeutet im Endeffekt mehr Effizienz, Sicherheit und weniger Kosten als ohne Framework. Egal ob durch Angular, Vue.js oder Ember – Programmierarbeiten können zeitsparender und strukturierter umgesetzt werden und haben gleichzeitig bessere Sicherheitsbestimmungen. Zudem sind alle Frameworks Teil einer Open Source Software – und anders als React von Facebook – auch wirklich frei zugänglich.

Ist das das Ende für React?

Die JavaScript Bibliothek React von Facebook gehörte bisher zu den beliebtesten Tools zur Erstellung von interaktiven Websites. Jetzt kann React den Programmierern jedoch zum Verhängnis werden. Denn die Lizenz-Situation und Nutzungsbedingungen des eigentlich als Open Source ausgelegten Tools sind heikel geworden. Zu Open Source gehören Softwares, deren Quelltext öffentlich eingesehen, genutzt und verändert werden darf. Eigentlich.

 

Was steckt dahinter?

React, welches erstmals 2013 mit einer Open Source Software herausgegeben wurde, dient dazu, Anwendungen sehr flüssig darzustellen, selbst bei großen Datenbanken. Der Vorteil von React ist, dass dort ein virtuelles DOM vorliegt, welches einfacher zu manipulieren ist und die Bibliothek so in der Lage ist, Interaktionen schneller umzusetzen. Gleichzeitig nimmt React die Komplexität aus dem View-Layer. Demnach ist das Tool besonders nützlich, wenn eine Website viel Interaktivität fordert.
Jedoch steht die Verwendung von Facebook‘s Open Source Software, darunter eben auch genannte Bibliothek React, unter einer BSD Plus Lizenz. BSD (Barkeley Software Distribution) heißt, dass die Software nur kopiert, verändert und verbreitet werden darf, wenn das Copyright Vermerk des ursprünglichen Programms nicht entfernt wird. So weit so gut. Nun hat Facebook vor einigen Wochen eine weitere Klausel zum Lizenzrecht ihrer Software hinzugefügt. Diese sagt aus, dass jedem die Nutzungsrechte für eben jene Open Source Software entzogen werden, wenn mit der Nutzung in irgendeiner Weise Konkurrenz-Ansprüche zu Facebook entstehen. Weiterhin geht aus der Klausel hervor, dass durch eine Klage gegen Facebook die Lizenzrechte ebenfalls entfallen. Im Original heißt dies:

„The license granted hereunder will terminate, automatically and without notice, if you […]take a direct financial interest in[…] any Patent Assertion against Facebook […]“

Open Source Software mit BSD Plus Lizenz – heißt konkret?

Facebook‘s Technik-Direktor Adam Wolff begründet diese Entscheidung damit, dass Facebook die Balance halten möchte, weiterhin Open Source Software zur Verfügung zu stellen, gleichzeitig aber das eigene Unternehmen vor teuren Rechtsstreitigkeiten schützen will.
Die Website React-etc empfiehlt in dieser Hinsicht gar einen Anwalt heranzuziehen, wenn React weiter benutzt werden möchte. Ebenso rät ein Entwickler der Apache Foundation , dass Startups möglichst nicht React benutzen sollten. Dies könnte mögliche Firmenübernahmen gegebenenfalls verhindern. Die Apache Foundation, eine Gemeinschaft von Entwicklern, die an Open Source Software Projekten arbeiten, hat nun sogar die Verwendung der Open Source Software von Facebook ihren Programmierern untersagt. Diese Entscheidung wird damit begründet, dass diese Lizenz ein Risiko an den Konsumenten weiterreichen würde und dieses Risiko deutlich stärker zu Lasten der Anwender ausfallen würde. Außerdem würde dies die Apache-Richtlinien verletzen, die unter anderem diktieren, ein universeller Spender zu sein.

React – das trojanische Pferd unter Open Source?

Diese Entscheidung stellt nun ein großes Problem für Entwickler dar, die unter Apache arbeiten, da sie React an vielen Stellen verwendet haben. Am meisten jedoch stört sie die unethische Einstellung von Facebook gegenüber einer Open Source Software. React sei, so die Entwickler, ein trojanisches Pferd in der Open Source Community und diese Verhaltensweise sei kein Beispiel dafür, wie Open Source funktionieren sollte. Adam Wolff gibt zu, durch diese Entscheidung einige Nutzer zu verlieren, jedoch stehe der Schutz des Unternehmens an erster Stelle. Er argumentiert, dass Facebook die Software auch ganz vom öffentlichen Markt hätte nehmen können.

Also, ihr lieben Programmierer unter euch, passt auf, wenn ihr React benutzen wollt – Alternativen dazu stellen beispielsweise das Webframework vue.js, die Programmiersprache Elm oder die Bibliothek Riot.js dar.

Frontend Frameworks – Teil 3

Im dritten Teil unserer Frontend Framework Reihe kommen wir zu den etwas anspruchsvolleren Frameworks, die eher für Leute mit Berufserfahrung als Developer angemessen sind.

Da hätten wir zum einen Foundation, welches von Großunternehmen wie eBay, Facebook oder Mozilla benutzt wird. Dieses Framework unterstützt GPU Beschleunigungen, was gleichmäßige und blitzschnelle Animationen ermöglicht. Ebenso hat es keine Lock-In bei Styles, sodass man flexibler arbeiten kann. Zudem benutzt es REMS statt Pixel. Das hat den Nutzen, dass man sich nicht an bestimmte Höhen oder Breiten bei jedem Endgerät richten muss.

Foundation gilt als Framework für Entwickler mit einem gewissen Erfahrungspensum, die vor Allem schnelle, reaktionsfähige Webseiten programmieren.

 

Sucht ihr nach einem Framework, mit dem ihr simpel Google’s Material Design Richtlinien befolgt, dann macht ihr mit Material UI nichts falsch, denn es ist das am besten ausgearbeitete Framework, um die Richtlinien umzusetzen. Aber: es ist kein geeigneter Ansatzpunkt, um ein neues Webdesign Projekt aufzusetzen.

Mit gebrauchsfertigen CSS- und Materialdesign-kompatiblen Klassen beladen, wird Material UI auf dem LESS Preprocessor aufgebaut. Weil es React-Komponenten verwendet, ist ein gewisses Verständnis von React hilfreich.

Absolut bezeichnend für dieses Framework ist, dass es individuell anpassbare Stile enthält, die in einzelne Dateien getrennt sind. So können Sie LESS CSS-Variablen überschreiben, ohne Framework-Komponenten zu beeinflussen.

Insgesamt ist es daher für Entwickler geeignet, die Erfahrung mit React.js haben und einen einfachen Weg einschlagen wollen, um die Material Design Richtlinien umzusetzen.

 

Entwickelt von Yahoo Developern ist Pure ein Framework, mit dem man so gut wie jedes Projekt angehen kann. Mit einem Array an CSS Modulen kann man mit Pure reaktionsfähige Buttons, Menüs, Grids, Tabellen und anderen interessanten Features kreieren. Dennoch ist hierbei zu beachten, dass momentan noch keine jQuery oder JavaScript PlugIns dafür vorhanden sind, da das Framework Pure ausschließlich .css Dateien umfasst.

Wenn es mit Gzip minimiert und komprimiert wird, verkleinert sich die Dateigröße bereits auf 4,75 kB, was es zu einem der schnellsten, platzsparendsten und geschicktesten Frameworks macht. Das ist der Grund, weshalb gerade so viele Mobile Developer so begeistert von Pure sind.

Folglich ideal für Entwickler, die sich mit Responsive Development beschäftigen.

 

UIKit ist ein höchst modulares Framework, welches sich von anderen Frontend Frameworks hervorhebt. Einer der vielen Gründe hierbei ist wohl, dass es sich SASS CSS preprocessors und LESS gleichsam bedient.
Mit einer Anordnung von leichten, reaktionsfähigen Klassen mit den gleichbleibend, gleichnamigen conventions wurde UIKit zu einem der beliebtesten Frontend Frameworks.
Durch die 30 modularen und erweiterbaren Komponenten kann es kombiniert werden, um noch mehr Einsatzflexibilität zu bieten.

Es enthält Navigationskomponenten wie side navigation bars, Elemente wie HTML-Formulare und Tabellen, JavaScript-Komponenten wie Off-Canvas-Bars und modale Dialoge; verbreitete Elemente wie Buttons, Abzeichen, Overlays und Layoutkomponenten, einschließlich eines flüssigen, vollständig ansprechenden Grids.

Das Framework hat zwar unglaublich viel an Angebot zu bieten, ist jedoch durch seinen relativ neuen Status für Beginner nicht zwingend geeignet, da es dementsprechend wenige Entwickler gibt, die damit schon repräsentative Projekte oder Tutorials dazu angefertigt haben.
Daher stehen hier Möglichkeiten gegen die Schwierigkeit des Neuheitsgrades. Folglich ist es besser, wenn sich Entwickler mit einer ansehnlichen Erfahrung an Programmierung daran versuchen. Letzten Endes ist es ein sagenhaftes Framework für simple sowie für komplexe Projekte und eine echte Alternative mit viel Nutzungspotential.

 

Für Diejenigen unter uns, die besondere Layout Bedürfnisse haben, ist Susy ein geeignetes Tool. Der Begriff Tool fällt hier deshalb, weil viele Susy als Grid Maker klassifizieren. Dennoch rüstet dieses Layout Tool einen unabdingbar für individuelle, anspruchsvolle und kreative Layout Wünsche auf. Es übernimmt alle Kalkulationen für den Benutzer, sodass man viel an Zeit und Energie spart.

 

 

Alles in Einem sollte die Entscheidung, welches Framework man verwenden möchte, nicht auf ihrer Beliebtheit beruhen, sondern vielmehr darauf, was für den Bedarf der Entwicklung am besten passt.

 

 

Frontend Frameworks – Teil 2

In Teil 1 unseres „Frontend Frameworks“ haben wir euch schon einmal in die Materie eingeführt, wie ihr das richtige Framework für euch speziell ermittelt und was man dabei beachten sollte. Da hieß es, dass man nicht immer die gängigen Frameworks nutzen muss, um ein großartige Webseite zu programmieren. Es gibt so viele neue, alternative Möglichkeiten, die euch – je nach eurem Kenntnis-Stand – besser dienen können.

Unsere Einführung ist angelehnt an die Top 10 Frontend Frameworks aus 2016.
Nach jeder Kurzbeschreibung der Frameworks, wird eingestuft, für welche Entwickler welchen Kenntnisstandes diese geeignet sind. Teil 2 wird sich vorerst mit Coding-Beginnern und Berufseinsteigern in der Entwicklung beschäftigen. Im dritten Teil unserer Beitragsreihe kommen dann die Frameworks für Fortgeschrittene mit mehrjähriger Berufserfahrung. Dran bleiben lohnt sich!

 

Der Korrektheit halber führen wir erst einmal Bootstrap an, das allgemein als gängig gilt und oft verwendet wird. Das von den Twitter-Entwicklern programmierte Framework beinhaltet einige der vebreitetsten Programmiersprachen: HTML, JavaScript und CSS. Bootstrap beinhaltet reaktionsfähige Webdesign Standards, die es dir erlauben Webseiten in jeglicher Komplexität und Größe zu entwickeln. Weil das Framework regelmäßig geupdatet wird, kann es in kürzester Zeit auf neue Features reagieren und sie einbinden.

Das Rundum-Paket ist für Beginner und Diejenigen, die ein robusteres Framework bevorzugen, recht ideal, enthält jedoch den Nachteil, dass durch die für das Web unübliche Größe lange Ladezeiten entstehen können. Das kommt durch die Masse an Klassen zustande, wovon nur ein Bruchteil genutzt wird.

 


Ein absoluter Newcomer mit Potential ist Semantic-UI. Ein Framework, welches sich durch seine Einfachheit auszeichnet und für Beginner sowie für Jene, die ein flinkes und leichtes Framework bevorzugen, geeignet ist.

Man sagt, dass Jene, die ein komplexeres Design und komplexeres Development fordern, dieses Framework Schwachstellen aufweisen kann. Dennoch birgt es den Vorteil von kleinen Dateigrößen, kurzen Ladezeiten und unglaublicher Aufstellung an Bibliotheken, sodass man eigentlich keine anderen Bibliotheken mehr braucht.

 

Materialize beinhaltet Design Besonderheiten von Google und stellt ready-to-use buttons bereit, icons, Karten, Formen und anderen Komponenten. Diese Elemente werden in einer Standardversion und in der Version, die mit SASS läuft, angeboten.

Außerdem umfasst Materialize einen praktischen IZ column grid feature, was man für Website Layouts verwenden kann. Mit Materialize kann man Typographien, Schatten, Farben und andere prägnante Animationen verwenden. Der Vorteil der immensen Auswahl an Klassen ist hierbei definitiv als Vorteil zu nennen. Konträr dazu stehen die großen Dateigrößen, die ebenso lange laden müssen wie bei Bootstrap. Somit ist das Framework ein etwas sperriges.

Als geeignet eingestuft wird es für Entwickler, die noch etwas Orientierung und Anleitung brauchen bezüglich Google’s Material Design Spezifiken.

 

Diejenigen, die kleine Projekte umsetzen wollen, für welche nicht alle Style-Klassen eines großen Frameworks erforderlich sind, ist Skeleton eine nennenswerte Alternative, die nicht jedem geläufig ist.
Skeleton ist ein reaktionsfähiger Textbaustein mit einem 400 Zeilen Code. Dieses Framework ist lediglich dazu gedacht mit der Entwicklung eines Web Projektes anzufangen und bietet daher nur das Minimum an Voraussetzungen wie z.B. Tabellen, Formen, Listen, Buttons, etc. Daher für Berufseinsteiger ideal, die sich mit ersten Projekten profilieren wollen und neu in die Praxis- und Projektwelt eintreten.

Frontend Frameworks – Teil 1

Da es eine solche Vielzahl an verschiedenen Frontend Frameworks gibt, kann sich die Wahl des richtigen Frameworks schwierig gestalten. Wie viele andere Entwickler auch, neigt man oftmals dazu die beliebten und bewährten Optionen wie Bootstrap und Foundation zu nehmen. Dann aber wieder kann ein weniger weit verbreitetes Framework effektiver auf individuelle Bedürfnisse angepasst werden. Daher lohnt es sich, sich auf den neuesten Stand zu bringen und sich über verschiedene neue Frameworks und ihren Nutzen zu informieren. Über neuere Alternativen klären wir euch im zweiten Teil auf. In diesem Beitrag konzentrieren wir uns erst einmal auf die Faktoren, die ihr zu einer Ermittlung des richtigen Frameworks beachten müsst.

Aspekte, die man bei der Wahl des Frameworks beachten muss

Alles zusammenfassend sollte das richtige Frontend-Framework das Webseiten-Design vereinfachen und optimieren und den Entwicklungsprozess beschleunigen. Dabei sollte bei der flexiblen Nutzung unterschiedlicher Funktionen keine Abstriche gemacht werden, damit immer noch ein einzigartiges und qualitatives Endergebnis rauskommt.