Guide

An x code generator app is a 50-line React component, not a download

Every result on the first page of Google for this keyword tells you to install Google Authenticator, Authy, or Microsoft Authenticator. None of them mention that the thing those apps do is RFC 6238 TOTP, and TOTP is a short, readable React component. This guide is about the option the SERP forgot: build your own, in about the time it takes to install Authy from the App Store.

m
mk0r
6 min
4.8from 10K+ creators
Sandbox boots in ~2.5s
No signup, no App Store
Full React + Vite project you own

What the SERP actually shows you, and what it hides

Search "x code generator app" and every top result is about the same thing: which authenticator to install so that you can log in to your X account with 2FA. TweetEraser, TweetDelete, Pixelscan, Geekflare, Bitwarden, X's own help center. All of them rank the same three apps: Google Authenticator, Authy, Microsoft Authenticator.

That is a sensible answer to the common question. It is also a shaped answer. The category "code generator app" collapses a generic RFC (6238) into a small set of commercial brands, and readers leave the SERP believing this is something you install, not something you build.

The actual code generator is about fifty lines of JavaScript. The UI around it is a React component. The only reason you normally do not build one is that setting up a Vite project, running npm install, and wiring in a QR scanner is a 20-minute chore you would not do to save 2 minutes of App Store time. mk0r removes that chore.

How a single prompt becomes a running generator

When you type "build me a TOTP code generator for X 2FA" into mk0r, three things run in parallel inside a single E2B sandbox. This diagram is the literal port layout, not an abstraction.

Your prompt, routed through the sandbox

Your prompt
TOTP secret
Follow-ups
mk0r-app-builder
Vite :5173
Chromium :9222
ACP :3002

The four steps mk0r runs for you

1

Claim a warm sandbox

mk0r keeps a Firestore-backed pool of pre-booted E2B sandboxes. When your request arrives, it pulls a ready one and re-targets it to your session. No cold start, no npm install.

Pool entries stay valid for up to 45 minutes and are refilled in the background so the next user also gets a warm one.

2

Claude Haiku writes the TOTP math

The agent writes a TotpGenerator React component: a base32 decoder, an HMAC-SHA1 call using the Web Crypto API, and a 30-second interval that re-computes the code.

3

Playwright verifies in-browser

Playwright MCP navigates to http://localhost:5173 on the in-VM Chromium and reads the generated code. If the first code does not match a reference implementation, the agent fixes the bit math and retries.

4

You paste your X secret locally

The secret X gives you when you enable 2FA stays in your browser. mk0r never sees it. You can test by comparing mk0r's code to Google Authenticator's code for the same secret, they should match.

What the agent actually runs

This is not marketing language. When you hit send, the session takes this shape across the ACP stream and the reverse proxy logs.

mk0r session, verbose

The component mk0r writes, roughly

Here is a trimmed version of what a first pass looks like. The real output includes a copy button, a progress ring tied to the 30-second timestep, and a QR scanner branch. This is the core.

src/TotpGenerator.tsx

That is it. Four small helpers and a component. A reader who has only ever installed authenticator apps often assumes the "real" version is proprietary. It is not. X verifies the same 6-digit code your own HMAC produces.

mk0r vs installing an authenticator

The trade is not "mk0r is better." The trade is that for people who want to understand, modify, or own the code, the SERP has been pushing a single answer for years. Here is what actually changes.

FeatureInstall an authenticatormk0r
Install pathApp Store or Play Store, download, open, allow notificationsOpen mk0r.com, type one sentence
Account requiredGoogle account (Authenticator), phone number (Authy)None, no email, no password
Where TOTP secrets liveInside the vendor app, sometimes synced to their cloudInside your own browser tab, in code you can read
Source code visibilityClosed or partially open, not yoursFull Vite + React + TypeScript project you own
Can you modify the algorithmNoYes, edit the hmac call and redeploy
Time from zero to working generatorAbout 90 seconds to install and configureAbout 2.5s to boot sandbox, 30-90s to write the component

Why the sandbox is pre-baked, and why that matters here

A normal "run this in a cloud IDE" flow spends 40-60 seconds on npm install. For a one-shot 2FA generator, that is longer than the build itself. mk0r runs a pool of warm sandboxes so the scaffold step is essentially free: boot target is about 0s.

0sSandbox boot (warm pool)
0 minPool entry TTL
0 minSession timeout
0Digits in an X TOTP code

What is in the pre-baked image

Nothing on this page is a claim about a future product. Everything here is shipped in the Dockerfile that builds the E2B template. You can read docker/e2b/e2b.Dockerfile in the appmaker repo for the full list.

Pre-baked sandbox

