Live: https://evm-book.vercel.app
An interactive, book-length guide to the Ethereum Virtual Machine (EVM), built as a dark-mode SPA/PWA. It teaches the EVM end-to-end — from "what is a virtual machine" to accounts, world state, the stack machine, data locations, the Solidity→bytecode→opcode path, execution with nested call frames and reverts, gas, quasi-Turing-completeness, and the modern EVM (PoS/Merge, EIP-1559, precompiles, recent opcode upgrades, rollups, account abstraction).
Built for a reader with 1–2 years of general programming experience and no required blockchain background. Concepts are explained with flowcharts, brainmaps, block diagrams, and purpose-built interactive visualizers.
- 20 chapters across Foundations → EVM Internals → The Modern EVM → Reference, with sidebar nav, breadcrumbs, prev/next, an in-page table of contents, and full-text search (
/). - Interactive visualizers: a LIFO stack stepper, a data-locations explorer, a transaction→state transition, a bytecode disassembler/opcode stepper with live stack and gas, a gas-accounting meter, and a live opcode reference table.
- Diagrams everywhere: Mermaid flowcharts/block/sequence diagrams and Markmap brainmaps.
- PWA: installable and works offline (service worker precache).
- Dark mode by default, light optional, with readable typography.
Vite · React · TypeScript · Tailwind CSS · MDX · Mermaid · Markmap · MiniSearch · vite-plugin-pwa · Vitest.
npm install # install dependencies npm run dev # start the dev server npm test # run the unit tests (Vitest) npm run typecheck # type-check with tsc npm run build # production build to dist/ (emits the service worker) npm run preview # preview the production build locally
src/
app/ shell: router, layout, sidebar, breadcrumbs, search, theme, MDX provider
content/ chapters.ts manifest + one MDX file per chapter
components/ diagram/presentational components + interactive visualizers
lib/ opcode data, disassembler + demo interpreter, gas helpers, search index
The src/content/chapters.ts manifest is the single source of truth that drives routing, the sidebar, breadcrumbs, prev/next, and search.
Deployed on Vercel as a static SPA (build → dist/, with an SPA rewrite to index.html). See vercel.json. Production: https://evm-book.vercel.app
Educational project. Diagrams and prose © the author.