Ben Smithett bensmithett

I just got back from 4 weeks traveling. I took an iPhone and an iPad, but didn't take my laptop and for the whole time completely ignored the world of web development.

Didn't visit GitHub
Didn't read any dev blog posts
Looked at Twitter once or twice for about 30 seconds (and realised if I wasn't in this industry I probably wouldn't use it at all)
Deleted pretty much every email I received without reading it.

I still used the internet though.

I pulled out my phone whenever I needed directions, opening hours or prices. I did some banking & flight booking. I checked train timetables. Occasionally I posted an update to Facebook or a photo to Instagram. I read the odd news article.

SMACSS + Sass + BEM

SMACSS

Scalable and
Modular
Architecture for
C
S
S

	Rockstar: Liberal Teen
	- looks like they're fun to be around
	- hard worker
	- so much on their plate right now!
	- studying the course they always wanted to, seems to be going really well
	- works a few nights a month to earn cash for maccas and pizza
	- movies with mates are becoming less
	- big, bad world creeping in!
	- study, work & resumes taking over
	- secretly dreams of playing at a higher level

	<!-- this partial takes a boolean "respond" argument -->

	<div class="<%= respond ? "widget--respond" : "widget" %>">
	...
	</div>

	function is_palindrome(str) {
	str = str.toString();
	return str === str.split('').reverse().join('');
	}

	/*
	// Usage...

	is_palindrome('racecar'); // true
	is_palindrome(45654); // true

	brew install ffmpeg
	ffmpeg -start_number 079 -y -r 30 -i "DSC_0%03d.JPG" -vf scale=1920:-1,crop=1920:1080 -vcodec libx264 -b:v 10000k -r 30 outputhd.m4v

	# Optional bits
	# -start_number: the first number in the sequence (default: 0)
	# -y: overwrite output files without asking
	# -r: input framerate (i.e. photos per second. The second -r is the output framerate)
	# -i: input files. %03d = 3 digits (so this example would use DSC_0079.JPG - DSC_0999.JPG)

	# Picked 10000k for the bitrate based on https://support.google.com/youtube/answer/1722171?hl=en

	<ol>
	<li class="inputgroup">
	<label for="someinput">Blah</label>
	<div class="inputs">
	<input type="text" name="someinput" id="someinput" />
	<!-- more inputs + paragraphs, smalls, whatever! -->
	</div>
	</li>
	<!-- etc etc -->
	</ol>

	https://dl.dropbox.com/u/34233166/Screen%20Shot%202013-01-07%20at%2010.00.04%20AM.png
	https://dl.dropbox.com/u/34233166/Screen%20Shot%202013-01-07%20at%2010.01.58%20AM.png

	var $container = $(".container");

	// Woo delegated event handlers (but I have to call on() twice)
	$container.on("click", ".control1", function () {
	// blah
	});

	$container.on("mouseleave", ".control2", function () {
	// blah
	});

	<div class="inputgroup">
	<label for="someinput">Blah</label>
	<div class="inputs">
	<input type="text" name="someinput" id="someinput" />
	<!-- more inputs + paragraphs, smalls, whatever! -->
	</div>
	</div>