🤖 BioBot  

AI-powered CV and cover letter builder that runs entirely in your browser.

✍️ Writing a CV is hard. 🎯 Tailoring it for every job you apply to is even harder. This app lets you load your full career history once, paste a job description, let AI reshape your experience highlights and summary to match, then tweak the result before you export. 📋 The Word (DOCX) output uses clean, structured formatting designed to be parsed correctly by most applicant tracking systems (ATS).

   

✨ Features

• ✏️ Build and edit a CV with a live side-by-side preview
• 🤖 AI-powered generation of professional summary, cover letter, and experience highlights using Google Gemini
• 📥 Import a CV from Word (.docx), PDF, image, or plain text — or restore a JSON backup you exported earlier
• 📄 Export to DOCX or JSON for submission or portable backup
• 📝 Markdown support in text fields for rich formatting
• 📖 Built-in step-by-step guide covering every feature from first load to final export

🧑‍💻 Using the AI features (optional)

The core CV builder works perfectly without AI — you can build, preview, and export without ever enabling it. AI tailoring is an opt-in feature that uses Google Gemini to rewrite your content to match a specific job description. You bring your own API key (free tier, no billing required).

1. 👤 Fill in all your details — personal info, experience, education, skills — or import a CV file (Word, PDF, image, or text) or a JSON backup you exported earlier
2. 📋 Paste or upload a job description (Word/text work without a key; PDF/image need one) and add your free Gemini API key
3. 🤖 Hit Enhance with AI to tailor your experience highlights, summary, and cover letter to the job, then tweak anything that still feels off
4. 💾 Hit Save to store your progress in the browser, or export as DOCX for submission / JSON for a portable backup
5. 📄 Need a PDF? Open the DOCX in Word, Google Docs, or LibreOffice and print to PDF

🔒 Privacy

• 🚫 No backend for your CV. There is no server that stores your draft. localStorage keeps your CV data, Gemini API key, and theme in your browser so you can pick up where you left off.
• 🤖 Gemini (optional): API calls go from your browser to Google using your own key.
• 🍪 No ad or marketing cookies. The app does not use HTTP cookies for its own features. Production builds load Cloudflare Web Analytics (cookieless, aggregate traffic) only when the GitHub Actions secret VITE_CLOUDFLARE_WEB_ANALYTICS_TOKEN is set; otherwise no analytics script ships. Local npm run dev and forks without that secret behave the same as “no token.” Sentry (below) may use browser storage for error session correlation.
• 🔑 Your Gemini API key stays on your device — anyone with access to this browser can read it, so use a device you trust.
• 📤 You can export as JSON or DOCX anytime. Use Clear all in the editor to wipe the form and local storage.
• 🐛 Error monitoring uses Sentry in production to track crashes and failed API calls so bugs can be fixed quickly. All events are scrubbed of API keys, email addresses, phone numbers, and UUIDs in the browser before anything is sent. The SDK does not attach IP addresses or user identifiers to events (sendDefaultPii is off, event.user is deleted). Sentry's server-side "Prevent Storing IP Addresses" setting is also enabled. Only console warnings and errors are captured — not general logs. Session Replay is not enabled.

📊 Analytics (Cloudflare Web Analytics)

When VITE_CLOUDFLARE_WEB_ANALYTICS_TOKEN is set for npm run build (e.g. GitHub Actions secret in CI below), production bundles load Cloudflare Web Analytics — privacy-oriented, cookieless, aggregate page views and performance signals. If the token is missing at build time, no analytics beacon is included.

What	Where
Injection & vendor logic	src/lib/analytics.ts
Called at startup	src/main.tsx (initAnalytics())
Env types	src/vite-env.d.ts
CI: pass token into build	.github/workflows/ci.yml (VITE_CLOUDFLARE_WEB_ANALYTICS_TOKEN)

Dashboard: Cloudflare → Web Analytics → Add a site → hostname visitors use (e.g. batbrain9392.github.io) → Manage site → copy the snippet token into the GitHub Actions secret above. The beacon tracks SPA navigations via the History API (see Cloudflare docs).

Forks / local dev: omit the secret to ship no analytics.

Alternative (if Cloudflare token is unset): VITE_ANALYTICS_SCRIPT_URL and optional VITE_ANALYTICS_DATA_DOMAIN (Plausible-style). See src/lib/analytics.ts.

⚙️ Tech stack

	Technology
⚛️	React 19 + TypeScript	UI framework
⚡	Vite 6	Build tool
🎨	Tailwind CSS v4 + shadcn	Styling and components
📋	react-hook-form + Zod	Form state and validation
🔀	react-router	Client-side routing
📄	docx.js	Word document generation
📝	marked	Markdown rendering
🐛	Sentry	Error monitoring
📈	Cloudflare Web Analytics	Cookieless traffic metrics (production, when token set)
🌐	Fully client-side	No backend required

🛠️ Built with

🖥️ Code written in Cursor with Claude Opus by Anthropic. ✨ Live AI features inside the app are powered by Google Gemini (gemini-2.5-flash).

🚀 Deployment

Deployed automatically to GitHub Pages on every push to main via GitHub Actions. CI runs lint, typecheck, tests, and build — deploy only happens if all checks pass. The app is served under a /cv-builder/ subpath and uses BrowserRouter (basename="/cv-builder"). Routes: /cv-builder/ (landing), /cv-builder/guide, /cv-builder/app. The build writes 404.html with the same scripts and styles as index.html but an empty #root, so unknown paths (including /app on first load) get a clean SPA shell while / and /guide stay prerendered (see below).

📎 Why we ship 404.html and how path routing works on GitHub Pages: docs/github-pages-spa-routing.md.

📎 Maintainers — SEO, prerender, Google Search Console, Cloudflare Web Analytics, sitemap, forks: docs/maintainer-seo.md.

To enable on a fresh fork: go to Settings > Pages and set the source to GitHub Actions.

💻 Local development

Requires Node 24+.

npm ci
npm run dev

Script	Purpose
npm run dev	Start local dev server
npm run build	Type-check and production build
npm run preview	Preview the production build
npm run lint	Run ESLint
npm run typecheck	Run TypeScript compiler checks
npm run test	Run tests with Vitest
npm run test:e2e	Run Playwright end-to-end tests
npm run generate:icons	Regenerate favicon and touch icons
npm run generate:og	Regenerate OG image and screenshots (requires npm run build first)
npm run generate:overview	Regenerate OVERVIEW.md (project map for AI agents)

📖 See OVERVIEW.md for a detailed project map, architecture notes, and file inventory — useful for contributors and AI agents.

💬 Feedback

Found a bug or have a feature idea? Open an issue or send a message on LinkedIn.

🫣 Design tips: Design feedback especially welcome — suggestions, mockups, or gentle roasts with actionable fixes are all appreciated.