LogoBotmonster Tech
AI Smart Home Self-Hosting Coding Web Dev Hardware Bootpag Image2SVG Tags
CSS Anchor Positioning: Replace Floating UI With CSS

CSS Anchor Positioning: Replace Floating UI With CSS

CSS Anchor Positioning is a browser-native feature that pins any absolutely-placed element to another element in the document. No JavaScript required. With the anchor() function, position-anchor property, and @position-try rules, you can build tooltips, dropdown menus, and context menus in pure CSS and HTML. It now works in Chrome 125+, Firefox 132+, and Safari 18.2+, which covers about 91% of browser traffic. Pair it with the HTML popover attribute (Baseline 2024) and you get show/hide toggling, keyboard dismissal, and top-layer stacking for free. The JavaScript tooltip library is dead for most use cases.

Implement OAuth 2.0 with PKCE: Flask + GitHub Login

Implement OAuth 2.0 with PKCE: Flask + GitHub Login

You implement OAuth 2.0 login by using the Authorization Code flow with PKCE (Proof Key for Code Exchange). Your web app redirects the user to the provider’s authorization endpoint with a code_challenge, the user authenticates and consents, the provider redirects back with an authorization code, and your backend exchanges that code along with the code_verifier for an access token. PKCE is mandatory for all OAuth 2.0 clients under the OAuth 2.1 draft specification (currently at draft-ietf-oauth-v2-1-15) and eliminates the need for a client secret in public clients. Building this from scratch - without Auth0, Clerk, or NextAuth - takes roughly 200 lines of code and teaches you exactly how token exchange, session management, and token refresh actually work.

Tailwind v4: Oxide Rust Engine, 182x Incremental Builds, CSS Config

Tailwind v4: Oxide Rust Engine, 182x Incremental Builds, CSS Config

Tailwind CSS v4 is a ground-up rewrite. The JavaScript-based PostCSS plugin is gone. In its place is a Rust-powered engine called Oxide. Configuration moves from tailwind.config.js into CSS-native @theme directives. Full builds run up to 5x faster, and incremental builds over 100x faster. The entry point is now a single @import "tailwindcss" line instead of three @tailwind directives. Most v3 projects can migrate in under an hour with the official @tailwindcss/upgrade codemod. Still, knowing what changed, and why, prevents surprises during the move.

Web Font Subsetting: Cut Payload by 90% with Variable Fonts

Web Font Subsetting: Cut Payload by 90% with Variable Fonts

By subsetting a variable font with pyftsubset to include only the Unicode ranges and OpenType features your site actually needs, and serving it as a WOFF2 file with the CSS unicode-range descriptor, you can reduce web font payload by 70-85%. A typical setup drops a 300 KB variable font to under 40 KB while keeping full weight and italic axis support for every glyph you actually use. This post walks through the entire process from font selection to CI integration.

Real-Time Chat with WebSockets: Under 150 Lines, No Framework

Real-Time Chat with WebSockets: Under 150 Lines, No Framework

A WebSocket chat needs two pieces. The server holds open connections and sends each message to every client. The browser client opens a socket, sends text on form submit, and shows new messages in the page. This build uses Node.js with the ws library and plain JavaScript on the client. No React, no Socket.IO, no build step. The whole thing fits in under 150 lines and handles dozens of users at once on a cheap server. This tutorial walks through every part.

Webhook Relay with Cloudflare Tunnels: Free ngrok Alternative

Webhook Relay with Cloudflare Tunnels: Free ngrok Alternative

You can expose a local dev server to webhooks from GitHub, Stripe, or Twilio. Run cloudflared next to a FastAPI app. This drops port forwarding, public IPs, and paid ngrok plans. Cloudflare Tunnels open an outbound-only encrypted link from your machine to Cloudflare’s edge. The edge then proxies webhook requests back to your local FastAPI endpoint with full TLS, auto reconnect, and no firewall changes.

The trick works because cloudflared opens QUIC connections outward from your machine. No inbound ports ever open on your router. Cloudflare’s edge gets the webhook POST from GitHub or Stripe. It routes that POST through your tunnel and hands it to localhost:8000, where FastAPI handles it. You get a stable, public URL like webhooks.yourdomain.com that survives reboots.

  • ◀︎
  • 1
  • 2
  • 3
  • 4
  • 5
  • ▶︎

Most Popular

Wildcard SSL Certificates with Let's Encrypt and DNS-01

Wildcard SSL Certificates with Let's Encrypt and DNS-01

Wildcard SSL certs from Let's Encrypt use DNS-01 or the new DNS-PERSIST-01 challenge. Certbot and acme.sh automate the process; systemd timers run renewal.

CSS Anchor Positioning: Replace Floating UI With CSS

CSS Anchor Positioning: Replace Floating UI With CSS

CSS Anchor Positioning pins tooltips and popovers to elements using pure CSS. Replace JavaScript positioning libraries with native browser anchor APIs.

WCAG 2.2 Web Forms: Error Handling, Validation, ARIA

WCAG 2.2 Web Forms: Error Handling, Validation, ARIA

Build WCAG 2.2 AA-compliant web forms with semantic HTML, ARIA attributes, real-time inline validation, and clear error message summaries for all users.

Self-Host Plausible Analytics: 1 KB Script, No Cookies

Self-Host Plausible Analytics: 1 KB Script, No Cookies

Self-host Plausible on a cheap VPS with Docker Compose: 1 KB gzipped privacy-first tracking script, zero cookies. Complete Google Analytics alternative.

Tailwind v4: Oxide Rust Engine, 182x Incremental Builds, CSS Config

Tailwind v4: Oxide Rust Engine, 182x Incremental Builds, CSS Config

Tailwind CSS v4 uses Rust-powered Oxide, moves config to CSS @theme directives, and builds 5x faster. Update utilities and convert config to CSS.

SQLite at the Edge: 100x Faster Reads, Cloudflare D1 and LiteFS

SQLite at the Edge: 100x Faster Reads, Cloudflare D1 and LiteFS

SQLite at the edge: sub-millisecond queries in serverless, CDN environments. Cloudflare D1, Turso, and Litestream distribute databases for production.

Like what you read?

Get new posts on Linux, AI, and self-hosting delivered to your inbox weekly.

Privacy Policy  ·  Terms of Service
2026 Botmonster