Der Blog

Die Blog-Artikel dokumentieren aktuelle Arbeitsschwerpunkte und Aspekte der Erstellung dieser Internetpräsenz.

Der erste Beitrag trägt sinnigerweise den Titel »Einführung«. Er findet sich ganz am Ende der Liste.

ArcadeDB

Bridgetown-basierende Internetauftritte können auf Inhalte der NoSQL-Datenbank ArcadeDB zugreifen.
arcadedb Lesen…

ArcadeDB Plugin für Bridgetown

Bridgetown-basierende Internetauftritte können auf Inhalte der NoSQL-Datenbank ArcadeDB zugreifen.
arcadedb bridgetown Lesen…

IB-Ruby Plugin für Bridgetown

Das Plugin eröffnet Bridgetown im Server Site Rendering-Modus den Zugang zur TWS-API von Interactive Brokers.
ibruby bridgetown Lesen…

Interaktivität mit Turbo-Frames

Interaktivität (fast) ohne Javascript. Das verspricht das »Turbo»-Projekt. Ein Klick auf einen Buttom ruft in diesem Beispiel eine normale Seite auf, stellt sie aber in einem Modal dar.
css javascript turbo Lesen…

Graphische Anwendungen mit Containern

Container isolieren Prozesse. Die zusätzliche Sicherheit gibt es fast Umsonst. Die graphische Ausgabe ist nicht von der eines »normalem« Programmaufrufs zu unterscheiden.
automation lxd Lesen…

Containerdienste unter Windows

LXD-Container benötigen eine Unix-Umgebung. Mit dem aktuellen »Windows Subsystem for Linux« können Container-Instanzen auch bequem auf Windows-Rechnern installiert und benutzt werden.
automation lxd Lesen…

Standardisierter Servicerechner

Per Bash-Skript wird ein standardisierter Handelsrechner inklusive der Handels-Software und eines administrativen SSH-Tunnels als LXD-Container installiert.
automation lxd Lesen…

Netzwerk aus LXD-Containern

Wie organisiert man seine digitale Arbeit? Dieser Beitrag zeigt, wie eine Arbeitsumgebung aus isolierten LXD-Containern erstellt wird, die auf einem Desktop-Rechner oder Server lebt und im gesamten Netzwerk verfügbar ist.
automation lxd netzwerk Lesen…

Dreispaltiges Grid-Design

Ein dreispaltiges responsives Design kann elegant mit einem Grid-Layout aufgesetzt werden. Wenn nur zwei Elemente nebeneinander passen, wird das dritte auf einer neuen Zeile fensterfüllend platziert.
css grid responsive Lesen…

Eine Sidebar

Die Blogbeiträge bekommen in der Desktop-Darstellung eine Sidebar. Dort wird auf weitere Blogbeiträge verwiesen.
css flexbox grid Lesen…

Zweispaltiges Hero

Realisierung eines zweispaltigen Designs für Webseiten mit Bridgetown.
css grid Lesen…

Positionierung von Bildern und Texten

Das saubere Platzieren von Texten vor Bildhintergründen ist im Responsive Design essentiell. Hier sind Flexbox-basierte Techniken zusammengetragen.
css flexbox Lesen…

Die Hero Komponente

Eine Hero-Komponente dient als Eyecatcher auf der Eingangsseite eines Webauftritts. Für die Umsetzung kann Flexbox oder Grid eingesetzt werden.
css flex grid Lesen…

Blog-Texte

Der Blog wird mit Markdown formatiert. Die Texte sind gut lesbar und können mit jedem Editor erstellt werden. Frontmatter stellt ein einfaches Interface für beschreibende Inhalte und variable Bestandteile bereit. So werden bereits auf dieser Ebene Form und Inhalt getrennt.
html Lesen…

Die Navigation

Die Navigation ist ein idealer Kandidat für eine Bridgetown-Komponente. Dort wird die gewünschte Funktionalität umgesetzt. In der Komponente sind Form und Inhalt klar getrennt.
css html sidebar Lesen…

Esbuild Anpassungen

Das Frontend (CSS + JS-Dateien) wird über das Tool Esbuild zusammenhalten. Für die Einbindung des Ruby-Javascript-Preprozessors <em>ruby2js</em> ist eine Modifikation notwendig.
javascript Lesen…

Installation von Schriftarten

Wenn die benutzen Schriftarten lokal vorgehalten und direkt eingebunden werden, entfällt das aufwendige Einholen der Erlaubnis, externe Quellen einzubinden.
setup Lesen…

PostCSS

Postcss macht den fertigen CSS-Code Browser-Kompatibel. Beim Web-Design können moderne Features benutzt werden. Für ältere Versionen implementiert PostCSS javascriptbasierte Simulationen.
css Lesen…

Einführung

Was liegt näher, als die Beiträge mit dem Protokoll zum Aufsetzen dieses Blogs selbst zu beginnen? Los gehts mit der Initialisierung des Projekts. Der Schwerpunkt des ersten Beitrags liegt auf dem Setup des Frontends.
Lesen…