-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
426 lines (403 loc) · 17.8 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
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
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Chris Esquerra, Developer</title>
<link rel="icon" href="images/LogoIcon.png">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Fira+Sans|Monda" rel="stylesheet">
<link rel="stylesheet" href="css/site-style.css">
</head>
<body>
<!------------------------NAVIGATION ELEMENTS------------------------->
<nav class="navbar navbar-expand sticky-top navbar-dark bg-dark mx-0">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse sm-justify-content-center row-sm" id="navbarNavAltMarkup">
<div class="navbar-nav col-sm-2">
<a id="homeButton" class="nav-item nav-link active mx-auto" href="#">Home</a>
</div>
<div class="navbar-nav col-sm-2">
<a id="experienceButton" class="nav-item nav-link mx-auto" href="#">Experience</a>
<a id="smallExperienceButton" class="nav-item nav-link mx-auto" href="#">History</a>
</div>
<div class="navbar-nav col-sm-2">
<a id="skillsButton" class="nav-item nav-link mx-auto" href="#">Skills</a>
</div>
<div class="navbar-nav col-sm-2">
<a id="projectsButton" class="nav-item nav-link mx-auto" href="#">Projects</a>
</div>
<div class="navbar-nav col-sm-2">
<a id="resumeButton" class="nav-item nav-link mx-auto" href="#">Resumé</a>
</div>
<div class="navbar-nav col-sm-2">
<a id="contactButton" class="nav-item nav-link mx-auto" href="#">Contact</a>
</div>
</div>
</nav>
<div>
<img id="keyboard" src="images/keyboard.jpg">
</div>
<!------------------------------MY EVER PRESENT VISAGE---------------------------->
<div class="d-none d-lg-block">
<img id="headshot" src="images/Headshot2.jpeg">
</div>
<!------------------------------HOME CLASS CONTENT---------------------------->
<div class="container-fluid row">
<div class="card home bg-dark col-sm-11 d-lg-none" id="otherHeadshotBox">
<div class="card-body">
<p><img id="otherHeadshot" src="images/Headshot2.jpeg"></p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card home bg-dark col-sm-11 col-lg-6" id="homeName">
<div class="card-body">
<h4>Chris Esquerra</h4>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card home bg-dark col-sm-11 col-lg-6" id="homePar1">
<div class="card-body">
<h4>A software developer with background centered on over a decade of multidisciplinary
collaboration in the healthcare industry and experience working with critical production
services of financial institution software as well as application/database construction
in service of non-profit organizations.</h4>
</div>
</div>
<div class="card home bg-dark col-sm-11 col-lg-6" id="homePar2">
<div class="card-body">
<h4>I aim to take my experience as a marketer of ideas and and team member/supervisory skills
to new projects and organizations to achieve goals and create new customer experiences.</h4>
</div>
</div>
</div>
<!-------------------------EXPERIENCE CLASS CONTENT-------------------------->
<div class="container-fluid row">
<div class="card experience bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h3>USAA Via Apex Systems - Software/API Developer</h3>
<h4>San Antonio, Texas</h4>
</div>
<div class="card-body">
<h5>September 2019 - Present</h5>
<p>Monitor multiple services for USAA financial institution using bash scripts and java, as well
as proprietary systems to ensure incoming deposits and customer disputes are handled according to regulatory
requirements.</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card experience bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h3>Social Solutions - Associate Software Engineer</h3>
<h4>San Antonio, Texas</h4>
</div>
<div class="card-body">
<h5>December 2018 - July 2019</h5>
<p>Develop software solutions for non profit organizations to manage outcomes for education sector partners
using C# and React/Typescript for front and back end elements as necessary.</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card experience bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h3>Assistant Director of Family Maltreatment Services</h3>
<h4>Joint Base San Antonio, Texas</h4>
</div>
<div class="card-body">
<h5>March 2013 - May 2016</h5>
<p>Managed intervention and prevention services to over 60k beneficiaries in the Department of
Defense's largest family maltreatment program worldwide. Supervised and ensured educational currency of
35 geographically separated staff members
in accordance with federal and healthcare accreditation regulations by orchestrating or conducting
required continuing education classes.</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card experience bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h3>Mental Health Education & Outreach Specialist</h3>
<h4>Osan Air Base, Republic of Korea</h4>
</div>
<div class="card-body">
<h5>February 2012 - March 2013</h5>
<p>Created and distributed mental health, substance abuse, and family violence prevention educational
content to over 20 squadrons of active duty and civilian personnel by conducting group classes, formal
theater presentations, and live radio broadcasts at several locations in country. </p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card experience bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h3>Substance Abuse Counselor</h3>
<h4>Offutt Air Force Base, Nebraska</h4>
</div>
<div class="card-body">
<h5>June 2010 - February 2012</h5>
<p>Provided direct counseling services to servicemembers diagnosed with substance abuse disorders
and those with substance related incidents. Coordinated care between several facilities to ensure
continuity of care and highest chance of recovery for patients. Additionally cooperated with command
personnel in accordance with healthcare privacy laws to provide stable environment for clients
returning from higher levels of care to the workcenter.</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card experience bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h3>Mental Health Technician</h3>
<h4>Offutt Air Force Base, Nebraska</h4>
</div>
<div class="card-body">
<h5>March 2008 - June 2010</h5>
<p>Manage administrative duties of medical outpatient clinic. Assess new clients and assign to most
appropriate services available. Maintained physical and electronic medical record system for over 1,200
active and closed cases.</p>
</div>
</div>
</div>
<!-----------------------SKILLS CLASS CONTENT------------------->
<div class="container-fluid row">
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>HTML</h5>
</div>
</div>
<div class="col-1"></div>
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>CSS</h5>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>Javascript</h5>
</div>
</div>
<div class="col-1"></div>
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>Java</h5>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>C#</h5>
</div>
</div>
<div class="col-1"></div>
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>.Net & .Net Core</h5>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>Spring Boot</h5>
</div>
</div>
<div class="col-1"></div>
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>Bash Shell</h5>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>JQuery</h5>
</div>
</div>
<div class="col-1"></div>
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>MySql & JDBC</h5>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>Microsoft SQL Server</h5>
</div>
</div>
<div class="col-1"></div>
<div class="card skills bg-dark col-sm-4 col-lg-5">
<div class="card-body text-center">
<h5>Git Version Control</h5>
</div>
</div>
</div>
<!-------------------------PROJECTS CLASS CONTENT-------------------------->
<div class="container-fluid row">
<div class="card projects bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h4>Pong</h4>
</div>
<div class="card-body">
<p>Attempt at testing basic AI scripting/pathing with a rehash of classic Pong game. You can download
a Mac version of the game by clicking <a href="PongMac.zip" download="pong">here</a>
or a Windows version by clicking <a href="PongWindows.zip" download="pong">here</a>.
</p>
<p class="text-center">
<img class="screenshot" src="images/PongScreenShot.png">
</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card projects bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h4>Blasteroids</h4>
</div>
<div class="card-body">
<p>A simple recreation of the classic Asteroids style game written using GameMaker Language.
Animations and sound produced by myself in an effort to figure out how games and publishing work.
If you're the kind of person who downloads software from strangers (and who in 2020 isn't?) you can try
a Mac version of the game by clicking <a href="BlasteroidsMac.zip" download="blasteroids">here</a>
or a Windows version by clicking <a href="BlasteroidsWindows.zip" download="blasteroids">here</a>.
</p>
<p class="text-center">
<img class="screenshot" src="images/BlasteroidsScreenShot.png">
</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card projects bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<a href="https://github.com/Adlister-Fever/closetry-corner-2" target="_blank">
<h4>Closetry Corner</h4>
</a>
</div>
<div class="card-body">
<p>A webapp to manage your closet. Users can upload and save garments, use them to compose
and plan outfits for events, and share them with friends via social media. Includes
OpenWeather API that notifies users of weather to plan outfits accordingly, and
integrates the UploadCare API to allow users to import garments from URL, device
camera, local files, or social media accounts. Composes prepopulated tweets with
garment or outfit image page for sharing with friends, because what fun are clothes if
you never get to show them off?</p>
<p class="text-center">
<a href="https://github.com/Adlister-Fever/closetry-corner-2" target="_blank">
<img class="screenshot" src="images/ClosetryCornerScreenShot.png">
</a>
</p>
<p>
*Live production site has been closed. Click above image to see the source on Github*
</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card projects bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h4><a href="https://github.com/Adlister-Fever/adlister-fever" target="_blank">Adlister Project</a></h4>
</div>
<div class="card-body">
<p>Ad site integrating Java EE and MySQL. Allows users to login, post ads for
items, as well as browse listings posted by other users. Messaging functionality
allows users to communicate with one another to orchestrate exchanges and sales.
Also integrates Google Maps to allow for geolocation for items at location defined
by users on their profile. It's basically a really cute Craigslist.</p>
<p class="text-center"><a href="https://github.com/Adlister-Fever/adlister-fever" target="_blank">
<img class="screenshot" src="images/AdlisterScreenShot.png"></a></p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card projects bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h4><a href="https://esquerrac.github.io/simple-math-game/" target="_blank">Math Practice</a></h4>
</div>
<div class="card-body">
<p>Interactive game designed for my daughter to practice her addition
and subtraction. Could probably help other preschool age kids, too.
Additional functionality may be added as she grows up, so long as
my coding skills outpace her math abilities.</p>
<p class="text-center"><a href="https://esquerrac.github.io/simple-math-game/" target="_blank">
<img class="screenshot" src="images/MathScreenShot.png"></a>
</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card projects bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<a href="https://esquerrac.github.io/simone/" target="_blank"><h4>Simone</h4></a>
</div>
<div class="card-body">
<p>Javascript based version of a memory game that in no way resembles
what may or may not have been an extremely popular game. Even the
name is different!</p>
<p class="text-center"><a href="https://esquerrac.github.io/simone/" target="_blank">
<img class="screenshot" src="images/SimoneScreenShot.png"></a>
</p>
</div>
</div>
</div>
<!-------------------------RESUME CLASS CONTENT-------------------------->
<div class="container-fluid row">
<div class="card resume bg-dark col-sm-11 col-lg-9">
<div class="card-header">
<h4>A copy of my resume is downloadable here.</h4>
</div>
<div class="card-body">
<p class="text-center"><a href="ChrisEsquerraResume.pdf" download="ChrisEsquerraResumePDF">
<img class="screenshot" src="images/ResumeScreenShot.png"></a></p>
</div>
<div class="card-footer">
<p><a href="ChrisEsquerraResume.pdf" download="ChrisEsquerraResumePDF">
<button type="button" class="btn btn-dark">Download</button>
</a></p>
</div>
</div>
</div>
<!-------------------------CONTACT CLASS CONTENT-------------------------->
<div class="container-fluid row">
<div class="card contact bg-dark col-sm-11 col-lg-6">
<div class="card-body">
<p>Mobile: 210-763-6803</p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card contact bg-dark col-sm-11 col-lg-6">
<div class="card-body">
<p>email: <a href="mailto:[email protected]">[email protected]</a></p>
</div>
</div>
</div>
<div class="container-fluid row">
<div class="card contact bg-dark col-sm-11 col-lg-6">
<div class="card-body">
<p>LinkedIn: <a href="https://www.linkedin.com/in/chris-esquerra/" target="_blank">in/chris-esquerra/</a>
</p>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="js/site-js.js"></script>
</body>
</html>