-
Notifications
You must be signed in to change notification settings - Fork 1
/
index2.html
313 lines (293 loc) · 12.2 KB
/
index2.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
<!DOCTYPE html>
<!--Hello everyone! I hope my indents are to your satisfaction.-->
<html lang="en">
<head>
<title>Kate Beard's FAC Portfolio</title>
<link rel="stylesheet" href="palmstyle.css"/>
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<!--THIS SECTION REGARDS MOBILE AND MID SIZED SCREENS-->
<section class = "nav">
<div>
<ul>
<li><a href="#intro">Intro</a></li>
<li>//</li>
<li><a href="#about">About</a></li>
<li>//</li>
<li><a href="#coding">Coding</a></li>
</ul>
</div>
</section>
<section class="introbg" id="intro">
<div class="mobileintrocontent">
<div class = "image">
<img src = "img/profile.JPG" class = "kate-img" alt = "Photo of the author">
</div>
<div class = "h1">
<h1>Hey there!</h1>
</div>
<div class = "p">
<p>
I'm Kate - currently a freelance photographer and writer, now
an aspiring front end developer based in London. Welcome to my
portfolio site created for Founders and Coders.
</p>
<p>
Hopefully, you'll be able to get an idea of what I enjoy, why
I'm hoping to become a developer, and where you can find what
I've worked on so far on sites like Codewars and FreeCodeCamp.
</p>
<p>
Grab a hot drink and settle in!
</p>
</div>
</div>
</section>
<section class="solidbg" id="about">
<div class = "mobilesectioncontent">
<div class = "image">
<img src = "img/art.JPG" class = "kate-img" alt = "Watercolor">
</div>
<div class = "h1">
<h1>About</h1>
</div>
<div class = "p">
<p>
My background is as varied as my interests: I graduated in 2015 with
a degree in linguistics and teaching English as a second language. Before
that I did a foundation degree at UAL in Art and Design. Since graduation,
I worked as a customer service rep at a dog food startup before becoming
office manager there and at another fast-growth startup.
</p>
<p>
My lifelong hobbies have included photography, drawing and painting, and
writing. I've loved coffee for as long as I've been allowed to drink it
and have variously worked as a barista and also as a coffee journalist
(it's a thing!) I also love travelling, and recently discovered a passion
for snowboarding. Down time is great too, though, so I also enjoy reading
and doing yoga.
</p>
</div>
</div>
</section>
<section class="imgbg" id="coding">
<div class = "mobilesectioncontent">
<div class = "image">
<img src = "img/coding2.JPG" class = "hobby-img" alt = "Photo of laptop and coffee on table">
</div>
<div class = "h1">
<h1>Why coding?</h1>
</div>
<div class = "p">
<p>
I've always been much more of a 'right-brain' person, enjoying
writing, drawing, photography, and other creative pursuits.
I always figured that I wasn't necessarily very good at things
that required a certain kind of logical, rational thinking, such
as mathematics or coding.
</p>
<p>
However, since moving to London and becoming involved in the tech/startup
scenes, coding is <i>everywhere</i>. It's the foundation
of it all, and therefore hard to ignore. In fact, it irked me
to have such a blind spot - to work in these circles and not know
anything about how the companies I was involved with were created from
scratch.
</p>
<p>
More than that, I began to see the connection to 'right-brain' creativity
and imagination. Could I learn to build things from the ground up as well
by focusing on this blind spot I had and overcoming those challenges? I
love learning new things, and I was curious and eager for this challenge.
</p>
</div>
</div>
</section>
<section class="solidbg">
<div class = "mobilesectioncontent">
<div class="image">
<img src = "img/coffee.JPG" class = "hobby-img" alt = "Photo of a latte">
</div>
<div class = "h1">
<h1> </h1>
</div>
<div class = "p">
<p>
After many abandoned attempts to learn coding in my spare time - on
evenings and weekends, already drained from my full time job, with no
true pressure to force me to progress - I went fully 'freelance' in
February 2018 to take the plunge and find out once and for all if the
coding life could be for me.
</p>
<p>
This time, I've been amazed and humbled to see the kind of progress I've
been able to make with the help of resources like FreeCodeCamp, Codecademy, the Founders
and Coders meetups, Codebar, Codewars, and more. I now feel competent in
being able to build things from scratch using all three.
</p>
<p>
I'm looking forward to continuing this journey, wherever that may be,
and learning even more so I can confidently call myself a full stack
front-end developer and create the things I want to see in the world.
</p>
</div>
</div>
</section>
<!--THIS SECTION REGARDS LARGE SIZED SCREENS-->
<section class = "navlg">
<div>
<ul>
<li><a href="#introlg">Intro</a></li>
<li>//</li>
<li><a href="#aboutlg">About</a></li>
<li>//</li>
<li><a href="#codinglg">Coding</a></li>
</ul>
</div>
</section>
<section class="introlarge" id="introlg">
<div class = "introcontent">
<div class="picheadingdiv">
<div><img src = "img/profile.JPG" class = "kate-img" alt = "Picture of author"></div>
<div class="h1"><h1>Hey there!</h1></div>
</div>
<div class="textdiv">
<p>
I'm Kate - currently a freelance photographer and writer, now
an aspiring front end developer based in London. Welcome to my
portfolio site created for Founders and Coders.
</p>
<p>
Hopefully, you'll be able to get an idea of what I enjoy, why
I'm hoping to become a developer, and where you can find what
I've worked on so far on sites like Codewars and FreeCodeCamp.
</p>
<p>
Grab a hot drink and settle in!
</p>
</div>
</div>
</section>
<section class="solidlarge" id="aboutlg">
<div class = "sectioncontent">
<div class="textdiv">
<p>
My background is as varied as my interests: I graduated in 2015 with
a degree in linguistics and teaching English as a second language. Before
that I did a foundation degree at UAL in Art and Design. Since graduation,
I worked as a customer service rep at a dog food startup before becoming
office manager there and at another fast-growth startup.
</p>
<p>
My lifelong hobbies have included photography, drawing and painting, and
writing. I've loved coffee for as long as I've been allowed to drink it
and have variously worked as a barista and also as a coffee journalist
(it's a thing!) I also love travelling, and recently discovered a passion
for snowboarding. Down time is great too, though, so I also enjoy reading
and doing yoga.
</p>
</div>
<div class="picheadingdiv">
<div><img src = "img/art.JPG" class = "hobby-img" alt = "Watercolor painting"></div>
<div class="h1"><h1>About</h1></div>
</div>
</div>
</section>
<section class="introlarge" id="codinglg">
<div class = "introcontent">
<div class="picheadingdiv">
<div><img src = "img/coding2.JPG" class = "hobby-img" alt = "Picture of laptop and coffee on a table"></div>
<div class="h1"><h1>Why coding?</h1></div>
</div>
<div class="textdiv">
<p>
<p>
I've always been much more of a 'right-brain' person, enjoying
writing, drawing, photography, and other creative pursuits.
I always figured that I wasn't necessarily very good at things
that required a certain kind of logical, rational thinking, such
as mathematics or coding.
</p>
<p>
However, since moving to London and becoming involved in the tech/startup
scenes, coding is <i>everywhere</i>. It's the foundation
of it all, and therefore hard to ignore. In fact, it irked me
to have such a blind spot - to work in these circles and not know
anything about how the companies I was involved with were created from
scratch.
</p>
<p>
More than that, I began to see the connection to 'right-brain' creativity
and imagination. Could I learn to build things from the ground up as well
by focusing on this blind spot I had and overcoming those challenges? I
love learning new things, and I was curious and eager for this challenge.
</p>
</div>
</div>
</section>
<section class="solidlarge">
<div class = "sectioncontent">
<div class="textdiv">
<p>
After many abandoned attempts to learn coding in my spare time - on
evenings and weekends, already drained from my full time job, with no
true pressure to force me to progress - I went fully 'freelance' in
February 2018 to take the plunge and find out once and for all if the
coding life could be for me.
</p>
<p>
This time, I've been amazed and humbled to see the kind of progress I've
been able to make with the help of resources like FreeCodeCamp, Codecademy, the Founders
and Coders meetups, Codebar, Codewars, and more. I now feel competent in
being able to build things from scratch using all three.
</p>
<p>
I'm looking forward to continuing this journey, wherever that may be,
and learning even more so I can confidently call myself a full stack
front-end developer and create the things I want to see in the world.
</p>
</div>
<div class="picheadingdiv">
<div><img src = "img/coffee.JPG" class = "hobby-img" alt = "Picture of a latte"></div>
<div class="h1"><h1> </h1></div>
</div>
</div>
</section>
<!--Footer is the same regardless-->
<footer>
<div class = "footer">
<ul>
<li>
<a href="https://www.codewars.com/users/sbinlondon" target="_blank"><img src="img/codewars.svg" alt="Codewars"/></a>
</li>
<li>
<a href="https://www.freecodecamp.org/sbinlondon" target="_blank"><img src="img/fcc.svg" alt="FreeCodeCamp"/></a>
</li>
<li>
<a href="https://github.com/sbinlondon/sbinlondon.github.io" target="_blank"><img src="img/github.svg" alt="Github"/></a>
</li>
<li>
<a href="https://twitter.com/SBinLondon" target="_blank"><img src="img/twitter.svg" alt="Twitter"/></a>
</li>
</ul>
</div>
</footer>
</body>
</html>