DevIdiot!

A bilingual Next.js site without middleware

This site is fully in English and Spanish. English is the default and Spanishis one click away, in the header. Every page has its own address in eachlanguage — /en/about and /es/sobre-mi, /en/contact and /es/contacto —and Google knows they're the same page in two languages, not two pagescompeting with each other.All of it is built on the Next.js 16 App Router, with no internationalisationlibrary and no middleware. This post walks through how, with the real code,and above all why each decision is

Signs Your Business Has Outgrown Spreadsheets, and What a Custom Web App Actually Costs You

Every business I've built a custom tool for started the same way: one spreadsheet that worked great. Then it became five spreadsheets, three people editing the same file, a color-coding system nobody remembers, and a weekly "reconciliation" meeting.Spreadsheets are a fantastic starting point. But there's a point where they start costing more than they save. Here's how to tell, and what to do next. Seven signs you've hit the ceilingMore than one person edits the same sheet daily, and you've

CAS-Protected Status Transitions in Client Management

The Problem: Race Conditions in Multi-Channel ConversationsWhen an Indian SMB manages customer conversations across WhatsApp, Instagram DM, SMS, and email simultaneously, state changes collide. A customer confirms a booking on WhatsApp while an agent marks it cancelled in the dashboard. A payment webhook arrives milliseconds after a manual refund. Without coordination, the last write wins — leaving the business with a confirmed appointment that was actually cancelled, or a payment marked p

We Stopped Letting the Model Write JSX

How a support case composer went from "suggest a React snippet" to a declarative catalog with A2UI v0.9, and what broke along the wayThe scariest pull request I reviewed last quarter was four lines long.It took a string the model had streamed back, ran it through a transpiler, and handed the result to new Function. The author (a good engineer, on a deadline) had a comment above it: // sandboxed enough for internal tools. It wasn't. I left a review comment I'm still a little proud of, closed the

I compared 1,489 eSIM plans in 199 countries. Price per GB varies 105x

Disclosure: we run Bitcall, which sells travel eSIMs. The prices below come from our own catalogue, so read them as one provider's prices on one date, not a survey of the market.We wanted to answer a simple question: how much does mobile data cost a traveller around the world? We had the data on our own site, so we turned it into a small price index. Here is how it works, with the code and a few things that surprised us. 1. The data was already structuredEvery destination page on our site c

I Built an AI 3D WebGL Portfolio Generator That Gives You Full Source Code Export

Hey everyone! 👋Like many developers, I noticed a frustrating tradeoff when creating a technical portfolio:Option A: Spend 40+ hours coding a custom website from scratch and maintaining it whenever you finish a new project.Option B: Use generic website builders that give you flat 2D templates, charge high monthly fees, and lock your code inside proprietary walled gardens.To solve this, I built MyFolio — an AI-powered 3D spatial portfolio generator that transforms your GitHub repositories and PDF

How Flingkeep turns a pointer gesture into a controlled throw in JavaScript

Flingkeep is our browser castle-defense game built around grabbing and throwing invading stick figures. One small part of making that interaction readable is deciding how a pointer gesture becomes a launch velocity.This walkthrough follows the current JavaScript implementation in our separate browser submission build. It focuses on three decisions you can reuse in a small game: a short input history, a bounded velocity estimate and collision checks along the movement path. Use the end of th

Build an AI Shopping Agent That Knows What a Deal Costs

Originally published at ForgeMesh.An AI shopping agent needs current product data, a way to compare like-for-like offers and an honest account of missing costs. ShopScout supplies search, product lookup, offer comparison and shipping-plan tools through an HTTP API and an MCP wrapper. This guide shows how to connect them to a tool-capable agent without tying the design to one chat model. Build around the tool contract, not one chat brandThe useful boundary is between the model that reasons a

A tiny deep-link trick so my Instagram stories open the exact game (3,000 games, 25 lines of JS)

This is not rocket science, and many of you have probably done it a hundred times. But it solved a real, annoying problem for me in 10 minutes, so I'm sharing it in case it helps someone else. 🙂 The problemI run PlayCombo, a small site with around 3,000 free HTML5 games split into 13 category pages. The games are loaded from a JSON list and rendered with plain JavaScript inside WordPress.Every day I post a story or a short video on Instagram, Facebook and YouTube showing one game. Then I ad

How to create an XML sitemap from a URL list

An XML sitemap is a list of public URLs that you want search engines to discover. It can help with discovery, but it does not guarantee crawling, indexing or rankings. Start with the sitemap your site already hasIf your site uses a CMS, check whether it already generates a sitemap. WordPress, Wix and other platforms can maintain one as pages are added or removed. Use that sitemap rather than creating a second file that will go stale.A manual sitemap makes sense when you have a small site, a

Prop Drilling in React

