The last article of 2021 showed how to build a simple and small REST API with Koa. I will use this backend today to connect the address book application to it. [...] weiterlesen
Der letzte Artikel des Jahres 2021 zeigte, wie man eine einfache und kleine REST-API mit Koa baute. Dieses Backend werde ich heute verwenden, um die Adressbuch-Applikation daran anzubinden. [...] weiterlesen
Heute zeige ich wie man ein Storybook Addon schreibt. Jedes Projekt ist individuell und einzigartig sind auch die Anforderungen. Storybook bietet einen breiten Katalog an Addons an. Ein tolles Feature, das das Entwicklungsteam anbietet, ist die Möglichkeit weitere Addons selber zu schreiben. [...] weiterlesen
In den letzten beiden Artikeln habe ich gezeigt wie man eine Komponentenbibliothek aufsetzt und wie man Storybook benutzt. Damit ist die Grundlage geschaffen. Was ist der nächste logische Schritt, wenn man einige (oder alle) Komponenten fertig hat? Richtig! Man möchte diese verwenden. Die Grundidee ist die Arbeitsteilung. Ein Team/Spezialist kümmert sich um die Komponentenbibliothek und stellt diese anderen Teams zur Verfügung. [...] weiterlesen
In meinem letzten Artikel habe ich Storybook vorgestellt. Heute möchte ich die Bedienung erklären. Es ist ein tolles Tool mit vielen Möglichkeiten, um eure Komponenten zu entwickeln, zu katalogisieren oder sogar zu testen. [...] weiterlesen
Heute zeige ich wie man mit Hilfe von StencilJS und Storybook eine wiederverwendbare Komponenten-Bibliothek aufbaut, die aus Web-Components besteht. Im ersten Teil setzen wir das Projekt auf und verbinden die StencilJS mit Storybook. Im nächsten Teil zeige ich dann wie man die Webcomponents installiert und benutzt. [...] weiterlesen
Eine Übersicht über meine StencilJS-Reihe [...] weiterlesen
Mit dem Wissen des letzten Artikels können wir uns dem eigentlichen Thema widmen: Tests schreiben. Das Framework ist installiert, der erste Test steht und nach dem Ausführen laufen die Browser los und testen die Anwendung. [...] weiterlesen
Mit den End2End-Tests sollte, meiner Meinung nach, sofort begonnen werden, sobald man die erste Seite gebaut hat. Wie der Name schon sagt wird das Zusammenspiel der Komponenten und die Anbindung an Schnittstellen getestet. [...] weiterlesen
Im vorherigen Artikel haben wir gelernt wie man einzelne Funktionen wegmockt. In einer Komponente befinden sich häufig auch viele importierte Fremdbibliotheken. Ich verlasse mich immer drauf, dass diese getestet sind und möchte diese auch nicht in meinen Tests erneut testen. In diesem Artikel zeige ich wie man damit umgeht. [...] weiterlesen
Dieser Artikel setzt auf dem letzten Artikel "StencilJS-Tutorial: Real World Unit Tests" auf und gibt weitere Einblicke und Beispiele zum Thema Jest-Testing innerhalb einer StencilJS-App. [...] weiterlesen
Nachdem wir im letzten Artikel die Grundlagen des Testing-Frameworks Jest gelernt haben, wenden wir dieses Wissen in unserem Beispielprojekt Adressbuch an. [...] weiterlesen
Jest ist DAS Javascript Testing-Framework. Wenn man mit Javascript/Typescript arbeitet, kommt man an diesem Schweizer-Taschenmesser des Testens nicht vorbei. Ich bin ein riesen Fan seitdem wir uns 2016 das erste mal begegnet sind. Ich habe davor mit diversen Test-Framework gearbeitet. [...] weiterlesen
Die bisherigen Tutorials haben jetzt alle nötigen Bausteine von StencilJS vorgestellt, die wir für unsere Adressbuch-Applikation benötigen. In diesem Artikel werden die diese nun verwendet, um ein funktionierendes Adressbuch zu bauen [...] weiterlesen
Die functional component oder stateless component stellt eine alternative Schreibweise für die StencilJS-Komponente dar. Die Komponente ist dadurch leichtgewichtiger. Aber man verzichtet auch an etwas Funktionalität. [...] weiterlesen
Der StencilJS-Store ist eine tolle Sache. Dabei handelt sich um einen sehr leichtgewichtigen State-Container ähnlich zu Redux, Redux-Zero oder dem guten alten $rootScope in AngularJS. [...] weiterlesen
Wir können eigene Komponenten erstellen und haben dazu das StencilJS-Starter-Projekt genutzt. Nun wollen wir etwas aufräumen und uns um das Thema Routing kümmern. [...] weiterlesen
Das Wissen um die Erstellung einer neuen Komponente wollen wir nun nutzen, um eine Tabelle umzusetzen. Wenn man sich die Scribbles anschaut, erkennt man sofort die Notwendigkeit einer Tabelle. Wir ignorieren an dieser Stelle, dass man es auch ohne HTML-Tabellen-Element umsetzen könnte. Schließlich wollen wir was lernen :-) [...] weiterlesen
Wir haben eine funktionsfähige Umgebung und können endlich mit der Entwicklung starten. [...] weiterlesen
Nachdem wir das StencilJS-Starter-Projekt aufgesetzt haben, fügen wir jetzt noch die nötigen Entwicklerwerkzeuge und ein CSS-Framework zum Projekt hinzu. Ziel dieser Werkzeuge ist ein einheitlicher und qualitativ-hochwertiger Code. [...] weiterlesen
In der Dokumentation von StencilJS wird erklärt wie man ein Projekt neu aufsetzt. [...] weiterlesen
StencilJS ist ein sehr gutes Framework mit dem man schnell robuste Webanwendungen bauen kann. Der Einstieg ist recht einfach, bzw. der Umstieg von zb. React macht es noch leichter. Der Grundgedanke ist leicht erklärt. Anstatt schwerfällige Runtimes/Kernbibliotheken mitauszuliefern, kompiliert StencilJS einfach den Webstandard Webcomponents, der in allen modernen Browsern out-of-the-box funktioniert. Weil diese Webcomponents, meiner Meinung nach, nicht schön zu programmieren sind, dient StencilJS als Luxuswerkzeug. [...] weiterlesen
See all tags.
weitere Posts befinden sich unter ArchiveKategorien
Favoriten