-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathblog.html
401 lines (392 loc) · 24.2 KB
/
blog.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
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
<!DOCTYPE html>
<html>
<head>
<title>Stephanie Lampotang</title>
<meta charset="utf-8"/>
<link href="https://fonts.googleapis.com/css?family=Playfair+Display|Muli|Cardo" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="stephanies.css">
<link rel="icon" href="profilepic.png">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="app.js"></script>
</head>
<body style="margin: 0;">
<div class="locationBar">
<ul class="loc">
<a href="index.html">
<li class = "home">
<img src="home.png" alt = "HTML5 Icon" style="width:100%; height:100%;" onmouseover="change(this)" onmouseout="changeback(this)">
</li>
</a>
<a href="aboutme.html">
<li class = "over">
About
</li>
</a>
<a href="resume.html">
<li class = "over">
Résumé
</li>
</a>
<a href="technology.html">
<li class = "over">
Technology
</li>
</a>
<a href="hobbies.html">
<li class = "over">
Hobbies
</li>
</a>
<a href="blog.html">
<li class = "over" style="background-color: gray; color: white;">
Blog
</li>
</a>
<a href="https://www.pinterest.com/stephanielpt">
<li class = "right">
<img src="pinterest.png" alt = "HTML5 Icon" style="width:1.5rem; height:auto;"">
</li>
</a>
<a href="https://www.instagram.com/stephanielptx/">
<li class = "right">
<img src="instagram.png" alt = "HTML5 Icon" style="width:1.5rem; height:auto;">
</li>
</a>
<a href="https://open.spotify.com/user/12144182661/playlist/5mmf0abvIYDeUQOWHsyuEu">
<li class = "right">
<img src="spotify.png" alt = "HTML5 Icon" style="width:1.5rem; height:auto;">
</li>
</a>
<a href="contact.html">
<li class = "right">
<img src="emailme.png" alt = "HTML5 Icon" style="width:1.5rem; height:auto;">
</li>
</a>
<a href="https://www.linkedin.com/in/stephanie-lampotang-511473144/">
<li class = "right">
<img src="linkedin.png" alt = "HTML5 Icon" style="width:1.5rem; height:auto;">
</li>
</a>
<a href="https://github.com/Stephanielpt/">
<li class = "right">
<img src="github.png" alt = "HTML5 Icon" style="width:1.5rem; height:auto">
</li>
</a>
</ul>
</div>
<script type="text/javascript">
function change(homebutton)
{
homebutton.src='home2.png';
}
function changeback(homebutton)
{
homebutton.src='home.png';
}
</script>
<div class="profilepic" style="margin-top: 0rem; padding-top: 2rem;">
<img src="profilepic.png" alt="HTML5 Icon" style= "width:16%; height: auto; margin-right: 42%; margin-left: 42%; margin-top: 6rem; border-radius: 50%;">
</div>
<div class = "weAre">
<h1 style="margin-top: 0rem; padding-top: 4rem;">S T E P H A N I E    L A M P O T A N G</h1>
<h4>M u l t i p o t e n t i a l i t e</h4>
</div>
<div class= "one" style="align-content: center; width:29%; height: auto; padding: 0rem; margin: 1.8%; display: inline-block;" >
<a href = "#winter" style="text-decoration: none; color: black;">
<p style="text-align: center; ">Smelling the Roses This Winter</p>
<img class= "uno" src="preflower.jpg" alt="HTML5 Icon" style= "width:100%; height: auto; padding: 0rem; margin: 0rem;">
</a>
</div>
<div class= "two" style="align-content: center; width:29%; height: auto; padding: 0rem; margin: 1.8%; display: inline-block;">
<a href = "technology.html#fbu" style="text-decoration: none; color: black;">
<p style="text-align: center; ">Facebook University Summer 2018</p>
<img class= "dos" src="fbucrop.jpg" alt="HTML5 Icon" style= "width:100%; height: auto; padding: 0rem; margin: 0rem;">
</a>
</div>
<div class= "two" style="align-content: center; width:29%; height: auto; padding: 0rem; margin: 1.8%; display: inline-block;">
<a href = "#codey" style="text-decoration: none; color: black;">
<p style="text-align: center; ">Cracking the ASCII to My Heart</p>
<img class= "dos" src="precody2.jpg" alt="HTML5 Icon" style= "width:100%; height: auto; padding: 0rem; margin: 0rem;">
</a>
</div>
<div class= "six" style="align-content: center; width:29%; height: auto; padding: 0rem; margin: 1.8%; display: inline-block;" >
<a href = "#pinkblue" style="text-decoration: none; color: black;">
<p style="text-align: center;">Life in Color</p>
<img class= "sies" src="prepinkblue.jpg" alt="HTML5 Icon" style= "width:100%; height: auto; padding: 0rem; margin: 0rem;">
</a>
</div>
<div class= "three" style="align-content: center; width:29%; height: auto; padding: 0rem; margin: 1.8%; display: inline-block;">
<a href = "#aeropuerto" style="text-decoration: none; color: black;">
<p style="text-align: center; ">Why J'adore los Aeropuertos</p>
<img class= "tres" src="preaeropuerto.jpg" alt="HTML5 Icon" style= "width:100%; height: auto; padding: 0rem; margin: 0rem;">
</a>
</div>
<div class= "four" style="align-content: center; width:29%; height: auto; padding: 0rem; margin: 1.8%; display: inline-block;" >
<a href = "#escape" style="text-decoration: none; color: black;">
<p style="text-align: center;">Escape to Nature</p>
<img class= "cuatro" src="preheaven.jpg" alt="HTML5 Icon" style= "width:100%; height: auto; padding: 0rem; margin: 0rem;">
</a>
</div>
<!-- <div class="post">
<a id = 'winter'></a>
<h2>
REFLECTING   ON   ROLE   MODELS
</h2>
<img src="flower.png" alt="HTML5 Icon" style= "width:100%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>March 8, 2018</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
Happy International Womens Day everyone! I'd like to start by thanking all of the women in my life who inspire me to believe that I can be whatever I want to be every day.
</p>
<p style="text-indent: 2.5rem">
Not too long ago, I made the decision to follow in my older sister's footsteps and accept my place in the Facebook University Cohort of Summer 2018.
</p>
<p style="text-indent: 2.5rem">
Role model to me and others too
historical figures
kell
Rory Gilmore - early days - simplicity
Camila - fearlessness
more fictional characters
hermione - intelligence
unconformity
curiosity
style
kell - work ethic
- creativity
kindness
strength?
</p>
<p style="text-indent: 2.5rem">
Can I make a post about spring break too? Hm okay
- read 3 books
- learn JavaScript again lol
- exercise and play an instrument every day
- hydrate!!
</p>
</li>
</ul>
</div> -->
<div class="post">
<a id = 'fbu'></a>
<h2>
FACEBOOK  UNIVERSITY  SUMMER  2018
</h2>
<img src="FBU.png" alt="HTML5 Icon" style= "width:85%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>August 26, 2018</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
This summer I met the most inspiring and passionate people. Within my cohort, I made amazing new friends, and the joined forces with best teammates I could have asked for. Within the first three weeks, we ramped up from 0 to 100, and built three apps, just to learn some iOS basics. I went into those 3 weeks with no experience at all in Objective-C and I came out of them confident in my ability to build out any idea I had as an iOS app. For the rest of the summer, I worked in a team of 3 to develop a full-fledged app from start to finish. We chose everything from the big idea to each small feature, which was one of the coolest parts for me.
</p>
<p style="text-indent: 2.5rem">
In some ways, the summer felt like a 2 month long hackathon, and my team's final product was "Fetch." Fetch is a map-based, item-sharing app. It's practical and straighforward - it targets the pain-points of renting, but most importantly, it's something we had worked towards and devoted significant time to for 5 weeks. During that time, I was learning more than just technical iOS skills, I was also learning about how to organize a long term project. We created sprints, user stories, and git issues and branches for our project. They helped us work well as a team and stay focused on our goals. After 5 weeks of cranking out code, searching stackoverflow, and dabbling in design, we demoed "Fetch". First, to Denise Hernandez, our program's director, and later that day, we literally jumped for joy when learned that we were chosen to demo Fetch once more, but this time to Mark Zuckerberg!
</p>
<p style="text-indent: 2.5rem">
On my last day, it was so hard to say goodbye, but I knew I was walking away with new friends, new inspiration, and a new outlook that would stick with me long after the end of my internship. Thank you for the memories Facebook!
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'winter'></a>
<h2>
SMELLING  THE  ROSES  THIS  WINTER
</h2>
<img src="flower.png" alt="HTML5 Icon" style= "width:100%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>December 18, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
In the last three days, I've built the first screen of my first iOS app, started exploring the world of blockchain, and added new features - including Spotify embedded play buttons - to this website! Winter break started 5 days ago, but honestly, I don't think I've ever been more productive. Without the pressure of looming deadlines and time-driven projects, I've had time to truly focus on what I want.
</p>
<p style="text-indent: 2.5rem">
And the tech side of me isn't the only part that has been reinvigorated. I've also had time to enjoy some of my more creative hobbies. I've found my way back to piano, <a href = "hobbies.html#books">reading</a>, photography, yoga, and obviously writing. Sometimes, with deadline after deadline, I forget to reflect on where I am and whether I'm moving in the direction of my goals. This week I was lucky enough to reflect on my first semester of college as I wandered through rose gardens and museums for hours at a time.
</p>
<p style="text-indent: 2.5rem">
P.S. Note to self (and anyone who will lend an ear): Smell the roses. They make life so much sweeter.
</p>
<p style="text-indent: 2.5rem">
<iframe src="https://open.spotify.com/embed/track/3vv9phIu6Y1vX3jcqaGz5Z" width="300" height="80" frameborder="0" allowtransparency="true"></iframe>
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'pinkblue'></a>
<h2>
LIFE  IN  COLOR
</h2>
<img src="pinkblue.png" alt="HTML5 Icon" style= "width:85%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>October 15, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
Residential Art Night gave me a nice break from my school work of nearly all STEM courses :)
</p>
<p style="text-indent: 2.5rem">
But of course, afterwards I dove back into CS and finished up my Python web scraper. My code even matched my painting and made for a cute collage haha
</p>
<p style="text-indent: 2.5rem">
<iframe src="https://open.spotify.com/embed/track/2JDMJhjJmx2GtMz5HFSTim" width="300" height="80" frameborder="0" allowtransparency="true"></iframe>
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'la'></a>
<h2>
THE  CITY  OF  ANGELS
</h2>
<img src="LA.PNG" alt="HTML5 Icon" style= "width:85%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>August 14, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
My first week in LA - I got a taste of this diverse and energetic city, and now I can't wait to dig deeper.
</p>
<p style="text-indent: 2.5rem">
<b>Some food places I visited and highly recommend:</b><br/>- Sushi Enya<br/>- Bruxie<br/>- Chichen Itza<br/>- Full House Dim Sum<br/>- Salt and Straw<br/>- 85 Bakery<br/>- C&O Trattoria<br/>- Pokénometry<br/>- Urth Caffé<br/>- Hangari
</p>
<p style="text-indent: 2.5rem">
<b>Some sights I visited and highly recommend:</b> <br/>- Griffith Observatory (for the physics lovers)<br/>- Venice Beach (has more character than Santa Monica in my opinion)<br/>- Getty Villa (check out the sniffing game!)<br/>- Disney Concert Hall <br/>- Westside German Sheppard Shelter (ask for Virginia and Mila if they're still there)
</p>
<p style="text-indent: 2.5rem">
Here's to a great next four years!
</p>
<p style="text-indent: 2.5rem">
<iframe src="https://open.spotify.com/embed/track/4MV8yeKSsls4xev14yDXL6" width="300" height="80" frameborder="0" allowtransparency="true"></iframe>
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'codey'></a>
<h2>
CRACKING  THE  ASCII  TO  MY  HEART
</h2>
<img src="cody2.JPG" alt="HTML5 Icon" style= "width:85%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Technology</p>
<p>July 13, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
My experience with computer science could almost be a romance novel.
</p>
<p style="text-indent: 2.5rem">
It reads like this:
</p>
<p style="text-indent: 2.5rem">
If I was the new girl at school, then computer science was the sulky, badboy in the back of the classroom. Mysterious and intimidating, he seemed to only hang out with guys - what was up with that? Throughout the year I admired his logical progressions, but I never really got to know him because of our language barrier. I could speak English, French, and Spanish, but he only spoke Java.
</p>
<p style="text-indent: 2.5rem">
Flash-forward one year and call it fate! We met once again at a STEM summer camp and that was when our relationship truly developed. We were reintroduced, and I began to see computer science in a different light - it was the beginning of a beautiful relationship. He helped me pursue my passion for physics with computer models and even introduced me to Arduino boards. By the end of the summer program, I was head over heels in love. Needless to say, we weren't just a summer fling. Here I am today, coding in honor of our 1 year anniversary!
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'aeropuerto'></a>
<h2>
Why  j'adore  los  aeropuertos
</h2>
<img src="aeropuerto.JPG" alt="HTML5 Icon" style= "width:85%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>July 9, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
Airports do something truly amazing.
</p>
<p style="text-indent: 2.5rem">
They have the super power of being able to bring people together - regardless of where they live in the world.
</p>
<p style="text-indent: 2.5rem">
So it always struck me as such a shame that airports are so busy, and people, so focused on their destinations. Thousands of untold stories and unique ideas pass through the airports every day, each one thought-provoking, a story that you might tell to your own children one day. They are untapped inspiration.
</p>
<p style="text-indent: 2.5rem">
I love traveling solo and meeting new people with different world views, languages, and cultures. Regardless of whether the person in the seat next to me is a 4 year old French girl who likes to put socks on her hands, a retired computer science professor who now spends her time traveling the world, or a nervous man in his twenties headed off to give his first lecture, I always find that by the time I step off the plane my world is a little bigger than it was when I boarded. I challenge you to reach out the next time you find yourself in an airport! You never know what you might learn.
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'escape'></a>
<h2>
Escape  to  Nature
</h2>
<img src="heaven.jpg" alt="HTML5 Icon" style= "width:85%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>June 11, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
Today I woke up to the sound of waves on the shore and the sight of dolphins in the sea. Sound like heaven? It is, but it also goes by the name Cedar Key. It's where we go to escape to a day of scenic wildlife and fresh air in a tranquil town.
</p>
<p style="text-indent: 2.5rem">
Sometimes when we arrive, I get the sense that we've somehow traveled 20 years back in time. The wooden restaurants that balance on top of the ocean, the way that your can tell nature still rules this town, and the number of people who take the time to say hi while taking a stroll make Cedar Key a rare and priceless gem in a world full of urbanized and bustling cities.
</p>
<p style="text-indent: 2.5rem">
It is the type of town that can charm you into waking up at the crack of dawn with the promise of dolphins dancing less than 10 feet away - the type of town where you can order seafood and know that it was fished from the ocean that morning - the type of town that tempts you with afternoon naps on the dock and entrances you with blushing sunsets on the horizon.
</p>
</li>
</ul>
</div>
<div class="post">
<a id = 'grad'></a>
<h2>
Eastside  High  School  Graduation
</h2>
<img src="grad.jpg" alt="HTML5 Icon" style= "width:75%; height: auto; padding-bottom: 3rem;">
<ul>
<li class="options">
<p>Reflection</p>
<p>June 3, 2017</p>
</li>
<li class="descrip">
<p style="text-indent: 2.5rem">
Graduation was not built in a day.
</p>
<p style="text-indent: 2.5rem">
It was a long journey that I can’t fit into a single post, but I’ll tell you some things that made Eastside the best place for me these last 4 years.
</p>
<p style="text-indent: 2.5rem">
1. It was a rich experience where students were never afraid to chase their dreams or be unapologetically themselves. We were encouraged to take risks, reach out, and create community.
</p>
<p style="text-indent: 2.5rem">
2. Every student who chose Eastside knew the value of a well-rounded education and the benefit of being a “renaissance man/woman”. That’s why we learned a little philosophy in physics class, explored Michelangelo’s work in math class, did some cooking in chemistry class, and read about foreign affairs in French class. Our teachers inspired us to be multi-faceted learners, independent thinkers, and most importantly, global citizens.
</p>
<p style="text-indent: 2.5rem">
3. The IB program is not something you undergo alone. Your friends are the ones who will keep you sane and at the same time push you to become the best version of yourself. I know that realistically, I won’t be keeping all of my friends from high school, but I also know that the ones that I do keep will be forever, because we found ourselves with each other.
</p>
</li>
</ul>
</div>
<div style = "text-align: center">
<br/>
<p><i>You've reached the end of my blog! <br><br> To learn more about me, you can navigate my personal website using the location bar at the top of the page :) </i><br><br><br><br></p>
</div>
</body>
</html>