In React, props are used to pass data from a parent component to a child component. Props are an important part of React because they allow components to share information. However, when data needs to travel through many levels of components, it can lead to a situation called Prop Drilling.Prop drilling means passing data from a parent component to a deeply nested child component through intermediate components, even when those intermediate components do not need the data.For example, imagine th

Building a Zero-Lag Swiss Tax & Salary Calculator in Next.js (Why We Kept Everything in Browser Memory)

If you’ve ever looked at how taxes and social contributions work in Switzerland, you know it’s notoriously decentralized. There are 26 cantons, each with its own municipal tax multipliers (Steuerfuss), varying church taxes, multiple withholding tax tariffs (Quellensteuer), and statutory pension rules that change based on your exact age bracket.When building LivingSwiss, an expat analytics and financial tool suite, our initial instinct was to treat this like a standard backend system: send the us

I let Muse ship an app on SnoozeStack. Here's the whole thing.

Why I did thisI created SnoozeStack — a backend platform with a specific bet: most developers don't have one app with a million users, they have ten apps with a hundred users each, and the infrastructure tax per project is what kills the other nine.I wanted to test out Meta's new Muse AI Assistant and thought having it start from zero and setup a working public site on SnoozeStack would be a great test. If the platform is actually agent-friendly, an agent should be able to drive it end to

How to Install Node.js on Windows, Mac and Linux (Complete Guide)

I spent a weekend debugging a "node: command not found" error because I'd skipped a step in the Node.js install. So I wrote down everything I wish I'd known.If you want the version with OS-detection tabs and troubleshooting, here's the full guide:👉 How to Install Node.js on Windows, Mac, and LinuxHere's the short version. Which version should you install?Always install LTS (Long Term Support). It's stable, tested, and supported for years. Skip "Current" unless you need bleeding-edge feature

SOLID Principles in React: All Five Survived. Most Explanations Didn't.

Ask a frontend developer to explain SOLID, and almost every answer looks like this:class Shape { area(): number { /* ... */ }}class Rectangle extends Shape { /* ... */ }class Square extends Rectangle { /* the famous Liskov trap */ }Everyone nods. Nobody in the room has written class Shape in years. Their codebase is function components, hooks, and a server/client boundary that didn't exist when SOLID was written.So what's actually left of SOLID in React? Most articles answer by finding a React

I built my own operating system that runs in the browser (NebulaOS)

Most portfolios are a scroll of sections. Mine is an operating system.For Hack Club's WebOS 1 workshop I built NebulaOS, a personal OS that runs entirely in your browser. You boot it, open apps, drag windows around, lock the screen, and even type commands into a terminal to learn about me.👉 Try it: https://maddulasriharsha.github.io/webos/ (no sign-in, no password) 👉 Code: https://github.com/maddulasriharsha/webosWhat it can doWindow manager: drag, resize, minimize, maximize, and snap to screen

I built a browser wave-survival FPS with Three.js — no download, just open and play. 8 weapons, 7 enemy types, custom B* pathfinding, endless boss waves. If you enjoy it, a star would really help it get discovered: https://github.com/guangzhoueven/fps

GitHub - guangzhoueven/fps: 一个有趣，好玩的原创FPS游戏。 · GitHub 一个有趣，好玩的原创FPS游戏。. Contribute to guangzhoueven/fps development by creating an account on GitHub. github.com

A/B Testing UI Variations with Zero Performance Penalty & Zero Layout Shifts

A/B testing is essential for Conversion Rate Optimization (CRO). However, traditional third-party experimentation tools (Optimizely, VWO, Google Optimize) introduce severe architectural flaws:The Flash of Original Content (FOOC): The browser downloads the original page, displays it for 150ms, the tracking script downloads, parses, and swaps out the headline. Users see a distracting visual glitch.Devastating Cumulative Layout Shift (CLS): Dynamic DOM mutations push your CLS scores above 0.25, tri

Simple Lightweight CAPTCHA Alternative for React & Next.js

i try built a lightweight alternative captcha for react/nextjs 💅i recently wanted to add a bit of friction to my forms just to slow down automated bots. i didn't need anything massive—just a simple hurdle to make it a little more "expensive" or annoying for bots to spam.so i built react-math-captcha. it's just a lightweight, self-hosted tool that does exactly that without overcomplicating things. the simple goalthis isn't trying to be the most "advanced" security layer on the planet.

Eighteen hand-drawn SVG spots that invert on a dark panel without taking a single prop

Nakodo is built as a field guide to YouTube creators, so the interface is meant to look like a naturalist's notebook: a kingfisher called Alcy, tagged specimen entries, plate numbers, hatching instead of grey fills. All of it is drawn in React components rather than exported as assets, and the rule that made the whole set maintainable is that a spot illustration takes no colour props at all.This is the design-engineering half of the product. There is no clever algorithm in here, just a small set