Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Try a little tenderness
Search
masylum
July 01, 2013
0
91
Try a little tenderness
masylum
July 01, 2013
Tweet
Share
More Decks by masylum
See All by masylum
IPFS
masylum
0
180
REST Clients Nordic APIs
masylum
3
220
REST clients
masylum
2
190
Building the best tech-team
masylum
4
200
I love async but I can't code like this
masylum
4
500
Featured
See All Featured
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
21k
Music & Morning Musume
bryan
46
6.7k
Balancing Empowerment & Direction
lara
1
540
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
For a Future-Friendly Web
brad_frost
179
9.9k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
47
9.6k
A designer walks into a library…
pauljervisheath
207
24k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Transcript
Coding is a fucking mess, big programs are complex and
troublesome... follow Ottis advice and Try a little tenderness
Who am I?
Pau Ramon CTO at Teambox ! @masylum github.com/masylum
This talk is about good code style principles
Why caring about style?
Development is not the bottleneck, maintenance is
Code may be ugly, but is what you stare at
all day
Mind your API Expose only what you need
Mind your API var obj = {}; obj.pi = 3.14;
obj.circumference = function (r) { return num * this.pi; };
Mind your API var obj = {}; var pi =
3.14; obj.circumference = function (r) { return r * a; };
Be verbose Good naming
Be verbose function avg(xs) { var s = i =
0; var l = xs.length; for(; i < l; i++;){ s += parseInt(xs[i]); } return s / l; }
Be verbose function average(numbers) { var sum = i =
0; var length = numbers.length; for(; i < length; i++;){ sum += parseInt(numbers[i]); } return sum / length; }
Explicit over Implicit Magic is for magicians
Explicit over Implicit function Dog() { this.speed = 4; }
require(‘run’); var dog = new Dog(); dog.run();
Explicit over Implicit function Dog() { this.speed = 4; }
Dog.prototype.run = require(‘run’); var dog = new Dog(); dog.run();
Careful with DRY It creates dependencies
Careful with DRY function truncateName(el) { var attr = el.type
=== ‘user’ ? ‘fullName’ : ‘name’; return el[attr].substring(0, 40); }
Careful with DRY function truncate(string) { return string.substring(0, 40); }
truncate(user.fullName); truncate(project.name);
Lines of code syndrome The myth of less is more
Lines of code syndrome function isUrgent(id) { if (task =
Task.find(id) && task.urgent) return true; return false; }
Lines of code syndrome function isUrgent(id) { var task =
Task.find(id); if (task && task.urgent) { return true; } return false; }
Self explanatory code Avoid inline comments
Self explanatory code function removeUser(id) { // find user var
user = User.find(id); ... // remove tasks return user.tasks.remove(); }
Self explanatory code function removeUser(id) { var user = findUser(id);
return removeTasks(user); }
Write contracts Document your API
Write contracts // removes the user function removeUser(id) ...
Write contracts /** * Removes the user and all his
* assigned tasks * * @param {Number} id - user id * @return {Boolean} - did work? */ function removeUser(id) ...
Beware of nesting Flow control complexity
Beware of nesting function isComplete(task) { var comment = task.comment;
if (comment) if (comment.status === 3) return true; return task.isResolved(); }
Beware of nesting function isComplete(task) { var comment = task.comment;
if (comment) { return comment.isComplete(); } return task.isResolved(); }
Beware of nesting setTimeout(function () { setTimeout(function () { console.log(‘B’);
}, 10); }, 20);
Beware of nesting ! function secondMethod() { console.log(‘B’); } function
firstMethod() { setTimeout(secondMethod, 10); } setTimeout(firstMethod, 20);
Use tools They are better than you
Use tools • Have static analyzers to detect bad code
practices and syntax errors • Use tools that can provide metrics • Integrate your tools with your editor • Integrate your tools with your process
Use tools • Javascript: JSHint • Ruby: Cane, Rubocop •
IDE • SAAS: Codeclimate
Avoid broken windows With metrics and processes
Avoid broken windows • Before pushing: Git hooks • Before
merging a branch: Travis • Before deploying a release: Jenkins