-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
276 lines (213 loc) · 11.9 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
<!DOCTYPE html>
<html>
<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">
<link rel="stylesheet" href="style.css">
<!-- Importing font awesome to use their accessible logos -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
crossorigin="anonymous"
referrerpolicy="no-referrer" />
<!-- Grabbing the JavaScript file -->
<script src="script.js"></script>
<title>Mingjun Zhang</title>
</head>
<body>
<!-- For making a navigation page -->
<nav>
<div class="left">
<a href="/">
<span>Mingjun Zhang</span>
</a>
</div>
<div class="middle">
<span><h4>Display mode</h4></span>
<div class="btn">
<input type="checkbox" id="darkModeButton">
</div>
</div>
<div class="right">
<a href="https://github.com/mzhang9622" target="_blank" rel="noopener norereferrer">
<i class="fa-brands fa-square-github"></i>
<span>Github</span>
</a>
<a href="https://www.linkedin.com/in/ming-zhang-685596251/" target="_blank" rel="noopener norereferrer">
<i class="fa-brands fa-linkedin"></i>
<span>Linkedin</span>
</a>
<a href="mailto:[email protected]" target="_blank" rel="noopener norereferrer">
<i class="fa-regular fa-envelope"></i>
<span>Email</span>
</a>
</div>
</nav>
<main>
<!-- self -->
<section class="self">
<div class="text">
<h2>Hi there! I'm Ming 👋</h2>
<p>
I am an aspiring Software Engineer with a great interest in Game Design and Development.
Enrolled in Colby College, working on a Major in Computer Science and Minors in Mathematics and Japanese.
Currently taking a course on Software Engineering and Databases to improve myself as a programmer and explore greater heights.
</p>
<p2>
<h4>In progress:</h4>
<ul>
<li>
JLPT Exam (Japanese-Language Proficiency Test) N2-level: <strong>December 1st, 2024</strong>
</li>
<li>
Learning Unity and RPGMaker.
</li>
<li>
MySQL (ongoing).
</li>
</ul>
</p2>
<div id="links" class="links">
<a id="skillButton" href="#skills">
<i class="fa-solid fa-code"></i>
<span>Skills</span>
</a>
<a id="projectButton" href="#project">
<i class="fa-solid fa-file"></i>
<span>Projects</span>
</a>
<a id="experienceButton" href="#experience">
<i class="fa-solid fa-lightbulb"></i>
<span>Experience</span>
</a>
<a id="contactButton" href="#contact">
<i class="fa-regular fa-envelope"></i>
<span>Contact</span>
</a>
</div>
</div>
<div class="portrait">
<img src="images/ming-headshot_25.webp" alt="Mingjun Zhang">
</div>
</section>
<!-- Skills -->
<section id="skills" class="skills">
<h2>Skills</h2>
<p><em>Just a normal sword slash won't slay any dragons...</em></p>
<div class="text">
<ul>
<h3>Frontend Development</h3>
<!-- remember to grab some logos -->
<li><i class="fa-brands fa-html5"></i> HTML 5</li>
<li><i class="fa-brands fa-css3-alt"></i> CSS</li>
<li><i class="fa-brands fa-js"></i> JavaScript</li>
</ul>
<ul>
<h3>Backend Development</h3>
<li><i class="fa-brands fa-python"></i> Python</li>
<li><i class="fa-brands fa-java"></i> Java</li>
<li>C++</li>
</ul>
<ul>
<h3>Database</h3>
<li><i class="fa-solid fa-database"></i> MySQL</li>
</ul>
<ul>
<h3>Other Randoms</h3>
<li><i class="fa-brands fa-unity"></i> Unity (Currently learning)</li>
<li><i class="fa-solid fa-gamepad"></i> RPGMaker (Currently learning)</li>
</ul>
</div>
</section>
<!-- Projects -->
<section id="project" class="project">
<h2>Projects</h2>
<p><em>The main events are what makes the adventures exciting!</em></p>
<div class="project-chicken">
<div class="content">
<h4>Project Chicken</h4>
This amateur game was done with the Python Turtle as my first official project.
The player plays as a chicken (with sprite borrowed from ConcernApe), to attack the slimes and level up.
If the player's attack is less than the slime's hp, they will lose and launch a lose screen. To win, they must keep fighting the slimes until they reach max level.
</div>
<img class="img" src="images/cs151project.webp">
</div>
<div class="tiktaktoe">
<div class="content">
<h4>Tiktaktoe</h4>
After learning a bit of C++, I made a Tiktaktoe game that allows 2 players to input values from 1-9 to determine their placements.
Also a very amateur project, but demonstrates the foundation of C++.
</div>
<img class="img" src="images/tiktaktoe1.webp">
<img class="img" src="images/tiktaktoe2.webp">
</div>
<div class="blackjack">
<div class="content">
<h4>Blackjack</h4>
This Java project simulates games of Blackjacks and aims to analyze rates of playerwin, dealerwin, and draw.
Player and dealer has a hit number, such that if their cards do not add up to more than that number, they keeping hitting.
This number is adjustable, which allows the analysis of the win rates with different given hitnumbers.
</div>
<img class="img" src="images/blackjack1.webp">
</div>
<div class="blackjack2">
<img class="img" src="images/blackjack2.webp" style="float: right">
</div>
<div class="sudoku">
<div class="content">
<h4>Sudoku</h4>
Another project written in Java that solves a given Sudoku problem. It uses a Depth-First-Search algorithm that traverses through all possible solutions and backtracks solutions if no numbers work.
For solvable solutions, it will eventually solve the puzzle. However, it will run endlessly if a puzzle without a solution is given.
</div>
<img class="img" src="images/sudoku.webp">
</div>
</section>
<!-- Experience -->
<section id="experience" class="experience">
<h2>Experience <del class="level">Points</del></h2>
<p><em>We all need some way of leveling up.</em></p>
<div class="ta">
<h3>Computer Science Teaching Assistant: Colby College</h3>
<p>Teaching Assistant for the course CS231: Data Structures and Algorithms. The job allowed me to tutor students who had issues with their projects.
There were also times where collaborations between other TAs were done to solve difficult bugs</p>
</div>
<div class="research">
<h3>Computer Science Research Assistant: Colby College</h3>
<p>During a JanPlan course (January-term courses offered at Colby College) I was a research assistant for Professor Max Bender along with three other assistants.
The research was about the classic graph-based game: Cops and Robbers. The students were responsible for developing an algorithm that determined whether a graph is cop-win or cop-lose.
Throughout the research, many definitions, theorems, and lemmas were defined. The results are unofficially written.
Click to teleport -> <a href="https://github.com/mzhang9622/CopsAndRobbers" target="_blank">Cops and Robbers</a>
</p>
</div>
</section>
<!-- Contact -->
<section id="contact" class="contact">
<h2>Contact me!</h2>
<p><em>Everyone needs companions on the way</em></p>
<div class="group">
<div class="text">
<p>
If somehow you decide to contact me, the form on the right is for you to use!
Oh, and it's dangerous to go alone, take this staff!
</p>
<img src="images/staff.webp" style="float: left">
</div>
<form action="https://api.web3forms.com/submit" method="POST">
<input type="hidden" name="access_key" value="3b7becb6-2448-409d-aa53-6e9e1d99a885">
<label for="name">Name</label>
<input type="text" id="name" name="name" placeholder="Your Name" class="contact-inputs" required>
<label for="name">Email</label>
<input type="email" id="email" name="email" placeholder="[email protected]" class="contact-inputs" required>
<label for="message">Message</label>
<textarea id="message" name="message" class="contact-inputs" placeholder="Type something!" cols="30" rows="10" required></textarea>
<button id="submitButton" type="submit">Send Message</button>
</form>
</div>
</section>
</main>
</body>
<!-- makes the copyright bar -->
<footer>
<p>© <span id="year"></span> Mingjun Zhang. All rights reserved.</p>
</footer>
</html>