DevIdiot!

Why the kiosk hid the courier in this JavaScript game

AI can generate a working game before you understand its engine. When a character suddenly disappears behind a kiosk, knowing which part of the code to inspect becomes useful.In Market Run, the courier below is standing in front of a fruit kiosk. You can see their shoes, but the rest of the character is hidden. Before changing the movement or collision code, freeze the two objects and inspect how the engine draws them.The blue dot marks the courier's feet. The red dot marks the kiosk's ground an

React Native for Beginners: Build Real Mobile Apps With JavaScript

React Native lets you build real mobile apps for Android and iOS using JavaScript and React. Instead of learning two separate languages and maintaining two codebases, you write one app and it runs on both platforms. That is why startups and small teams love it: one team, one codebase, two app stores. If you already know JavaScript, React Native is the shortest path to publishing a mobile app.How does React Native work? You build your app from components, just like a React website — but instead o

JavaScript for Beginners: The One Language Every Website Runs On

JavaScript is the programming language of the web. Every interactive button, dropdown, form validation, and animation you have ever used in a browser runs on JavaScript, and today it also runs on servers, mobile apps, and desktop apps. If you want to learn one language that opens the most doors in web development, JavaScript is it — it is the only language every browser speaks natively.How does JavaScript work? In the browser, JavaScript runs inside the page: it can read and change the HTML, lis

Zero-dependency Google Indexing API with Node.js crypto

I needed to submit 174 URLs to Google's Indexing API from a production server running Python 3.8 with system pip. The official quickstart uses google-auth, which meant either polluting system packages or spinning up a venv just to run one script.So I did it with Node's built-in crypto instead. Zero dependencies, no install step. What the API actually needsGoogle's Indexing API takes an OAuth 2.0 access token from a service account. The flow is:Sign a JWT with the service account's private k

Transformez votre programme CoddyRun en page web !

🌐 Transformez votre programme CoddyRun en page web !Un jeu, une animation, un exercice… En quelques clics, l'outil "Construire la page web" le transforme en un seul fichier .html qui s'ouvre dans n'importe quel navigateur : ordinateur, tablette ou téléphone, sans CoddyRun et sans Internet.✅ Code visible, en console seule ou caché✅ Onglet CoddyBlock pour voir le programme en blocs✅ Protection par mot de passe (code chiffré)✅ Toile ajustée à l'écran, même sur téléphone✅ Meilleurs scores et réglage

Each Emoji Counts as One Character: Grapheme Clusters in the Word Counter

I work on OnePassApps, the team behind app.onepassapps.com. This is about our own Word Counter, and every number below was read off the live panel on 8 November 2026 - one build, one signed-out session, one browser.Our guide for the app makes a promise about emoji: "Each emoji or accented character counts as one character." Three earlier posts of ours about this app said, in their own limits sections, that we had not tested emoji or accented characters, so that promise was still untested on this

Verify a minified stack against its JavaScript source map

A few weeks ago I wrote that minified browser code gives you function names like t and n until you apply source maps, and then admitted I hadn't tested it. This weekend I tested it.I didn't want another upload walkthrough. I wanted to know one thing: when a frame says a @ app.min.js:1:88, how do I prove the map I have turns it into the right function and the right line? And what does it look like when the map is wrong?So I built a 15-line checkout module, minified it with esbuild, threw a known

Why QuickBooks rejects bank .QBO / .QFX imports with Error OL-222 (and how to convert CSV, QFX, or IIF in the browser)

If you have ever helped a small business owner or bookkeeper import bank statements into QuickBooks, you have probably run into a surprisingly stubborn wall:QuickBooks Online and Desktop frequently reject .QBO or .QFX files with Error OL-222 or "Unable to verify the Financial Institution".Native 3-column CSV imports strip out Check Numbers (CHECKNUM), break on multi-line bank summary headers (like Chase or Wells Fargo), and reverse credit card charges on Amex/Citi exports.Sunsetted QuickBooks De

A PDF Writer in 40 Lines: Turning Photos Into PDFs in the Browser, No Library

We are a small Saudi team in Riyadh, and one of our 200 free browser tools turns photos into a PDF. People use it for receipts, ID scans, homework and contracts, so two things mattered: the photos must never be uploaded, and the page must stay light on a phone.The usual answer is to load a PDF library. We didn't. The whole writer is about 40 lines of plain JavaScript, and in our test its output passed a strict parser and opened in MuPDF without any repair. This post walks through how it works an

What Chrome Web Store review time actually looks like in 2026 (measured on 6 submissions)

Every few months someone asks "how long does Chrome Web Store review take now?" and the answers range from "two hours" to "three weeks". Both are true, because review time is not one number — it depends on what changed in the package. I keep timestamps for every submission of my extensions, so here is the real spread. The short versionWhat you submittedObserved timeRejection (policy violation in the listing text)~10 minutesUpdate, same permissions, small feature setsame day – 1 dayUpdate th

