-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
536 lines (401 loc) · 20.7 KB
/
index.html
File metadata and controls
536 lines (401 loc) · 20.7 KB
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
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
<!DOCTYPE html>
<html lang="en">
<head>
<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> Yousef Shamsaldeen </title>
<!-- font awesome cdn link -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!-- custom cursors -->
<div class="cursor-1"></div>
<div class="cursor-2"></div>
<div id="menu-bars" class="fas fa-bars"></div>
<!-- header section starts -->
<header>
<a href="file:///C:/" class="logo"> <span> Yousef Shamsaldeen </span></a>
<nav class="navbar">
<a href="#home">home</a>
<a href="#about">about</a>
<a href="#experience">experience</a>
<a href="#service">Research</a>
<a href="#portfolio">portfolio</a>
<a href="#contact">contact</a>
</nav>
<div class="follow">
<a href="https://www.facebook.com/" class="fab fa-facebook-f"></a>
<a href="https://www.twitter.com/" class="fab fa-twitter"></a>
<a href="https://www.instagram.com/" class="fab fa-instagram"></a>
<a href="https://www.linkedin.com/" class="fab fa-linkedin"></a>
</div>
</header>
<!-- header section ends -->
<!-- home section starts -->
<section class="home" id="home">
<div class="content">
<span class="hi"> hi there... </span>
<h3> i am <span> Yousef A. Shamsaldeen </span> </h3> <br></br>
<p class="info"> Welcome to my portfolio </p>
<p class="text">
</p>
<br> <a href="#about" class="btn">about me</a> </br>
</div>
<div class="image">
<img src="images/home-img.png" alt="">
</div>
</section>
<!-- home section ends -->
<!-- about section starts -->
<section class="about" id="about">
<h1 class="heading"> about <span> me </span> </h1>
<div class="row-1">
<div class="image">
<img src="images/about-img.jpg" alt="">
</div>
<div class="content">
<h3> I'm Yousef Amir Shamsaldeen </h3>
<p style="text-align: justify;"> A Junior high scholar at STEM Gharbiya in Egypt with a huge passion for computer science and entrepreneurship. I'm developing my passion for both areas by searching out more opportunities, learning more about the two fields, and gaining hands-on experience. I aim to continue improving until possessing the mindset and the skillset required to become a pioneer who will have a positive impact on his community in the coming few years. In my free time, I enjoy reading novels or watching MCU movies. I aspire to pursue my undergraduate degree in a USA top university, where I can reach out to new domains of knowledge and find a medium that helps me develop my mindset and skillset further!</p>
<div class="box-container">
<div class="box">
<p> <span> age : </span> 16 </p>
<p> <span> gender : </span> male </p>
<p> <span> language : </span> Arabic / English / German </p>
<p> <span> Dream Major : </span> Computer Engineering </p>
</div>
<div class="box">
<p> <span> GPA : </span> 3.9/4.0 </p>
<p> <span> phone : </span> +2011474800732 </p>
<p> <span> email : </span> alyousef9shamjk@gmail.com </p>
<p> <span> country : </span> Egypt </p>
</div>
</div>
<a href="https://drive.google.com/file/d/1sgdhdgj8nYePUjr7hRjzroEJqE785AQD/view" class="btn">download CV</a>
</div>
</div>
<h1 class="heading"> <span> my </span> skills </h1>
<div class="row-2">
<div class="skills">
<div class="progress">
<h3> Graphic Design web design & web development <span> 95% </span> </h3>
<div class="bar"> <span></span> </div>
</div>
<div class="progress">
<h3> Robotics <span> 80% </span> </h3>
<div class="bar"> <span></span> </div>
</div>
<div class="progress">
<h3> 3D Design <span> 75% </span> </h3>
<div class="bar"> <span></span> </div>
</div>
<div class="progress">
<h3> Graphic Design <span> 85% </span> </h3>
<div class="bar"> <span></span> </div>
</div>
</div>
<div class="box-container">
<div class="box">
<h3> 5+ </h3>
<p>years of experience</p>
</div>
<div class="box">
<h3> 100+ </h3>
<p>Hours of Mentoring</p>
</div>
<div class="box">
<h3> 150+ </h3>
<p>projects completed</p>
</div>
<div class="box">
<h3> 1500+ </h3>
<p>Hours of coding and designing</p>
</div>
</div>
</div>
</section>
<!-- about section ends -->
<!-- experience section starts -->
<section class="experience" id="experience">
<h1 class="heading"> <span> my </span> experience </h1>
<div class="box-container">
<div class="box">
<div class="content">
<span> 2024 - 2025 </span>
<h3>President - <a href="https://hack-club-gh.github.io/Gharbia-Branch/">Hack Club</a></h3>
<p style="text-align: justify;">As the President of the Hack Club branch in Gharbia for Computer Science, I led a team of tech enthusiasts, fostering innovation and creativity in coding, cybersecurity, and emerging technologies. Through strategic planning and mentorship, I inspired members to explore and excel in the world of computer science, contributing to the future of technology in the region; All statstics present in the website.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> 2024 - 2025 </span>
<h3>Vice President <br> <a href="https://hack-club-gh.github.io/Gharbia-Branch/">MUN Gharbiya STEM school</a></h3>
<p style="text-align: justify;">As the vice president and mentor at branch in Gharbia I have role as mentorship for guide about 300 student at the school to learn about the United nations and its model. I was head for arraging the conference of our school under supervision of politics and social studies teachers. Every one in the role of its country hae make it turn and it was freely right.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> September 2023 - 2025 </span>
<h3>Head of Graphic design <br> <a href="https://linktr.ee/StudentActivitiesFamily">Student Activities Family</a></h3>
<p style="text-align: justify;">SAF Team help students to find good opportunities to improve their skills in different branches in various ages. I have design +70 graphics and lead committee with +10 designers each one with more than 100 designs along complete season of the team, this the <a href="https://drive.google.com/file/d/1WvOAE6NFgodXzBslFoJJ8wp-dNyGAT-B/view?usp=sharing">certificate.</a></p>
</div>
</div>
<div class="box">
<div class="content">
<span> June 2024 - October 2024 </span>
<h3>Mentor - <a href="https://drive.google.com/file/d/1JUylSE7wATsvjjFg8iXS5fcOn9UwiXVk/view?usp=drive_link">SAF Techno Camp</a> </h3>
<p style="text-align: justify;">In my role as a mentor of web development at SAF Techno Camp, I empowered budding tech enthusiasts to master the art of creating captivating websites. Through personalized guidance and hands-on training, I cultivated their skills in HTML, CSS, JavaScript, and beyond, nurturing a new generation of skilled web developers poised for success in the digital realm. These mentorship hours for more than 15 hours and about 30 scholars. </p>
</div>
</div>
<div class="box">
<div class="content">
<span> 2024 - 2025 </span>
<h3>Chief Technology Officer <br> <a href="https://iynaismailia.github.io/Issue_1/index.html">IYNA Ismailia Chapter</a></h3>
<p style="text-align: justify;">As head of web development committee for the first season of IYNA Ismailia Chapter, I was responsible for create this website in less than one weak before the start of the season then after the start of season and hiring of new members we can get the website ready for publish articles on it.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> April 2024 - Septemper 2024 </span>
<h3>Former Presidant - Technical head <br><a href="https://inspire-club.github.io/Inspire/index.html">Inspire Club</a> </h3>
<p style="text-align: justify;">As I like writing and i have worked as web develper I start to create club in all STEM schools in Egypt under supervision of teachers from my school for writing and publish, which somehting like magazine and we collect many writings and publish it on the website I have programmed it.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> August 2024 - November 2024 </span>
<h3>Researcher <br><a href="https://drive.google.com/file/d/1P81iVp2eKu02dvWWAAlqQun86Bbf-6yX/view?usp=sharing">Minerva Accelerators Assosiation</a> </h3>
<p style="text-align: justify;">As a researcher in the Minerva Accelerators Program, I delved into cutting-edge technologies, exploring innovative solutions to complex problems. Collaborating with top minds, I conducted in-depth analyses, proposed novel ideas, and contributed to groundbreaking projects that pushed the boundaries of knowledge and advanced the frontiers of science and technology.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> 31 August 2024 - 6 November 2024 </span>
<h3>Scholar Researcher <br><a href="https://app.moonshotpirates.com/?v=main">Launchpad - Moonshot Pirate</a> </h3>
<p style="text-align: justify;">As a researcher in the Launchpad Program, my research paper about Asthma Inspector project which is application of IoT on Arduino to create complete system which can dedect the time of the asthma attack depending on some readings from sensors with high quality analysis by an AI model.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> August 2023 - August 2025 </span>
<h3>Scholar Researcher <br><a href="https://joinlaunchpad.com/#/profile/20598">Junior Academy</a> </h3>
<p style="text-align: justify;">The Junior Academy is a virtual program with mentors, research, and innovation challenges in science, technology, engineering, and math. It is quite a prestigious program - it is globally recognized and has an acceptance rate under 6%</p>
</div>
</div>
<div class="box">
<div class="content">
<span> August 2021 - April 2024 </span>
<h3> Entrepreneur <br><a href="https://drive.google.com/file/d/1isZlcDX9ADL3wybho8RNjtQggJ6L5NZK/view?usp=drive_link">Digital Egypt Cubs Initiative (DECI)</a> </h3>
<p style="text-align: justify;">I have won the 1st project for the L-1 2023 year. I am leader of team-x who win the first place in the L-1 competition in solving community problems. It is an amazing trial in this Initiative to learn widely about Machine Learning and AI.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> 2021 - 2024 </span>
<h3> Entrepreneur <br><a href="https://drive.google.com/file/d/1wORO7CfQX8EaLmcdLMagjwfKTS9QTRoi/view?usp=drive_link ">Arab African Youth University</a> </h3>
<p style="text-align: justify;">At this non-profit organization, I have particacpate and organise more than 30 events and fellowships about the leadership and soft skills for more than 3 years as best member.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> August 2022 - April 2023 </span>
<h3> Scholar <br><a href="https://drive.google.com/file/d/11mH0tuAtBIlBCh-4OaRdf0ZLOmlu_SKF/view?usp=drive_link">Google Africa Developers (GADS)</a> </h3>
<p style="text-align: justify;">The Google Africa Developer Scholarship (GADS) program sponsors aspiring developers in Africa to skill up with Pluralsight Skills, supported by the Google Developer community.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> Jul - August 2023 </span>
<h3> Scholar <br><a href="https://drive.google.com/file/d/1xsCJJy6KYp5fLT38JE92sGd7MIVi8LqC/view?usp=drive_link">FGS × CFA Summer Fellowship</a> </h3>
<p style="text-align: justify;">A college-readiness program for first-generation and/or low-income high school juniors. Launched in summer of 2021. A unique & innovative mentorship program consisting of 100+ college students and high school seniors, juniors, and sophomores.</p>
</div>
</div>
<div class="box">
<div class="content">
<span> August 2022 - April 2023 </span>
<h3> Journalist <br><a href="#">International Union of Arab Press</a> </h3>
<p style="text-align: justify;">I have published more than 50 journalistic articles, poems and prose in English, Arabic and German in the political, economic, social and psychological fields. I have do many interviews with many famous persons as scientists and artists.</p>
</div>
</div>
</div>
</section>
<!-- experience section ends -->
<!-- service section starts -->
<section class="service" id="service">
<h1 class="heading"> <span> my </span> research papers </h1>
<div class="box-container">
<div class="box">
<a href="https://drive.google.com/drive/folders/1JQzfKrlJQtXOPz1di9ibPwvYl8yAd032?usp=sharing"><h3>Passive Trap Dust Filter</h3></a>
</div>
<div class="box">
<a href="#"><h3>Irrigate Me</h3></a>
</div>
<div class="box">
<a href="#"><h3>Automatic Watering</h3></a>
</div>
<div class="box">
<a href="#"><h3>Galvanic Cell soil battery</h3></a>
</div>
<div class="box">
<a href="#"><h3>Asthma X</h3></a>
</div>
<div class="box">
<a href="#"><h3>VallyX Dam</h3></a>
</div>
</div>
</section>
<!-- service section ends -->
<!-- portfolio section starts -->
<section class="portfolio" id="portfolio">
<h1 class="heading"> <span> my </span> portfolio </h1>
<div class="box-container">
<div class="box">
<img src="images/1.png" alt="image1">
<h3> Climate Story Writers </h3>
<div class="icons">
<a href="https://inspire-club.github.io/NASA-Space-Apps-2025/Climate%20story%20tellers/stage/index.html" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/15.png" alt="">
<h3> Graphic design projects </h3>
<div class="icons">
<a href="https://www.behance.net/joamir10" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/2.png" alt="">
<h3> Gharbia Hack Club </h3>
<div class="icons">
<a href="https://hack-club-gh.github.io/Gharbia-Branch/" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/3.png" alt="">
<h3> IYNA Gharbia Branch </h3>
<div class="icons">
<a href="https://glory-dev.github.io/iyna-gharbiya-chapter/stage/" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/4.png" alt="">
<h3> Inspire Club </h3>
<div class="icons">
<a href="https://inspire-club.github.io/Inspire/index.html" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/5.png" alt="">
<h3> IYNA Ismailia Branch </h3>
<div class="icons">
<a href="https://iynaismailia.github.io/Issue_1/" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/6.png" alt="">
<h3> Smart Irrigator </h3>
<div class="icons">
<a href="https://github.com/joamir10/Smart_Irrigator" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/7.png" alt="">
<h3> XChess </h3>
<div class="icons">
<a href="https://github.com/joamir10/XChess" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/8.png" alt="">
<h3> Payton </h3>
<div class="icons">
<a href="https://github.com/joamir10/Payton" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/9.png" alt="">
<h3> Moon X </h3>
<div class="icons">
<a href="https://github.com/joamir10/Moon-X" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/10.png" alt="">
<h3> PSP.XY </h3>
<div class="icons">
<a href="https://github.com/joamir10/PSP.XY" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/11.png" alt="">
<h3> PSP.XY </h3>
<div class="icons">
<a href="https://github.com/joamir10/PSP.XY" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/12.png" alt="">
<h3> Canvas </h3>
<div class="icons">
<a href="https://github.com/joamir10/Canvas" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/13.png" alt="">
<h3> Counter </h3>
<div class="icons">
<a href="https://github.com/joamir10/Counter" class="fas fa-link"></a>
</div>
</div>
<div class="box">
<img src="images/14.png" alt="">
<h3> Movies Website </h3>
<div class="icons">
<a href="https://github.com/joamir10/Movies-Website" class="fas fa-link"></a>
</div>
</div>
</div>
</section>
<!-- portfolio section ends -->
<!-- contact section starts -->
<section class="contact" id="contact">
<h1 class="heading"> contact <span> me </span> </h1>
<div class="icons-container">
<div class="icons">
<i class="fas fa-envelope"></i>
<h3>my email</h3>
<p>alyousef9shamjk@gmail.com</p>
<p>yousef.1923048@stemgharbiya.moe.edu.eg</p>
</div>
<div class="icons">
<i class="fas fa-phone"></i>
<h3>my number</h3>
<p>+20 1147480732</p>
<p>+20 1091100547</p>
</div>
<div class="icons">
<i class="fas fa-map-marker-alt"></i>
<h3>my address</h3>
<p> Nasria, Sammanoud, Gharbiya, Egypt</p>
</div>
</div>
<div class="row">
<form action="">
<input type="text" placeholder="name" class="box">
<input type="email" placeholder="email" class="box">
<input type="number" placeholder="number" class="box">
<textarea name="" placeholder="message" id="" cols="30" rows="10"></textarea>
<input type="submit" class="btn" value="send message">
</form>
<iframe class="map" src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d2613.578840729184!2d31.243112366451815!3d30.93754744096264!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2seg!4v1734345083235!5m2!1sen!2seg" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
</section>
<!-- contact section ends -->
<!-- footer section -->
<footer class="footer"> created by <span> Yousef Shamsaldeen </span> | all rights reserved! </footer>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body>
</html>