The complete list, no omissions, each tool with its exact job, its input, its output, and the specific moment it is the right tool. One: the Cron expression parser — input is the expression, output is the human sentence and the fire times, the moment is the schedule that is not a sentence, which is every schedule, because the schedule is never a sentence, it is always a pattern of numbers that needs translating. Two: YAML to JSON — the config to the API, the moment is the deploy that needs the config in a different format than the team wrote it in. Three: URL slug generator — the title to the URL, the moment is the publish, because the title is not a URL and the URL is not the title, and the conversion is the step between them.
Four: HTML to text — the page to the words, the moment is the content that needs extracting from the markup. Five: QR code generator — the data to the code, the moment is the demo, because the demo needs the URL on the phone in three seconds, and the three seconds is the window. Six: HTML entities encoder and decoder — the special characters to the entities and back, the moment is the copy-paste that breaks on the ampersand. Seven: UUID generator — the test data to the identifiers, the moment is the test fixture that needs a unique value. Eight: password generator — the requirement to the entropy, the moment is the account that needs a password it does not have to remember. Nine: Lorem Ipsum generator — the layout to the placeholder, the moment is the design review that needs text in the boxes. Ten: hash generator — the file to the digest, the moment is the download that needs verifying. Eleven: Base64 encoder and decoder — the blob to the readable and back, the moment is the error message that is encoded. Twelve: JWT decoder — the token to the claims, the moment is the 401 that needs its expiration. Thirteen: diff tool — the two versions to the changed lines, the moment is the config that broke the deploy. Fourteen: CSV to JSON — the spreadsheet to the data, the moment is the import that needs the table as objects. Fourteen jobs, fourteen tools, and the moment each one is the answer.
Lists are a lazy format, and a lazy list is worse than no list, because it costs you ten minutes and gives you nothing. So this one is built to a standard: every item has what it does, when you would actually use it, and the specific failure it prevents. No filler, no and-more. No item that exists only to pad the count. the DevTools collection is the lens — 14 pure-HTML developer tools: converters, generators, and inspectors. Zero install, zero tracking, works offline. — and the list below is the part you can screenshot and keep. If an item does not save you a specific amount of time or a specific kind of pain, it is not on the list, and the items that are on it are ordered by how often they actually earn their place.
The Search Bar Is Load-Bearing
The collection has a client-side search bar that filters the fourteen tool cards by name and description, and it is doing more work than it looks. In a fourteen-tool collection, the failure mode is not: the tool does not exist. It is: I do not remember the exact name, and I do not remember which of the three converters it was. The search bar turns that failure into a two-word query: yaml, hash, qr. The implementation is a few lines of JavaScript that filter the page, which is exactly the kind of feature that a framework-based site would treat as a component and a pure-HTML site treats as a paragraph of code. Small features, done without infrastructure, are the signature of the design: every line of the site earns its place, and the search bar is the line that earns the most, because it is the difference between finding the tool in two seconds and not finding it at all. The search is the index of the drawer, and a drawer without an index is a pile. The bar is the difference.
What I Would Add Next, Honestly
Every collection has a backlog, and being honest about it is more useful than pretending the tool is finished. The candidates in order of value: more converter pairs — the remaining config formats are the obvious gaps; a date-time formatter to sit next to the schedule parser; and a language pass, because the site currently ships in one language while the problems it solves are universal. The candidates I am deliberately not doing: accounts, sync, and personalization. Those are the features that would turn a zero-trust tool into a trust decision, and they are the features that would add a server to a serverless site. The backlog is a list of converters and formatters. Everything else is a different product, and a different product is not the point. The honesty is the feature: the roadmap is short enough to read, the non-roadmap is named, and the reason for each no is the same reason the collection exists in the first place — the tool should stay small enough to trust, and every feature that does not serve that constraint is a feature the collection does not have. The absence is the policy.
Who It Is For, and Who It Is Not
The collection is for the developer who hits a format problem and wants the answer in five seconds, not a five-minute search. It is for the two-in-the-morning token decode, the conference-room QR code, the config conversion on a flaky connection. It is not for the team that needs shared workspaces, audit logs, and admin controls — that is a different category of product with a different trust model. It is not for the power user who wants a plugin ecosystem or a macro system — the tools are deliberately one-job-each. And it is not a replacement for a real IDE or a real debugger; it is the set of small, standalone answers that sit next to those tools. The right frame is a drawer of hand tools: each one small, each one specific, and the drawer is the point. Knowing who it is not for is as useful as knowing who it is for, because the wrong user does not get a bad experience — they get an experience that is missing the features they came for, and the missing features are the named ones, the deliberate absences. The collection is honest about its edge, and the edge is the design.
Pairing the Browser Tools With the CLI Toolkit
The browser collection and the CLI tools cover the same developer day from two angles. In the terminal: the scaffolder generates the project, the secret scanner checks it, the git analytics measure the repository, the snippet manager stores the code that falls out. In the browser: the converters handle the format collisions, the generators produce the values, the inspectors decode the artifacts. The day is one continuous loop of mechanical problems, and the toolkit is the set of small answers to each of them. The two halves are independent — the browser tools do not need the CLI, and the CLI does not need the browser — but the pattern is the same in both: a specific, frequent, mechanical task, answered by a tool that does exactly that and nothing else. Collectively, they are a working theory of what a modern developer's toolkit should look like: small, single-purpose, zero-ceremony, and always available. The theory is not in the tools individually; it is in the set, and the set is the argument. Each tool is a sentence, and the toolkit is the paragraph that makes sense.
The Converter Family: When Formats Collide
Half of the collection exists for one specific pain: the moment when the format in front of you is not the format you need. YAML from a config file needs to be JSON for the API. CSV from the spreadsheet needs to be JSON for the script. An encoded blob from an error message needs to be readable. An HTML entities dump from a scraped page needs to be plain text. A chunk of HTML needs to be the text inside it. Each converter is small, instant, and client-side — the data you paste is processed in your browser and never transmitted anywhere. The collection is organized so that when the format collision happens, the tool is one tab away, and the answer to how do I convert this stops being a five-minute search and starts being a five-second paste. The converters are the highest-frequency tools in the collection, and the frequency is the point: the tool you use a hundred times a year is worth more than the tool you use a hundred times in one emergency, even though the emergency feels bigger when it happens.
The Inspector Family: Reading What You Cannot Parse in Your Head
Inspectors are for the artifacts that are structured but not human-readable at a glance. The Cron expression parser turns a schedule into a sentence and a visualization of when it fires. The JWT decoder splits a token into its header, payload, and signature, and shows you the claims — including the expiration, which is the answer to why is this failing now. The hash generator computes digests for text, which is the verification step after a download. The diff tool highlights the exact lines that differ between two versions of anything. The common thread: the artifact is right there in front of you, but reading it correctly takes a tool. The collection is that tool, for the artifacts every developer meets. The inspectors are the tools that save the most time per use, because the alternative is not a small cost — it is a wrong answer, and the wrong answer in a schedule or a token or a checksum is the kind of error that costs an hour to find. The inspector finds it in five seconds, which is the entire value proposition of the family.
Offline-First as a Feature, Not an Absence
The tools work without a network connection, and that is the most underrated property in the collection. Airplane mode: the converters still convert. A flaky office connection: the hash generator still hashes. A conference hall with no signal: the diff tool still diffs. The practical moments are specific and real — the deploy that is failing on a train, the token that needs decoding in a meeting room where the Wi-Fi is a joke, the config that needs converting while the VPN is down. An online-only tool is a tool that is unavailable exactly when the network is the thing that is broken. Offline-first is not a fallback mode. It is the difference between a tool that is always available and a tool that is available when the internet agrees. The property costs nothing to build — it is a consequence of the pure-HTML design — and it shows up in the moments that matter most, which are the moments when everything else in the stack is unavailable and the one thing you need is the small tool that does not need the network to be the thing you need. The offline tool is the last tool standing, and that is exactly where you want it.
14 Tools, One Tab, Zero Install
The collection is fourteen developer tools on a single page: a Cron expression parser, a YAML-to-JSON converter, a URL slug generator, an HTML-to-text converter, a QR code generator, an HTML entities encoder and decoder, a UUID generator, a password generator, a Lorem Ipsum generator, a hash generator for the SHA family, a Base64 encoder and decoder, a JWT decoder, a text diff tool, and a CSV-to-JSON converter. All of them are pure HTML and JavaScript. No install, no extension, no account, no build step. You open the page, you pick a tool, you use it, you close the tab. The design constraint that shaped everything: if a tool needs an install, it will not be used in the moment it is needed, and the moment it is needed is the only moment it matters. Fourteen tools, one tab, zero install — and each one does exactly one job, which is the constraint that makes the collection feel like a drawer of hand tools instead of a software suite. The drawer is the point.
Why Pure HTML Is a Feature, Not a Limitation
Every tool in the collection is a single HTML file. No framework, no build step, no node_modules, no bundle. The consequence is that the tools are smaller than the README that describes them, they load instantly on any connection, they work in airplane mode, and they will still work when the current JavaScript framework of the moment has been abandoned. There is also a maintenance argument: a pure-HTML tool can be reviewed by anyone in the team, fixed with a text editor, and deployed by pushing a file. The build pipeline for the entire collection is a commit. In a category full of tools that need a runtime version and a package manager to run, the absence of both is not a compromise. It is the product. The tool should be as permanent as the problem it solves, and the problems — convert this, generate that, decode this — are as old as the formats themselves. The formats change slowly. The pure-HTML tools change with them, and nothing else in the stack has to change at all. That permanence is the feature.
GitHub Pages: Hosting That Costs Nothing and Owes Nothing
The collection lives on static hosting, and that is a deliberate infrastructure decision with a specific shape. No server to pay for, no uptime to manage, no scaling to think about, no vendor lock-in beyond the repository itself. The site is static files in a git repository, and the entire operational model is: commit, push, done. When a tool needs a fix, the fix is a pull request, reviewable like any other code. When the collection needs to move, it is a repository, portable by definition. The tradeoff is real — static hosting means no server-side features, no accounts, no personalization — but every one of those absences is a feature in this design. The hosting is boring on purpose, because the boring infrastructure is the part that is still there in five years. The subscription-based tool you loved last year is the cautionary tale: the tool was good, the hosting model was not, and the tool died with the business model. The static page has no business model to die. It has a repository, and the repository is the model.
The Generator Family: The Things You Should Never Type by Hand
The generators cover the values that are correct in exactly one way and painful to produce manually. UUIDs for test data and local development. Strong passwords, where the point is the entropy, not the memorability. QR codes for the URL you are about to hand someone at a demo. Placeholder text for the layout that has to exist before the design can be evaluated. URL slugs for the title you are about to publish, with the punctuation stripped and the casing fixed. Each generator is a small answer to a question that comes up dozens of times a year, and the cost of answering it without a tool is low individually and high in aggregate. The collection treats those small costs as the thing to eliminate. The generators are the least dramatic tools in the set and some of the most used, which is the pattern of the whole collection: the quiet tools carry the load, and the dramatic tools are the insurance you hope you never need but are glad is there.
The takeaway
That is the list. Screenshot it, pin it, or just remember the three items you will actually use — that is the honest success metric for a list. The tools behind it: Open https://wuchunjie00.github.io/devtools/, source at https://github.com/wuchunjie00/devtools, and the same npx pattern for the rest of the toolkit. If the list saved you a specific amount of time, ko-fi.com/wuchunjie is a one-click thank-you that keeps every tool free and dependency-free. The next list is already forming, and the items that fail the specific-pain test will not make it. A list that only contains things worth keeping is the only kind of list worth publishing, and that is the standard this one was held to.
Top comments (0)