-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
171 lines (147 loc) · 7.75 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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width = device-width, initial-scale = 1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Work by Chris</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" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css?family=Black+Han+Sans" rel="stylesheet">
<link rel="stylesheet" href="./index.css">
</head>
<body>
<header>
<h1 class="myTitle">Chris Harding: </h1>
<h2 class="myTitleSub">Full Stack Web Developer</h2>
</header>
<br>
<div class="container">
<div class="aboutMe">
<h3>About Me:</h3>
<p>I am an intelligent, dedicated, and good-natured full stack web developer. I have a thirst for knowledge and a knack for creative problem-solving. I have a proven track record in business, as VP of business development and then head of operations at a successful fintech startup.</p>
<p>Now, I am turning that same work ethic, drive, and attitude towards the development world.</p>
<a href="./resume.pdf" class="btn btn-primary">Resume</a>
<a href="mailto:[email protected]?Subject=Connect" class="btn btn-primary">Contact Me</a>
<a href="https://www.linkedin.com/in/christopherjharding/" class="fa fa-linkedin"></a>
<a href="https://github.com/HardingRU" class="fa fa-github"></a>
</div>
<hr>
<div class="mySkills">
<h3>My Skills:</h3>
<!-- <div><p><span class="leftSpan">JAVASCRIPT/NODE.JS</span><span class="rightSpan">EXPRESS</span></p></div>
<div><p><span class="leftSpan">RUBY</span><span class="rightSpan">RAILS</span></p></div>
<div><p><span class="leftSpan">REACT</span><span class="rightSpan">REDUX</span></p></div>
<div><p><span class="leftSpan">HTML</span><span class="rightSpan">CSS</span></p></div>
<br> -->
<div class="leftDiv">JavaScript/Node.js</div> <div class="rightDiv">Express</div>
<div class="leftDiv">Ruby</div> <div class="rightDiv">Rails</div>
<div class="leftDiv">React</div> <div class="rightDiv">Redux</div>
<div class="leftDiv">Elixir</div> <div class="rightDiv">Phoenix</div>
<div class="leftDiv">HTML</div> <div class="rightDiv">CSS</div>
</div>
<br><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<hr>
<br>
<h3 class="portStart">My General Assembly Portfolio Projects:</h3>
<br>
<div class="row">
<div class="col-sm-6">
<div class="card border-primary mb-3">
<div class="card-body text-primary">
<h5 class="card-title">InvestiGator (React/Rails)</h5>
<img class="card-img-top" src="./proj-4.png" alt="Card image cap">
<p class="card-text">A stock portfolio app that allows users to search for stocks, view the stocks price history (data from 3rd party API), and save stocks to their portfolio. Includes full user auth.</p>
<a href="https://secret-badlands-93489.herokuapp.com/" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card border-primary mb-3">
<div class="card-body text-primary">
<h5 class="card-title">GAmblr (Node/React/Express)</h5>
<img class="card-img-top" src="./proj-3.png" alt="Card image cap">
<p class="card-text">Group project: a Tumblr clone for General Assembly. Create an account (full user auth), post a variety of media types (videos, images, text), and follow others to see their feed.</p>
<a href="https://ga-mblr.herokuapp.com/" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
</div>
<br>
<div class="row">
<div class="col-sm-6">
<div class="card border-primary mb-3">
<div class="card-body text-primary">
<h5 class="card-title">MTG: Collection Manager (Node/Express)</h5>
<img class="card-img-top" src="./proj-2.png" alt="Card image cap">
<p class="card-text">An online collection management tool for Magic: The Gathering cards and decks. Leverages third party API to allow users to add cards to their collection via search and/or opening packs of cards.</p>
<a href="https://mtgoat.herokuapp.com/" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card border-primary mb-3">
<div class="card-body text-primary">
<h5 class="card-title">Number Punchers (JavaScript/jQuery)</h5>
<img class="card-img-top" src="./proj-1.png" alt="Card image cap">
<p class="card-text">A browser-based remake of the game Number Munchers. Users must find the correct numbers for each puzzle (prime numbers, factors, multiples) to advance. But beward of Mr. Dino!</p>
<a href="https://hardingru.github.io/Number-Punchers/" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
</div>
<br>
<br>
<h3 class="portStart">Additional Work:</h3>
<br>
<div class="row">
<div class="col-sm-6">
<div class="card border-primary mb-3">
<div class="card-body text-primary">
<h5 class="card-title">Quotes App (Elixir/Phoenix)</h5>
<img class="card-img-top" src="./elix.png" alt="Card image cap">
<p class="card-text">A very basic CRUD app built over a weekend to learn Elixir and Phoenix.</p>
<a href="https://elixir-quotes.herokuapp.com/" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card border-primary mb-3">
<div class="card-body text-primary">
<h5 class="card-title">TubeFlix (Node/React/Express)</h5>
<img class="card-img-top" src="./tubeflix.png" alt="Card image cap">
<p class="card-text">A Netflix clone using YouTube API data. Browse popular videos by category, or search your favorite.</p>
<a href="https://radiant-waters-72558.herokuapp.com/" class="btn btn-primary">Explore</a>
</div>
</div>
</div>
</div>
<br>
<hr>
<br>
<div class="aboutMe">
<h3>Why Hire Me?</h3>
<ul>
<li>You should hire me because I am intelligent, and I understand how to solve problems in a logical and efficient manner.</li>
<li>You should hire me because I understand that social/emotional intelligence is just as important as traditional smarts.</li>
<li>You should hire me because I have a proven track record of successfully working as part of a team, and in managing team dynamics.</li>
<li>You should hire me because I am a diligent, determined worker, who genuinely enjoys the challenges that come with learning and growth.</li>
<li>You should hire me because I have worked in a start-up environment, and I know how to function and excel in an intense atmosphere.</li>
<li>You should hire me because a hiring decision is an investment, and I have both the potential and drive to produce a healthy return.</li>
</ul>
</div>
</div>
<!-- <footer><a href="www.workbychris.com">A CH Joint</a></footer> -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></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>
</body>
</html>