It’s #FrontendFriday – Kennt ihr schon Nebular und NGX-Admin?

Was ist Nebular?

Nebular ist eine Open Source Angular-UI-Bibliothek, welche auf dem Eva-Design-System basiert. Es stellt 40 UI-Komponenten, 4 Standard-Themes sowie weitere Module zur Authentifizierung sowie Sicherheit bereit. Diese Komponenten helfen bei der Implementierung von einheitlichen UI’s über mehrere Devices hinweg. Hab ich da Module geschrieben? Richtig es ist Modularisiert. D.h benötigte Inhalte werden als Module in eine bestehende Angular-App integriert. Beispielsweise existiert das ThemeModule, welches ein Default-Theme anzieht. Die Experten unter euch werden bereits Parallelen zum Angular Material ziehen. Und ich muss mich euch direkt anschließen. Der Aufbau, die Dokumentation, im Prinzip alles ist ähnlich.

 

Was ist NGX-Admin?

Auf der Suche nach Nebular im WWW, taucht zusammenhängend ein weiterer Begriff auf. „NGX-Admin“. Hierbei handelt es sich um eine Open Source Beispielimplementierung einer Dashboard-Anwendung, welche Nebular, Bootstrap 4+ sowie Angular 8+ im Stack Repertoire hat. Das Backend ist jedoch gemockt und muss bei Bedarf zugekauft werden. Der Urheber Akveo stellt zudem auch eigene Icons zur Verfügung und wirbt mit folgenden Vorteilen:

  • Mobile First
  • Customizable
  • Updated and supported
  • Completely FREE and MIT licensed
Beispieldashboard
Beispieldashboard

Kann Nebular Bibliothek bzw. das NGX-Admin-Template bei der Entwicklung von Webapps helfen?

Laut Urheber Akveo auf jeden Fall. Denn man würde sich als Entwickler 480 Stunden an Entwicklungszeit aneignen. Doch will ich als Entwickler das überhaupt? Fakt ist, ich bin in der Entwicklerrolle an verschiedenste Anforderungen gebunden, die sich in der Regel nicht durch die Beispielimplementierung abdecken lassen. NGX-Admin ist eine große Anwendung, mit viel Boilerplate Code. D. h. ich als Entwickler muss sicherstellen, dass Codefragmente, die an vielen Stellen nicht benötigt werden, entfernt werden. Zudem muss sichergestellt werden, dass alle „Vulnerabilities“ (siehe Screenshot) behoben werden.

Vulnerabilities
Vulnerabilities: Code aus Beispielprojekt

Selbstverständlich ist auch ein Bottom-Up-Ansatz im Rahmen des Möglichen. Damit ist die Aufsetzung eines neuen Angular-Projektes und der damit verbundenen, schrittweisen Integration der benötigten Nebular Inhalte gemeint. Ist ein Dashboard als UI gefordert, so kann man das NGX-Admin Projekt als architekturtechnische Referenz verwenden und somit schneller ans Ziel kommen.

In welchem Szenario eignet sich ein Einsatz von NGX-Admin?

Abhängig von den Anforderungen kristallisiert sich eigentlich nur ein sinnvolles Einsatzszenario heraus: „Der Kunde wünscht sich ein Dashboard und hat keine konkreten Anforderungen bezüglich des Technologiestacks“. Zur Erinnerung, NGX-Admin ist mittels der Nebular Komponentenbibliothek umgesetzt und somit technologiegebunden.

Gibt es einen ähnlichen Ansatz für Angular Material?

Ja, das gibt es. Im Folgenden sind zwei Beispielansätze verlinkt:

https://www.creative-tim.com/product/material-dashboard-angular2

https://flatlogic.github.io/angular-material-dashboard/#/dashboard

Es handelt sich hierbei, anders als bei NGX-Admin, welches vom gleichen Urheber wie Nebular entwickelt ist, jedoch um Lösungen von vereinzelten Entwicklern. Pauschal interpretiert, werden die Lösungen wohl nicht an die Implementierung von NGX-Admin herankommen. Denn bei NGX-Admin steht das gesamte Unternehmen dahinter.

Fazit:

Nebular ist eine sehr gute Alternative zum Angular Material. Es stellt ebenfalls eine hohe Anzahl an Komponenten, Themes und weiterer Features bereit. Das Theme an sich ist meiner Meinung nach besser, sauberer anpassbar als bei Angular Material. Stichwort: „Powerful theming engine with custom CSS properties mode“. Abhängig von den gegeben Anforderungen und im Rahmen eines richtigen Einsatzszenarios hat es ein enormes Potenzial, um Entwicklern bei der Entwicklung von Webapps zur Seite zu stehen. Es macht eben das, was ein UI-Komponentenframework so macht.

Ein entscheidender Nachteil gegenüber Angular Material ist die rare Community. Die folgende Grafik unterstreicht dies in Form der Download-Zahlen in den letzten zwei Jahren.

Auszug aus Google Trends

Quellen:

https://akveo.github.io/nebular/

https://akveo.github.io/ngx-admin/

It’s #FrontendFriday – Unser TechStack für Frontends

Es ist wieder Freitag, somit #FrontendFriday und in diesem kurzen Beitrag wird sich der neue Frontend TechStack auf Stackshare angeschaut. Außerdem wird erklärt, warum wir manche Tools gewählt haben und welche Vorteile oder Nachteile diese im Projektalltag haben. Den neuen Frontend TechStack haben wir auf Stackshare erstellt, dort sind auch noch weitere TechStack’s von doubleSlashHier geht es zum Frontend Stack.

Mehr

It’s #FrontendFriday – Was ist HTTP?

Es ist soweit, es ist Freitag – It’s #FrontendFriday :)

Im heutigem Blog geht es um das Thema „Was ist HTTP?“.

Was ist HTTP?

Das Hypertext Transfer Protocol (HTTP, englisch für Hypertext-Übertragungsprotokoll) ist ein zustandsloses Protokoll zur Übertragung von Daten auf der Anwendungsschicht über ein Rechnernetz. Es wird hauptsächlich eingesetzt, um Webseiten (Hypertext-Dokumente) aus dem World Wide Web (WWW) in einen Webbrowser zu laden. Es ist jedoch nicht prinzipiell darauf beschränkt und auch als allgemeines Dateiübertragungsprotokoll sehr verbreitet.

Mit Hypertext Transfer Protocol (HTTP) kommen die Nutzer eines Webbrowsers immer dann in Berührung, wenn sie die Webseiten eines entfernten Servers laden.
Das 2014 von der Internet Engineering Task Force (IETF) veröffentlichte RFC 7231 charakterisiert HTTP derweil allgemeiner als zustandsloses Protokoll, das auf Anwendungsebene angesiedelt ist und sich für verteilte, kollaborative Hypertextinformationssysteme eignet.

Wie funktioniert HTTP?

Mehr