/
index.html
255 lines (247 loc) · 10.3 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
<meta name="theme-color" content="#000000" />
<meta property="og:title" content="Andrew VanNess Personal Site" />
<meta property="og:url" content="https://oftheheadland.com/" />
<meta property="og:image" content="https://oftheheadland.com/img/colorblindly.gif" />
<meta property="og:description" content="Resume and portfolio of my work as a web developer." />
<title>Andrew VanNess</title>
<link href="css/index.css" rel="stylesheet">
<link href="lib/fontello/css/fontello.css" rel="stylesheet">
</head>
<body>
<header class="header-container">
</header>
<main>
<div class="container">
<div class="lead">
<h1 class="lead__heading">Hi, I'm Andrew VanNess</h1>
<div class="lead__sub">
I'm a full stack developer currently working at <a target="_blank" href="https://nexthink.com/">Nexthink</a>. My
goal is to make the web
a more accessible and friendly place for everyone. I've worked with clients such as state governments and the
EPA. I build
everything from chrome extensions to full stack React apps.
</div>
<div class="call-to-action">
<a href="resume.pdf" target="_blank" class="btn btn--primary btn--lg">View My Resume</a>
<div class="socials">
<a class="socials__link social-icon " href="https://github.com/oftheheadland" target="_blank">
<i class="icon-github-circled"></i>
</a>
<a class="socials__link social-icon " href="mailto:andrewvanness221@gmail.com" target="_blank">
<i class="icon-mail-alt"></i>
</a>
<a class="socials__link social-icon " href="https://www.linkedin.com/in/agvanness/" target="_blank">
<i class="icon-linkedin-squared"></i>
</a>
</div>
</div>
</div>
</div>
<div class="container experience-container">
<h1>Experience.</h1>
<div class="timeline">
<div class="timeline__line"></div>
<div class="timeline__item">
<div class="experience">
<header class="experience__header">October 2021 - Present</header>
<h2 class="experience__name">
Manager, Marketing Web Development at Nexthink
</h2>
<div class="skill-tags">
</div>
<p></p>
<ul>
<li>While managing a team developed and managed the marketing websites for a large corporation - ensuring they were constantly updated in a fast-paced environment
</li>
<li>Migrated a Vue app to Next.js for 75% faster page loads, better SEO, and enhanced web accessibility
</li>
<li>Hands-on experience with modern web development technology including Next.js, WordPress, GraphCMS, VueJS, and SEO best practices </li>
</ul>
</div>
</div>
<div class="timeline__item">
<div class="experience">
<header class="experience__header">May 2018 - October 2021</header>
<h2 class="experience__name">
Web Developer at Eastern Research Group
</h2>
<div class="skill-tags">
</div>
<p></p>
<ul>
<li>Converted an outdated natural disaster management website to a full-stack Vue/PHP/MySQL application
</li>
<li>Developed an EPA application for viewing water quality using React and Esri maps
to produce high-detail informative maps
</li>
<li>Created a browser extension for the CDC to automate the process of reporting fraudulent
COVID-19 preventative products</li>
</ul>
</div>
</div>
<div class="timeline__item">
<div class="experience">
<header class="experience__header">Aug 2017 - May 2018</header>
<h2 class="experience__name">
CS Teaching Assistant at Bridgewater State University
</h2>
<div class="skill-tags">
</div>
<p></p>
<ul>
<li>Assigned and graded Python assignments and exams</li>
<li>Tutored students individually and held weekly sessions with the entire class to review course material
</li>
<li>Assisted professor in preparing assignments and lectures</li>
</ul>
</div>
</div>
<div class="timeline__item">
<div class="experience">
<header class="experience__header">Apr 2017 - Aug 2017</header>
<h2 class="experience__name">
Website Intern at Town of Falmouth
</h2>
<div class="skill-tags">
</div>
<p></p>
<ul>
<li>Updated and maintained the town website through a CMS</li>
<li>Automated time-consuming IT processes and increased productivity</li>
<li>Provided technical support to local Police and Fire departments</li>
</ul>
</div>
</div>
</div>
</div>
<div class="container project-container">
<h1>My Projects</h1>
<div class="project">
<div class="project__img-container">
<a target="_blank" href="https://mywaterway.epa.gov/">
<img class="project__img" src="img/hmw.png" alt="HMW logo" style="width: 100%;">
</a>
</div>
<div class="project__details">
<h2 class="project__name">
How's My Waterway
</h2>
<div class="skill-tags">
<div class="skill-tag">React</div>
<div class="skill-tag">NodeJS</div>
<div class="skill-tag">JavaScript</div>
<div class="skill-tag">Esri Maps</div>
<div class="skill-tag">Cloud.gov</div>
</div>
<p>
A map-centric, open source, progressive web application that pulls data from
multiple systems at the EPA to provide a user with an overall picture of their water
quality. Developed while working at Eastern Research Group.
<br>
<ul>
<li>Over 50,000 monthly users.</li>
</ul>
<div>
<a class="btn" href="https://mywaterway.epa.gov/" target="_blank">View Project</a>
<a class="btn" href="https://www.youtube.com/watch?v=hqSLARmxHCM" target="_blank">Watch Demo</a>
<a class="btn" href="https://github.com/USEPA/mywaterway" target="_blank">View
Source</a>
</div>
</p>
</div>
</div>
<div class="project">
<div class="project__img-container">
<a target="_blank"
href="https://chrome.google.com/webstore/detail/colorblindly/floniaahmccleoclneebhhmnjgdfijgg">
<img class="project__img" src="img/colorblindly.gif" alt="Colorblindly picture" style="width: 100%;">
</a>
</div>
<div class="project__details">
<h2 class="project__name">
Colorblindly
</h2>
<div class="skill-tags">
<div class="skill-tag">JavaScript</div>
<div class="skill-tag">CSS</div>
<div class="skill-tag">Chrome Extension</div>
</div>
<p class="project-description">
Colorblindly lets you experience colorblindness in your browser. This extension simulates the different
types of colorblindness to assist developers in creating accessible websites.
<br><br>
<ul>
<li>350+ Github stars and over 10,000 weekly users.</li>
</ul>
<div>
<a style="margin-left: 10px;" class="btn"
href="https://motherboard.vice.com/en_us/article/vbknv4/colorblindly-chrome-extension-shows-you-the-internet-as-if-you-were-colorblind"
target="_blank">View VICE Article</a>
<a class="btn"
href="https://chrome.google.com/webstore/detail/colorblindly/floniaahmccleoclneebhhmnjgdfijgg"
target="_blank">View Project</a>
<a class="btn" href="https://github.com/oftheheadland/Colorblindly" target="_blank">View Source</a>
</div>
</p>
</div>
</div>
<div class="project">
<div class="project__img-container">
<a target="_blank" href="https://jamiebot.com/">
<img src="img/discord_logo.png" alt="Jamie Bot stats on Discord Bot List"
style="width: 100%; margin-top: 50px;">
</a>
</div>
<div class="project__details">
<h2 class="project__name">
Jamie Bot
</h2>
<div class="skill-tags">
<div class="skill-tag">NodeJs</div>
<div class="skill-tag">DiscordJS</div>
<div class="skill-tag">JavaScript</div>
<div class="skill-tag">React</div>
</div>
<p class="project-description">
Jamie Bot is a task automation bot for Discord. Jamie lets you seamlessly search and share images, videos,
news, and more.
<br><br>
<ul>
<li>Over 125,000 users across 1,000 communities.</li>
</ul>
<div>
<a class="btn" href="https://jamiebot.com/" target="_blank">View Project</a>
</div>
</p>
</div>
</div>
</div>
<div class="container">
<h2>Testimonials</h2>
<blockquote class="testimonial">
<p>“Someone that would make a great fit in any company.”</p>
<cite>
Angela Hurwitz
(Director at <a href="https://opencape.org/">OpenCape</a>)
</cite>
</blockquote>
<div class='contact'>
<h2>Contact</h2>
<p class='contact__msg'>If you're interested in working with me, please get in touch through <a
href='mailto:andrewvanness221@gmail.com'>andrewvanness221@gmail.com</a>.
</div>
</div>
</main>
<footer class='footer'>
<h1 class='footer__name'>Andrew VanNess</h1>
<h2 class='footer__title'>Full Stack Developer</h2>
Copyright © Andrew VanNess
</footer>
<script src="js/index.js"></script>
</body>
</html>