// Link

Kopieren und Einfügen in eine Shell kann böse Folgen haben

Einfach ein Befehl aus dem Internet kopieren und in die Shell einfügen. Der Befehl kann auf den ersten Blick harmlos aussehen, jedoch kann dieser eventuell böse Folgen haben.

Mit JavaScript kann man den Inhalt beim Kopieren anpassen und durch das Hinzufügen einer neuen Zeile, wird der Befehl nach dem Einfügen in die Shell auch direkt ausgeführt.

Der Link enthält auch ein Beispiel. Der Inhalt in der Zwischenablage ist ein anderer als der Text, der zuvor auf der Website kopiert wurde.

Don't Copy Paste Into A Shell
// Link

Ansible Playbook für Uberspace

Mein Namensvetter Lukas verwaltet seine Uberspaces mit Ansible. Mit Ansible lassen sich z.B. virtuelle Maschinen oder auch Uberspaces verwalten und automatisieren. Die Einrichtung, die man normalerweise händisch in das Terminal tippt, lässt sich mit Ansible nachbilden. Somit wird alles nachvollziehbar und auch reproduzierbar. Hat man alles über ein Ansible Playbook organisiert, kann man den aktuellen Zustand des Servers immer wieder erzeugen.

Lukas stellt seine Ansible Playbook zur Verfügung. Dies kann als Inspiration genutzt werden, um ein eigenes Ansible Playbook für Uberspace zu erstellen.

Ansible Playbook für Uberspace
// Link

Dashboard mit Laravel und Echtzeit-Funktionalität

Wenn man Echtzeit-Funktionalität in einer Web-Anwendung nutzen möchte, gibt es mir zwei bekannte Wege. Die erste Option ist, dass man in regelmäßigen Abständen den aktuellen Status vom Server lädt. Die Alternative, und vermutlich auch der elegantere Weg, ist die Nutzung von Websockets. Mit Websockets kann der Server neue Daten an den Browser schicken. Websockets bedeuten aber auch eine zusätzliche Schicht an Komplexität.

Der Artikel zeigt gut, dass man nicht vergessen sollte die Anwendung einfach zu halten.

Building a realtime dashboard powered by Laravel, Livewire and Tailwind (2020 edition)
// Link

gitmoji - Emojis in Commit-Nachricht für eine bessere Übersicht

Arbeitet man in unterschiedlichen Projekten mit unterschiedlichen Entwicklern, dann unterscheiden sich z.B. auch die Anforderungen an das Codestyling oder die Art des Aufbaus einer Commit-Nachricht. Gibt es ein Issue, dann stelle ich die Issue-Nummer vor die Commit-Nachricht. Mit gitmoji kann man aber noch einen Schritt weitergehen und Emojis verwenden. Das hat nicht nur den Zweck, dass die Nachrichten vielleicht cooler/moderner aussehen, sondern man hat nun die Möglichkeit anhand des Emojis zu sehen was für Codeänderungen in dem Commit enthalten sind. Das Ganze funktioniert natürlich nur, wenn alle Entwickler die gleichen Emojis für die Zuordnung verwenden. Das Projekt gitmoji gibt eine Übersicht über die zu verwendenden Emojis. Die Beschreibung des Projektes fasst es sehr gut zusammen:

Using emojis on commit messages provides an easy way of identifying the purpose or intention of a commit with only looking at the emojis used. As there are a lot of different emojis I found the need of creating a guide that can help to use emojis easier.

Die Schreibweise mit dem Doppelpunkt wird von GitHub und GitLab interpretiert und in der Weboberfläche werden die Emojis dargestellt. Fehlt eigentlich nur noch, dass Git Tower auch die Emojis interpretiert.

Wenn du Git über das Terminal bedienst, dann solltest du dir gitmoji-cli anschauen. Damit lassen sich die passenden Emojis zu dem Commit im Terminal auswählen.

gitmoji
// Link

Grid Garden - Ein Spiel, um CSS Grid zu lernen

CSS Grid ist mir ein Begriff, jedoch hatte ich bisher noch keinen Kontakt mit der neuen Technik. Mit der neuen Technik lassen sich komplexe Layouts erstellen ohne ein externes Framework zu verwenden. Die meisten aktuellen Browser unterstützen schon CSS Grid. Aus meiner Sicht ist die Technik noch etwas neu, um sie produktiv einzusetzen. Aber man kann sich jetzt schon damit beschäftigen.

CSS Garden bieten einen guten und spielerischen Einstieg in CSS Grid.

CSS Grid Garden
// Link

JavaScript 30 - Kostenloser Onlinekurs zum Thema Vanilla JavaScript

Bisher habe ich in jedem Projekt jQuery eingebunden, wenn JavaScript nötig war. jQuery vereinfach den Umgang mit JavaScript. Wenn man sich mal genauer mit Vanilla JavaScript beschäftigt, merkt man schnell, dass jQuery oft gar nicht nötig ist. Vanilla JavaScript bezeichnet das reine JavaScript ohne die Nutzung von Bibliotheken wie z.B. jQuery.

Vieles was man mit jQuery löst, lässt sich auch mit reinem JavaScript lösen. Meistens entstehen kaum mehr Zeilen Code im Vergleich zur Lösung mit jQuery. Der Vorteil von Vanilla JavaScript ist, dass man sich das Laden von jQuery sparen kann, da vermutlich nie alle Funktionen von jQuery benötigt werden und somit immer zusätzlich geladen werden.

Der kostenlose Onlinekurs zeigt anhand schöner Beispiele, wie man ohne jQuery oder andere JavaScript-Bibliothek auskommt. In 30 Videos bekommt man gezeigt, wie man nur mit JavaScript Aufgaben löst. Neben dem Videos erhält man einen Projektordner, in dem alle Aufgaben enthalten sind. Beim Schauen der Videos lässt sich das Gezeigte direkt umsetzen.

Die ersten Videos und Aufgaben haben mir sehr gut gefallen und man bekommt sehr schön gezeigt wie man Vanilla JavaScript schreibt. Dabei wird auch auf das neue JavaScript ES6 eingegangen.

Zum Onlinekurs JavaScript 30
// Link

fnm - Fast Node Manager

Wenn man mehrerer Node.js-Version nutzt, dann benötigt man ein Tool, das die Verwaltung übernimmt. nvm ist der wohl bekannteste Node Version Manager. Leider ist nvm sehr langsam und beeinflusst somit das Starten einer neuen Shell sehr stark.

Eine Alternative ist fnm, der sich auch um die Verwaltung von mehreren Node.js-Versionen kümmert. fnm beeinflusst das Starten einer neuen Shell jedoch nicht so stark. Ein weiterer Vorteil ist, dass fnm direkt mit der fish shell genutzt werden kann.

fnm
Vermutlich verwendest du einen veralteten Browser. Da diese Website auf moderne Technik setzt, benötigst du einen aktuellen Browser, um diese Website richtig darzustellen.