What helps us to write HQ JS?

14
Y andex DevDay, Riga 2013 What helps us to write HQ JS?

Transcript of What helps us to write HQ JS?

Page 1: What helps us to write HQ JS?

Yandex DevDay, Riga 2013

What helps us to write HQ JS?

Page 2: What helps us to write HQ JS?

2

HELLO RIGA♥ I’M DMITRII SHCHADEI

@ MeTroFuN

Page 3: What helps us to write HQ JS?

Grand Master Yoda

Many eyes see what one alone cannot

Code review

Page 4: What helps us to write HQ JS?

4

So, why does it work?

• Collective code ownership –  Increase the bus factor –  Increase code reuse

• Skills exchange

• The Ego Effect

Page 5: What helps us to write HQ JS?

5

• Pre and post commit

• Version control agnostic

• Lots of features –  jira integration –  statistics –  progress meter

Page 6: What helps us to write HQ JS?

6

using Pull Requests

• That’s FREE*

• Pre commits only

• No git-flow, Yes github-flow

Page 7: What helps us to write HQ JS?

7

# install on OS X !$ port install hub!!# alias it as git !$ alias git=hub!!# open a pull request for a branch, put its URL to the clipboard!$ git push -u origin feature !$ git pull-request | pbcopy!!# put compare URL for a topic branch to clipboard !$ git compare -u feature | pbcopy!!# see the current project's issues!$ git browse --issues!

makes you better at GitHub

Page 8: What helps us to write HQ JS?

Obi-Wan Kenobi

Mistakes are always easy to see in retrospect

Static code analysis

Page 9: What helps us to write HQ JS?

9

/*jshint unused: true, es5: false, undef: true */!!var foo = { ! !<< Defined but never used!! !a: 1, !!! !b: 2, ! !<< Extra comma!!}, super,! !<< Reserved word!!nums = {}; !!

!for (i = 0; i < 10; i++) { << Not defined!!nums[i] = function (j) { !! !return i + j; !!};! ! ! ! !<< Functions within a loop!

}!

- usage example

Page 10: What helps us to write HQ JS?

• Max number of –  line length –  function params –  function statements –  nested blocks depth

• Tab width and whitespaces

• Quotation marks and lots of other cool staff…

for style guides

Page 11: What helps us to write HQ JS?

11

Force to use…

#!/bin/sh –e!case "${1}" in!!--about ) !! !echo "check *.js files using jshint";;!!* ) !!for FILE in $(git diff --cached --diff-filter=ACMTR --

name-only HEAD | grep -e '\.js$'); do!! !echo jshint $FILE !! !jshint $FILE !!done;;!

esac!

HOOK PRE-COMMIT

Page 12: What helps us to write HQ JS?

12

.column {!!!display: inline-block;!!width: 50%;!!*width: 49%;! ! ! !<< Star prefix found!!font-size: 11px;!!background: rgba(0,0,0,0.5); !<< Fallback should precede !!position: relative;!!float: left;! !<< Can't be used with display: inline-block!

}!.column * { ! ! ! ! !<< Is known to be slow !!display: inline;!!color: black !important;! ! !<< Use of !important!!font-weight: bold; !!!color: red; ! !<< Duplicate property!!-moz-user-select: none; !<< include -ms-user-select !!-webkit-user-select: none;!

}!

- bonus track =)

Page 13: What helps us to write HQ JS?

13

SUFFER THE PAIN OF DISCIPLINE

OR SUFFER THE PAIN OF

REGRET

Page 14: What helps us to write HQ JS?

14

That’s all, Any Questions? @ MeTroFuN