-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
239 lines (184 loc) · 9.5 KB
/
about.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
<!DOCTYPE html>
<!--[if IEMobile 7 ]><html class="no-js iem7"><![endif]-->
<!--[if lt IE 9]><html class="no-js lte-ie8"><![endif]-->
<!--[if (gt IE 8)|(gt IEMobile 7)|!(IEMobile)|!(IE)]><!--><html class="no-js" lang="en"><!--<![endif]-->
<head>
<!-- Standard Meta -->
<meta charset="utf-8" />
<!-- Site Properities -->
<title>About | Tales from the Front-end!</title>
<meta name="description" content="Personal site of Colyn Brown, Front-end development consultant (@colynb)" />
<meta name="keywords" content="javascript, nodejs, software development, docpad, octopress, jekyll, php, css, modular design, website design, website development, front-end development" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- DocPad Meta -->
<meta name="generator" content="DocPad v6.54.9" />
<style >html.wait {
cursor: wait !important;
opacity: 0;
transition: opacity 0.5s ease;
}</style><link rel="stylesheet" href="/styles/bootstrap.css" /><link rel="stylesheet" href="/styles/solarized_dark.css" />
<style>
#sidebar {
border-width: 0 0 1px;
padding: 3%;
}
#main {
padding: 0 3%;
}
#footer {
padding: 0 20px;
font-family: arial, helvetica, sans-serif;
font-size: 12px;
}
</style>
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
<![endif]-->
<div>
<header role="banner" id="sidebar" class="col-sm-4">
<aside id="logo" class="text-center ">
<a href="/" class="hidden-xs"><img src="/img/me.png"></a>
<h2>Tales from the<br> <span style="font-size: 56px;">Front End</span></h2>
<h4>All about Javascript, CSS, and ... well just Javascript really.</h4>
</aside>
<div class="visible-xs">
<ul class="nav nav-pills" style="max-width: 390px; margin: 0 auto;">
<li>
<a href="/">Home</a>
</li>
<li class="link"><a href="/pages/about.html">Who is Colyn Brown?</a></li>
<li class="link"><a href="/pages/projects.html">Projects</a></li>
</ul>
<hr>
<div class="text-center" style="max-width: 250px; margin: 0 auto;">
<a href="https://twitter.com/colynb"><img src="/img/twitter-small.png" style="vertical-align: middle;"></a>
<a href="https://github.com/colynb"><img src="/img/github-small.png" style="vertical-align: middle;"></a>
<a href="http://www.linkedin.com/in/colyn/"><img src="/img/linkedin-small.png" style="vertical-align: middle;"></a>
</div>
</div>
<div class="hidden-xs">
<hr>
<ul class="nav nav-stacked" style="max-width: 250px; margin: 0 auto;">
<li>
<a href="/">Home</a>
</li>
<li class="link"><a href="/pages/about.html">Who is Colyn Brown?</a></li>
<li class="link"><a href="/pages/projects.html">Projects</a></li>
</ul>
<hr>
<div class="text-center" style="max-width: 250px; margin: 0 auto;">
<a href="https://twitter.com/colynb"><img src="/img/twitter-small.png" style="vertical-align: middle;"></a>
<a href="https://github.com/colynb"><img src="/img/github-small.png" style="vertical-align: middle;"></a>
<a href="http://www.linkedin.com/in/colyn/"><img src="/img/linkedin-small.png" style="vertical-align: middle;"></a>
</div>
<hr>
</div>
<p class="visible-lg">
<strong>Tweets from the front-end</strong>
<a class="twitter-timeline" href="https://twitter.com/colynb/front-end-development" data-widget-id="364199002167726081">Tweets from @colynb/front-end-development</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</p>
</header>
<section id="main" class="panel panel-default col-sm-8">
<article class="post panel-body">
<label class="label label-default">Tue Aug 27 2013 12:57:08 GMT-0700 (MST)</label>
<h1 class="entry-title">About</h1>
<div><p>My name is Colyn Brown. I've been a web developer since 1995 - almost 20 years now! I've also been raising a family for not much longer than that.</p>
<p>Though my experience in web development covers a lot of areas, I will be focusing this site on front-end development and related technologies. However, as a consumer of dev blogs myself, the biggest problem I see with a lot of blogs especially ones in a tutorial format is that they are quickly out of date. Some of my entries will be written as a tutorial, but I want to avoid this dilemma.</p>
<p>To do that, what I would like to do <em>eventually</em> is get to a point where this site is more like a wiki and less like a journal. Every page on this site will be open source and hosted on GitHub so that anyone who would like to contribute can make changes to any page, thereby keeping them up to date.</p>
<p>As of today, the site is powered by Docpress, and you can read my <a href="/posts/static-site-generation-with-docpad-part-1.html">introductory post</a> on my decision to use it.</p>
</div>
<hr>
Found this useful? <a href="https://twitter.com/share" class="twitter-share-button" data-via="colynb">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
<hr>
<p><a class="btn btn-default" href="https://github.com/colynb/colynb.github.io-SOURCE/blob/master/src/documents/./about.html.md">Edit This Page</a>
<span class="glyphicon glyphicon-hand-left"></span> <span class="text-muted">You too can edit this page! ... just make your change then submit a pull request!</span>
</p>
<hr>
<div id="disqus_thread"></div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'colynb-com'; // required: replace example with your forum shortname
/* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
</article>
</section>
<footer id="footer" class="clearfix">
<hr>
<p><a rel="license" href="http://creativecommons.org/licenses/by-nc/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc/3.0/88x31.png" /></a><br />This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc/3.0/deed.en_US">Creative Commons Attribution-NonCommercial 3.0 Unported License</a>.</p>
<p><small><a href="http://docpad.org//">Powered by Docpad</a></small></p>
</footer>
</div>
<!--- SCripts -->
<script >(function(){
/* Did we just livereload? */
var log = !!(localStorage && console && console.log && true);
if ( log && localStorage.getItem('/docpad-livereload/reloaded') === 'yes' ) {
localStorage.removeItem('/docpad-livereload/reloaded');
console.log('LiveReload completed at', new Date())
}
/* Listen for the regenerated event and perform a reload of the page when the event occurs */
var listen = function(){
var primus = new Primus('/docpad-livereload');
primus.on('data', function(data){
if ( data && data.message ) {
if ( data.message === 'generateBefore' ) {
if ( log ) {
console.log('LiveReload started at', new Date());
}
if ( typeof document.getElementsByTagName !== 'undefined' ) {
document.getElementsByTagName('html')[0].className += ' wait';
}
}
else if ( data.message === 'generateAfter' ) {
if ( log ) {
localStorage.setItem('/docpad-livereload/reloaded', 'yes');
}
document.location.reload();
}
}
});
};
/* Inject socket into our page */
var inject = function(){
var t = document.createElement('script');
t.type = 'text/javascript';
t.async = 'async';
t.src = '/primus/primus.js';
t.onload = listen;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(t, s);
};
if ( typeof Primus !== 'undefined' ) {
listen();
} else {
inject();
}
})();</script><script defer="defer" src="/vendor/log.js"></script><script defer="defer" src="/vendor/modernizr.js"></script><script defer="defer" src="http://code.jquery.com/jquery-1.10.1.min.js"></script><script defer="defer" src="/scripts/script.js"></script><script defer="defer" src="/scripts/bootstrap.js"></script>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'colynb-com'; // required: replace example with your forum shortname
/* * * DON'T EDIT BELOW THIS LINE * * */
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = '//' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
</body>
</html>