Mercurial

comparison mrjunejune/test/snapshots/tools_markdown_to_html_index.html.snapshot @ 184:8c74204fd362

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[MD to HTML] Updated so it can be used through readme to html
author MrJuneJune <me@mrjunejune.com>
date Fri, 23 Jan 2026 22:20:35 -0800
parents 7eb79fd91c7e
children
comparison
equal deleted inserted replaced
183:a8976a008a9d 184:8c74204fd362
1 blic/fonts/more-sugar.extras.otf" as="font" type="font/otf" crossorigin> -->
2 <link rel="preload" href="/public/fonts/more-sugar.regular.otf" as="font" type="font/otf" crossorigin>
3 <link rel="preload" href="/public/fonts/more-sugar.thin.otf" as="font" type="font/otf" crossorigin>
4 <link rel="preload" href="/public/epi_all_colors.svg" as="image">
5
6 <link rel="preload" href="/base.css" as="style" />
7 <link rel="stylesheet" href="/base.css" />
8
9
10 <link rel="preload" href="resume.css" as="style" />
11 <link rel="stylesheet" href="resume.css" />
12 </head>
13 <body>
14 <style>
15 :root {
16 --header-background: var(--white);
17 --header-color: rgb(var(--black));
18 --link-hover-accent: var(--awesome);
19 }
20
21 /* Fixed icon in top left corner */
22 #themeToggle {
23 position: fixed;
24 top: 20px;
25 left: 20px;
26 background: var(--header-background);
27 display: flex;
28 align-items: center;
29 border-radius: 50%;
30 cursor: pointer;
31 z-index: 1000;
32 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
33 transition: transform 0.2s ease;
34 }
35
36 #themeToggle:hover {
37 transform: scale(1.05);
38 }
39
40 /* Professional header */
41 header {
42 margin: auto;
43 padding: 1.5em 1em;
44 font-family: "More", sans-serif;
45 box-shadow: 0 2px 8px rgba(var(--black), 5%);
46 width: 720px;
47 max-width: calc(100% - 2em);
48 text-align: center;
49 }
50
51 header h1 {
52 margin: 0;
53 font-size: 1.8em;
54 font-weight: 700;
55 letter-spacing: -0.5px;
56 }
57
58 header h1 a {
59 text-decoration: none;
60 color: var(--header-color);
61 }
62
63 header h1 a::before {
64 display: none;
65 }
66
67 /* Mobile responsiveness */
68 @media (max-width: 720px) {
69 #themeToggle {
70 top: 15px;
71 left: 15px;
72 }
73
74 header {
75 padding: 1em;
76 }
77
78 header h1 {
79 font-size: 1.5em;
80 }
81 }
82
83 @media (max-width: 480px) {
84 #themeToggle {
85 top: 10px;
86 left: 10px;
87 }
88
89 #themeToggle img {
90 height: 40px;
91 width: 40px;
92 }
93
94 header h1 {
95 font-size: 1.3em;
96 }
97 }
98
99 #logo {
100 width: 300px;
101 }
102
103 /* 1. DEFINE THE DEFAULTS (Light Mode) */
104 :root {
105 --logo-invert: invert(0);
106 --epi-grayscale: grayscale(0) brightness(1);
107 }
108
109 /* 2. MANUAL DARK OVERRIDE */
110 html.dark {
111 --logo-invert: invert(1);
112 --epi-grayscale: grayscale(1);
113 }
114
115 /* 3. MANUAL LIGHT OVERRIDE */
116 html.light-mode {
117 --logo-invert: invert(0);
118 --epi-grayscale: brightness(2.9) grayscale(1);
119 }
120
121 /* 4. SYSTEM PREFERENCE */
122 @media (prefers-color-scheme: dark) {
123 :root:not(.light-mode) {
124 --logo-invert: invert(1);
125 }
126 }
127
128 /* 5. APPLY TO ELEMENTS */
129 #logo {
130 -webkit-filter: var(--logo-invert);
131 filter: var(--logo-invert);
132 transition: filter 0.3s ease;
133 }
134
135 .epi-logo {
136 -webkit-filter: var(--epi-grayscale);
137 filter: var(--epi-grayscale);
138 transition: filter 0.3s ease;
139 }
140 </style>
141
142 <div id="themeToggle">
143 <img id="epiChan" class="epi-logo" aria-label="Toggle dark mode" src="/public/epi_all_colors.svg" height="50" width="50">
144 </div>
145
146 <header>
147 <h1><a href="/">MrJuneJune</a></h1>
148 </header>
149 <script src="/index.js"></script>
150
151
152 <main>
153 <div class="info">
154 <a href="/public/resume.pdf">Download PDF</a>
155 <hr>
156 <p><span class="header-firstname-style"> JUNTAE </span><span class="header-lastname-style">PARK</span><p>
157 <p class="header-position-style"> SOFTWARE ENGINEER </p>
158 <div class="header-address-style">
159 Bay Area, CA, USA
160 </div>
161 <div class="header-social-style">
162 <div>
163 <a href="tel:+016505311728">(US) 650-531-1728</a>
164 </div>
165 <div>
166 <a href="tel:+014375808026">(CA) 437-580-8026</a>
167 </div>
168 <div>
169 <a href="mailto:[email protected]">[email protected]</a>
170 </div>
171 <div>
172 <a href="https://www.linkedin.com/in/junepark"><svg width="12" height="12" fill="currentColor" class="bi bi-linkedin" viewBox="0 0 16 16">
173 <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z"/>
174 </svg> June Park
175 </a>
176 </div>
177 </div>
178 </div>
179
180 <div class="sub-header">
181 <h2 class="section-style"> Summary </h2>
182 <div class="line"></div>
183 </div>
184 <p class="paragraph-style">Software Engineer with 9 years of hands-on experience across diverse tech stacks, from early-stage startups to FANG-scale systems. Adept in designing and delivering robust software solutions using modern languages, frameworks, and cloud platforms. <br><br> Open to impactful work.</p>
185 <div class="sub-header">
186
187 <h2 class="section-style"> Skills </h2>
188 <div class="line"></div>
189 </div>
190 <div class="paragraph-style">
191 <p>
192 <span class="entry-title-style"> Programming Languages:</span>
193 <span class="skill-type-style"> TypeScript, Python, C/C++, Ruby, Java, MATLAB </span>
194 </p>
195 <p>
196 <span class="entry-title-style">Tools & Platforms:</span>
197 <span class="skill-type-style">Bazel, PostgresSQL, Mercurial, Git, Pands, Raylib, XCode</span>
198 </p>
199 <p>
200 <span class="entry-title-style"> Web Frameworks: </span>
201 <span class="skill-type-style"> Django, Rails, React, Flask</span>
202 </p>
203 <p>
204 <span class="entry-title-style"> DevOp:</span>
205 <span class="skill-type-style"> Plummi, Heroku, DigitalOcean, AWS, Google Cloud </span>
206 </p>
207 <p>
208 <span class="entry-title-style"> Language:</span>
209 <span class="skill-type-style"> English, Korean, Japanese </span>
210 </p>
211 </div>
212
213 <!-- Experiences -->
214 <div class="sub-header">
215 <h2 class="section-style"> Experience </h2>
216 <div class="line"></div>
217 </div>
218 <div class="flex-box">
219 <p class="entry-title-style">
220 <a href="https://www.meta.com/">Meta</a>
221 </p>
222 <p class="entry-location-style">San Francisco, CA, USA</p>
223 </div>
224 <div class="flex-box">
225 <p class="entry-position-style">SOFTWARE ENGINEER</p>
226 <p class="entry-date-style">Oct, 2024 - Present</p>
227 </div>
228 <ul class="description-style">
229 <li>
230 Took initiative on Channel Value Rule, targeting the 16% of ad traffic with both app and web destinations to improve value attribution and ROI.
231 </li>
232 <li>
233 Built full-stack features using React and Hack/GraphQL, contributing to scalable, production-ready systems.
234 </li>
235 <li>
236 Partnered with data science to design A/B tests and analyze revenue impact of ads destination.
237 </li>
238 <li>
239 Proposed and implemented alpha improvements to internal testing infrastructure, reducing test time by 50% and enhancing developer velocity.
240 </li>
241 </ul>
242 <div class="flex-box">
243 <p class="entry-title-style">
244 <a href="https://www.wmg.com/">Warner Music Group</a>
245 </p>
246 <p class="entry-location-style">Toronto, ON, Canada</p>
247 </div>
248 <div class="flex-box">
249 <p class="entry-position-style">TECHNICAL LEAD ENGINEER</p>
250 <p class="entry-date-style">July, 2023 - Sept, 2024</p>
251 </div>
252 <ul class="description-style">
253 <li>
254 Implements <a href="https://bazel.build/">bazel </a>structure for the company for TypeScript and JavaScript code base for hermiticity and stablishing standards for JavaScript and
255 </li>
256 <li>
257 TypeScript testing and code structures.
258 </li>
259 <li>
260 Led a team of five engineers in building GraphQL endpoints for client-facing applications using Apollo and AppSync, supporting over 2000 RPS and auto scaling depending on request values.
261 </li>
262 <li>
263 Improved application response times by up to 85% for graphQL response by updating database schema and SQL queries, eliminating N+1 queries and lack of indexes.
264 </li>
265 <li>
266 Developed CI/CD pipelines for backend structures.
267 </li>
268 <li>
269 Designed infrastructure for pub/sub, caching, and media processing logic.
270 </li>
271 </ul>
272
273 <div class="flex-box">
274 <p class="entry-title-style">
275 <a href="https://www.google.com/">Google</a>
276 </p>
277 <p class="entry-location-style">Toronto, ON, Canada</p>
278 </div>
279 <div class="flex-box">
280 <p class="entry-position-style">SOFTWARE ENGINEER</p>
281 <p class="entry-date-style">Feb, 2022 - July 2023</p>
282 </div>
283 <ul class="description-style">
284 <li>
285 Implements and maintained new features relating to App Script across google workspace platform including Gmail, sheets, and Docs.</li>
286 <li>
287 Improved a response time and render time of App Script hover card components.</li>
288 <li>
289 Collaborated with a team of developers to ensure timely and accurate delivery of features.</li>
290 <li>
291 Conducted user testing and gathered feedback to iterate on features for optimal user experience.</li>
292 </ul>
293
294 <div class="flex-box">
295 <p class="entry-title-style">
296 <a href="https://www.everlywell.com/">Everlywell</a>
297 </p>
298 <p class="entry-location-style">Toronto, ON, Canada</p>
299 </div>
300 <div class="flex-box">
301 <p class="entry-position-style">SOFTWARE ENGINEER</p>
302 <p class="entry-date-style">December, 2020 - Jan, 2022</p>
303 </div>
304 <ul class="description-style">
305 <li>
306 Maintained Amazon amplify apps to create and deploy React web applications for companies such as <a href="https://brooklynnets.everlywell.com/">NBA</a>, <a href="https://tinder.everlywell.com/">Tinder</a>, and other companies for COVID-19 at-home test kits.</li>
307 <li>
308 Implemented a script that helps accurately access and refund unused covid test kits; helping company save up to 200,000 USD.</li>
309 <li>
310 Created several Rails controllers for internal purposes; mocking end to end user experience for QA, mass refund features for CX department, and more, ultimately reducing support tickets amount by 50 percent.</li>
311 <li>
312 Implemented an audit table to help debug problems and logged which process was responsible for the change of the record using PaperTrail gems</li>
313 </ul>
314
315 <div class="flex-box">
316 <p class="entry-title-style">
317 <a href="https://www.spiria.com/">Spiria</a>
318 </p>
319 <p class="entry-location-style">Oakville, ON, Canada</p>
320 </div>
321 <div class="flex-box">
322 <p class="entry-position-style">SOFTWARE ENGINEER</p>
323 <p class="entry-date-style">October, 2018 - October, 2020</p>
324 </div>
325 <ul class="description-style">
326 <li>
327 Constructed RESTful API endpoints in multiple different frameworks such as Django, Ruby on Rails, and Flask and automated API documentation process using swagger.
328 </li>
329 <li>
330 Designed custom rake tasks for importing production data into newly updated data structure to meet client's needs.
331 </li>
332 <li>
333 Maintained or updated staging/productions servers. Debugged problems in production postgres database using ssh and postgres console on Heroku or AWS servers
334 </li>
335 <li>
336 Collaborated in creating automation python scripts for websites and application using selenium covering for QA eliminating 80% of QA's manual work
337 </li>
338 </ul>
339
340 <div class="flex-box">
341 <p class="entry-title-style">
342 <a href="https://www.apexscore.ai/">Apex Score</a>
343 </p>
344 <p class="entry-location-style">Oakville, ON, Canada</p>
345 </div>
346 <div class="flex-box">
347 <p class="entry-position-style">SOFTWARE ENGINEER</p>
348 <p class="entry-date-style">September, 2019 - October, 2020</p>
349 </div>
350 <ul class="description-style">
351 <li>
352 Developed custom Shapley value regression model to calculate importance of independent variables of data sets using sklearn, pandas, and numpy.
353 </li>
354 <li>
355 Created custom image uploader to Amazon s3 bucket using boto3 library.
356 </li>
357 <li>
358 Built RESTful API application using Flask framework and automated extensive API documentation pages using flask-restplus, pytest, and swagger, covering 95% of the code base.
359 </li>
360 <li>
361 Created an interactive graph using D3.js in Vue.js with data from Flask backend API.
362 </li>
363 </ul>
364
365 <div class="sub-header">
366 <h2 class="section-style"> Education </h2>
367 <div class="line"></div>
368 </div>
369 <div class="flex-box">
370 <p class="entry-title-style">
371 University of British Columbia
372 </p>
373 <p class="entry-location-style">Kelowna, British Columbia</p>
374 </div>
375 <div class="flex-box">
376 <p class="entry-position-style">BACHELOR OF SCIENCE IN PHYSICS</p>
377 <p class="entry-date-style">2014 - 2018</p>
378 </div>
379 <div id="footer"></div>
380 </main>
381 <div style="display: flex; align-items: center; justify-content: center; margin: 30px 0px;">
382 <small>&copy; 2026 June Park</small>
383 </div>
384
385 <script href="index.js"></script>
386 </body>
387 </htmlLocation: /tools/markdown_to_html
388