# utsho261/cv-builder architecture

> Architecture diagram of the GitHub repository utsho261/cv-builder, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/utsho261/cv-builder
- Repository: https://github.com/utsho261/cv-builder

## Overview

CV Studio is a browser-based resume builder: job seekers edit or preset CV content, review live ATS feedback and a template preview, then export a PDF or JSON backup. The main workflow and much of the UI live in the large `src/App.tsx` module; `src/templates.tsx` renders layouts, while `src/atsAnalyzer.ts` scores content. The README documents template filtering, zoom, mobile preview, and import/export; the excerpts do not expose all their event wiring, so those links are shown only where supported. All data processing is local; no remote CV service is documented.

Main entry points: [`src/App.tsx`](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx) (Studio UI), [`src/main.tsx`](https://github.com/utsho261/cv-builder/blob/main/src/main.tsx) (React Entry), [`src/presets.ts`](https://github.com/utsho261/cv-builder/blob/main/src/presets.ts) (Sample Presets), [`src/templates.tsx`](https://github.com/utsho261/cv-builder/blob/main/src/templates.tsx) (Template Renderer)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_workspace["Builder Workspace"]
  node_entry["React Entry<br/>[main.tsx]"]
  node_studio["Studio UI<br/>[App.tsx]"]
end

subgraph group_content["CV Content"]
  node_cvmodel["CV Data Model<br/>[types.ts]"]
  node_editor["CV Editing<br/>[App.tsx]"]
  node_presets["Sample Presets<br/>[presets.ts]"]
  node_sampledata["Profile Data<br/>[sampleData.ts]"]
end

subgraph group_review["Review and Layout"]
  node_ats["ATS Analyzer<br/>[atsAnalyzer.ts]"]
  node_templatechoice["Template Selection<br/>[App.tsx]"]
  node_renderer["Template Renderer<br/>[templates.tsx]"]
  node_preview["Resume Preview<br/>[App.tsx]"]
end

subgraph group_output["Export and State"]
  node_browserstore[("Local Draft Storage")]
  node_jsonbackup["JSON Backup<br/>[App.tsx]"]
  node_pdf["PDF Export<br/>[App.tsx]"]
  node_printengine["Browser PDF Engine"]
end

node_jobseeker(("Job Seeker"))

node_jobseeker -->|"opens app"| node_entry
node_entry -->|"renders"| node_studio
node_jobseeker -->|"edits CV"| node_editor
node_studio -->|"hosts"| node_editor
node_editor -->|"uses data shape"| node_cvmodel
node_studio -->|"loads presets"| node_presets
node_presets -->|"uses profiles"| node_sampledata
node_studio -->|"analyzes CV"| node_ats
node_studio -->|"selects layout"| node_templatechoice
node_studio -->|"renders data"| node_renderer
node_renderer -->|"produces preview"| node_preview
node_studio -->|"reads and writes"| node_browserstore
node_jobseeker -->|"imports or exports"| node_jsonbackup
node_studio -->|"handles backup"| node_jsonbackup
node_jobseeker -->|"requests download"| node_pdf
node_studio -->|"captures resume"| node_pdf
node_pdf -.->|"creates PDF"| node_printengine

click node_entry "https://github.com/utsho261/cv-builder/blob/main/src/main.tsx"
click node_studio "https://github.com/utsho261/cv-builder/blob/main/src/App.tsx"
click node_cvmodel "https://github.com/utsho261/cv-builder/blob/main/src/types.ts"
click node_editor "https://github.com/utsho261/cv-builder/blob/main/src/App.tsx"
click node_presets "https://github.com/utsho261/cv-builder/blob/main/src/presets.ts"
click node_sampledata "https://github.com/utsho261/cv-builder/blob/main/src/sampleData.ts"
click node_ats "https://github.com/utsho261/cv-builder/blob/main/src/atsAnalyzer.ts"
click node_templatechoice "https://github.com/utsho261/cv-builder/blob/main/src/App.tsx"
click node_renderer "https://github.com/utsho261/cv-builder/blob/main/src/templates.tsx"
click node_preview "https://github.com/utsho261/cv-builder/blob/main/src/App.tsx"
click node_jsonbackup "https://github.com/utsho261/cv-builder/blob/main/src/App.tsx"
click node_pdf "https://github.com/utsho261/cv-builder/blob/main/src/App.tsx"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_entry,node_studio toneBlue
class node_cvmodel,node_editor,node_presets,node_sampledata toneAmber
class node_ats,node_templatechoice,node_renderer,node_preview toneMint
class node_browserstore,node_jsonbackup,node_pdf,node_printengine toneRose
class node_jobseeker toneIndigo
```

## Components

### Builder Workspace

- [React Entry](https://github.com/utsho261/cv-builder/blob/main/src/main.tsx): `src/main.tsx`
- [Studio UI](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx): `src/App.tsx`

### CV Content

- [CV Data Model](https://github.com/utsho261/cv-builder/blob/main/src/types.ts): `src/types.ts`
- [CV Editing](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx): `src/App.tsx`
- [Sample Presets](https://github.com/utsho261/cv-builder/blob/main/src/presets.ts): `src/presets.ts`
- [Profile Data](https://github.com/utsho261/cv-builder/blob/main/src/sampleData.ts): `src/sampleData.ts`

### Review and Layout

- [ATS Analyzer](https://github.com/utsho261/cv-builder/blob/main/src/atsAnalyzer.ts): `src/atsAnalyzer.ts`
- [Template Selection](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx): `src/App.tsx`
- [Template Renderer](https://github.com/utsho261/cv-builder/blob/main/src/templates.tsx): `src/templates.tsx`
- [Resume Preview](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx): `src/App.tsx`

### Export and State

- **Local Draft Storage**
- [JSON Backup](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx): `src/App.tsx`
- [PDF Export](https://github.com/utsho261/cv-builder/blob/main/src/App.tsx): `src/App.tsx`
- **Browser PDF Engine**

### Other components

- **Job Seeker**

## Connections

- Job Seeker → React Entry: opens app
- React Entry → Studio UI: renders
- Job Seeker → CV Editing: edits CV
- Studio UI → CV Editing: hosts
- CV Editing → CV Data Model: uses data shape
- Studio UI → Sample Presets: loads presets
- Sample Presets → Profile Data: uses profiles
- Studio UI → ATS Analyzer: analyzes CV
- Studio UI → Template Selection: selects layout
- Studio UI → Template Renderer: renders data
- Template Renderer → Resume Preview: produces preview
- Studio UI → Local Draft Storage: reads and writes
- Job Seeker → JSON Backup: imports or exports
- Studio UI → JSON Backup: handles backup
- Job Seeker → PDF Export: requests download
- Studio UI → PDF Export: captures resume
- PDF Export → Browser PDF Engine: creates PDF