🚀 Building an AI-Powered Resume Optimizer with Angular, Node.js & Gemini
Struggling to tailor your resume for specific job postings? I built an AI-powered Resume Optimizer that helps you analyze your resume against any job description using Google Gemini. Here’s how I built it using the MEAN stack (MongoDB-free) with Angular standalone components, Tailwind CSS, and Google’s Generative AI API.
💡 Why I Built This
Every job role has unique expectations, but most resumes stay generic. I wanted to automate the process of matching resumes with job descriptions, highlighting what’s missing, and suggesting improvements—all with the power of AI.
🛠 Tech Stack
| Layer | Stack |
|---|---|
| Frontend | Angular 20, Standalone Components, Tailwind CSS, Signals, Reactive Forms |
| Backend | Node.js, Express, Multer |
| AI Engine | Google Gemini via @google/genai
|
| Parsing |
pdf-parse and mammoth for file extraction |
🧠 Features
- ✅ Upload Resume (PDF or DOCX)
- ✅ Upload or Paste Job Description
-
✅ Get AI analysis:
- Match Score
- Missing Keywords
- Tailored Suggestions
-
🌗 Dark Mode Support
-
📱 Fully Responsive UI
🧩 System Architecture
[Angular UI] --> [Express API] --> [Gemini API]
|
[PDF/DOCX Parser]
🖥️ Frontend Highlights
- Standalone Angular Components
- Signals for local state (
resumeFile,jdFile, etc.) - Native control flow (
@if,@else) over structural directives - Reactive Forms for input validation
- Markdown rendering using
ngx-markdownfor AI response formatting
const form = fb.nonNullable.group({ jdText: '' });
const resumeFile = signal<File | null>(null);
const result = signal<string | null>(null);
🔧 Backend Highlights
- File parsing using
pdf-parse(PDF) andmammoth(DOCX) - Gemini prompt format:
Compare the following resume and job description. Provide:
- Match score (0-100)
- Missing keywords
- Suggested improvements
- AI integration via
@google/genai:
const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });
const response = await ai.models.generateContent({ model: 'gemini-2.5-flash', contents: prompt });
🚀 How to Run It Locally
🔗 Clone the Project
git clone https://github.com/manthanank/resume-optimizer.git
cd resume-optimizer
⚙️ Backend Setup
cd backend
npm install
cp .env.example .env
# Add your GEMINI_API_KEY
npm run dev
🌐 Frontend Setup
cd frontend
npm install
ng serve
🌐 Hosted Live (Demo)
- Frontend: https://resume-optimizer-app.vercel.app
- Backend API: https://resume-optimizer-api.vercel.app
📦 Future Improvements
- 🔐 Auth for saving resume history
- 📝 Editable resume templates
- 📄 PDF download of feedback
- 🌍 Multi-language support
📃 License
MIT — Free to use and modify. Contributions welcome!
✨ Final Thoughts
This project taught me how to combine real-time file processing with AI content generation in a full-stack TypeScript environment. Whether you’re building something for HR, job seekers, or just love AI—this app is a perfect side project to learn from.
👉 Want to try it?
🔗 GitHub Repo
🚀 Live Demo
