-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
275 lines (262 loc) · 12.2 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Jagdish Suthar Portfolio</title>
</head>
<body>
<!-- Header -->
<section id="header">
<div class="header container">
<div class="nav-bar">
<div class="brand">
<a href="#hero">
<h1>Jagdish Suthar</h1>
</a>
</div>
<div class="nav-list">
<div class="hamburger">
<div class="bar"></div>
</div>
<ul>
<li><a href="#hero" data-after="Home">Home</a></li>
<li><a href="#services" data-after="Service">Skills</a></li>
<li><a href="#projects" data-after="Projects">Projects</a></li>
<li><a href="#about" data-after="About">About</a></li>
<li><a href="#contact" data-after="Contact">Contact</a></li>
</ul>
</div>
</div>
</div>
</section>
<!-- End Header -->
<!-- Hero Section -->
<section id="hero">
<div class="hero container">
<div>
<h1>Hello, <span></span></h1>
<h1>My Name is <span></span></h1>
<h1>Jagdish Suthar<span></span></h1>
<h1>Specializing in DSA, ML,<span></span></h1>
<h1>and Web Dev<span></span></h1>
<a href="#projects" type="button" class="cta">Portfolio</a>
</div>
</div>
</section>
<!-- End Hero Section -->
<!-- Service Section -->
<section id="services">
<div class="services container">
<div class="service-top">
<h1 class="section-title">My<span> Skills</span></h1>
<p>I specialize in a range of technical areas, offering services that leverage my expertise in cutting-edge technologies and methodologies. Here’s how I can help you:</p>
</div>
<div class="service-bottom">
<div class="service-item">
<div class="icon"><img src="https://img.icons8.com/?size=100&id=V7bWlRbkNWas&format=png&color=000000" /></div>
<h2>Data structures algorithms</h2>
<p>Providing in-depth understanding and solutions in data structures and algorithms. Enhancing system efficiency and problem-solving capabilities with optimized code and strategic design.</p>
</div>
<div class="service-item">
<div class="icon"><img src="https://img.icons8.com/?size=100&id=114898&format=png&color=000000" /></div>
<h2>Machine Learning</h2>
<p>Building intelligent systems through machine learning techniques. Implementing models for predictive analytics, natural language processing, and data-driven decision-making.</p>
</div>
<div class="service-item">
<div class="icon"><img src="https://img.icons8.com/bubbles/100/000000/web.png" /></div>
<h2>Web Development</h2>
<p>Creating robust and interactive web applications with modern technologies such as React, Next.js, and TypeScript. Focusing on user experience and scalable architecture.</p>
</div>
</div>
</div>
</section>
<!-- End Service Section -->
<!-- Projects Section -->
<section id="projects">
<div class="projects container">
<div class="projects-header">
<h1 class="section-title">Recent <span>Projects</span></h1>
</div>
<div class="all-projects">
<div class="project-item">
<div class="project-info">
<h1>TeleICU Monitoring System</h1>
<h2>Streamlit, YOLOv8, Python, LabelStudio, Tensoflow, OpenCV, MoviePy, Mediapipe</h2>
<p> Developed to enhance ICU patient care, this system provides remote monitoring and support.
It features real-time people detection and classification using YOLOv8, patient action detection with an LSTM model, and graphical representation of detected actions.
The project improves patient outcomes and healthcare efficiency by enabling detailed video analysis and action tracking.
</p>
</div>
<div class="project-img">
<a href="https://github.com/Jagdish9903/Intel-Project-TeleICU" target="_blank"><img src="./img/image3.png" alt="img"></a>
</div>
</div>
<div class="project-item">
<div class="project-info">
<h1>Interactive Music Application</h1>
<h2>ReactJS, NodeJS, ExpressJS, Python, Machine Learning, CNN, SQLite</h2>
<p>This project elevates the music experience with emotion-based song recommendations using facial recognition, lyrics-based song identification, and features for seamless playback and discovery.
Developed with Rishabh Parmar and Mihir Dhami, It combines innovative interactions with a rich music experience.</p>
</div>
<div class="project-img">
<a href="https://www.linkedin.com/posts/jagdish-suthar-20934a227_musicapp-facialrecognition-ai-activity-7198594992657854465-U6tg?utm_source=share&utm_medium=member_desktop" target="_blank"><img src="./img/image2.png" alt="img"></a>
</div>
</div>
<div class="project-item">
<div class="project-info">
<h1>Driver Behavior Monitoring System</h1>
<h2>Python, OpenCV, YOLO, dlib, keras, Numpy</h2>
<p>Developed during my summer internship at Edunet Foundation, this system enhances road safety by detecting driver drowsiness, mobile phone usage, yawning, and emotional states.
Key features include real-time alerts for fatigue and distractions, and emotion recognition to promote safer driving.
</p>
</div>
<div class="project-img">
<a href="https://github.com/Rishabh3243/AI_Saksham_Project" target="_blank"><img src="./img/image.png" alt="img"></a>
</div>
</div>
<div class="project-item">
<div class="project-info">
<h1>Movies Recommendation System</h1>
<h2>Python, Jupyter Notebook, Streamlit, Numpy, Pandas</h2>
<p>A Streamlit application that I developed end-to-end. I designed and implemented a recommendation model using vector representations and cosine similarity on a movie dataset.
The app suggests movies similar to the user-selected one and displays their posters and titles, leveraging The Movie Database API for movie details. </p>
</div>
<div class="project-img">
<a href="https://github.com/Jagdish9903/movie_recommendation" target="_blank"><img src="./img/img4.png" alt="img"></a>
</div>
</div>
<div class="project-item">
<div class="project-info">
<h1>Cloud Books</h1>
<h2>HTML, CSS, JS</h2>
<p>A static website developed with Rishabh Parmar, showcasing a diverse collection of books in categories like science, fiction, and business.
The platform offers a user-friendly way to explore and read books across these genres.
</p>
</div>
<div class="project-img">
<a href="https://rishabh3243.github.io/Cloud-Books/Home/Home.html" target="_blank"><img src="./img/image4.png" alt="img"></a>
</div>
</div>
</div>
</div>
</section>
<!-- End Projects Section -->
<!-- About Section -->
<section id="about">
<div class="about container">
<div class="col-left">
<div class="about-img">
<img src="./img/me3.jpg" alt="img">
</div>
</div>
<div class="col-right">
<h1 class="section-title">About <span>me</span></h1>
<h2>Software Developer</h2>
<p>I'm Jagdish, a Software Developer with a strong focus on creating efficient and scalable applications. My expertise includes front-end development, machine learning, and data science. I enjoy solving complex DSA problems and want to build innovative solutions that can make a real impact.</p>
<a href="https://drive.google.com/file/d/13Crya2mwr0EUpe48eLWhvPjZuYnj-Cp8/view?usp=drivesdk" target="_blank" class="cta">See Resume</a>
</div>
</div>
</section>
<!-- End About Section -->
<!-- Achievements Section -->
<section id="achievements">
<div class="achievements container">
<div class="achievements-top">
<h1 class="section-title">My<span> Achievements</span></h1>
<p>Here are some notable achievements that reflect my dedication and success in various fields:</p>
</div>
<div class="achievements-bottom">
<div class="achievement-item">
<div class="icon">
<a href="https://www.linkedin.com/posts/jagdish-suthar-20934a227_sih2023-winners-teamwork-activity-7144975976874106880-DCGh?utm_source=share&utm_medium=member_desktop" target="_blank"><img src="img/sih.png" alt="Smart India Hackathon" /></a>
</div>
<h2>Smart India Hackathon 2023</h2>
<p>Winner of the Smart India Hackathon 2023, showcasing innovative problem-solving and teamwork skills.</p>
</div>
<div class="achievement-item">
<div class="icon">
<img src="img/gtu.jpeg" alt="Academic Excellence Award" />
</div>
<h2>Academic Excellence Award</h2>
<p>Recipient of the Academic Excellence Award at the Devang Mehta IT Awards 2023 for outstanding performance in academics.</p>
</div>
<div class="achievement-item">
<div class="icon">
<a href="https://www.naukri.com/code360/profile/Jagdish9903" target="_blank"><img src="img/codingninjas.jpeg" alt="Coding Ninjas" /></a>
</div>
<h2>Coding Ninjas</h2>
<p>Ranked in the Top 5% on Coding Ninjas, demonstrating strong problem-solving abilities and algorithmic skills.</p>
</div>
<div class="achievement-item">
<div class="icon">
<a href="https://leetcode.com/u/Jagdish9903/" target="_blank"><img src="img/leetcode.png" alt="Leetcode" /></a>
</div>
<h2>Leetcode</h2>
<p>Ranked in the Top 16% on Leetcode, reflecting proficiency in coding and algorithm challenges.</p>
</div>
</div>
</div>
</section>
<!-- End Achievements Section -->
<!-- Contact Section -->
<section id="contact">
<div class="contact container">
<div>
<h1 class="section-title">Contact <span>info</span></h1>
</div>
<div class="contact-items">
<div class="contact-item">
<div class="icon"><img src="https://img.icons8.com/bubbles/100/000000/phone.png" /></div>
<div class="contact-info">
<h1>Phone</h1>
<h2>+91 93134 18603</h2>
</div>
</div>
<div class="contact-item">
<div class="icon"><img src="https://img.icons8.com/bubbles/100/000000/new-post.png" /></div>
<div class="contact-info">
<h1>Email</h1>
<h2>jagdishsuthar4413@gmail.com</h2>
</div>
</div>
<div class="contact-item">
<div class="icon"><img src="https://img.icons8.com/bubbles/100/000000/map-marker.png" /></div>
<div class="contact-info">
<h1>Address</h1>
<h2>Anand, Gujarat</h2>
</div>
</div>
</div>
</div>
</section>
<!-- End Contact Section -->
<!-- Footer -->
<section id="footer">
<div class="footer container">
<div class="brand">
<h1><span>Jagdish Suthar</span></h1>
</div>
<h2>"Better Than Yesterday!"</h2>
<div class="social-icon">
<div class="social-item">
<a href="https://www.linkedin.com/in/jagdish-suthar-20934a227/" target="_blank"><img src="https://img.icons8.com/bubbles/100/000000/linkedin.png" /></a>
</div>
<div class="social-item">
<a href="https://www.github.com/Jagdish9903" target="_blank"><img src="https://img.icons8.com/bubbles/100/000000/github.png" /></a>
</div>
<div class="social-item">
<a href="https://www.facebook.com/" target="_blank"><img src="https://img.icons8.com/bubbles/100/000000/facebook-new.png" /></a>
</div>
<div class="social-item">
<a href="https://www.instagram.com/" target="_blank"><img src="https://img.icons8.com/bubbles/100/000000/instagram-new.png" /></a>
</div>
</div>
<p>Copyright © 2024 Jagdish. All rights reserved</p>
</div>
</section>
<!-- End Footer -->
<script src="./app.js"></script>
</body>
</html>