Hugging Face's logo

Spaces:
Jurk06
/
data-science-resume-analyser
Running

App Files Community
Jurk06 commited on
Commit
02ced39
·
verified ·
1 Parent(s): 4122ee7

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +758 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Data Science Resume Analyser
3
- emoji: 🦀
4
- colorFrom: red
5
- colorTo: yellow
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: data-science-resume-analyser
3
+ emoji: 🐳
4
+ colorFrom: green
5
+ colorTo: pink
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,758 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ATS Score Checker for Data Scientists & ML Engineers</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #6B73FF 0%, #000DFF 100%);
12
+ }
13
+ .progress-bar {
14
+ transition: width 0.5s ease-in-out;
15
+ }
16
+ .resume-preview {
17
+ min-height: 300px;
18
+ background-color: #f8fafc;
19
+ border: 2px dashed #cbd5e1;
20
+ border-radius: 0.5rem;
21
+ }
22
+ .keyword-match {
23
+ background-color: #d1fae5;
24
+ padding: 0.2rem;
25
+ border-radius: 0.2rem;
26
+ }
27
+ .keyword-miss {
28
+ background-color: #fee2e2;
29
+ padding: 0.2rem;
30
+ border-radius: 0.2rem;
31
+ }
32
+ .tooltip {
33
+ position: relative;
34
+ display: inline-block;
35
+ }
36
+ .tooltip .tooltiptext {
37
+ visibility: hidden;
38
+ width: 200px;
39
+ background-color: #333;
40
+ color: #fff;
41
+ text-align: center;
42
+ border-radius: 6px;
43
+ padding: 5px;
44
+ position: absolute;
45
+ z-index: 1;
46
+ bottom: 125%;
47
+ left: 50%;
48
+ margin-left: -100px;
49
+ opacity: 0;
50
+ transition: opacity 0.3s;
51
+ }
52
+ .tooltip:hover .tooltiptext {
53
+ visibility: visible;
54
+ opacity: 1;
55
+ }
56
+ </style>
57
+ </head>
58
+ <body class="bg-gray-50">
59
+ <div class="gradient-bg text-white py-8 px-4 shadow-lg">
60
+ <div class="container mx-auto">
61
+ <div class="flex items-center justify-between">
62
+ <div>
63
+ <h1 class="text-3xl font-bold">Data Science Resume Analyzer</h1>
64
+ <p class="mt-2">Optimize your resume for ATS systems and get more interviews</p>
65
+ </div>
66
+ <div class="bg-white/20 p-3 rounded-full">
67
+ <i class="fas fa-robot text-3xl"></i>
68
+ </div>
69
+ </div>
70
+ </div>
71
+ </div>
72
+
73
+ <div class="container mx-auto px-4 py-8">
74
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
75
+ <!-- Left Column - Input Section -->
76
+ <div class="md:col-span-1 bg-white p-6 rounded-lg shadow-md">
77
+ <h2 class="text-xl font-semibold mb-4">Upload Your Resume</h2>
78
+
79
+ <div class="mb-6">
80
+ <label class="block text-gray-700 text-sm font-bold mb-2" for="resume-upload">
81
+ Choose File (PDF or DOCX)
82
+ </label>
83
+ <div class="flex items-center justify-center w-full">
84
+ <label class="flex flex-col items-center justify-center w-full h-32 border-2 border-gray-300 border-dashed rounded-lg cursor-pointer bg-gray-50 hover:bg-gray-100">
85
+ <div class="flex flex-col items-center justify-center pt-5 pb-6">
86
+ <i class="fas fa-cloud-upload-alt text-gray-400 text-3xl mb-2"></i>
87
+ <p class="mb-2 text-sm text-gray-500">Click to upload or drag and drop</p>
88
+ <p class="text-xs text-gray-500">PDF, DOCX (Max. 2MB)</p>
89
+ </div>
90
+ <input id="resume-upload" type="file" class="hidden" accept=".pdf,.docx" />
91
+ </label>
92
+ </div>
93
+ </div>
94
+
95
+ <div class="mb-6">
96
+ <label class="block text-gray-700 text-sm font-bold mb-2" for="job-title">
97
+ Target Job Title
98
+ </label>
99
+ <select id="job-title" class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500">
100
+ <option value="data_scientist">Data Scientist</option>
101
+ <option value="ml_engineer">Machine Learning Engineer</option>
102
+ <option value="data_engineer">Data Engineer</option>
103
+ <option value="ai_researcher">AI Researcher</option>
104
+ <option value="mlops">MLOps Engineer</option>
105
+ </select>
106
+ </div>
107
+
108
+ <div class="mb-6">
109
+ <label class="block text-gray-700 text-sm font-bold mb-2" for="experience-level">
110
+ Experience Level
111
+ </label>
112
+ <select id="experience-level" class="block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500">
113
+ <option value="entry">Entry Level (0-2 years)</option>
114
+ <option value="mid">Mid Level (3-5 years)</option>
115
+ <option value="senior">Senior Level (5+ years)</option>
116
+ </select>
117
+ </div>
118
+
119
+ <button id="analyze-btn" class="w-full gradient-bg text-white py-3 px-4 rounded-md font-medium hover:opacity-90 transition duration-300 flex items-center justify-center">
120
+ <i class="fas fa-search mr-2"></i> Analyze Resume
121
+ </button>
122
+
123
+ <div class="mt-6 p-4 bg-blue-50 rounded-lg">
124
+ <h3 class="font-medium text-blue-800 mb-2">Tips for Better ATS Scores</h3>
125
+ <ul class="text-sm text-blue-700 space-y-1">
126
+ <li class="flex items-start">
127
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
128
+ <span>Use standard section headings (Experience, Education, Skills)</span>
129
+ </li>
130
+ <li class="flex items-start">
131
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
132
+ <span>Include relevant keywords from the job description</span>
133
+ </li>
134
+ <li class="flex items-start">
135
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
136
+ <span>Avoid graphics, tables, and complex formatting</span>
137
+ </li>
138
+ <li class="flex items-start">
139
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
140
+ <span>Use bullet points instead of paragraphs</span>
141
+ </li>
142
+ </ul>
143
+ </div>
144
+ </div>
145
+
146
+ <!-- Middle Column - Results Section -->
147
+ <div class="md:col-span-2 space-y-6">
148
+ <!-- Score Card -->
149
+ <div id="score-card" class="bg-white p-6 rounded-lg shadow-md hidden">
150
+ <div class="flex justify-between items-center mb-4">
151
+ <h2 class="text-xl font-semibold">ATS Score Analysis</h2>
152
+ <div class="flex items-center">
153
+ <span id="score-value" class="text-3xl font-bold mr-2">0</span>
154
+ <span class="text-gray-500">/100</span>
155
+ </div>
156
+ </div>
157
+
158
+ <div class="mb-4">
159
+ <div class="flex justify-between text-sm mb-1">
160
+ <span>ATS Compatibility</span>
161
+ <span id="score-percent">0%</span>
162
+ </div>
163
+ <div class="w-full bg-gray-200 rounded-full h-2.5">
164
+ <div id="score-bar" class="progress-bar h-2.5 rounded-full" style="width: 0%"></div>
165
+ </div>
166
+ </div>
167
+
168
+ <div class="grid grid-cols-2 gap-4 mt-6">
169
+ <div class="bg-green-50 p-4 rounded-lg border border-green-200">
170
+ <div class="flex justify-between items-start">
171
+ <h3 class="font-medium text-green-800">Strengths</h3>
172
+ <i class="fas fa-thumbs-up text-green-500"></i>
173
+ </div>
174
+ <ul id="strengths-list" class="mt-2 text-sm text-green-700 space-y-1">
175
+ <!-- Filled by JavaScript -->
176
+ </ul>
177
+ </div>
178
+ <div class="bg-red-50 p-4 rounded-lg border border-red-200">
179
+ <div class="flex justify-between items-start">
180
+ <h3 class="font-medium text-red-800">Improvements</h3>
181
+ <i class="fas fa-exclamation-triangle text-red-500"></i>
182
+ </div>
183
+ <ul id="improvements-list" class="mt-2 text-sm text-red-700 space-y-1">
184
+ <!-- Filled by JavaScript -->
185
+ </ul>
186
+ </div>
187
+ </div>
188
+ </div>
189
+
190
+ <!-- Keyword Analysis -->
191
+ <div id="keyword-analysis" class="bg-white p-6 rounded-lg shadow-md hidden">
192
+ <h2 class="text-xl font-semibold mb-4">Keyword Analysis</h2>
193
+ <p class="text-gray-600 mb-4">These are the most important keywords for your target role. The highlighted ones were found in your resume.</p>
194
+
195
+ <div class="mb-6">
196
+ <h3 class="font-medium mb-2">Technical Skills</h3>
197
+ <div id="technical-keywords" class="flex flex-wrap gap-2">
198
+ <!-- Filled by JavaScript -->
199
+ </div>
200
+ </div>
201
+
202
+ <div class="mb-6">
203
+ <h3 class="font-medium mb-2">Tools & Frameworks</h3>
204
+ <div id="tools-keywords" class="flex flex-wrap gap-2">
205
+ <!-- Filled by JavaScript -->
206
+ </div>
207
+ </div>
208
+
209
+ <div>
210
+ <h3 class="font-medium mb-2">Methodologies</h3>
211
+ <div id="methodology-keywords" class="flex flex-wrap gap-2">
212
+ <!-- Filled by JavaScript -->
213
+ </div>
214
+ </div>
215
+ </div>
216
+
217
+ <!-- Resume Preview -->
218
+ <div id="resume-preview-container" class="bg-white p-6 rounded-lg shadow-md hidden">
219
+ <div class="flex justify-between items-center mb-4">
220
+ <h2 class="text-xl font-semibold">Resume Preview</h2>
221
+ <button id="download-btn" class="text-sm bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-md flex items-center">
222
+ <i class="fas fa-download mr-2"></i> Download
223
+ </button>
224
+ </div>
225
+ <div id="resume-preview" class="resume-preview p-4 overflow-auto">
226
+ <!-- Filled by JavaScript -->
227
+ </div>
228
+ </div>
229
+
230
+ <!-- Detailed Analysis -->
231
+ <div id="detailed-analysis" class="bg-white p-6 rounded-lg shadow-md hidden">
232
+ <h2 class="text-xl font-semibold mb-4">Detailed Analysis</h2>
233
+
234
+ <div class="space-y-6">
235
+ <!-- Content Score -->
236
+ <div>
237
+ <div class="flex justify-between items-center mb-2">
238
+ <h3 class="font-medium flex items-center">
239
+ <i class="fas fa-file-alt text-blue-500 mr-2"></i>
240
+ Content Score
241
+ </h3>
242
+ <div class="flex items-center">
243
+ <span id="content-score" class="font-bold mr-1">0</span>
244
+ <span class="text-gray-500">/30</span>
245
+ </div>
246
+ </div>
247
+ <div class="w-full bg-gray-200 rounded-full h-2.5">
248
+ <div id="content-bar" class="progress-bar h-2.5 rounded-full bg-blue-500" style="width: 0%"></div>
249
+ </div>
250
+ <div id="content-feedback" class="mt-2 text-sm text-gray-600">
251
+ <!-- Filled by JavaScript -->
252
+ </div>
253
+ </div>
254
+
255
+ <!-- Keyword Score -->
256
+ <div>
257
+ <div class="flex justify-between items-center mb-2">
258
+ <h3 class="font-medium flex items-center">
259
+ <i class="fas fa-key text-purple-500 mr-2"></i>
260
+ Keyword Score
261
+ </h3>
262
+ <div class="flex items-center">
263
+ <span id="keyword-score" class="font-bold mr-1">0</span>
264
+ <span class="text-gray-500">/30</span>
265
+ </div>
266
+ </div>
267
+ <div class="w-full bg-gray-200 rounded-full h-2.5">
268
+ <div id="keyword-bar" class="progress-bar h-2.5 rounded-full bg-purple-500" style="width: 0%"></div>
269
+ </div>
270
+ <div id="keyword-feedback" class="mt-2 text-sm text-gray-600">
271
+ <!-- Filled by JavaScript -->
272
+ </div>
273
+ </div>
274
+
275
+ <!-- Formatting Score -->
276
+ <div>
277
+ <div class="flex justify-between items-center mb-2">
278
+ <h3 class="font-medium flex items-center">
279
+ <i class="fas fa-paint-brush text-green-500 mr-2"></i>
280
+ Formatting Score
281
+ </h3>
282
+ <div class="flex items-center">
283
+ <span id="formatting-score" class="font-bold mr-1">0</span>
284
+ <span class="text-gray-500">/20</span>
285
+ </div>
286
+ </div>
287
+ <div class="w-full bg-gray-200 rounded-full h-2.5">
288
+ <div id="formatting-bar" class="progress-bar h-2.5 rounded-full bg-green-500" style="width: 0%"></div>
289
+ </div>
290
+ <div id="formatting-feedback" class="mt-2 text-sm text-gray-600">
291
+ <!-- Filled by JavaScript -->
292
+ </div>
293
+ </div>
294
+
295
+ <!-- Experience Score -->
296
+ <div>
297
+ <div class="flex justify-between items-center mb-2">
298
+ <h3 class="font-medium flex items-center">
299
+ <i class="fas fa-briefcase text-yellow-500 mr-2"></i>
300
+ Experience Score
301
+ </h3>
302
+ <div class="flex items-center">
303
+ <span id="experience-score" class="font-bold mr-1">0</span>
304
+ <span class="text-gray-500">/20</span>
305
+ </div>
306
+ </div>
307
+ <div class="w-full bg-gray-200 rounded-full h-2.5">
308
+ <div id="experience-bar" class="progress-bar h-2.5 rounded-full bg-yellow-500" style="width: 0%"></div>
309
+ </div>
310
+ <div id="experience-feedback" class="mt-2 text-sm text-gray-600">
311
+ <!-- Filled by JavaScript -->
312
+ </div>
313
+ </div>
314
+ </div>
315
+ </div>
316
+ </div>
317
+ </div>
318
+ </div>
319
+
320
+ <script>
321
+ document.addEventListener('DOMContentLoaded', function() {
322
+ // DOM Elements
323
+ const analyzeBtn = document.getElementById('analyze-btn');
324
+ const scoreCard = document.getElementById('score-card');
325
+ const keywordAnalysis = document.getElementById('keyword-analysis');
326
+ const resumePreviewContainer = document.getElementById('resume-preview-container');
327
+ const detailedAnalysis = document.getElementById('detailed-analysis');
328
+ const downloadBtn = document.getElementById('download-btn');
329
+ const resumeUpload = document.getElementById('resume-upload');
330
+
331
+ // Store the original resume content
332
+ let originalResumeContent = '';
333
+ let analyzedResumeContent = '';
334
+
335
+ // Keywords for different roles
336
+ const roleKeywords = {
337
+ data_scientist: {
338
+ technical: ['Python', 'R', 'SQL', 'Statistics', 'Data Analysis', 'Data Visualization',
339
+ 'Machine Learning', 'Deep Learning', 'Natural Language Processing', 'Predictive Modeling'],
340
+ tools: ['Pandas', 'NumPy', 'Scikit-learn', 'TensorFlow', 'PyTorch', 'Keras',
341
+ 'Matplotlib', 'Seaborn', 'Tableau', 'Power BI', 'Spark', 'Hadoop'],
342
+ methodology: ['A/B Testing', 'Hypothesis Testing', 'Feature Engineering', 'Model Evaluation',
343
+ 'Cross-Validation', 'Data Cleaning', 'EDA', 'CRISP-DM']
344
+ },
345
+ ml_engineer: {
346
+ technical: ['Python', 'Machine Learning', 'Deep Learning', 'Neural Networks', 'Computer Vision',
347
+ 'Natural Language Processing', 'Algorithm Development', 'Model Deployment', 'ML Pipelines'],
348
+ tools: ['TensorFlow', 'PyTorch', 'Keras', 'Scikit-learn', 'OpenCV', 'NLTK',
349
+ 'Docker', 'Kubernetes', 'AWS SageMaker', 'MLflow', 'Airflow'],
350
+ methodology: ['Model Optimization', 'Hyperparameter Tuning', 'Transfer Learning', 'Data Augmentation',
351
+ 'Model Serving', 'CI/CD', 'MLOps', 'Feature Engineering']
352
+ },
353
+ data_engineer: {
354
+ technical: ['SQL', 'NoSQL', 'ETL', 'Data Pipelines', 'Data Warehousing', 'Data Modeling',
355
+ 'Distributed Systems', 'Big Data', 'Data Quality', 'Data Governance'],
356
+ tools: ['Spark', 'Hadoop', 'Kafka', 'Airflow', 'Snowflake', 'Redshift',
357
+ 'BigQuery', 'PostgreSQL', 'MongoDB', 'Docker', 'Kubernetes'],
358
+ methodology: ['Data Architecture', 'Schema Design', 'Performance Optimization', 'Data Security',
359
+ 'Data Integration', 'Stream Processing', 'Batch Processing']
360
+ },
361
+ ai_researcher: {
362
+ technical: ['Python', 'Machine Learning', 'Deep Learning', 'Reinforcement Learning', 'Computer Vision',
363
+ 'Natural Language Processing', 'Generative Models', 'Neural Networks', 'Algorithm Design'],
364
+ tools: ['TensorFlow', 'PyTorch', 'Keras', 'JAX', 'OpenAI Gym', 'Hugging Face',
365
+ 'Matplotlib', 'Seaborn', 'Jupyter Notebook', 'LaTeX'],
366
+ methodology: ['Research Methodology', 'Literature Review', 'Experimental Design', 'Model Interpretation',
367
+ 'Transfer Learning', 'Few-shot Learning', 'Self-supervised Learning']
368
+ },
369
+ mlops: {
370
+ technical: ['Python', 'Machine Learning', 'Model Deployment', 'CI/CD', 'Monitoring',
371
+ 'Infrastructure as Code', 'Cloud Computing', 'Containerization', 'Orchestration'],
372
+ tools: ['Docker', 'Kubernetes', 'AWS', 'GCP', 'Azure', 'MLflow',
373
+ 'Kubeflow', 'Airflow', 'Prometheus', 'Grafana', 'Terraform'],
374
+ methodology: ['MLOps', 'DevOps', 'Model Versioning', 'A/B Testing', 'Canary Deployments',
375
+ 'Performance Monitoring', 'Logging', 'Alerting']
376
+ }
377
+ };
378
+
379
+ // Sample resume data for demonstration
380
+ const sampleResume = {
381
+ content: `John Doe
382
+ Data Scientist
383
+
384
+ EXPERIENCE
385
+ Senior Data Scientist
386
+ ABC Tech (2020 - Present)
387
+ - Developed machine learning models using Python and TensorFlow to improve product recommendations
388
+ - Led A/B testing initiatives that increased conversion rates by 15%
389
+ - Built data pipelines with Spark and Airflow to process large datasets
390
+
391
+ Data Analyst
392
+ XYZ Corp (2017 - 2020)
393
+ - Performed exploratory data analysis using Pandas and NumPy
394
+ - Created interactive dashboards in Tableau for business stakeholders
395
+ - Wrote SQL queries to extract and transform data from multiple sources
396
+
397
+ EDUCATION
398
+ MS in Data Science
399
+ University of Tech (2016)
400
+
401
+ SKILLS
402
+ Python, R, SQL, Machine Learning, Data Visualization, Statistics, TensorFlow, PyTorch, Spark`
403
+ };
404
+
405
+ // Handle file upload
406
+ resumeUpload.addEventListener('change', function(e) {
407
+ const file = e.target.files[0];
408
+ if (!file) return;
409
+
410
+ // For demo purposes, we'll just use the filename
411
+ // In a real app, you would parse the file content here
412
+ originalResumeContent = `Uploaded file: ${file.name}\n\n${sampleResume.content}`;
413
+ });
414
+
415
+ // Download button click handler
416
+ downloadBtn.addEventListener('click', function() {
417
+ if (!analyzedResumeContent) {
418
+ alert('Please analyze your resume first');
419
+ return;
420
+ }
421
+
422
+ // Create a Blob with the resume content
423
+ const blob = new Blob([originalResumeContent], { type: 'text/plain' });
424
+
425
+ // Create a download link
426
+ const url = URL.createObjectURL(blob);
427
+ const a = document.createElement('a');
428
+ a.href = url;
429
+
430
+ // Get the current date for the filename
431
+ const today = new Date();
432
+ const dateStr = today.toISOString().split('T')[0];
433
+
434
+ // Set the filename
435
+ const jobTitle = document.getElementById('job-title').value;
436
+ const formattedJobTitle = jobTitle.split('_').map(word =>
437
+ word.charAt(0).toUpperCase() + word.slice(1)
438
+ ).join(' ');
439
+
440
+ a.download = `Resume_${formattedJobTitle}_${dateStr}.txt`;
441
+
442
+ // Trigger the download
443
+ document.body.appendChild(a);
444
+ a.click();
445
+
446
+ // Clean up
447
+ document.body.removeChild(a);
448
+ URL.revokeObjectURL(url);
449
+ });
450
+
451
+ // Analyze button click handler
452
+ analyzeBtn.addEventListener('click', function() {
453
+ // For demo purposes, we'll use the sample resume
454
+ // In a real app, you would parse the uploaded file here
455
+
456
+ const jobTitle = document.getElementById('job-title').value;
457
+ const experienceLevel = document.getElementById('experience-level').value;
458
+
459
+ // If no file was uploaded, use the sample resume
460
+ originalResumeContent = originalResumeContent || sampleResume.content;
461
+ analyzedResumeContent = originalResumeContent;
462
+
463
+ // Show all sections
464
+ scoreCard.classList.remove('hidden');
465
+ keywordAnalysis.classList.remove('hidden');
466
+ resumePreviewContainer.classList.remove('hidden');
467
+ detailedAnalysis.classList.remove('hidden');
468
+
469
+ // Calculate scores (simulated for demo)
470
+ const scores = calculateScores(analyzedResumeContent, jobTitle, experienceLevel);
471
+
472
+ // Update the UI with the scores
473
+ updateScoreCard(scores);
474
+ updateKeywordAnalysis(analyzedResumeContent, jobTitle);
475
+ updateResumePreview(analyzedResumeContent, jobTitle);
476
+ updateDetailedAnalysis(scores);
477
+ });
478
+
479
+ // Calculate scores based on resume content and job title
480
+ function calculateScores(resumeContent, jobTitle, experienceLevel) {
481
+ // This is a simplified scoring system for demo purposes
482
+ // A real implementation would be more sophisticated
483
+
484
+ const keywords = roleKeywords[jobTitle];
485
+ let contentScore = 0;
486
+ let keywordScore = 0;
487
+ let formattingScore = 0;
488
+ let experienceScore = 0;
489
+
490
+ // Check for standard sections (content score)
491
+ const hasExperience = resumeContent.toLowerCase().includes('experience');
492
+ const hasEducation = resumeContent.toLowerCase().includes('education');
493
+ const hasSkills = resumeContent.toLowerCase().includes('skills');
494
+
495
+ if (hasExperience) contentScore += 10;
496
+ if (hasEducation) contentScore += 5;
497
+ if (hasSkills) contentScore += 5;
498
+
499
+ // Check for bullet points (formatting score)
500
+ const bulletPoints = (resumeContent.match(/-/g) || []).length;
501
+ formattingScore += Math.min(bulletPoints, 10);
502
+
503
+ // Check for length (formatting score)
504
+ const lineCount = resumeContent.split('\n').length;
505
+ if (lineCount >= 15 && lineCount <= 40) formattingScore += 10;
506
+
507
+ // Check for keywords (keyword score)
508
+ let foundKeywords = 0;
509
+ let totalKeywords = 0;
510
+
511
+ // Count technical keywords
512
+ for (const keyword of keywords.technical) {
513
+ totalKeywords++;
514
+ if (resumeContent.toLowerCase().includes(keyword.toLowerCase())) {
515
+ foundKeywords++;
516
+ }
517
+ }
518
+
519
+ // Count tools keywords
520
+ for (const keyword of keywords.tools) {
521
+ totalKeywords++;
522
+ if (resumeContent.toLowerCase().includes(keyword.toLowerCase())) {
523
+ foundKeywords++;
524
+ }
525
+ }
526
+
527
+ // Count methodology keywords
528
+ for (const keyword of keywords.methodology) {
529
+ totalKeywords++;
530
+ if (resumeContent.toLowerCase().includes(keyword.toLowerCase())) {
531
+ foundKeywords++;
532
+ }
533
+ }
534
+
535
+ keywordScore = Math.round((foundKeywords / totalKeywords) * 30);
536
+
537
+ // Experience score based on level
538
+ if (experienceLevel === 'entry') {
539
+ experienceScore = resumeContent.toLowerCase().includes('intern') ? 15 : 10;
540
+ } else if (experienceLevel === 'mid') {
541
+ experienceScore = (resumeContent.match(/\d+\+? years/g) || []).length >= 3 ? 15 : 10;
542
+ } else {
543
+ experienceScore = (resumeContent.match(/\d+\+? years/g) || []).length >= 5 ? 20 : 15;
544
+ }
545
+
546
+ // Calculate total score
547
+ const totalScore = contentScore + keywordScore + formattingScore + experienceScore;
548
+
549
+ return {
550
+ total: totalScore,
551
+ content: contentScore,
552
+ keyword: keywordScore,
553
+ formatting: formattingScore,
554
+ experience: experienceScore
555
+ };
556
+ }
557
+
558
+ // Update the score card with the calculated scores
559
+ function updateScoreCard(scores) {
560
+ document.getElementById('score-value').textContent = scores.total;
561
+ document.getElementById('score-percent').textContent = `${scores.total}%`;
562
+ document.getElementById('score-bar').style.width = `${scores.total}%`;
563
+
564
+ // Set bar color based on score
565
+ if (scores.total >= 80) {
566
+ document.getElementById('score-bar').classList.add('bg-green-500');
567
+ } else if (scores.total >= 50) {
568
+ document.getElementById('score-bar').classList.add('bg-yellow-500');
569
+ } else {
570
+ document.getElementById('score-bar').classList.add('bg-red-500');
571
+ }
572
+
573
+ // Update strengths and improvements
574
+ const strengthsList = document.getElementById('strengths-list');
575
+ const improvementsList = document.getElementById('improvements-list');
576
+
577
+ strengthsList.innerHTML = '';
578
+ improvementsList.innerHTML = '';
579
+
580
+ // Add strengths
581
+ if (scores.keyword >= 20) {
582
+ strengthsList.innerHTML += '<li>Strong keyword matching for your target role</li>';
583
+ }
584
+ if (scores.formatting >= 15) {
585
+ strengthsList.innerHTML += '<li>Good resume formatting and structure</li>';
586
+ }
587
+ if (scores.content >= 20) {
588
+ strengthsList.innerHTML += '<li>Comprehensive content with all key sections</li>';
589
+ }
590
+
591
+ // Add improvements
592
+ if (scores.keyword < 15) {
593
+ improvementsList.innerHTML += '<li>Add more relevant technical keywords</li>';
594
+ }
595
+ if (scores.formatting < 10) {
596
+ improvementsList.innerHTML += '<li>Improve formatting with more bullet points</li>';
597
+ }
598
+ if (scores.content < 15) {
599
+ improvementsList.innerHTML += '<li>Ensure all standard sections are included</li>';
600
+ }
601
+
602
+ // Default messages if no specific strengths/improvements
603
+ if (strengthsList.innerHTML === '') {
604
+ strengthsList.innerHTML = '<li>No significant strengths identified</li>';
605
+ }
606
+ if (improvementsList.innerHTML === '') {
607
+ improvementsList.innerHTML = '<li>No major improvements needed</li>';
608
+ }
609
+ }
610
+
611
+ // Update the keyword analysis section
612
+ function updateKeywordAnalysis(resumeContent, jobTitle) {
613
+ const keywords = roleKeywords[jobTitle];
614
+
615
+ // Technical keywords
616
+ const technicalKeywordsDiv = document.getElementById('technical-keywords');
617
+ technicalKeywordsDiv.innerHTML = '';
618
+
619
+ keywords.technical.forEach(keyword => {
620
+ const hasKeyword = resumeContent.toLowerCase().includes(keyword.toLowerCase());
621
+ const span = document.createElement('span');
622
+ span.className = hasKeyword ? 'keyword-match' : 'keyword-miss';
623
+ span.textContent = keyword;
624
+
625
+ if (!hasKeyword) {
626
+ const tooltip = document.createElement('div');
627
+ tooltip.className = 'tooltip';
628
+ tooltip.innerHTML = `<span class="tooltiptext">This important keyword is missing from your resume</span>${keyword}`;
629
+ technicalKeywordsDiv.appendChild(tooltip);
630
+ } else {
631
+ technicalKeywordsDiv.appendChild(span);
632
+ }
633
+ });
634
+
635
+ // Tools keywords
636
+ const toolsKeywordsDiv = document.getElementById('tools-keywords');
637
+ toolsKeywordsDiv.innerHTML = '';
638
+
639
+ keywords.tools.forEach(keyword => {
640
+ const hasKeyword = resumeContent.toLowerCase().includes(keyword.toLowerCase());
641
+ const span = document.createElement('span');
642
+ span.className = hasKeyword ? 'keyword-match' : 'keyword-miss';
643
+ span.textContent = keyword;
644
+
645
+ if (!hasKeyword) {
646
+ const tooltip = document.createElement('div');
647
+ tooltip.className = 'tooltip';
648
+ tooltip.innerHTML = `<span class="tooltiptext">This important tool is missing from your resume</span>${keyword}`;
649
+ toolsKeywordsDiv.appendChild(tooltip);
650
+ } else {
651
+ toolsKeywordsDiv.appendChild(span);
652
+ }
653
+ });
654
+
655
+ // Methodology keywords
656
+ const methodologyKeywordsDiv = document.getElementById('methodology-keywords');
657
+ methodologyKeywordsDiv.innerHTML = '';
658
+
659
+ keywords.methodology.forEach(keyword => {
660
+ const hasKeyword = resumeContent.toLowerCase().includes(keyword.toLowerCase());
661
+ const span = document.createElement('span');
662
+ span.className = hasKeyword ? 'keyword-match' : 'keyword-miss';
663
+ span.textContent = keyword;
664
+
665
+ if (!hasKeyword) {
666
+ const tooltip = document.createElement('div');
667
+ tooltip.className = 'tooltip';
668
+ tooltip.innerHTML = `<span class="tooltiptext">This methodology is important for your role</span>${keyword}`;
669
+ methodologyKeywordsDiv.appendChild(tooltip);
670
+ } else {
671
+ methodologyKeywordsDiv.appendChild(span);
672
+ }
673
+ });
674
+ }
675
+
676
+ // Update the resume preview with highlighted keywords
677
+ function updateResumePreview(resumeContent, jobTitle) {
678
+ const resumePreview = document.getElementById('resume-preview');
679
+ const keywords = [
680
+ ...roleKeywords[jobTitle].technical,
681
+ ...roleKeywords[jobTitle].tools,
682
+ ...roleKeywords[jobTitle].methodology
683
+ ];
684
+
685
+ let highlightedContent = resumeContent;
686
+
687
+ // Highlight keywords in the content
688
+ keywords.forEach(keyword => {
689
+ const regex = new RegExp(keyword, 'gi');
690
+ highlightedContent = highlightedContent.replace(regex, match => {
691
+ return `<span class="keyword-match">${match}</span>`;
692
+ });
693
+ });
694
+
695
+ // Preserve line breaks
696
+ highlightedContent = highlightedContent.replace(/\n/g, '<br>');
697
+
698
+ resumePreview.innerHTML = highlightedContent;
699
+ }
700
+
701
+ // Update the detailed analysis section
702
+ function updateDetailedAnalysis(scores) {
703
+ document.getElementById('content-score').textContent = scores.content;
704
+ document.getElementById('keyword-score').textContent = scores.keyword;
705
+ document.getElementById('formatting-score').textContent = scores.formatting;
706
+ document.getElementById('experience-score').textContent = scores.experience;
707
+
708
+ document.getElementById('content-bar').style.width = `${(scores.content / 30) * 100}%`;
709
+ document.getElementById('keyword-bar').style.width = `${(scores.keyword / 30) * 100}%`;
710
+ document.getElementById('formatting-bar').style.width = `${(scores.formatting / 20) * 100}%`;
711
+ document.getElementById('experience-bar').style.width = `${(scores.experience / 20) * 100}%`;
712
+
713
+ // Content feedback
714
+ let contentFeedback = '';
715
+ if (scores.content >= 25) {
716
+ contentFeedback = 'Your resume has all the essential sections with detailed content.';
717
+ } else if (scores.content >= 15) {
718
+ contentFeedback = 'Your resume has most key sections but could use more detail in some areas.';
719
+ } else {
720
+ contentFeedback = 'Your resume is missing important sections. Add Experience, Education, and Skills sections.';
721
+ }
722
+ document.getElementById('content-feedback').textContent = contentFeedback;
723
+
724
+ // Keyword feedback
725
+ let keywordFeedback = '';
726
+ if (scores.keyword >= 25) {
727
+ keywordFeedback = 'Excellent keyword optimization! Your resume matches most important terms for your target role.';
728
+ } else if (scores.keyword >= 15) {
729
+ keywordFeedback = 'Your resume includes some important keywords but could use more technical terms.';
730
+ } else {
731
+ keywordFeedback = 'Your resume is missing many important keywords. Review the keyword analysis above.';
732
+ }
733
+ document.getElementById('keyword-feedback').textContent = keywordFeedback;
734
+
735
+ // Formatting feedback
736
+ let formattingFeedback = '';
737
+ if (scores.formatting >= 15) {
738
+ formattingFeedback = 'Great formatting! Your resume uses bullet points effectively and has an appropriate length.';
739
+ } else if (scores.formatting >= 10) {
740
+ formattingFeedback = 'Your formatting is decent but could be improved with more bullet points and better structure.';
741
+ } else {
742
+ formattingFeedback = 'Your resume formatting needs work. Use more bullet points and keep it between 1-2 pages.';
743
+ }
744
+ document.getElementById('formatting-feedback').textContent = formattingFeedback;
745
+
746
+ // Experience feedback
747
+ let experienceFeedback = '';
748
+ if (scores.experience >= 15) {
749
+ experienceFeedback = 'Your experience section effectively showcases your relevant background.';
750
+ } else {
751
+ experienceFeedback = 'Your experience section could better highlight your relevant skills and achievements.';
752
+ }
753
+ document.getElementById('experience-feedback').textContent = experienceFeedback;
754
+ }
755
+ });
756
+ </script>
757
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=Jurk06/data-science-resume-analyser" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
758
+ </html>