CV Typewriter is a data-first CV editor for maintaining a professional resume as structured JSON and previewing it as a polished A4 document before export. It is designed for developers who want version-controlled CV content, bilingual variants, predictable print output, and a clean engineering-resume aesthetic.
- Data-first CV content: maintain the CV as JSON instead of coupling content to layout.
- Bilingual preview: switch between Spanish and English CV variants from the editor panel.
- Oxford-inspired resume layout: compact header, minimal section treatment, and readable hierarchy.
- A4 print preview: render fixed-size A4 pages in the browser before exporting.
- Smart pagination: measure content blocks and avoid awkward page splits across entries and technical sections.
- PDF export: export the selected language variant through the browser print-to-PDF flow.
- JSON export: download the underlying structured CV data for backup or version control.
- Markdown-style links: use
[Label](https://example.com)in supported text fields.
- Keep CV content under version control.
- Maintain separate Spanish and English CV variants in one source file.
- Preview page breaks before exporting a PDF.
- Tailor a developer CV toward software engineering, AI tooling, automation, or platform roles.
- Iterate on content while preserving a consistent print layout.
- React 19 — UI runtime.
- Vite — development server and production build.
- Tailwind CSS — styling and print layout utilities.
- shadcn/ui-style primitives — buttons, cards, inputs, badges and separators.
- CodeMirror — JSON editor.
- react-to-print — print/PDF export flow.
- Lucide React — iconography.
src/
├── CVTypewriter.jsx # Feature orchestrator
├── features/cv-typewriter/
│ ├── components/ # Editor, preview and CV rendering components
│ ├── hooks/ # CV state, pagination, page config and printing
│ ├── services/ # Block building and file operations
│ ├── cvUtils.jsx # Parsing, localization, normalization and formatting
│ └── sample.js # Bilingual sample CV data
└── components/ui/ # Shared UI primitivesAdditional documentation lives in:
docs/
├── adr/ # Architecture Decision Records
├── changelog/ # Documentation and content changes
├── overview/ # Architecture overview
└── handoff.md # Professional positioning and continuation context- Node.js 18 or newer
- npm
npm installnpm run devOpen the local Vite URL, usually:
http://localhost:5173npm run buildnpm run lint:check
npm run format:check- Edit the JSON content in the left panel.
- Use the language selector to preview
ESorEN. - Review the paginated A4 preview on the right.
- Export the selected language as PDF.
- Download the JSON source when you want a portable backup.
The sample CV stores localized content under cv.languages:
cv: {
active_language: 'es',
languages: {
es: { /* Spanish CV */ },
en: { /* English CV */ }
}
}Each language can define its own:
- personal details,
- localized section labels,
- professional summary,
- experience entries,
- technical stack,
- selected projects,
- education.
The app still supports older single-language JSON files by falling back to the legacy cv.sections shape.
Useful references:
docs/overview/cv-typewriter.mddocs/adr/ADR-0001-client-side-pagination-for-cv-rendering.mddocs/handoff.md
- PDF export depends on the browser print dialog. Use A4 and disable browser headers/footers for best results.
- Large editor dependencies can produce a Vite chunk-size warning during build; the build still completes successfully.
- The current JSON export downloads the full source JSON, including both language variants.
MIT. See LICENSE.