-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
95 lines (79 loc) · 6.4 KB
/
about.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
<!DOCTYPE html>
<html lang="en">
<head>
<title>About Me</title>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="index.js"></script>
<link rel="icon" type="image/x-icon" href="images/star.png">
</head>
<body onload="head(); dateTime(); foot();">
<header id="header" style="position:fixed;"></header>
<h1 class="title">About Me</h1>
<div class="text" style="font-size:1.5em;">
<div style="display:flex; align-items:center;">
<p>Hi! My name is Patrick Bian and I am a Grade 10 student at William Lyon Mackenzie CI. This is my portfolio built using HTML/CSS/JS for the ICS4U0 course, with Java tutorials demonstrating my learning. I am mainly a C++ programmer, but I am also efficient in Java and HTML/CSS/JS. Here is my <a style="color:white" href="https://dmoj.ca/user/patrickstar8166" target="_blank">DMOJ account</a> and my <a style="color:white" href="https://github.com/patrickstar8166" target="_blank">Github account</a>.</p>
<img src="images/me.jpg" style="float:right; width:25%; height:25%; margin-right:10%; margin-left:5%;">
</div>
<h2><br>My Interests</h2>
<p>In my free time, I enjoy playing piano, coding, math, and basketball. I started playing piano ever since I was 5 years old, and have been playing since. I recently got my ARCT diploma this past summer, the highest academic level in piano. Additionally, I do a lot of math outside of school, taking extracurricular classes and writing math contests. I also volunteer with a math organization to help kids in their mathematics journey. In addition to these, I also enjoy photography. Some of the pictures I took are below.</p>
</div>
<div style="display:flex; align-items:center; margin-left:12%;">
<img src="images/piano.jpg" style="float:left; width:15%; height:15%; margin-right:5px;">
<img src="images/lamp.jpg" style="float:left; width:15%; height:15%; margin-right:5px;">
<img src="images/sky.jpg" style="float:left; width:26.5%; height:26.5%; margin-right:5px;">
<img src="images/sea.jpeg" style="float:left; width:15%; height:15%; margin-right:5px;">
<img src="images/flower.jpg" style="float:left; width:15%; height:15%;">
</div>
<div class="text" style="font-size:1.5em;">
<h2><br>My Journey of Coding</h2>
<p>I started coding in Grade 9 with the ICS2DP course. This prompted me to learn more about computer science, and got into competitive programming at the start of Grade 10. I taught myself C++ using websites like Geeks for Geeks and lessons from our school coding club, MCPT. I achieved a lot in three short months. By the start of December 2022, I was able to do 12p problems on DMOJ and had a blue rating. <a style="color:white" href="https://dmoj.ca/problem/ccc18s3" target="_blank">This</a> is one of my favourite problems. Below is a picture of my solved DMOJ problems.</p>
</div>
<div style="display:flex; align-items:center; margin-left:13%;">
<img src="images/problems.png" style="float:left; width:47%; height:47%; margin-right:5px;">
<img src="images/cpp.jpeg" style="float:left; width:40%; height:40%;">
</div>
<div class="text" style="font-size:1.5em;">
<br>I recently started learning about web development, and I am a part of Metropolis, the school website. I taught myself the basics of HTML/CSS/JS in a week and made a small game, which is linked below. I recommend those starting out with web development to visit sites like <a style="color:white" href="https://www.w3schools.com/html/" target="_blank">W3 Schools</a>.</p>
<h2><br>My Projects</h2>
</div>
<div class="text">
<div style="display:flex;">
<div class="project">
<h3>Spotissey - Lyonhacks 2023</h3>
<h5>LyonHacks III 2nd Place — Spicing up your life with music around the world! Made with Leaflet interactive maps API and Spotify's Developer API.</h5>
<div class="link"><a class="hyperlink" href="https://github.com/patrickstar8166/Spodissey-Lyonhacks2023.git" target="_blank">Github Page</a></div>
</div>
<div class="project">
<h3>Amogus Aim Trainer - My First Project</h3>
<h5>A fun aim trainer game made with HTML/CSS/JS.</h5>
<div class="link"><a class="hyperlink" href="https://github.com/patrickstar8166/amogus-aim-trainer.git" target="_blank">Github Page</a></div>
<div class="link"><a class="hyperlink" href="https://patrickstar8166.github.io/amogus-aim-trainer/" target="_blank">Try it!</a></div>
</div>
</div>
<div style="display:flex;">
<div class="project">
<h3>Fresh Forage Adventure</h3>
<h5>Final project for ICS4U0 course. Foraging game made with Java.</h5>
<div class="link"><a class="hyperlink" href="https://github.com/patrickstar8166/ICS4U0-ISP.git" target="_blank">Github Page</a></div>
</div>
<div class="project">
<h3>ICS4U0 Portfolio</h3>
<h5>The webpage that you are on right now. Made with HTML/CSS/JS.</h5>
<div class="link"><a class="hyperlink" href="https://github.com/patrickstar8166/ICS4U-Portfolio.git" target="_blank">Github Page</a></div>
</div>
</div>
</div>
<div class="text" style="font-size:1.5em;">
<h2><br>My Future</h2>
<p>I have a keen interest in technology. In the future, I would like to pursue a career in AI and machine learning. With this in mind, I hope to be able to learn more about AI, and eventually make my own in the next two years of my high school career. I also enjoy business and I am a part of our school's DECA chapter. I also hope to be able to integrate business into my university life in the future.</p>
</div>
<div style="display:flex; align-items:center; width:50%; margin:auto;">
<img src="images/ai.jpeg" style="float:left; width:40%; height:40%; margin-right:20%;">
<img src="images/deca.jpeg" style="float:left; width:25%; height:25%;">
</div>
<div style="margin-bottom:3%;"></div>
<footer id="footer"></footer>
</body>
</html>