React 20 Compiler: Which Hooks It Eliminates, Which It Cannot, and How to Audit Your Codebase Before Upgrading

React 20 Compiler: Which Hooks It Eliminates, Which It Cannot, and How to Audit Your Codebase Before UpgradingThis article was written with the assistance of AI, under human supervision and review.The React Compiler shipped with React 19 as a stable Babel plugin that automatically memoizes components and hooks, eliminating the majority of manual useMemo, useCallback, and React.memo calls. Teams installing version 1.0.0 today find that most performance-oriented memoization becomes redundant

Our app says: the site didn't say, so we assumed. Then it rings the field each assumption is about

When software writes a document for you, the hard part is not writing it. It is telling you which bits it made up.Nakodo starts a campaign by writing a brief, which how it works describes with the line that matters here: everything in it can be changed before anything happens. A brief written from a website always contains guesses, because websites do not state everything, and the app keeps those guesses alongside it. The question is what the screen does with them.The answer is 133 lines, a pane

Our setup wizard keeps the step in the URL and the answers nowhere, so Back works and a reload starts over

Setting up a campaign in Nakodo is a wizard, which is a word that usually comes with a drafts table, an autosave, a half-finished row somebody has to clean up, and a resume link. This one has none of that, and the reason is one line of policy: nothing exists in the database until the last step before the review.What that buys is worth the trade I will come to at the end. The number of steps is a functionexport type Step = "kind" | "where" | "businesses" | "emails" | "website" | "review";exp

We import 53 icons from one library, and six of them ever reach a public page

Nakodo imports its interface icons from lucide-react. Counting the named imports across the repo:files importing lucide-react 52distinct icons imported 53imported by exactly one file 30icon elements rendered in JSX 132Thirty icons with a single call site each is the shape you would expect from a library: you reach for the one that fits and you never need it again. The interesting number is how many of those 53 a visitor can actually see, so I swept all 76 URLs in the sitem

Seven useMemo calls in 72,683 lines, six of them in one file, and the one that matters is not about speed

Nakodo is a Next.js 16 app on React 19.2.8: 582 TypeScript files, 72,683 lines. Most advice about React performance is about memoisation, so I grepped the whole thing to see how much of it we actually use.useMemo 7 occurrences, 2 filesuseCallback 2 occurrences, 2 filesReact.memo / memo() 0useDeferredValue 0useLayoutEffect 0useImperativeHandle 0For scale, the same grep over the same tree finds useEffect in 23 files, useState in 33, useTransition in 11

Thirty-two controls on our free tools, and not one of them is in the URL

The round planner on our marketing site turns a set of quiz rounds into a running order with real timings. It has 15 controls: a start time, a break length, which round the break follows, and a type select plus a question count for each round, with more appearing as you add rounds.Fill it in, get your running order, and send it to the person actually hosting the night. You cannot. The URL never changes. The measurementScripted on the live page:defaults start 20:00, 6 rounds, break af

A page of ours with nothing to click carries 253 event listeners, and 151 of them are on document

Open our FAQ page, open the console, and ask Chrome what is listening:const l = getEventListeners(document);console.log(Object.keys(l).length, "types,", Object.values(l).reduce((a, v) => a + v.length, 0), "listeners");// 90 types, 152 listenersThat page is prerendered HTML. It has no form, no dialog, no media element and nothing that changes after paint. It has 268 elements in the body. And 253 event listeners.I walked every node of four live pages over CDP to find out where they come from.

CSS Modules Explained: Say Goodbye to Global CSS Collisions in React

What is a CSS Module?A CSS Module is a build system configuration that automatically scopes Cascading Style Sheets (CSS) class names locally to the specific JavaScript component that imports them. Rather than relying on global style declarations that risk overriding each other, CSS Modules generates a unique class name (typically by appending a random hash) for every class during build time. This ensures that styling rules defined for a single user interface (UI) element remain entirely co

Every clip our video package renders keeps its alpha channel, and the five-line config is the smallest part of that

Munchable markets itself with video where a person is on camera holding a food packet. That ruled out the obvious thing, which is rendering finished vertical reels, because a finished reel has no room in it for the person. What the repo produces instead is a set of transparent overlays: the phone, the caption, the sticker, the scan guide, each one a clip you drop on a track above your own footage.That is a Remotion package of 13 overlays, one end card, a pile of icons, and two scripts. Here is w

Our Expo web build animates its own navigation in 196 lines, and half of them are not about animation

Munchable ships from one Expo codebase to iOS, Android and the web. On the phones, navigation is the native stack: real UIKit and Fragment transitions, nothing to write. On the web, react-native-screens renders a pile of absolutely positioned plain views, so every push lands instantly with no transition at all.The fix is one platform file. src/components/Stack.tsx is three lines:export { Stack } from 'expo-router';src/components/Stack.web.tsx is 196, exports the same shape, and reads the same an