-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
340 lines (318 loc) · 15.4 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
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
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
<!DOCTYPE html>
<html>
<head>
<title>Sebastian Slomski</title>
<meta charset="utf-8">
<!-- I didn't concatenate the files so you can have a look at my module structure -->
<link href='https://fonts.googleapis.com/css?family=Lustria' rel='stylesheet' type='text/css'>
<link href="css/reset.css" rel="stylesheet" type="text/css" media="all">
<link href="css/animations.css" rel="stylesheet" type="text/css" media="all">
<link href="css/base.css" rel="stylesheet" type="text/css" media="all">
<link href="css/utils.css" rel="stylesheet" type="text/css" media="all">
<link href="css/layout.css" rel="stylesheet" type="text/css" media="all">
<link href="css/modules/bar.css" rel="stylesheet" type="text/css" media="all">
<link href="css/modules/portfolio.css" rel="stylesheet" type="text/css" media="all">
<link href="css/modules/alert.css" rel="stylesheet" type="text/css" media="all">
<link href="css/modules/skills.css" rel="stylesheet" type="text/css" media="all">
<link rel="image_src" href="http://sebslomski.com/images/me-small.jpg">
<script src="js/vendor/modernizr.js"></script>
<script src="js/vendor/jquery-1.7.1.min.js"></script>
<script src="js/vendor/jquery.scrollTo.min.js"></script>
<script src="js/vendor/jquery.cycle.all.js"></script>
<script src="js/vendor/jquery.lazyload.min.js"></script>
<script src="js/app.js"></script>
<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-30477317-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
console.log('Hi there :-) Just go to github to check out my code: http://github.com/sebslomski');
</script>
</head>
<body>
<div id="webcrawler-hint">
Hi, I'm Sebastian, a software engineer & front-end architect from Munich, Germany,
specialised in building (mobile) web applications.
</div>
<header class="l-container bar bar-fixed">
<div class="l-grid clearfix">
<div class="l-grid-column-2-1 bar-logo">
<h1>
<a href="#intro">
Sebastian Slomski
<span>Front-end engineer</span>
</a>
</h1>
</div>
<nav class="l-grid-column-2-1 bar-links">
<ul class="bar-menu">
<li><a href="#about-me">About me</a></li>
<li><a href="#skills">Skills</a></li>
<li><a href="#publications">Publications</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="http://blog.sebslomski.com">Blog</a></li>
</ul>
</nav>
</div>
</header>
<div id="content" class="fade">
<section id="intro" class="l-container">
<div class="l-grid">
<div id="browser-fail" class="alert-box-wrapper">
<div class="l-grid-row alert-box">
<a class="alert-close">×</a>
<h4>Warning!</h4>
<p>
You are using a browser which apparently doesn't support today's technology yet.<br>In order to enjoy the full user experience of this site, you should consider upgrading to a newer version of your browser.
</p>
</div>
</div>
<div class="l-grid-row intro-image">
<img src="images/lazyload.jpg" data-original="images/me.jpg" width="1000" height="500" alt="Sebastian Slomski" class="lazy">
<h2 class="l-grid-row quote">
<span class="quote-left">“</span>
I work with designers to develop beautiful and appealing applications using cutting edge web technologies.
<span class="quote-right">”</span>
</h2>
</div>
</div>
</section>
<section id="about-me" class="l-container">
<div class="l-grid">
<h1 class="l-grid-row">About me</h1>
<div class="l-grid-column-3-2">
<h2>Summary</h2>
<p>
Hi, I'm Sebastian, a software engineer & front-end architect from Munich, Germany, specialised in building (mobile) web applications.
</p>
<p>
While completing an apprenticeship at <a href="http://www.edvschule-plattling.de" target="_blank">EDV-Schule Plattling</a> I discovered my passion for building web applications.
</p>
<p>
Outside of work, I helped organize
<a href="http://refreshmunich.com" target="_blank">RefreshMunich</a>, a user group connecting designers and developers in Munich for exchange, work with a friend on an own product and also actively attend other user groups and conferences. I have even given talks to help others to learn from my experience.
</p>
<p>
In my leisure time I enjoy skiing (I grew up close to the Alps), hiking and rock climbing. I also love to travel, which I mostly combine with scuba/apnea diving.
</p>
</div>
<div class="l-grid-column-3-1">
<h2>sebslomski.zip</h2>
<ul class="tabular">
<li>
<span>Name</span>
<span>Sebastian Slomski</span>
</li>
<li>
<span>Age</span>
<span>24</span>
</li>
<li>
<span>Lives in</span>
<span>Munich, Germany</span>
</li>
<li>
<span>Born in</span>
<span>Deggendorf, Germany</span>
</li>
<li>
<span>Crazy about</span>
<span>Javascript</span>
</li>
<li>
<span>Speaks</span>
<span>German, English</span>
</li>
<li>
<span>Shoe size</span>
<span>13 ½ / 49</span>
</li>
<li>
<span>Degree</span>
<span>IT-specialist for application development</span>
</li>
<li>
<span>Hobbies</span>
<span>skiing, hiking, rock climbing, traveling, scuba/apnea diving</span>
</li>
</ul>
</div>
<div class="clearfix l-spacer"></div>
<div class="l-grid-row">
<h2>Short Bio</h2>
<h3>Educational and vocational training</h3>
<ul class="styled">
<li>
<h4>2007 – 2010</h4>
<div>
IT-specialist for application development,
<a href="http://www.edvschule-plattling.de" target="_blank">EDV-Schule Plattling</a>,
(vocational computer science school).
</div>
</li>
<li>
<h4>1999 – 2007</h4>
<div>O-level degree, St. Michaels Gymnasium Metten, (grammar school).</div>
</li>
</ul>
<h3>Professional career</h3>
<ul class="styled">
<li>
<h4>Jul 2013 - Now</h4>
<div>Co-Founder of Pure Labs, a consultancy for web projects, focused on tech startups. Munich, Germany.</div>
</li>
<li>
<h4>Nov 2012 - Now</h4>
<div>Developer & Co-Founder of <a href="http://cutterslounge.de" target="_blank">Cutters Lounge</a> (Plan It UG), Munich, Germany.</div>
</li>
<li>
<h4>May 2012 – Nov 2012</h4>
<div>Javascript Developer, <a href="http://luluvise.com" target="_blank">Luluvise</a>, London, UK.</div>
</li>
<li>
<h4>Feb 2011 – Mar 2012</h4>
<div>Front-end Solution Architect, <a href="http://catenate.com" target="_blank">catenate</a>/<a href="http://cwerk.com" target="_blank">cwerk</a>, Munich, Germany.</div>
</li>
<li>
<h4>Feb 2010 – Dec 2010</h4>
<div>Web developer, <a href="http://personalnovel.de" target="_blank">PersonalNOVEL</a>, Munich, Germany.</div>
</li>
<li>
<h4>Aug 2008 – Oct 2008</h4>
<div>Web developer / intern, <a href="http://siliconvisions.com.au" target="_blank">Silicon Visions Advertising</a>, Sydney, Australia.</div>
</li>
</ul>
</div>
</div>
</section>
<section id="skills" class="l-container">
<div class="l-grid">
<h1 class="l-grid-row">Skills and Experience</h1>
<div class="l-grid-column-3-1">
<h2 class="skills-headline">Filter</h2>
<span class="skills-button" data-group="*">All</span>
<span class="skills-button s-focus" data-group="frontend">Front-end</span>
<span class="skills-button" data-group="backend">Back-end</span>
<span class="skills-button" data-group="development">Software Development</span>
</div>
<div class="l-grid-column-3-2 skills">
<span class="skills-frontend">Backbone.js</span>
<span class="skills-backend">MySQL</span>
<span class="skills-development">Extreme Programming</span>
<span class="skills-frontend">jQuery / Zepto.js</span>
<span class="skills-development">Agile Software Development</span>
<span class="skills-backend">Mac OS X</span>
<span class="skills-frontend">HTML5</span>
<span class="skills-development skills-backend">Automated Deployments (Ansible, Puppet)</span>
<span class="skills-backend">Django Web Framework</span>
<span class="skills-frontend skills-backend">Internationalisation</span>
<span class="skills-backend">Linux</span>
<span class="skills-frontend">CoffeeScript</span>
<span class="skills-frontend skills-backend skills-development">MVC / MVP</span>
<span class="skills-frontend">Large Scale Web Architecture</span>
<span class="skills-backend">Nginx</span>
<span class="skills-development">Migration from SVN to GIT</span>
<span class="skills-frontend">Angular</span>
<span class="skills-backend">REST API Design</span>
<span class="skills-backend">High Availability</span>
<span class="skills-frontend">Scalable and Modular CSS</span>
<span class="skills-backend">MongoDB</span>
<span class="skills-frontend">Backbone.Marionette</span>
<span class="skills-frontend">CSS3</span>
<span class="skills-backend">Amazon Web Services (AWS)</span>
<span class="skills-development">GIT</span>
<span class="skills-frontend">Phonegap</span>
<span class="skills-backend">Apache</span>
<span class="skills-frontend">Mobile Web Apps</span>
<span class="skills-development">Scrum</span>
</div>
</div>
</section>
<section id="publications" class="l-container">
<div class="l-grid">
<h1 class="l-grid-row">Talks and Publications</h1>
<div class="l-grid-column-2-1">
<h2>Conferences and User Group Meetups</h2>
<p>
Conferences and User Group Meetups give me the chance to connect with other passionate people and share thoughts.<br>I'm a regular attendee of the <a href="http://munichjs.org" target="_blank">Munich Javascript User Group</a> and <a href="http://mnug.de" target="_blank">Munich Node.js User Group</a>.
</p>
<p>
I'm also taking part in organising the <em>Munich Hacknight</em> and <a href="http://refreshmunich.com" target="_blank">RefreshMunich</a>.
</p>
<p>
Aside from attending these I also enjoy giving talks and share my knowledge.
</p>
</div>
<div class="l-grid-column-2-1">
<img src="images/lazyload.jpg" data-original="images/conferences.png" width="400" height="400" class="right lazy" alt="Conferences and User Groups I attended">
</div>
<div class="clearfix l-spacer"></div>
<div class="l-grid-row">
<h2>Talks</h2>
<ul class="styled">
<li>
<h4>Introduction to Coffeescript</h4>
<div>
at <a href="http://munichjs.org" target="_blank">Munich Javascript User Group</a>, 6 July 2011
and at <a href="http://frontendconf.ch" target="_blank">Frontend Conference Zurich</a>, 10 September 2011
<br>
30-45min talk about why you should use Coffeescript
</div>
</li>
<li>
<h4>Structuring front-ends with Backbone.js</h4>
<div>
at <a href="http://munichjs.org" target="_blank">Munich Javascript User Group</a>, 13 October 2011
<br>
30min talk about how to structure front-ends with Backbone.js
</div>
</li>
</ul>
</div>
</div>
</section>
<section id="contact" class="l-container">
<div class="l-grid">
<h1 class="l-grid-row">Contact</h1>
<div class="l-grid-column-2-1">
<h2>Get in touch</h2>
<p>
Interested in working together?
Drop me a line at <a href="mailto:[email protected]">[email protected]</a>.
</p>
</div>
<div class="l-grid-column-2-1">
<h2>Professional Network</h2>
<p>
If you are just looking to connect up to me as a colleague in a shared professional network of
like minded individuals, the best way to do so is by connecting with me on
<a href="http://twitter.com/sebslomski" target="_blank">Twitter</a>,
<a href="http://github.com/sebslomski" target="_blank">Github</a>,
<a href="http://www.xing.com/profile/Sebastian_Slomski" target="_blank">Xing</a> or
<a href="http://uk.linkedin.com/pub/sebastian-slomski/35/400/850" target="_blank">LinkedIn</a>.
</p>
</div>
</div>
</section>
</div>
<footer class="l-container bar">
<div class="l-grid">
<div class="l-grid-column-2-1">
<a class="bar-copyright" href="mailto:[email protected]">© 2012 Sebastian Slomski. Feel free to copy</a>
</div>
<div class="l-grid-column-2-1 bar-links">
<ul class="bar-social hidden">
<li><a class="bar-social-twitter" href="http://twitter.com/sebslomski" target="_blank">Twitter</a></li>
<li><a class="bar-social-github" href="http://github.com/sebslomski" target="_blank">Github</a></li>
<li><a class="bar-social-xing" href="http://www.xing.com/profile/Sebastian_Slomski" target="_blank">Xing</a></li>
<li><a class="bar-social-linkedin" href="http://uk.linkedin.com/pub/sebastian-slomski/35/400/850" target="_blank">LinkedIn</a></li>
</ul>
</div>
</div>
</footer>
</body>
</html>