<!doctype html>
<!--[if !IE]>
<html class="no-js non-ie" lang="en-US"> <![endif]-->
<!--[if IE 7 ]>
<html class="no-js ie7" lang="en-US"> <![endif]-->
<!--[if IE 8 ]>
<html class="no-js ie8" lang="en-US"> <![endif]-->
<!--[if IE 9 ]>
<html class="no-js ie9" lang="en-US"> <![endif]-->
<!--[if gt IE 9]><!-->
<html class="no-js" lang="en-US"> <!--<![endif]-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="">
<link rel="profile" href="http://gmpg.org/xfn/11">

<title>Roy Tomeij</title>
<link rel='dns-prefetch' href='//platform-api.sharethis.com' />
<link rel='dns-prefetch' href='//fonts.googleapis.com' />
<link rel='dns-prefetch' href='//s.w.org' />
<link rel="alternate" type="application/rss+xml" title="Roy Tomeij &raquo; Feed" href="https://roy.io/feed/" />
<link rel="alternate" type="application/rss+xml" title="Roy Tomeij &raquo; Comments Feed" href="https://roy.io/comments/feed/" />
		<script type="text/javascript">
			window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/2.2.1\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/roy.io\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.7.2"}};
			!function(a,b,c){function d(a){var b,c,d,e,f=String.fromCharCode;if(!k||!k.fillText)return!1;switch(k.clearRect(0,0,j.width,j.height),k.textBaseline="top",k.font="600 32px Arial",a){case"flag":return k.fillText(f(55356,56826,55356,56819),0,0),!(j.toDataURL().length<3e3)&&(k.clearRect(0,0,j.width,j.height),k.fillText(f(55356,57331,65039,8205,55356,57096),0,0),b=j.toDataURL(),k.clearRect(0,0,j.width,j.height),k.fillText(f(55356,57331,55356,57096),0,0),c=j.toDataURL(),b!==c);case"emoji4":return k.fillText(f(55357,56425,55356,57341,8205,55357,56507),0,0),d=j.toDataURL(),k.clearRect(0,0,j.width,j.height),k.fillText(f(55357,56425,55356,57341,55357,56507),0,0),e=j.toDataURL(),d!==e}return!1}function e(a){var c=b.createElement("script");c.src=a,c.defer=c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g,h,i,j=b.createElement("canvas"),k=j.getContext&&j.getContext("2d");for(i=Array("flag","emoji4"),c.supports={everything:!0,everythingExceptFlag:!0},h=0;h<i.length;h++)c.supports[i[h]]=d(i[h]),c.supports.everything=c.supports.everything&&c.supports[i[h]],"flag"!==i[h]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[i[h]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
		</script>
		<style type="text/css">
img.wp-smiley,
img.emoji {
	display: inline !important;
	border: none !important;
	box-shadow: none !important;
	height: 1em !important;
	width: 1em !important;
	margin: 0 .07em !important;
	vertical-align: -0.1em !important;
	background: none !important;
	padding: 0 !important;
}
</style>
<link rel='stylesheet' id='crayon-css'  href='https://roy.io/wp-content/plugins/crayon-syntax-highlighter/css/min/crayon.min.css?ver=_2.7.2_beta' type='text/css' media='all' />
<link rel='stylesheet' id='crayon-theme-sublime-text-css'  href='https://roy.io/wp-content/plugins/crayon-syntax-highlighter/themes/sublime-text/sublime-text.css?ver=_2.7.2_beta' type='text/css' media='all' />
<link rel='stylesheet' id='crayon-font-monaco-css'  href='https://roy.io/wp-content/plugins/crayon-syntax-highlighter/fonts/monaco.css?ver=_2.7.2_beta' type='text/css' media='all' />
<link rel='stylesheet' id='sparkling-bootstrap-css'  href='https://roy.io/wp-content/themes/sparkling/inc/css/bootstrap.min.css?ver=4.7.2' type='text/css' media='all' />
<link rel='stylesheet' id='sparkling-icons-css'  href='https://roy.io/wp-content/themes/sparkling/inc/css/font-awesome.min.css?ver=4.7.2' type='text/css' media='all' />
<link rel='stylesheet' id='sparkling-fonts-css'  href='//fonts.googleapis.com/css?family=Open+Sans%3A400italic%2C400%2C600%2C700%7CRoboto+Slab%3A400%2C300%2C700&#038;ver=4.7.2' type='text/css' media='all' />
<link rel='stylesheet' id='sparkling-style-css'  href='https://roy.io/wp-content/themes/sparkling/style.css?ver=4.7.2' type='text/css' media='all' />
<script type='text/javascript' src='https://roy.io/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='https://roy.io/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var CrayonSyntaxSettings = {"version":"_2.7.2_beta","is_admin":"0","ajaxurl":"https:\/\/roy.io\/wp-admin\/admin-ajax.php","prefix":"crayon-","setting":"crayon-setting","selected":"crayon-setting-selected","changed":"crayon-setting-changed","special":"crayon-setting-special","orig_value":"data-orig-value","debug":""};
var CrayonSyntaxStrings = {"copy":"Press %s to Copy, %s to Paste","minimize":"Click To Expand Code"};
/* ]]> */
</script>
<script type='text/javascript' src='https://roy.io/wp-content/plugins/crayon-syntax-highlighter/js/min/crayon.min.js?ver=_2.7.2_beta'></script>
<script type='text/javascript' src='https://roy.io/wp-content/themes/sparkling/inc/js/modernizr.min.js?ver=4.7.2'></script>
<script type='text/javascript' src='https://roy.io/wp-content/themes/sparkling/inc/js/bootstrap.min.js?ver=4.7.2'></script>
<script type='text/javascript' src='https://roy.io/wp-content/themes/sparkling/inc/js/functions.min.js?ver=4.7.2'></script>
<script type='text/javascript' src='//platform-api.sharethis.com/js/sharethis.js#product=ga'></script>
<link rel='https://api.w.org/' href='https://roy.io/wp-json/' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://roy.io/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://roy.io/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 4.7.2" />
<style type="text/css">a:hover, a:active, #secondary .widget .post-content a:hover,
        .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover,
        .woocommerce nav.woocommerce-pagination ul li span.current  {color: #555555;}.btn-default, .label-default, .flex-caption h2, .btn.btn-default.read-more,button,
              .navigation .wp-pagenavi-pagination span.current,.navigation .wp-pagenavi-pagination a:hover,
              .woocommerce a.button, .woocommerce button.button,
              .woocommerce input.button, .woocommerce #respond input#submit.alt,
              .woocommerce a.button, .woocommerce button.button,
              .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background-color: #da4453; border-color: #da4453;}.site-main [class*="navigation"] a, .more-link, .pagination>li>a, .pagination>li>span { color: #da4453}.entry-content {font-family: ; font-size:16px; font-weight: normal; color:#555555;}#secondary .widget, #secondary .widget a { color: #555; } #secondary .widget_text a { color: #da4453; }</style>	<style type="text/css">
			.navbar > .container .navbar-brand {
			color: #ffffff;
		}
		</style>
	
</head>

<body class="home blog">
<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>
<div id="page" class="hfeed site">

	<header id="masthead" class="site-header" role="banner">
		<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
			<div class="container">
				<div class="row">
					<div class="site-navigation-inner col-sm-12">
						<div class="navbar-header">
							<button type="button" class="btn navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
								<span class="sr-only">Toggle navigation</span>
								<span class="icon-bar"></span>
								<span class="icon-bar"></span>
								<span class="icon-bar"></span>
							</button>

							
							
							<div id="logo">
								<h1 class="site-name">									<a class="navbar-brand" href="https://roy.io/" title="Roy Tomeij" rel="home">Roy Tomeij</a>
								</h1>							</div><!-- end of #logo -->

							
						</div>
						<div class="collapse navbar-collapse navbar-ex1-collapse"><ul id="menu-header-nav" class="nav navbar-nav"><li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-23"><a title="About" href="https://roy.io/about/">About</a></li>
<li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-28"><a title="Speaking &#038; teaching" href="https://roy.io/speaking-teaching/">Speaking &#038; teaching</a></li>
<li id="menu-item-44" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-44"><a title="Contact" href="https://roy.io/contact/">Contact</a></li>
</ul></div>					</div>
				</div>
			</div>
		</nav><!-- .site-navigation -->
	</header><!-- #masthead -->

	<div id="content" class="site-content">

		<div class="top-section">
								</div>

		<div class="container main-content-area">
            			<div class="row side-pull-left">
				<div class="main-content-inner col-sm-12 col-md-8">

	<div id="primary" class="content-area">
		<main id="main" class="site-main" role="main">

		
<article id="post-84" class="post-84 post type-post status-publish format-standard hentry category-miscellaneous tag-digital-ocean tag-server tag-ssl">
	<div class="blog-item-wrap">
				<a href="https://roy.io/forcing-ssl-and-redirecting-www-on-a-digitalocean-wordpress-droplet/" title="Forcing SSL and redirecting www. on a DigitalOcean WordPress droplet" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/forcing-ssl-and-redirecting-www-on-a-digitalocean-wordpress-droplet/" rel="bookmark">Forcing SSL and redirecting www. on a DigitalOcean WordPress droplet</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/forcing-ssl-and-redirecting-www-on-a-digitalocean-wordpress-droplet/" rel="bookmark"><time class="entry-date published" datetime="2017-01-02T22:12:19+00:00">January 2, 2017</time><time class="updated" datetime="2017-01-03T10:11:38+00:00">January 3, 2017</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/forcing-ssl-and-redirecting-www-on-a-digitalocean-wordpress-droplet/#respond"><span class="dsq-postid" data-dsqidentifier="84 https://roy.io/?p=84">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>Congratulations, you just created a new blog on a DigitalOcean droplet using their &#8220;One-click apps&#8221;! But, security conscious as you are, you want it to run over SSL exclusively, and force traffic from www.example.com to example.com for SEO purposes. When running the default letsencrypt script, as advertized,  it only creates and sets up a certificate for [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/forcing-ssl-and-redirecting-www-on-a-digitalocean-wordpress-droplet/" title="Forcing SSL and redirecting www. on a DigitalOcean WordPress droplet">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-7" class="post-7 post type-post status-publish format-standard hentry category-home-automation tag-domoticz tag-fibaro tag-itho tag-ventilation">
	<div class="blog-item-wrap">
				<a href="https://roy.io/controlling-itho-cve-eco-ventilation-with-domoticz/" title="Controlling Itho CVE ECO ventilation with Domoticz" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/controlling-itho-cve-eco-ventilation-with-domoticz/" rel="bookmark">Controlling Itho CVE ECO ventilation with Domoticz</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/controlling-itho-cve-eco-ventilation-with-domoticz/" rel="bookmark"><time class="entry-date published" datetime="2016-12-29T19:58:55+00:00">December 29, 2016</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/controlling-itho-cve-eco-ventilation-with-domoticz/#respond"><span class="dsq-postid" data-dsqidentifier="7 http://188.166.26.64/?p=7">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>For ventilation our 17 year old house is equipped with an Itho air handler for mechanical ventilation. Exhausts in the kitchen, toilet and bathroom make sure that fresh air gets pulled in through ventilation inlets located over the windows. The air handler made a lot of noise for the past few years, so we mostly had it unplugged. Since that&#8217;s [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/controlling-itho-cve-eco-ventilation-with-domoticz/" title="Controlling Itho CVE ECO ventilation with Domoticz">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-77" class="post-77 post type-post status-publish format-standard hentry category-web-development tag-sass">
	<div class="blog-item-wrap">
				<a href="https://roy.io/having-fun-with-sass-lists-and-strings/" title="Having fun with Sass lists and strings" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/having-fun-with-sass-lists-and-strings/" rel="bookmark">Having fun with Sass lists and strings</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/having-fun-with-sass-lists-and-strings/" rel="bookmark"><time class="entry-date published" datetime="2013-10-16T00:00:34+00:00">October 16, 2013</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/having-fun-with-sass-lists-and-strings/#comments"><span class="dsq-postid" data-dsqidentifier="77 https://roy.io/?p=77">4 Comments</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>At SassConf I presented a one hour &#8220;featured workshop&#8221; on lists, while also touching on new Sass 3.3 features such as maps and string functions. After all, the best way to learn how new functionality works is to toy around with it (and break stuff), so I decided to create an &#8220;animation trajectory grid&#8221; (or [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/having-fun-with-sass-lists-and-strings/" title="Having fun with Sass lists and strings">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-75" class="post-75 post type-post status-publish format-standard hentry category-web-development tag-css tag-sass">
	<div class="blog-item-wrap">
				<a href="https://roy.io/should-you-use-a-sass-mixin-or-extend/" title="Should you use a Sass mixin or @extend?" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/should-you-use-a-sass-mixin-or-extend/" rel="bookmark">Should you use a Sass mixin or @extend?</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/should-you-use-a-sass-mixin-or-extend/" rel="bookmark"><time class="entry-date published" datetime="2013-07-26T00:00:29+00:00">July 26, 2013</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/should-you-use-a-sass-mixin-or-extend/#comments"><span class="dsq-postid" data-dsqidentifier="75 https://roy.io/?p=75">3 Comments</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>If you want to DRY your CSS, the easiest way is to start using a pre-processor like Sass. Specially in the beginning though, you need to regularly look at what your Sass compiles to. By using mixins for instance, you can seriously scale back the amount of code you need to write. But if you [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/should-you-use-a-sass-mixin-or-extend/" title="Should you use a Sass mixin or @extend?">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-73" class="post-73 post type-post status-publish format-standard hentry category-web-development tag-css tag-sass">
	<div class="blog-item-wrap">
				<a href="https://roy.io/the-missing-media-query-element-dimensions/" title="The missing media query: element dimensions" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/the-missing-media-query-element-dimensions/" rel="bookmark">The missing media query: element dimensions</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/the-missing-media-query-element-dimensions/" rel="bookmark"><time class="entry-date published" datetime="2012-12-12T00:00:35+00:00">December 12, 2012</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/the-missing-media-query-element-dimensions/#respond"><span class="dsq-postid" data-dsqidentifier="73 https://roy.io/?p=73">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>A few weeks ago Wes Oudshoorn, a UI/UX designer we&#8217;re fortunate to work with on AppSignal, asked if I knew a way to make media queries relative to an element instead of the viewport. I did not, but it didn&#8217;t take long for me to understand that this is a feature that would make writing [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/the-missing-media-query-element-dimensions/" title="The missing media query: element dimensions">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-70" class="post-70 post type-post status-publish format-standard hentry category-web-development tag-rails tag-ruby">
	<div class="blog-item-wrap">
				<a href="https://roy.io/fostering-a-development-community/" title="Fostering a development community" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/fostering-a-development-community/" rel="bookmark">Fostering a development community</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/fostering-a-development-community/" rel="bookmark"><time class="entry-date published" datetime="2012-10-01T00:00:29+00:00">October 1, 2012</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/fostering-a-development-community/#respond"><span class="dsq-postid" data-dsqidentifier="70 https://roy.io/?p=70">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>Yesterday I wrote a controversial article about how I see and hear that the Ruby community is more and more influenced by poor developers. I knew it would stir up a shit storm, but the amount of tweets and comments on various sites still surprised me. We&#8217;re talking 7,000+ unique visitors in the first 18 [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/fostering-a-development-community/" title="Fostering a development community">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-68" class="post-68 post type-post status-publish format-standard hentry category-web-development tag-rails tag-ruby">
	<div class="blog-item-wrap">
				<a href="https://roy.io/will-rails-be-the-new-php/" title="Will Rails be the new PHP?" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/will-rails-be-the-new-php/" rel="bookmark">Will Rails be the new PHP?</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/will-rails-be-the-new-php/" rel="bookmark"><time class="entry-date published" datetime="2012-09-29T00:00:24+00:00">September 29, 2012</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/will-rails-be-the-new-php/#respond"><span class="dsq-postid" data-dsqidentifier="68 https://roy.io/?p=68">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>UPDATE 2: Here&#8217;s a follow-up to this post with some thoughts on how we can turn the tide if what&#8217;s to follow below is true. UPDATE: I&#8217;m sure this is going to feel like an uncool move, but I&#8217;m not only not going to respond to all individual comments, I also closed the thread. Anything [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/will-rails-be-the-new-php/" title="Will Rails be the new PHP?">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-65" class="post-65 post type-post status-publish format-standard hentry category-web-development tag-html tag-js tag-performance">
	<div class="blog-item-wrap">
				<a href="https://roy.io/follow-up-dont-use-class-names-to-find-html-elements-with-js/" title="Follow-up: Don&#8217;t use class names to find HTML elements with JS" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/follow-up-dont-use-class-names-to-find-html-elements-with-js/" rel="bookmark">Follow-up: Don&#8217;t use class names to find HTML elements with JS</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/follow-up-dont-use-class-names-to-find-html-elements-with-js/" rel="bookmark"><time class="entry-date published" datetime="2012-09-13T00:00:05+00:00">September 13, 2012</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/follow-up-dont-use-class-names-to-find-html-elements-with-js/#respond"><span class="dsq-postid" data-dsqidentifier="65 https://roy.io/?p=65">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>This is the follow-up to &#8220;Don&#8217;t use class names to find HTML elements with JS&#8220;, where we take a look at a new test case, with results proving that the negative speed impact of finding elements by data attribute instead of by class name is negligible. The reasons for using this approach are in the [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/follow-up-dont-use-class-names-to-find-html-elements-with-js/" title="Follow-up: Don&#8217;t use class names to find HTML elements with JS">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-60" class="post-60 post type-post status-publish format-standard hentry category-miscellaneous">
	<div class="blog-item-wrap">
				<a href="https://roy.io/my-first-legally-binding-contract-at-age-11/" title="My first legally binding contract (at age 11)" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/my-first-legally-binding-contract-at-age-11/" rel="bookmark">My first legally binding contract (at age 11)</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/my-first-legally-binding-contract-at-age-11/" rel="bookmark"><time class="entry-date published" datetime="2012-09-09T00:00:11+00:00">September 9, 2012</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/my-first-legally-binding-contract-at-age-11/#respond"><span class="dsq-postid" data-dsqidentifier="60 https://roy.io/?p=60">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>Recently my mother, while going through junk accumulated over the past 30 years, found a contract I made at age 11. I&#8217;m astonished that 1: it has so little spelling errors, and 2: this seems to be a legally binding contract. It has a date, the city where the document was signed, the names of [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/my-first-legally-binding-contract-at-age-11/" title="My first legally binding contract (at age 11)">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

<article id="post-58" class="post-58 post type-post status-publish format-standard hentry category-miscellaneous tag-speaking">
	<div class="blog-item-wrap">
				<a href="https://roy.io/on-public-speaking/" title="On public speaking" >
			 				</a>
		<div class="post-inner-content">
			<header class="entry-header page-header">

				<h2 class="entry-title"><a href="https://roy.io/on-public-speaking/" rel="bookmark">On public speaking</a></h2>

								<div class="entry-meta">
					<span class="posted-on"><i class="fa fa-calendar"></i> <a href="https://roy.io/on-public-speaking/" rel="bookmark"><time class="entry-date published" datetime="2012-06-23T00:00:48+00:00">June 23, 2012</time><time class="updated" datetime="2016-12-30T20:05:19+00:00">December 30, 2016</time></a></span><span class="byline"> <i class="fa fa-user"></i> <span class="author vcard"><a class="url fn n" href="https://roy.io/author/roy/">Roy</a></span></span>				<span class="comments-link"><i class="fa fa-comment-o"></i><a href="https://roy.io/on-public-speaking/#respond"><span class="dsq-postid" data-dsqidentifier="58 https://roy.io/?p=58">Leave a comment</span></a></span>
				
				
				</div><!-- .entry-meta -->
							</header><!-- .entry-header -->

						<div class="entry-content">

				<p>This week Zach Holman and Chiu-Ki Chan wrote about public speaking. While I&#8217;m not claiming to be a very experienced speaker, I have my two cents to add after being involved with some conferences, etc. Here&#8217;s my take on slides, rehearsing, introductions, Q&amp;A and more. I&#8217;m mixing some practicalities in here too, things I do [&hellip;]</p>
					<p><a class="btn btn-default read-more" href="https://roy.io/on-public-speaking/" title="On public speaking">Read More</a></p>
				
							</div><!-- .entry-content -->
					</div>
	</div>
</article><!-- #post-## -->

	<nav class="navigation pagination" role="navigation">
		<h2 class="screen-reader-text">Posts navigation</h2>
		<div class="nav-links"><span class='page-numbers current'>1</span>
<a class='page-numbers' href='https://roy.io/page/2/'>2</a>
<a class="next page-numbers" href="https://roy.io/page/2/">Older posts <i class="fa fa-chevron-right"></i></a></div>
	</nav>
		</main><!-- #main -->
	</div><!-- #primary -->

</div>
	<div id="secondary" class="widget-area col-sm-12 col-md-4" role="complementary">
		<div class="well">
						<aside id="text-2" class="widget widget_text"><h3 class="widget-title">About</h3>			<div class="textwidget">Hi, I'm Roy Tomeij. I co-founded <a href="https://appsignal.com">AppSignal</a>, and <a href="/speaking-teaching">speak & teach</a> about web development and business.</div>
		</aside><aside id="search-2" class="widget widget_search">
<form role="search" method="get" class="form-search" action="https://roy.io/">
  <div class="input-group">
  	<label class="screen-reader-text" for="s">Search for:</label>
    <input type="text" class="form-control search-query" placeholder="Search&hellip;" value="" name="s" title="Search for:" />
    <span class="input-group-btn">
      <button type="submit" class="btn btn-default" name="submit" id="searchsubmit" value="Search"><span class="glyphicon glyphicon-search"></span></button>
    </span>
  </div>
</form></aside>		<aside id="recent-posts-2" class="widget widget_recent_entries">		<h3 class="widget-title">Recent Posts</h3>		<ul>
					<li>
				<a href="https://roy.io/forcing-ssl-and-redirecting-www-on-a-digitalocean-wordpress-droplet/">Forcing SSL and redirecting www. on a DigitalOcean WordPress droplet</a>
						</li>
					<li>
				<a href="https://roy.io/controlling-itho-cve-eco-ventilation-with-domoticz/">Controlling Itho CVE ECO ventilation with Domoticz</a>
						</li>
					<li>
				<a href="https://roy.io/having-fun-with-sass-lists-and-strings/">Having fun with Sass lists and strings</a>
						</li>
					<li>
				<a href="https://roy.io/should-you-use-a-sass-mixin-or-extend/">Should you use a Sass mixin or @extend?</a>
						</li>
					<li>
				<a href="https://roy.io/the-missing-media-query-element-dimensions/">The missing media query: element dimensions</a>
						</li>
				</ul>
		</aside>		<aside id="categories-2" class="widget widget_categories"><h3 class="widget-title">Categories</h3>		<ul>
	<li class="cat-item cat-item-2"><a href="https://roy.io/category/home-automation/" >home automation</a> (1)
</li>
	<li class="cat-item cat-item-1"><a href="https://roy.io/category/miscellaneous/" >miscellaneous</a> (3)
</li>
	<li class="cat-item cat-item-8"><a href="https://roy.io/category/web-development/" >web development</a> (11)
</li>
		</ul>
</aside>		</div>
	</div><!-- #secondary -->
		</div><!-- close .row -->
	</div><!-- close .container -->
</div><!-- close .site-content -->

	<div id="footer-area">
		<div class="container footer-inner">
			<div class="row">
				
				</div>
		</div>

		<footer id="colophon" class="site-footer" role="contentinfo">
			<div class="site-info container">
				<div class="row">
										<nav role="navigation" class="col-md-6">
											</nav>
					<div class="copyright col-md-6">
						sparkling						Theme by <a href="http://colorlib.com/" target="_blank">Colorlib</a> Powered by <a href="http://wordpress.org/" target="_blank">WordPress</a>					</div>
				</div>
			</div><!-- .site-info -->
			<div class="scroll-to-top"><i class="fa fa-angle-up"></i></div><!-- .scroll-to-top -->
		</footer><!-- #colophon -->
	</div>
</div><!-- #page -->

  <script type="text/javascript">
    jQuery( document ).ready( function( $ ){
      if ( $( window ).width() >= 767 ){
        $( '.navbar-nav > li.menu-item > a' ).click( function(){
            if( $( this ).attr('target') !== '_blank' ){
                window.location = $( this ).attr( 'href' );
            }else{
                var win = window.open($( this ).attr( 'href' ), '_blank');
                win.focus();
            }
        });
      }
    });
  </script>
<script>
    jQuery(document).ready(function () {
		jQuery.post('https://roy.io?ga_action=googleanalytics_get_script', {action: 'googleanalytics_get_script'}, function(response) {
			var F = new Function ( response );
			return( F() );
		});
    });
</script><script type='text/javascript' src='https://roy.io/wp-content/themes/sparkling/inc/js/skip-link-focus-fix.js?ver=20140222'></script>
<script type='text/javascript' src='https://roy.io/wp-includes/js/wp-embed.min.js?ver=4.7.2'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var countVars = {"disqusShortname":"roytomeij"};
/* ]]> */
</script>
<script type='text/javascript' src='https://roy.io/wp-content/plugins/disqus-comment-system/media/js/count.js?ver=4.7.2'></script>

</body>
</html>