Mercurial

comparison mrjunejune/test/snapshots/root.snapshot @ 94:092afa595764

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[MrJuneJune] Added Integration tests.
author June Park <parkjune1995@gmail.com>
date Fri, 02 Jan 2026 18:13:32 -0800
parents 6626ec933933
children 1c446ab6f945
comparison
equal deleted inserted replaced
93:be91a73d801a 94:092afa595764
1 HTTP/1.1 200 OK 1 HTTP/1.1 200 OK
2 Content-Type: text/html; charset=utf-8 2 Content-Type: text/html
3 Content-Length: 12120 3 Content-Length: 5322
4 Connection: close 4 Connection: close
5 5
6 <!doctype html> 6 <!doctype html>
7 <html lang="en"> 7 <html lang="en">
8 <head> 8 <head>
9 <BaseHead title="Resume" description="June's resume" /> 9 <title> MrJuneJune </title>
10 <link rel="stylesheet" href="base.css" /> 10 <link rel="icon" type="image/svg+xml" href="/public/epi_all_colors.svg">
11 <link rel="stylesheet" href="resume.css" /> 11
12 <link rel="preload" href="/public/fonts/Roboto-Regular.ttf" as="font" crossorigin>
13 <link rel="preload" href="/public/fonts/Roboto-Thin.ttf"as="font" crossorigin>
14
15 <link rel="preload" href="/public/fonts/atkinson-regular.woff" as="font" type="font/woff" crossorigin>
16 <link rel="preload" href="/public/fonts/atkinson-bold.woff" as="font" type="font/woff" crossorigin>
17
18 <link rel="preload" href="/public/fonts/more-sugar.extras.otf" as="font" type="font/otf" crossorigin>
19 <link rel="preload" href="/public/fonts/more-sugar.regular.otf" as="font" type="font/otf" crossorigin>
20 <link rel="preload" href="/public/fonts/more-sugar.thin.otf" as="font" type="font/otf" crossorigin>
21
22 <link rel="preload" href="/base.css" as="style" />
23 <link rel="stylesheet" href="/base.css" />
24
25
26 <style>
27 .epi-photo {
28 display: flex;
29 justify-content: center;
30 margin-bottom: 10px;
31 }
32 </style>
12 </head> 33 </head>
13 <body> 34 <body>
35 <style>
36 :root {
37 --header-background: var(--white);
38 --header-color: rgb(var(--black));
39 --link-hover-accent: var(--awesome);
40 }
41
42 /* Fixed icon in top left corner */
43 #themeToggle {
44 position: fixed;
45 top: 20px;
46 left: 20px;
47 background: var(--header-background);
48 display: flex;
49 align-items: center;
50 border-radius: 50%;
51 cursor: pointer;
52 z-index: 1000;
53 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
54 transition: transform 0.2s ease;
55 }
56
57 #themeToggle:hover {
58 transform: scale(1.05);
59 }
60
61 /* Professional header */
62 header {
63 margin: auto;
64 padding: 1.5em 1em;
65 font-family: "More", sans-serif;
66 box-shadow: 0 2px 8px rgba(var(--black), 5%);
67 width: 720px;
68 max-width: calc(100% - 2em);
69 text-align: center;
70 }
71
72 header h1 {
73 margin: 0;
74 font-size: 1.8em;
75 font-weight: 700;
76 letter-spacing: -0.5px;
77 }
78
79 header h1 a {
80 text-decoration: none;
81 color: var(--header-color);
82 }
83
84 header h1 a::before {
85 display: none;
86 }
87
88 /* Mobile responsiveness */
89 @media (max-width: 720px) {
90 #themeToggle {
91 top: 15px;
92 left: 15px;
93 }
94
95 header {
96 padding: 1em;
97 }
98
99 header h1 {
100 font-size: 1.5em;
101 }
102 }
103
104 @media (max-width: 480px) {
105 #themeToggle {
106 top: 10px;
107 left: 10px;
108 }
109
110 #themeToggle img {
111 height: 40px;
112 width: 40px;
113 }
114
115 header h1 {
116 font-size: 1.3em;
117 }
118 }
119
120 #logo {
121 width: 300px;
122 }
123
124 /* 1. DEFINE THE DEFAULTS (Light Mode) */
125 :root {
126 --logo-invert: invert(0);
127 --epi-grayscale: grayscale(0) brightness(1);
128 }
129
130 /* 2. MANUAL DARK OVERRIDE */
131 html.dark {
132 --logo-invert: invert(1);
133 --epi-grayscale: grayscale(1);
134 }
135
136 /* 3. MANUAL LIGHT OVERRIDE */
137 html.light-mode {
138 --logo-invert: invert(0);
139 --epi-grayscale: brightness(2.9) grayscale(1);
140 }
141
142 /* 4. SYSTEM PREFERENCE */
143 @media (prefers-color-scheme: dark) {
144 :root:not(.light-mode) {
145 --logo-invert: invert(1);
146 }
147 }
148
149 /* 5. APPLY TO ELEMENTS */
150 #logo {
151 -webkit-filter: var(--logo-invert);
152 filter: var(--logo-invert);
153 transition: filter 0.3s ease;
154 }
155
156 .epi-logo {
157 -webkit-filter: var(--epi-grayscale);
158 filter: var(--epi-grayscale);
159 transition: filter 0.3s ease;
160 }
161 </style>
162
163 <div id="themeToggle">
164 <img id="epiChan" class="epi-logo" aria-label="Toggle dark mode" src="/public/epi_all_colors.svg" height="50" width="50">
165 </div>
166
167 <header>
168 <h1><a href="/">MrJuneJune</a></h1>
169 </header>
170 <script src="/index.js"></script>
171
172
14 <main> 173 <main>
15 <div> 174 <p>Hi, my name is Juntae, but most people call me June or MrJuneJune.</p>
16 <p>Hi, my name is Juntae, but most people call me <b>June</b>.</p> 175
17 <p>I am a software engineer with experience spanning a wide range of companies, from small startups to FAANG. </p> 176 <p>I am a software engineer with experience spanning a wide range of companies, from small startups to FAANGs....</p>
18 <p>Feel free to check out my <a href="/resume.pdf"> resume </a> below, and if you're interested, don’t hesitate to contact me for contract work ranging from web/app development to embedded programming.</p> 177 <p>I know it is lame to work for them, but I have a dog so I need to put foods on my table.</p>
178
179 <div class="epi-photo">
180 <img id="currentPhoto" style="opacity: 0; transition: opacity 0.2s;" />
19 </div> 181 </div>
20 <div class="info"> 182
21 <p><span class="header-firstname-style"> JUNTAE </span><span class="header-lastname-style">PARK</span><p> 183 <p>During my free time, I like to write codes mostly in C, Python, and Typescript. All in mono repo styles using mercurial and bazel. (I know that is mentally ill...)</p>
22 <p class="header-position-style"> FULL STACK DEVELOPER · SOFTWARE ENGINEER </p> 184 <p>Feel free to check it out. My bad code..</p>
23 <div class="header-address-style"> 185
24 Bay Area, CA, USA 186 <h2>Links</h2>
25 </div> 187 <ul>
26 <div class="header-social-style"> 188 <li><a href="https://zenbu.babocoder.com/file/tip">Repository</a> - Check out my monorepo code</li>
27 <p>📱(US) 650-531-1728 |📱(CA) 437-580-8026 | <a href="mailto:[email protected]"> ✉️ [email protected] </a>| <a href="https://github.com/mrjunejune"> 189 <li><a href="/resume">Resume</a> - My professional experiences </li>
28 <svg viewBox="0 0 16 16" aria-hidden="true" width="12" height="12"> 190 <li><a href="/tools">Tools</a> - Tools </li>
29 <path 191 <!-- <li><a href="/blogs">Blogs</a> - Personal Blogs where I rant </li> -->
30 fill="currentColor" 192 </ul>
31 d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"
32 ></path>
33 </svg> mrjunejune
34 </a>| <a href="https://www.linkedin.com/in/junepark">
35 <svg width="12" height="12" fill="currentColor" class="bi bi-linkedin" viewBox="0 0 16 16">
36 <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"/>
37 </svg>
38 junepark
39 </a>
40 </p>
41 </div>
42 </div>
43
44 <div class="sub-header">
45 <h2 class="section-style"> Summary </h2>
46 <div class="line"></div>
47 </div>
48 <p class="paragraph-style">Software Engineer with 8 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. Open to impactful work.</p>
49 <div class="sub-header">
50
51 <h2 class="section-style"> Skills </h2>
52 <div class="line"></div>
53 </div>
54 <div class="paragraph-style">
55 <p>
56 <span class="entry-title-style"> Programming Languages:</span>
57 <span class="skill-type-style"> TypeScript, Python, C++/C, Ruby, Java, MATLAB </span>
58 </p>
59 <p>
60 <span class="entry-title-style">Tools & Platforms:</span>
61 <span class="skill-type-style">Bazel, PostgresSQL, Mercurial, Git, Pands, Raylib, XCode</span>
62 </p>
63 <p>
64 <span class="entry-title-style"> Web Frameworks: </span>
65 <span class="skill-type-style"> Django, Rails, React, Flask</span>
66 </p>
67 <p>
68 <span class="entry-title-style"> DevOp:</span>
69 <span class="skill-type-style"> Plummi, Heroku, DigitalOcean, AWS, Google Cloud </span>
70 </p>
71 <p>
72 <span class="entry-title-style"> Language:</span>
73 <span class="skill-type-style"> English, Korean, Japanese </span>
74 </p>
75 </div>
76
77 <!-- Experiences -->
78 <div class="sub-header">
79 <h2 class="section-style"> Experience </h2>
80 <div class="line"></div>
81 </div>
82 <div class="flex-box">
83 <p class="entry-title-style">
84 <a href="https://www.meta.com/">Meta</a>
85 </p>
86 <p class="entry-location-style">San Francisco, CA, USA</p>
87 </div>
88 <div class="flex-box">
89 <p class="entry-position-style">SOFTWARE ENGINEER</p>
90 <p class="entry-date-style">Oct, 2024 - Present</p>
91 </div>
92 <ul class="description-style">
93 <li>
94 Took initiative on Channel Value Rule, targeting the 16% of ad traffic with both app and web destinations to improve value attribution and ROI.
95 </li>
96 <li>
97 Built full-stack features using React and Hack/GraphQL, contributing to scalable, production-ready systems.
98 </li>
99 <li>
100 Partnered with data science to design A/B tests and analyze revenue impact of ads destination.
101 </li>
102 <li>
103 Proposed and implemented alpha improvements to internal testing infrastructure, reducing test time by 50% and enhancing developer velocity.
104 </li>
105 </ul>
106 <div class="flex-box">
107 <p class="entry-title-style">
108 <a href="https://www.wmg.com/">Warner Music Group</a>
109 </p>
110 <p class="entry-location-style">Toronto, ON, Canada</p>
111 </div>
112 <div class="flex-box">
113 <p class="entry-position-style">TECHNICAL LEAD ENGINEER</p>
114 <p class="entry-date-style">July, 2023 - Sept, 2024</p>
115 </div>
116 <ul class="description-style">
117 <li>
118 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
119 </li>
120 <li>
121 TypeScript testing and code structures.
122 </li>
123 <li>
124 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.
125 </li>
126 <li>
127 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.
128 </li>
129 <li>
130 Developed CI/CD pipelines for backend structures.
131 </li>
132 <li>
133 Designed infrastructure for pub/sub, caching, and media processing logic.
134 </li>
135 </ul>
136
137 <div class="flex-box">
138 <p class="entry-title-style">
139 <a href="https://www.google.com/">Google</a>
140 </p>
141 <p class="entry-location-style">Toronto, ON, Canada</p>
142 </div>
143 <div class="flex-box">
144 <p class="entry-position-style">SOFTWARE ENGINEER</p>
145 <p class="entry-date-style">Feb, 2022 - July 2023</p>
146 </div>
147 <ul class="description-style">
148 <li>
149 Implements and maintained new features relating to App Script across google workspace platform including Gmail, sheets, and Docs.</li>
150 <li>
151 Improved a response time and render time of App Script hover card components.</li>
152 <li>
153 Collaborated with a team of developers to ensure timely and accurate delivery of features.</li>
154 <li>
155 Conducted user testing and gathered feedback to iterate on features for optimal user experience.</li>
156 </ul>
157
158 <div class="flex-box">
159 <p class="entry-title-style">
160 <a href="https://www.everlywell.com/">Everlywell</a>
161 </p>
162 <p class="entry-location-style">Toronto, ON, Canada</p>
163 </div>
164 <div class="flex-box">
165 <p class="entry-position-style">SOFTWARE ENGINEER</p>
166 <p class="entry-date-style">December, 2020 - Jan, 2022</p>
167 </div>
168 <ul class="description-style">
169 <li>
170 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>
171 <li>
172 Implemented a script that helps accurately access and refund unused covid test kits; helping company save up to 200,000 USD.</li>
173 <li>
174 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>
175 <li>
176 Implemented an audit table to help debug problems and logged which process was responsible for the change of the record using PaperTrail gems</li>
177 </ul>
178
179 <div class="flex-box">
180 <p class="entry-title-style">
181 <a href="https://www.spiria.com/">Spiria</a>
182 </p>
183 <p class="entry-location-style">Oakville, ON, Canada</p>
184 </div>
185 <div class="flex-box">
186 <p class="entry-position-style">SOFTWARE ENGINEER</p>
187 <p class="entry-date-style">October, 2018 - October, 2020</p>
188 </div>
189 <ul class="description-style">
190 <li>
191 Constructed RESTful API endpoints in multiple different frameworks such as Django, Ruby on Rails, and Flask and automated API documentation process using swagger.
192 </li>
193 <li>
194 Designed custom rake tasks for importing production data into newly updated data structure to meet client's needs.
195 </li>
196 <li>
197 Maintained or updated staging/productions servers. Debugged problems in production postgres database using ssh and postgres console on Heroku or AWS servers
198 </li>
199 <li>
200 Collaborated in creating automation python scripts for websites and application using selenium covering for QA eliminating 80% of QA's manual work
201 </li>
202 </ul>
203
204 <div class="flex-box">
205 <p class="entry-title-style">
206 <a href="https://www.apexscore.ai/">Apex Score</a>
207 </p>
208 <p class="entry-location-style">Oakville, ON, Canada</p>
209 </div>
210 <div class="flex-box">
211 <p class="entry-position-style">SOFTWARE ENGINEER</p>
212 <p class="entry-date-style">September, 2019 - October, 2020</p>
213 </div>
214 <ul class="description-style">
215 <li>
216 Developed custom Shapley value regression model to calculate importance of independent variables of data sets using sklearn, pandas, and numpy.
217 </li>
218 <li>
219 Created custom image uploader to Amazon s3 bucket using boto3 library.
220 </li>
221 <li>
222 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.
223 </li>
224 <li>
225 Created an interactive graph using D3.js in Vue.js with data from Flask backend API.
226 </li>
227 </ul>
228
229 <div class="sub-header">
230 <h2 class="section-style"> Education </h2>
231 <div class="line"></div>
232 </div>
233 <div class="flex-box">
234 <p class="entry-title-style">
235 University of British Columbia
236 </p>
237 <p class="entry-location-style">Kelowna, British Columbia</p>
238 </div>
239 <div class="flex-box">
240 <p class="entry-position-style">BACHELOR OF SCIENCE IN PHYSICS</p>
241 <p class="entry-date-style">2014 - 2018</p>
242 </div>
243 </main> 193 </main>
194 <div style="display: flex; align-items: center; justify-content: center; margin: 30px 0px;">
195 <small>&copy; 2026 June Park</small>
196 </div>
197
244 </body> 198 </body>
199 <script>
200 let arr = Array.from({ length: 18 }, (_, i) => i+1);
201 function setRandomImages() {
202 const randomIndex = Math.floor(Math.random() * arr.length);
203 const pos = arr[randomIndex];
204 currentPhoto.src = `/public/epi-photos/webp/${pos}.webp`;
205 currentPhoto.onload = () => {
206 currentPhoto.style.opacity = "1";
207 };
208 setTimeout(() => setRandomImages(), 1000);
209 }
210 setRandomImages();
211 </script>
245 </html> 212 </html>