-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
309 lines (254 loc) · 12.5 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
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-4G5DVR6FCK"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-4G5DVR6FCK');
</script>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ady S.</title>
<script src="https://kit.fontawesome.com/e674bba739.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="style.css">
</head>
<body>
<section id="header">
<div class="navbar-title">
<h3 class="title-first-name">
Ady S.
</h3>
</div>
<div>
<ul class="navbar-menu">
<li><a class="profile-card-active" href="#aboutme"> About </a></li>
<li><a class="profile-card-active" href="#introduction">Works</a></li>
<li><a class="profile-card-active" href="#skill">Skills</a></li>
<li><a class="profile-card-active" href="#footer">Contacts</a></li>
</ul>
</div>
<div>
<ul class="social-media">
<li>
<i class="fa-brands fa-linkedin-in"></i>
<a href="https://id.linkedin.com/in/ady-saputro-468065270" target="_blank">LinkedIn</a>
</li>
<li>
<i class="fa-brands fa-github"></i>
<a href="https://github.com/Gen0z" target="_blank">Github</a>
</li>
<li>
<i class="fa-brands fa-whatsapp"></i>
<a href="https://wa.me/+6282313351759" target="_blank">Whatsapp</a>
</li>
<li>
<i class="fa-regular fa-envelope"></i>
<a href="mailto:[email protected]">Email</a>
</li>
</ul>
</div>
</section>
<section id="content-body">
<div class="body-part-1">
<div class="developer-intro">
<p>Backend Developer</p>
<p>Security Enthusiast</p>
<p>AI programmer</p>
</div>
<div class="body-title">
<!-- <h1>Wkwkwkww</h1> -->
<h1 style="color: rgb(115, 224, 6);">I'm a Cybersecurity Engineer</h1>
<h2 style="color: aquamarine;">Backend with AI development</h2>
<p>Crafting a Secure Software development in Artificial Intelligence Digital Era</p>
<a href="https://id.linkedin.com/in/ady-saputro-468065270">LET'S Connect!</a>
</div>
<div class="body-tail">
<h1>7+
</h1>
<p>Certificatons<br>EXPERIENCE</p>
<h1>4</h1>
<p>PROJECTS<br>COMPLETED</p>
</div>
</div>
<div class="body-part-2">
<div class="container">
<div class="svg-animation">
<img src="assets/cyber.svg">
</div>
</div>
</div>
</section>
<section id="aboutme">
<div class="body-part-2">
<div class="container">
<div class="svg-animation">
<img src="assets/who.svg">
</div>
</div>
</div>
<div class="body-part-1">
<div class="body-title">
<!-- <h1>Talk is cheap<br>Show me the code</h1> -->
<h1>Who Am I?</h1>
<p>Ady here, an Indonesian enthusiast in Wonogiri, passionate about programming and cybersecurity.<br>
Graduated from Vocational High School Computer and Networking Engineering<br>
Started with a Java Programming Internship, honed skills, and fell in love with web development using HTML, CSS, and JS.<br>
Explored image processing, wireless sensor networks, and even published findings in research projects.<br>
Certified in various domains, from Big Data to Ethical Hacking, building a well-rounded foundation.<br>
Beyond tech, I'm an adventure junkie - trekking and gaming are my go-tos.<br>
Staying current with the latest tech trends is a must for me.<br>
Fluent in Indonesian and English, and have a basic grasp of Japanese, facilitating global connections.<br>
Join me in my journey through back-end development and cybersecurity - let's learn and grow together!
</p>
<a href="https://id.linkedin.com/in/ady-saputro-468065270">LET'S Connect!</a>
</div>
</div>
</div>
</div>
</section>
<section id="introduction">
<div class="heading-container">
<h3 class="section-heading">Latest Projects</h3>
<p>Perfect solutions for digital experience</p>
</div>
<div class="cards-container">
<div class="cards">
<div class="design-card active">
<div>
<h3>An Enhanced Haze Removal: Using DCP and Enriched-Invariant Features</h3>
<i class="fa-solid fa-wand-magic-sparkles"></i>
</div>
<p>The project proposes an enhanced method for removing haze from images using Dark Channel Prior (DCP) and Enriched-Invariant Features. This approach aims to improve the accuracy and efficiency of existing haze removal techniques, particularly in situations where the visibility is severely impaired by haze.</p>
</div>
<div class="design-card">
<div>
<h3>Multicast Wireless Routing Protocol In Java Programming</h3>
<i class="fa-solid fa-code"></i>
</div>
<p>The Multicast Wireless Routing Protocol project in Java programming aims to develop a protocol for efficient data transmission over wireless networks using multicasting. The project involves implementing algorithms to optimize data transmission and minimize delays and packet losses.</p>
</div>
<div class="design-card">
<div>
<h3>Vampire Attacks Draining Life from Wireless Ad Hoc Sensor Networks</h3>
<i class="fa-solid fa-terminal"></i>
</div>
<p>"Vampire Attacks" is a Java-based application that simulates and analyzes the impact of vampire attacks on wireless sensor networks. This application explores the vulnerabilities of such networks and mimics the behavior of energy-draining malicious nodes.</p>
</div>
<div class="design-card">
<div>
<h3>
Pack Indonesian Packers and Movers Website Development Project
</h3>
<i class="fa-solid fa-terminal"></i>
</div>
<p>I successfully crafted a professional website for Pack India Packer and Movers, highlighting their top-tier relocation services. The site provides seamless user experience, valuable information, and easy client interaction, bolstering Pack India's online presence and their mission of smooth moving solutions.</p>
</div>
</div>
</div>
</div>
<div class="image-container">
<div class="body-part-2">
<div class="container">
<div class="svg-animation">
<img src="assets/project.svg">
</div>
</div>
</div>
</div>
</section>
<section id="skill">
<div class="heading-container">
<h3 class="section-heading">Skills</h3>
</div>
<div class="image-container">
<div class="body-part-2">
<div class="container">
<div class="svg-animation">
<img src="assets/skill.svg">
</div>
</div>
</div>
</div>
<div class="cards-container">
<div class="cards">
<div class="design-card active">
<div>
<h3>Cybersecurity</h3>
<i class="fa-solid fa-wand-magic-sparkles"></i>
</div>
<p>Threat Detection • Network Security • Cybersecurity Architecture • Ethical Hacking • Social Engineering • Information Security Management System (ISMS) • IT Audit • IT Security Assessments • Penetration Testing</p>
</div>
<div class="design-card">
<div>
<h3>Backend Development</h3>
<i class="fa-solid fa-code"></i>
</div>
<p>Java • MATLAB • SQL • Full-Stack Development • JavaScript • HTML • Cascading Style Sheets (CSS) • Front-End Development • PHP</p>
</div>
<div class="design-card">
<div>
<h3>AI Programming</h3>
<i class="fa-solid fa-terminal"></i>
</div>
<p>Algorithms • Prompt Engineer • Chat bot development • Software Development • LLM • NLP • Computer Vision • </p>
</div>
</div>
</div>
</div>
</section>
<section id="footer">
<div class="footer-left">
<form
action="https://formspree.io/f/xvojyvqo"
method="POST">
<h2>Let's make something amazing together</h2>
<div class="email-form">
<h2>Start by <span>saying hi</span></h2>
<input type="text" name="name" id="" placeholder="Your name">
<input type="email" name="email" id="" placeholder="Email Address">
<div>
<input type="number" name="phone-number" id="" placeholder="Phone number">
<button type="submit">Send</button>
</div>
</form>
</div>
<div class="footer-title">
<h3 class="title-first-name">
Ady
</h3>
<h3 class="title-last-name">
Saputro
</h3>
</div>
</div>
<div class="footer-right">
<div class="footer-email-intro">
<p>Information</p>
<h4>Wonogiri, Indonesia </h4>
<h7 class="green-text" style="color: greenyellow;">[email protected]</h7>
</div>
<div class="footer-nav-menu">
<ul class="footer-menu">
<li><a class="profile-card-active" href="#aboutme"> About </a></li>
<li><a class="profile-card-active" href="#introduction">Works</a></li>
<li><a class="profile-card-active" href="#skill">Skills</a></li>
</ul>
</div>
<div class="social-icons">
<a href="https://id.linkedin.com/in/ady-saputro-468065270" target="_blank">
<i class="fa-brands fa-linkedin-in"></i>
</a>
<a href="https://github.com/Gen0z" target="_blank">
<i class="fa-brands fa-github"></i>
</a>
<p class="love">Made with 😁 in Indonesia</p>
</div>
</div>
</section>
<script src="script.js"></script>
</body>
</html>