-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
222 lines (195 loc) · 13.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
<!DOCTYPE html>
<html>
<head>
<title>Valerie Thoma</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"
integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="
crossorigin="anonymous"></script>
<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script>
<script type="text/javascript" src="scripts/scripts.js"></script>
<script src="https://use.fontawesome.com/6251bfc733.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<!-- Import Devicon fonts -->
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-mfizz/2.4.1/font-mfizz.css"/>
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
<link href="https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed" rel="stylesheet">
<link rel="icon" href="images/cupcake.png">
<!-- <link rel="stylesheet" href="css/font-awesome.css"/> -->
<link rel="stylesheet" href="css/styles.css"/>
</head>
<body>
<header>
</header>
<!-- <NAV> -->
<div class="navbar-fixed scrollspy">
<nav>
<div class="nav-wrapper"> <a href="#" class="brand-logo center">valerie jane thoma</a>
<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="#hero-box">about</a></li>
<li><a href="#projects">projects</a></li>
<li><a href="#skills">skills</a></li>
<li><a href="#contact">contact</a></li>
</ul>
</div>
</nav>
</div>
<ul class="side-nav" id="mobile-demo">
<li><a href="#hero-box">about</a></li>
<li><a href="#projects">projects</a></li>
<li><a href="#skills">skills</a></li>
<li><a href="#contact">contact</a></li>
</ul>
<!-- </nav> -->
<!-- <ABOUT> -->
<div class="x-padding"></div> <!-- add padding -->
<div id="hero-box">
<div class="padding"></div> <!-- add padding -->
<div class="hero-filter center-align flex-text">
<div class="left chip z-depth-1">
About
</div>
<p>Until recently <a href="https://reactjs.org/docs/react-component.html#state" target="blank" rel="noopener noreferrer" id="link">this.state</a> was just Georgia, <a href="https://www.oracle.com/java/index.html" target="blank" rel="noopener noreferrer" id="link">Java</a> was something I poured for people, a <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions" target="blank" rel="noopener noreferrer" id="link">regular expression</a> was, "Do you have any questions about the menu?", and <a href="https://vimeo.com/114164549" target="blank"rel="noopener noreferrer" id="link">"kill the server"</a> was something I would take personally.<span class="right"><img src="images/profile.png" class="profile-img z-depth-2 circle"/></span> </p>
<p>I'm on a journey today that began many yesterdays ago in a classroom at Georgia State University. There I wrote a browser game about two off duty crime-fighting pets, <i>The Adventures of Pud and Patti</i>. I didn't know it then, but I would find my way back to a <a href="https://www.digitalcrafts.com/">classroom</a> and this would be one of my proudest choices.</p>
<p>The most valuable outcome of developing new skills is that invariably your perspective will grow too. The unique world that software development has exposed me to is one where I am afforded opportunities to draw from my previous background in Criminal Justice and Film and Television. Technology provides instances of collaboration, creativity, caritas and just the right amount of java pouring.</p>
<h4>Hi, I'm Valerie and I'm a software developer.</h4>
</div>
</div> <!-- </about> -->
<!-- <PROJECTS> -->
<div class="x-padding"></div> <!-- add padding -->
<div id="projects" class="section scrollspy">
<div class="center-align flex-text">
<div class="chip z-depth-1">Featured Projects</div>
</div>
<div class="card horizontal shoebox z-depth-5">
<!-- <h4 id="shoebox" class="center-align ">Shoebox Project</h4> -->
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src="images/shoebox.png">
</div>
<div class="card-content">
<span class="card-title activator">Shoebox Project<i class="material-icons right">more_vert</i></span>
<p><a href="https://github.com/ValerieThoma/shoebox-project" target="blank" rel="noopener noreferrer">Github Repository</a></p>
<p><a href="https://github.com/ValerieThoma/S.Miles" target="blank" rel="noopener noreferrer">Live Site</a></p>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">Full Stack<i class="material-icons right">close</i></span>
<p>Full stack project using Express, Node.js, MySQL, AWS S3, Multer, Bcrypt, Google Maps API, Javascript, jQuery, HTML, and CSS.</p>
<p>The Shoebox Project provides a home for the collection and curation of
professional protographs for children in the foster care system.</p>
</div>
</div>
<div class="card horizontal smiles z-depth-5">
<!-- <h4 id="shoebox" class="center-align ">S.Miles</h4> -->
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src="images/editgrades.png">
</div>
<div class="card-content">
<span class="card-title activator">eduCrate<i class="material-icons right">more_vert</i></span>
<p><a href="https://github.com/eddieatkinson/schoolApp" target="blank" rel="noopener noreferrer">Github Repository</a></p>
<p><a href="https://goo.gl/p7oKsF" target="blank" rel="noopener noreferrer">Video Demo</a></p>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">eduCrate<i class="material-icons right">close</i></span>
<p>Frontend: React, Redux, JSX, Sass, React-Materialize, Material-UI <br>
Backend API: Node.js, Express, MySQL <br>
eduCrate, a learning management system for grade-school aged students, provides educators an authoring tool in which to deliver assignments, document the progress of students, record correspondence with parents, and otherwise manage and administer all other miscellaneous instructional content directly to the parents and students.
</p>
</div>
</div>
<div class="card horizontal menuize z-depth-5">
<!-- <h4 id="shoebox" class="center-align ">Menuize</h4> -->
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src="images/menuize.png">
</div>
<div class="card-content">
<span class="card-title activator">Menuize<i class="material-icons right">more_vert</i></span>
<p><a href="https://github.com/ValerieThoma/mealprep" target="blank" rel="noopener noreferrer">Github Repository</a></p>
<p><a href="https://github.com/ValerieThoma/mealprep" target="blank" rel="noopener noreferrer">Live Site</a></p>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4">WWC Hackathon<i class="material-icons right">close</i></span>
<P>Built in 16 hours during the 2nd Annual Women Who Code Hackathon using time-tested technologies such as newly formed friendships, lots of coffee, extremely comfortable pants, HTML, CSS, AngularJS, and jQuery.
Empower the way you eat!</p>
</div>
</div>
<div class="padding"></div>
</div> <!-- </projects> -->
<!-- <SKILLS> -->
<div id="skills" class="skills section scrollspy">
<div class="row">
<div class="center-align">
<div id="front" class="chip grow z-depth-1">
Front-end
</div>
<div id="back" class="chip grow z-depth-1">
Back-end
</div>
<div id="dev" class="chip grow z-depth-1">
Development Tools
</div>
</div>
<div class="padding"></div> <!-- add padding -->
<div class="icons grid">
<span class="glyph-sample element-item back"><i class="icon-python"></i><p class="showskill"></p></span>
<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript" target="blank" class="element-item front"><span class="glyph-sample"><i class="icon-javascript"></i></span></a>
<a href="https://nodejs.org/en/" target="blank" class="element-item back"><span class="glyph-sample"><i class="icon-nodejs"></i></span></a>
<a href="https://jquery.com/" target="blank" class="element-item front"><span class="glyph-sample"><i class="icon-jquery"></i></span></a>
<a href="https://reactjs.org/" target="blank" class="element-item front"><span class="glyph-sample"><i class="icon-reactjs"></i></span></a>
<a href="https://www.mysql.com/" target="blank" class="element-item back"><span class="glyph-sample"><i class="icon-mysql"></i></span></a>
<a href="https://www.apache.org/" target="blank" class="element-item back"><span class="glyph-sample"><i class="icon-apache"></i></span></a>
<a href="https://aws.amazon.com/" target="blank" class="element-item dev"><span class="glyph-sample"><i class="devicon-amazonwebservices-original plain"></i></span></a>
<a href="https://www.ubuntu.com/" target="blank" class="element-item dev"><span class="glyph-sample"><i class="devicon-ubuntu-plain"></i></span></a>
<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5" target="blank" class="element-item front"><span class="glyph-sample"><i class="icon-html5"></i></span></a>
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS3" target="blank" class="element-item front"><span class="glyph-sample"><i class="icon-css3"></i></span></a>
<a href="https://expressjs.com/" target="blank" class="element-item back"><span class="glyph-sample"><i class="devicon-express-original"></i></span></a>
<a href="https://www.npmjs.com/" target="blank" class="element-item back"><span class="glyph-sample"><i class="icon-npm"></i></span></a>
<a href="https://babeljs.io/" target="blank" class="element-item front"><span class="glyph-sample"><i class="devicon-babel-plain plain"></i></span></a>
<a href="https://github.com/" target="blank" class="element-item dev"><span class="glyph-sample"><i class="devicon-github-plain"></i></span></a>
<a href="http://sass-lang.com/" target="blank" class="element-item front"><span class="glyph-sample"><i class="devicon-sass-original"></i></span></a>
<a href="https://jasmine.github.io/" target="blank" class="element-item dev"><span class="glyph-sample"><i class="devicon-jasmine-plain-wordmark"></i></span></a>
<a href="https://www.sourcetreeapp.com/" target="blank" class="element-item dev"><span class="glyph-sample"><i class="devicon-sourcetree-plain-wordmark"></i></span></a>
</span>
</div>
</div>
<div class="center-align">
<div id="all" class="chip grow z-depth-1">
All
</div>
</div>
</div> <!-- </skills> -->
<div class="padding"></div> <!-- add padding -->
<!-- <CONTACT> --> <!-- <FOOOTER> -->
<footer class="page-footer">
<div id="contact" class="container section scrollspy">
<div class="padding"></div> <!-- add padding -->
<div id="mobile-resp" class="center-align flex-text">
<h3>Contact Me</h3>
<p>Let's stay in touch</p>
<div class="row center-align">
<span><a class="contact-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Email" href="mailto:valeriejanethoma@gmail.com"><i class="grow fa fa-envelope" aria-hidden="true"></i></a></span>
<span><a class="contact-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Github" href="https://github.com/ValerieThoma" target="blank" rel="noopener noreferrer"><i class="grow fa fa-github-square" aria-hidden="true"></i></a></span>
<span><a class="contact-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Linkedin" href="http://linkedin.com/in/valeriejanethoma/" target="blank" rel="noopener noreferrer"><i class="grow fa fa-linkedin-square" aria-hidden="true"></i></a></span>
<span><a class="contact-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Resume" href="images/valeriethoma.pdf" target="blank" rel="noopener noreferrer"><i class="grow fa fa-file" aria-hidden="true"></i></a></span>
</div>
<div class="row flex-text center-align">
<span id="hype">Featured in <a href="https://hypepotamus.com/people/valerie-thoma/" target="blank" rel="noopener noreferrer">Hypepotamus</a> Tech Talent section</span>
<span><a class="contact-icon tooltipped" data-position="bottom" data-delay="50" data-tooltip="Hypepotamus" href="images/hypepotamus.com_people_valerie-thoma.pdf" target="blank" rel="noopener noreferrer"><i class="grow fa fa-file-pdf-o" aria-hidden="true"></i></a></span>
</div>
</div>
<div class="x-padding"></div> <!-- add padding -->
<div class="center-align copyright">
<span>© 2017 Valerie Jane Thoma</span>
</div>
</div> <!-- </contact> -->
</footer> <!-- </footer> -->
</body>
</html>