Einige nützliche Hilfen und Code-Schnipsel, die ich immer wieder benötige und deshalb hier für alle sammle.
Möchte man auf einer Webseite etwas mit Javascript je nach Bildschirmgröße verändern, so hat man einen Eventlistener auf resize. Macht man nun etwas mehr Veränderungen oder hat ein langsameres Gerät, so kommt das Javascript und der Browser schnell…
Für mein Spiel teamword.io benötigte ich für die zur Auswahl stehenden Wörter eine Funktion, die mir aus einem großen Array von Ratewörtern drei einzigartige Wörter/Strings holt, die dann dem Team angezeigt werden um das Wort für die Runde…
Einen Countdown in React zu erstellen ist relativ einfach, wenn man es denn richtig macht. Nach einigen Versuchen und ein bisschen Recherche bin ich dann auf eine funktionierende Lösung gekommen.
Bootstrap hat schon viele Utility Klassen um das meiste am Design ohne eine weiteres CSS zu machen, jedoch fehlte mir etwas um die Line-Height anpassen zu können. Daher habe ich ein paar Zeilen CSS ergänzt um diese Funktionalität herzustellen.…
Auf der Suche nach einem schönen Spielhaus für unser Kind kamen wir schnell zu dem Entschluss, dass wir uns ein Haus selber bauen werden. Die angebotenen Fertigbausätze hatten entweder nicht die passende Aufteilung, hielten nur 50kg Gewicht oder…
Möchte man socket.io und react zusammen benutzen, so kommt man schnell in die Schwierigkeit, dass die React-App mehrere verschiedene Verbindungen aufmacht und zu oft reagiert. Das Ganze lässt sich schnell und einfach mit einem Context-Provider…
Möchte man in Javascript ein Array klonen, so geht das Ganze seit ES6 sehr einfach. Wie das folgende Beispiel zeigt:
Hier mal ein kleines Snipped, dass es einem ermöglicht eine Box ganz nach unten zu scrollen, wenn es Änderungen gibt. Zum Beispiel wenn in einem Chat eine neue Nachricht kommt.
Manchmal kommt es vor, dass man Import und Export von Ecmascript 6 in NodeJs benutzen möchte. Mitlerweile gibt es für node dafür eine experimentelle Unterstützung (siehe hier), aber ich fand das nicht so schön. Eine einfache und schnelle Lösung ist…
In diesem Tutorial geht es diesmal nicht um Programmierung und Software sondern man muss selbst Hand anlegen und etwas reales erschaffen. Es ist ein Kinderbett mit einem Dach, also ein Hausbett. Inspiriert haben wir uns hierbei beim…