Aus dem OpenReplay Blog
Animationen mit Tailwind CSS Plugins hinzufügen
Die Optionen für Tailwind CSS-Animationen im Überblick: von integrierten Utilities über Plugins bis zu v4-Keyframes, stets mit Barrierefreiheit im Blick.
Sichere Verarbeitung von Benutzereingaben in Node.js
Zod, parametrisierte Abfragen und explizite Argumente schützen Node.js-Anwendungen vor SQL-Injection, Prototype-Pollution und Mass-Assignment-Angriffen.
Ein erster Blick auf die HTML Sanitizer API
Die HTML Sanitizer API bringt XSS-Schutz direkt in den Browser und vergleicht sichere Methoden mit DOMPurify-Fallbacks sowie effektiver Allowlist-Konfiguration.
So finden Sie DOM-Elemente nach Text
DOM-Elemente per Text abfragen lässt sich mit querySelector-Filterung, TreeWalker-Traversierung und XPath über document.evaluate zuverlässig umsetzen.
Die besten CDNs für moderne Webanwendungen
Cloudflare Workers, Fastly Instant Purge, AWS CloudFront und Akamai Ion im Vergleich für die richtige CDN-Wahl bei Frontend-Architektur und Edge-Logic.
Erste Schritte mit Laravel Livewire
PHP-Komponenten und Blade-Templates in Livewire ermöglichen dynamische Laravel-UIs mit automatischer Formularvalidierung und reaktiven DOM-Aktualisierungen.
Die CSS-Funktion random() erkunden
Die CSS-Funktion random() erzeugt native Zahlenwerte in Stylesheets und ersetzt JavaScript für visuelle Variation – mit Syntax, Caching-Keys und Fallbacks.
Styling von Select-Elementen mit modernem CSS
Select-Elemente mit appearance none und base-select stylen, clip-path sowie Fokus-Spans nutzen und per modernem CSS browserübergreifend schrittweise verbessern.
Echtzeit-UX mit der htmx-SSE-Erweiterung
Mit der SSE-Erweiterung und Server-Sent Events lässt sich eine Echtzeit-UI in htmx-Projekten per HTML-Attributen integrieren, ohne JavaScript-Framework.
Warum Sie mit `!` in TypeScript vorsichtig sein sollten
Der Non-Null-Assertion-Operator in TypeScript unterdrückt Compiler-Warnungen ohne Laufzeitschutz und macht Fehler zur Laufzeit schwer nachvollziehbar.
Relative Farbsyntax in CSS erklärt
Die relative Farbsyntax in CSS erlaubt, Tints, Shades und Transparenzvarianten aus einer Ausgangsfarbe per OKLCH und anderen modernen Farbfunktionen abzuleiten.
Sauberere Async-Ketten mit Promise.try schreiben
Promise.try fängt synchrone Fehler als Rejections ab und hält Async-Ketten sauber. Der Beitrag vergleicht Alternativen und zeigt bedingte Datenlademuster.
Was ist Babylon.js? Eine kurze Einführung
Babylon.js ist eine Open-Source-3D-Engine für JavaScript, basierend auf WebGL und WebGPU – mit einem Vergleich zu Three.js und typischen Anwendungsfällen.
So sichern Sie eine WordPress-Website
WordPress-Sites absichern: Plugin-Updates, 2FA, korrekte Dateiberechtigungen und eine WAF wie Cloudflare oder Wordfence schützen effektiv vor Angriffen.
Dynamische Viewport-Einheiten in CSS verstehen
Die CSS-Viewport-Einheiten svh, lvh und dvh lösen Layout-Clipping durch Browser-Chrome auf Mobilgeräten und helfen bei responsiven und Vollbild-Layouts.
Das Argument für Vanilla JavaScript statt Frameworks
Wann Vanilla JavaScript, Web Components, ES-Module und native Browser-APIs React oder Vue für spezifische Frontend-Projekte übertreffen, zeigt dieser Vergleich.
Was steckt in einer HTTP-Response?
HTTP-Antworten bestehen aus Statuszeile, Headern und Body. Dieses Wissen hilft beim Debuggen in DevTools und beim gezielten Verarbeiten von fetch-Ergebnissen.
Versteckte Funktionen in den Chrome DevTools
Chrome DevTools punktet mit CSS Overview, Logpoints, Coverage-Tab und Layout Shift-Debugging für bessere Performance und effizienteren Workflow.
UnJS kennenlernen: Framework-agnostische JavaScript-Tools
Das UnJS-Ökosystem stellt Tools wie Nitro, h3, ofetch und unplugin vor, die JavaScript-Infrastruktur laufzeitunabhängig und framework-agnostisch verwalten.
Wie OpenUI Web Components formt
OpenUI standardisiert UI-Muster über die Popover API, die Invoker Commands API und anpassbares Select-CSS, um den Aufwand für eigenes JavaScript zu reduzieren.
Wichtige npm-Befehle, die jeder Entwickler kennen sollte
Die npm CLI deckt Abhängigkeits-Audits, Skriptausführung und Pinning transitiver Abhängigkeiten ab, um Bäume zu debuggen und Sicherheitslücken zu beheben.
Wie man Komponenten in Svelte Lazy Loading anwendet
Svelte-Komponenten per dynamischer Imports und bedingtem Rendering lazy laden hält initiale Bundles in SvelteKit- und Vite-Projekten schlank.
So beheben Sie 'Cannot use import statement outside a module'
Den Fehler 'cannot use import statement outside a module' in Node.js, Browsern und Jest behebt man durch die korrekte Diagnose des Modulsystem-Konflikts.
Chromes Local Network Access (LNA) Berechtigung erklärt
Chrome Local Network Access schützt lokale Geräte vor öffentlichen Websites. Hier wird erklärt, was den LNA-Prompt auslöst und wie Web-Apps damit umgehen.