E2B template 2yi5lxazr1abcs2ew6h8 already has Vite, React, TypeScript and Tailwind v4 scaffolded at /app. No npm install on first request.

Chromium on Xvfb

The VM runs Chromium headfully on a virtual framebuffer, so Playwright can watch the TOTP code advance every 30 seconds in a real browser while you watch over VNC.

Playwright MCP on :3001

The agent can navigate to the running Vite app, check that the code rotates, and screenshot the failure if the HMAC math is wrong.

Claude Haiku by default

Free tier runs claude-haiku-4-5, which is fast enough for a 50-line TOTP component and ACP-aware so it commits its own turns to local git.

ACP bridge on :3002

The Agent Client Protocol bridge streams every tool call back to your browser, so the 'watch it build' is not a metaphor, it is the raw protocol.

Local git history

Every turn commits. Undo, redo, and jump-to-sha work out of the box. If your first draft of the generator was wrong, you do not lose the previous one.

Three ways people extend it from the first prompt

QR scanner

"Add a button to scan the QR code X shows when enabling 2FA and pre-fill the secret." The agent pulls in a QR library, wires the camera, and parses the otpauth:// URI.

Multiple accounts

"Let me store several accounts, each with a label and secret, and show all codes at once." Adds localStorage and a list view without leaving the browser.

Hardware-backed

"Swap the browser secret for a WebAuthn-derived key so the TOTP seed never touches localStorage." Advanced, but the agent can scaffold it on top of the base generator.

When you should still just install Google Authenticator

There is a smaller audience for this angle than for the default SERP answer, and that is fine. Install an existing authenticator if any of these is true: you want offline use on a phone, you want cloud backup of your seeds, you are not comfortable pasting a secret into your own browser tab, or you are setting up 2FA for someone who will not maintain the generator.

Build one with mk0r if: you want to understand how TOTP works mechanically, you want the source code under your control, you want to customize the UI or algorithm, or you want to teach somebody what an authenticator app actually is.

Want the TOTP component walked through live?

Book a call and we will open a mk0r session, scaffold a generator for an X account you own, and walk through the HMAC math line by line. About 20 minutes, one tab.

Frequently asked questions

Is a code generator app for X the same thing as an authenticator app?

Yes. On X (formerly Twitter), 'code generator app' refers to any authenticator that produces a 6-digit TOTP code from a shared secret, following RFC 6238. Google Authenticator, Authy, 1Password, Bitwarden and Microsoft Authenticator all implement the same algorithm. A 6-digit code from any of them will pass the same check X runs server side.

Can I actually use an app I generated with mk0r as my X 2FA code generator?

Yes, as long as the app correctly implements HMAC-SHA1 over the current 30-second timestep using the shared secret X gives you when you enable app-based 2FA. mk0r generates a working Vite + React app that runs in your browser. You are responsible for deciding whether to trust a browser-based generator with a sensitive secret; most people pair it with a hardware key.

What is mk0r actually doing when it builds the generator?

mk0r claims a pre-warmed E2B sandbox (template id 2yi5lxazr1abcs2ew6h8, mk0r-app-builder) that already has Vite + React + TypeScript + Tailwind CSS v4 scaffolded at /app, Chromium running headfully on Xvfb, Playwright MCP on port 3001, and an ACP bridge on port 3002. Claude Haiku writes the TOTP code, Playwright tests it, and you watch the whole process stream over WebSocket screencast. Boot is about 2.5 seconds because the template is pre-baked.

Why is this better than just downloading Google Authenticator?

For most people it is not. Google Authenticator is free, offline, and battle tested. The angle of this guide is narrower: if you want to understand how a 2FA code generator app actually works, or you want your TOTP seeds under your own control and not in a proprietary app, mk0r lets you scaffold a private one in the same time it takes to install Authy from the App Store.

Does mk0r store my TOTP secrets?

No. The app mk0r builds runs entirely in your browser. The secret you paste in never leaves the browser tab. mk0r itself has no backend for that state. If you close the tab without saving the secret somewhere, it is gone.

What about X's QR code flow, does the generated app handle that?

Yes. X gives you either a QR code or a base32 secret string when you enable 'Authentication app' under two-factor authentication settings. Ask mk0r to add QR scanning and it will pull in a QR library, wire up the camera, and decode the otpauth:// URI. This pattern is a one-sentence follow-up prompt.

Can I take the generator off mk0r and host it myself?

Yes. Every mk0r VM session is a normal Vite + React + TypeScript + Tailwind project at /app. You get real files, a real git history, and npm scripts. You can download the project, push it to GitHub, and deploy it anywhere that runs a static Vite build. No vendor lock-in.

Skip the App Store. Scaffold your own code generator app in the time it would take to install one.

Build It Now
Book a walkthrough