DevIdiot!
Ecommerce Payment Integration: Reconcile Stripe Payouts in Node.js
Ecommerce payment integration isn't finished when checkout works. It's finished when you can trace every Stripe payout back to the orders in your database, and anything that doesn't match gets sent to a person. If your finance team exports CSVs every month and matches rows by hand in a spreadsheet, this tutorial replaces that with a nightly Node.js job.The job pulls the balance transactions behind each payout and matches them to your orders table. It then writes refunds, disputes, amount mismatc
I Built a DSCR Calculator in Vanilla JavaScript — Here's the Loan Math Nobody Explains
A while back I needed a DSCR calculator that wasn't buried under popups and didn't ask me to create an account before showing a single number. So I built one: a free, no-signup debt service coverage ratio calculator for rental property investors. It runs entirely in the browser.It sounded like a weekend project. The math had opinions.Here's what I learned, with the actual logic. What DSCR actually isDSCR (debt service coverage ratio) answers one question: for every dollar of loan payment a
Part 6: Quotient Filters - the Theory
In the previous articles of this series, we saw Bloom Filters, with restrictions on removing added values. Here we'll see Quotient Filters, which free the caller from those limits. Quotient FiltersBloom Filters answer one question cheaply: "Have I possibly seen this value before?" An SBF cannot support removals, and a CBF can, albeit at a cost: it requires more memory, and to ensure a removal causes no problems, the caller must do extra work. Quotient Filters (QF) work differently to a
Understanding Aspect Ratios in CSS and Canvas: Formulas, Responsive Rules, and Image Cropping
When building responsive image galleries, hero sections, or interactive media canvases, aspect ratio mismatches are among the common causes of Cumulative Layout Shift (CLS) and awkward visual cropping.A browser may not know an image's intrinsic dimensions early enough to reserve the right space before layout, unless the dimensions or aspect ratio are provided in advance. When the rendered image changes the space occupied by surrounding content, the page can shift unexpectedly.Here is a practical
Vite+ 1.0 ships one command for the whole web toolchain
VoidZero, the company behind the Vite build tool, released Vite+ 1.0 on September 28, 2026. It is the first stable version of an all-in-one toolchain for web development. A single command, vp, manages the Node.js runtime, the package manager, builds, tests, linting and formatting. Vite+ is free, MIT licensed and close to two million weekly downloads. For teams that maintain a separate config file for every tool, it offers one file instead. What Vite+ bundlesA toolchain is the set of program
I Ship 61 Calculators as a Static Site in 12 Languages — Here's How
I Ship 61 Calculators as a Static Site in 12 Languages — Here's HowWe're a small team of software engineers, and we run youcancalc.com — a free collection of 61 calculators, localized into 12 languages. No accounts, no backend, no paywall, no tracking pixels. Every calculation happens in your browser. This is a notes-from-the-trenches post about the architecture choices that make that possible, and the ones we'd make again. The whole thing is staticThe site is a statically-exported si
How to Validate Sri Lankan NIC Numbers, Phone Numbers, and LKR Amounts.
Links: GitHub · npm · API documentationShort answer: install lanka-validations from npm and call isValidNic('921234567V') from lanka-validations/nic. It returns true for valid old-format (9 digits plus V or X) and new-format (12 digits) Sri Lankan NIC numbers. The same package validates phone numbers, passports, driving licences, vehicle plates, LKR amounts, postal codes, CBSL bank codes, and TIN/VAT numbers. It has no runtime dependencies.npm install lanka-validationsimport { isValidNic, parseN
Accept USDT and USDC on a custom site without a payment processor account
Most ways to take crypto on a custom website start with a sign-up: create a processor account, pass business verification, generate an API key, store it somewhere safe, and let the processor collect your payments into a balance you withdraw later.If you just want USDT and USDC paid to your own wallet, there's a lighter shape. This post walks through it with one server-side request and no API key. The requestYour server creates a checkout with the price and the wallets you want to be paid in
Adding escrow to a freelance platform with one API call
Freelance platforms live and die on one moment: the client has to pay before the work is done, and the freelancer has to start work before they've been paid. Every platform solves it the same way in principle: hold the money in the middle until the work is delivered.This post shows how to do that with an escrow contract instead of your own balance, using one API call per milestone. No account, no API key, and your platform never holds the funds. The flowThe client accepts a proposal. Your s
I stopped arguing about chores and date night: building decision dice with real 3D physics
Every household has the same three arguments on repeat: who does the dishes, where do we eat, and what do we do Friday night. None of them is hard. All of them are tiring. That's decision fatigue: the energy isn't spent on the choice, it's spent on negotiating it. The ideaInstead of debating, roll a die. If the die is physical and a bit theatrical, nobody feels outvoted: the dice did it. It works for:Roommates: dishes, bins, bathroom, "whose turn is it to call the landlord".Couples: date ni
EliteGrid 0.2.0: a modular TypeScript data grid (77 kB, zero deps, 32 features)
We've been building EliteGrid, a TypeScript data grid for React, Vue and plain JavaScript. 0.2.0 is out on npm today, launching as the Community edition. It's the biggest release so far, and it's a breaking one, so here's what changed and why. The problem with most gridsMost grids ship every feature whether you use it or not, and configure them with a pile of flat boolean options like enableMultiColumnSorting. We wanted two things: only ship the code you actually use, and a config that read
Web Accessibility (a11y): Building UIs Everyone Can Use
âš¡ TL;DR: Most accessibility is free if you start with semantic HTML: a real button beats a div-button every time. Use the POUR principles, keyboard support, and contrast, and remember the first rule of ARIA is don't use ARIA. ContentsThe button that isn't a buttonAccessibility is just usability, for everyoneHow assistive tech actually sees your pageThe four POUR principlesDiv-button vs. real buttonThe first rule of ARIACommon mistakes that lock people outTakeawaysWhere to go next The b
Assemble 24fps Clips into a 30fps Remotion Composition
Generating the shots was one stage. Making the product name, transitions and sound land on the intended frames was another.This implementation note records the inputs, failure modes and checks needed to make the workflow reviewable. Place sound on the same timelineMusic and effects were placed at frame positions, with fades where needed. The final mix in this record measured about -17.5 LUFS and -2.7 dB peak; these are project measurements rather than universal loudness targets. Review spee
Room booking app with Next.js and Prisma
The room booking tutorial ends with "check again on the server". This one builds that server. You get a Next.js App Router app where rooms and bookings live in Postgres through Prisma, the calendar is Resource Scheduler in a client component, and the route handlers decide whether a booking is allowed.Every file is in the steps below, so you can copy them in order. The finished app is also in the repository as the resource-scheduler-rooms-starter folder; fetch just that folder with npx degit mdob
React Frontend Feature Flags: 3 Polling API Fallback Rules
Short answer: Poll feature flags for presentation changes in a React dashboard, and keep defaults in the application so a delayed or failed fetch cannot stop operators from inspecting a nightly fintech pipeline. Do not use a browser flag to authorize a payment or change billing behavior. If the real goal is searching structured pipeline logs and attributing their costs, treat flags as a small part of the operator interface, not as a substitute for log search, alerts, or an audit trail.Keep the d
React equipment rental calendar
A rental calendar has the things you rent down the side and the days across the top. Some things are one unit (a van), some are a pool (three projectors), one is in for service on a day, and the question you get all day is "when is it free for three days?". This tutorial builds that with Resource Scheduler in seven steps. It is the same component running below.See it running live: interactive demo.Try three things. Drag the Delivery van booking to Tuesday on the projectors: three projectors are
React clinic appointment board
A clinic board has clinicians down the side and the day across the top. Every visit is the same length, each clinician works their own hours, nobody is booked back to back, and reception wants to ask "who is free next?". This tutorial builds that with Resource Scheduler in seven steps. It is the same component running below.See it running live: interactive demo.Try three things. Drag Tanaka (Dr Brown, 9:00) to Nurse Cho at 9:30: that is right after Singh, so the gap is missing and the drop turns
React shift planner (employee roster)
A shift planner has people down the side and days across the top. The standing rota repeats every week, people have contracted days and leave, someone covers a shift now and then, and there is a house rule about hours. This tutorial builds that with Resource Scheduler in six steps. It is the same component running below.See it running live: interactive demo.Try three things. Drag Cy's Friday shift to Ann: she already works 32 hours, so the drop turns red and nothing moves. Drag Cy's Monday shift
React room booking calendar (no double booking)
A room booking calendar has rooms down the side and half hours across the top. People pick free time, fill in a form, and two bookings can never share a room. This tutorial builds that with Resource Scheduler in five steps. It is the same component running below.See it running live: interactive demo.Drag across free time on a room to open the form. Try the booked blocks: you cannot select them, drop another booking on them, or resize into them. 1. Installnpm install resource-schedulerWorks
Building a Low-Latency Soundboard in Next.js: Audio Preloading, Web Audio and Mobile Autoplay Gotchas
A soundboard looks like the simplest app ever: a grid of buttons, each one plays a sound. I thought I'd finish one in an evening.Then I tested it on my phone. Tap a button, wait about 300 ms, then the sound. On iOS, the first tap sometimes did nothing at all. Spam a button quickly and sounds either cut each other off or queued up like a slow printer.For a meme soundboard, timing is the whole joke. A late "bruh" isn't funny. This post covers what I changed to make playback feel instant, using Nex