-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
213 lines (202 loc) · 8.83 KB
/
index.html
File metadata and controls
213 lines (202 loc) · 8.83 KB
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
<!DOCTYPE html>
<html>
<head>
<title>Kyle Becker</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="styles/styles.css">
</head>
<body>
<div class="anchor" id="about"></div>
<!-- Menu Bar -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark sticky-top">
<a class="navbar-brand" href="#about">Kyle Becker</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarText">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="#about">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#skills">Skills</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#portfolio">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</ul>
<span class="navbar-text">
<ul>
</li>
<li><a href="https://github.com/kmbecker" target="_blank"><span class="fa fa-github"></span> GitHub</a>
</li>
<li>
<p><a href="http://linkedin.com/in/kyle-m-becker/" target="_blank"><span class="fa fa-linkedin"></span> Linkedin</a></p>
</li>
</ul>
</span>
</div>
</nav>
<!-- End Menu Bar -->
</div>
<!-- Website container -->
<div class="container"></div>
<!-- About Me -->
<div class="jumbotron">
<div class="col-md-2"><img class="homepagePhoto" src="styles/images/self2.jpg"></div>
<div class="col-md-10">
<h2 class="display-4">Junior Developer</h2>
<p> Hi! My name is Kyle Becker, and I am a Junior Developer!</p>
<p>
While I was in middle school, I independently worked with basic HTML, CSS, and CMS
templating engines. By high school, my passion for technology grew, and my emphasis became
focused on hardware and building computers and finding out how they worked, down
to their most basic elements.
</p>
<p>
After attending college for some time, and then working for one of the largest
retailers in the world, I realized that I should get back into what I always
had a passion for, so I took the plunge, and made the decision to make it happen.
</p>
</div>
<div class="anchor" id="skills"></div>
</div>
<!-- End About Me -->
<!-- Skills -->
<div class="jumbotron">
<div class="col-md-10">
<h1 class="display-4">Skills</h1>
<a href="./downloads/KyleBeckerTechResume.pdf" target="_blank" alt="download resume"
class="btn btn-primary">Download Resume</a>
<p>Noted below are skills and languages that I have worked with on various projects.</p>
<div class="row">
<div class="col-md-6">
<ul>
<li>HTML</li>
<li>CSS</li>
<li>Bootstrap</li>
<li>JSON</li>
<li>Javascript</li>
<li>jQuery</li>
<li>Command line</li>
</ul>
</div>
<div class="col-md-6">
<ul>
<li>GIT</li>
<li>GitHub</li>
<li>Firebase</li>
<li>MySQL</li>
<li>ExpressJS</li>
<li>NodeJS</li>
<li>Computer science fundementals</li>
</ul>
</div>
</div>
</div>
<div class="anchor" id="portfolio"></div>
</div>
<!-- End Skills -->
<!-- Portfolio -->
<div class="jumbotron">
<div class="col-md-12">
<h1 class="display-4">Portfolio</h1>
<p>Below are some examples of projects that I have had the pleasure to either work on as a team, or independently on. I have thoroughly
enjoyed working on each of these projects indidvidually for very different reasons, and I feel that each shows a different skill set
that I have available. Below each image, there is a short description of the project, as well as a link to the GitHub repo, as well
as a link to the live project, if it is available in the context of that project. </p>
</div>
<!-- NewsWise -->
<div class="card">
<div class="row">
<div class="col-md-4">
<img src="styles/images/newswise.png" class="w-100 portImage">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title">NewsWise</h4>
<p class="card-text">An app that is dedicated to aggregating news from multiple sources, as well as allowing users to
submit news on their own as well. This page is in a BETA state. I worked on the user submissions page using Express,
NodeJS, as well as the Handlebars and MySQL and Heroku deployment.</p>
<a href="https://www.github.com/wmadhatterw/news-wise/" target="_blank" alt="news wise github repo" class="btn btn-primary">Github
</a>
<a href="https://newswise.herokuapp.com" target="_blank" alt="heroku app page" class="btn btn-primary">Heroku
</a>
</div>
</div>
</div>
</div>
<br>
<!-- Liri -->
<div class="card">
<div class="row">
<div class="col-md-4">
<img class="liri" src="styles/images/liri.png" class="w-100 portImage">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title">Liri</h4>
<p class="card-text">LIRI is like iPhone's SIRI. However, while SIRI is a Speech Interpretation and Recognition Interface, LIRI is a Language Interpretation and Recognition Interface. LIRI will be a command line node app that takes in parameters and gives you back data. Primarily used NodeJS server application, Twitter API, Spotify API, and OMDB API for this one.</p>
<a href="https://github.com/kmbecker/liri-node-app" target="_blank" alt="liri node app" class="btn btn-primary">Github
</a>
</div>
</div>
</div>
</div>
<br>
<!-- MysterySinusTheatre -->
<div class="card">
<div class="row">
<div class="col-md-4">
<img class="sinus" src="styles/images/mysterysinus.png" class="w-100 portImage">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title">Mystery Sinus Theatre 3000</h4>
<p class="card-text">For this project the goal was t use multiple APIs in order to compile information from many different data sources. To accomplish this task we utilized GIPHY and OMDB APIs as well as manipulations of YouTube's url mechanics and use of iFrame and Wikipedia search mechanics. I was responsible for the layout of this page, focus being on use of webkit elements, CSS, and Bootstrap for usability and mobile responsiveness.</p>
<a href="https://github.com/kmbecker/Project1" target="_blank" alt="Mystgery Sinus Theatre 3000 Github Repo" class="btn btn-primary">Github
</a>
<a href="https://kmbecker.github.io/Project1" target="_blank" alt="Mystery Sinus Theatre 3000 page" class="btn btn-primary">Website
</a>
</div>
</div>
</div>
</div>
<div class="anchor" id="contact"></div>
</div>
<!-- End Portfolio -->
<!-- Contact -->
<div id="contactCard" class="jumbotron">
<div id="totheright" class="col-md-10">
<h1 class="display-4">Contact</h1>
<p>
Thanks for taking the time to view some of the projects I have worked on, and taking
the time to learn a little bit about me. If you have any additional questions, or
if you have any feedback, do not hesitate to reach out. I am available through LinkedIn,
GitHub, or you can email me directly.
</p>
<p><a id="contactMe" href="http://linkedin.com/in/kyle-m-becker/" target="_blank"><span class="fa fa-linkedin"></span> Linkedin</a></p>
</a>
<p><a id="contactMe" href="https://github.com/kylembecker" target="_blank"><span class="fa fa-github"></span> GitHub</a></p>
<p>Email: <a href="mailto:kyle@kylebecker.net">kyle@kylebecker.net</a></p>
</div>
</div>
<!-- End Contact -->
</div>
<!-- End Container -->
<!-- Footer -->
<footer class="footer">
<div class="container">
<span class="text-muted">©Copyright 2018 Kyle Becker</span>
</div>
</footer>
<!-- End Footer -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="js/javascript.js"></script>
</body>
</html>