💎 Screenly – AI-Powered Resume Analyzer

#devchallenge #kendoreactchallenge #react #webdev

Submission for the KendoReact Free Components Challenge

👉 Live Demo: screenly.ai

✨ What is Screenly?

Screenly is your AI-powered career sidekick. It helps job seekers and recruiters analyze resumes in seconds with:

⚡ ATS scoring → See how recruiter software reads your resume

⚡ Skill insights → Find gaps & strengths instantly

⚡ Job-fit recommendations → Understand how well you match a role

Powered by Google’s Gemini AI, wrapped in a React + KendoReact UI, and backed by an Express server.

This isn’t just another project—it’s a tool to win interviews.

🚀 Features at a Glance

📂 Upload resumes in PDF/DOC
🧠 Smart ATS compatibility scoring
🎯 Instant job-fit score with colorful progress bars
🔍 Skill gap analysis & actionable recommendations
⚛️ Powered by sleek KendoReact components
📱 Fully responsive, fast, and modern

🎥 Screenshots

Resume Upload	Export Options	Job Fit	Resume Review

🛠 Tech Stack

Frontend: React + KendoReact
Backend: Express.js
AI Engine: Google Gemini API
Hosting: Render

🎨 KendoReact Components Used

💠 Buttons • Icons • Animations • ProgressBar • Notifications • Typography • TextArea • Tabs • Badges • Card • Inputs

⚡ Quick Start (Run Locally)

Set up Screenly on your machine in 5 minutes:

# 1️⃣ Clone the repo
git clone https://github.com/saifiimuhammad/screenly.git
cd screenly

# 2️⃣ Install dependencies
npm install

✏️ Config tweak: Update server binding in /server/index.ts

// Change this:
server.listen(port, "0.0.0.0", () => {
  console.log("Server running on http://0.0.0.0:5000");
});

// To this:
server.listen(port, "localhost", () => {
  console.log("Server running on http://localhost:5000");
});

# 3️⃣ Add your environment variables
# Create a .env file inside /server
GEMINI_API_KEY=your_google_gemini_api_key

# 4️⃣ Run the dev server (from project root)
npm run dev

# 5️⃣ Open in browser
http://localhost:5000