├── .editorconfig
├── .gitignore
├── .jsbeautifyrc
├── .jshintrc
└── README.md
/.editorconfig:
--------------------------------------------------------------------------------
1 | # This file is for unifying the coding style for different editors and IDEs
2 | # editorconfig.org
3 |
4 | root = true
5 |
6 | [*]
7 | indent_style = space
8 | indent_size = 4
9 | charset = utf-8
10 | trim_trailing_whitespace = true
11 | insert_final_newline = false
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
--------------------------------------------------------------------------------
/.jsbeautifyrc:
--------------------------------------------------------------------------------
1 | {
2 | "css": {
3 | "indentChar": " ",
4 | "indentSize": 4
5 | },
6 | "html": {
7 | "braceStyle": "end-expand",
8 | "indentChar": " ",
9 | "indentScripts": "keep",
10 | "indentSize": 4,
11 | "maxPreserveNewlines": 2,
12 | "preserveNewlines": true,
13 | "unformatted": ["a", "sub", "sup", "b", "i", "u"],
14 | "wrapLineLength": 100
15 | },
16 | "js": {
17 | "braceStyle": "end-expand",
18 | "breakChainedMethods": false,
19 | "e4x": false,
20 | "evalCode": false,
21 | "indentChar": " ",
22 | "indentLevel": 0,
23 | "indentSize": 4,
24 | "indentWithTabs": false,
25 | "jslintHappy": false,
26 | "keepArrayIndentation": true,
27 | "keepFunctionIndentation": true,
28 | "maxPreserveNewlines": 2,
29 | "preserveNewlines": true,
30 | "spaceBeforeConditional": true,
31 | "spaceInParen": false,
32 | "unescapeStrings": false,
33 | "wrapLineLength": 100
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/.jshintrc:
--------------------------------------------------------------------------------
1 | {
2 | "asi": false,
3 | "bitwise": true,
4 | "boss": true,
5 | "browser": true,
6 | "curly": true,
7 | "debug": false,
8 | "eqeqeq": true,
9 | "eqnull": false,
10 | "es5": false,
11 | "esnext": false,
12 | "evil": false,
13 | "expr": true,
14 | "forin": true,
15 | "funcscope": false,
16 | "globalstrict": false,
17 | "immed": true,
18 | "iterator": false,
19 | "lastsemic": false,
20 | "latedef": true,
21 | "laxbreak": false,
22 | "laxcomma": false,
23 | "loopfunc": false,
24 | "maxerr": 10000,
25 | "maxlen": 150,
26 | "multistr": false,
27 | "newcap": true,
28 | "noarg": true,
29 | "node": true,
30 | "noempty": true,
31 | "nomen": false,
32 | "onevar": true,
33 | "passfail": false,
34 | "plusplus": false,
35 | "proto": false,
36 | "quotmark": "single",
37 | "scripturl": true,
38 | "shadow": false,
39 | "smarttabs": false,
40 | "strict": false,
41 | "sub": false,
42 | "supernew": false,
43 | "trailing": true,
44 | "undef": true,
45 | "unused": true,
46 | "white": false
47 | }
48 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # My Coding Style
2 |
3 | For years I've been using different coding conventions for JavaScript development.
4 |
5 | But after reading [Nicholas Zakas's book](http://shop.oreilly.com/product/0636920025245.do) and inspired by [@zeh](https://github.com/zeh/), I've decided to formalize my reasons behind some of the conventions I adopted. Feel free to suggest anything you want :)
6 |
7 | > "All code in any code-base should look like a single person typed it, no matter how many people contributed."
8 |
9 | ## Commits
10 |
11 | Every commit message, pull request title or issue discussion must be in **English**.
12 |
13 | > Reason: English is the universal language nowadays, if you use any other language you're excluding potencial contributors.
14 |
15 | Don't use Past or Present Continuous tenses for commit messages, those should be in Imperative Present tense.
16 |
17 | ```javascript
18 | // Good
19 | Add feature X
20 |
21 | // Bad
22 | Added feature X
23 | Adding feature X
24 | ```
25 |
26 | > Reason: This preference comes from [Git itself](http://git.kernel.org/cgit/git/git.git/tree/Documentation/SubmittingPatches?id=HEAD#n111).
27 |
28 | When releasing a new version, write a commit message in the following format "Release - v1.0.0" instead of "v1.0.0".
29 |
30 | > Reason: Makes it easier to track version releases in git history. For example, you could run `git log --pretty=format:"%H %s" | grep 'Release'` to fetch only version bump commits.
31 |
32 | ## Indentation
33 |
34 | The unit of indentation is **4 spaces**. Never mix spaces and tabs.
35 |
36 | ```javascript
37 | // Good
38 | while (condition) {
39 | statements
40 | }
41 |
42 | // Bad
43 | while (condition) {
44 | statements
45 | }
46 | ```
47 |
48 | > Reason: TODO
49 |
50 | ## Line length
51 |
52 | Avoid lines longer than **100 characters**. When a statement will not fit on a single line, it may be necessary to break it. Place the break after an operator, ideally after a comma. The next line should be indented **4 spaces**.
53 |
54 | ```javascript
55 | // Good
56 | YUI().use('aui-module-a', 'aui-module-b', 'aui-module-c', 'aui-module-d',
57 | 'aui-module-e', 'aui-module-f');
58 |
59 | // Bad
60 | YUI().use('aui-module-a', 'aui-module-b', 'aui-module-c', 'aui-module-d', 'aui-module-e', 'aui-module-f');
61 | ```
62 |
63 | Every project should contain a [.editorconfig](https://github.com/zenorocha/my-coding-style/blob/master/.editorconfig) file that automatically set some indentation definitions. Make sure to install [Editor Config's](http://editorconfig.org/) plugin on your code editor and you'll be all set.
64 |
65 | > Reason: TODO
66 |
67 | ## Linting
68 |
69 | Use [JSHint](http://www.jshint.com/) to detect errors and potential problems.
70 |
71 | The options for JSHint are stored in a [.jshintrc](https://github.com/zenorocha/my-coding-style/blob/master/.jshintrc) file.
72 |
73 | > Reason: TODO
74 |
75 | ## Semicolons
76 |
77 | Relying on ASI (Automatic Semicolon Insertion) can cause hard to debug problems, so don't do it. **Always** use semicolons.
78 |
79 | ```javascript
80 | // Good
81 | a = b + c;
82 | test();
83 |
84 | // Bad
85 | a = b + c
86 | test()
87 | ```
88 |
89 | > Reason: TODO
90 |
91 | ## Variables
92 |
93 | All variables should be declared **before** used. Avoid multiple var statements.
94 |
95 | ```javascript
96 | // Good
97 | var foo = '',
98 | bar = '';
99 |
100 | // Bad
101 | var foo = '';
102 | var bar = '';
103 | ```
104 |
105 | Constants (variables with permanent values) are written **uppercase**.
106 |
107 | ```javascript
108 | // Good
109 | var FOO = 'foo';
110 |
111 | // Bad
112 | var foo = 'foo';
113 | ```
114 |
115 | > Reason: TODO
116 |
117 | ## Strings
118 |
119 | Prefer single quotes over double quotes.
120 |
121 | ```javascript
122 | // Good
123 | var string = 'Lorem Ipsum
';
124 |
125 | // Bad
126 | var string = "Lorem Ipsum
";
127 | ```
128 |
129 | Hexidecimal colors are written **uppercase**.
130 |
131 | ```javascript
132 | // Good
133 | var color = '#D96AB6';
134 |
135 | // Bad
136 | var color = '#d96ab6';
137 | ```
138 |
139 | > Reason: TODO
140 |
141 | ## New lines
142 |
143 | Parentheses `()` and commas `,` are **not** followed by indented children on new lines.
144 |
145 | ```javascript
146 | // Good
147 | YUI().use('aui-module', function (Y) {
148 | statements
149 | });
150 |
151 | // Bad
152 | YUI().use(
153 | 'aui-module',
154 | function (Y) {
155 | statements
156 | }
157 | );
158 | ```
159 |
160 | Curly brackets `{}` are followed by **new lines** and indented children.
161 |
162 | ```javascript
163 | // Good
164 | if (condition) {
165 | statements
166 | }
167 | else {
168 | statements
169 | }
170 |
171 | // Bad
172 | if (condition) {
173 | statements
174 | } else {
175 | statements
176 | }
177 | ```
178 |
179 | > Reason: TODO
180 |
181 | ## Whitespace
182 |
183 | Add spaces between **operators** (`=`, `>`, `*`, etc).
184 |
185 | ```javascript
186 | // Good
187 | for (i = 0; i < 10; i++) {
188 | statements
189 | }
190 |
191 | // Bad
192 | for (i=0;i<10;i++) {
193 | statements
194 | }
195 | ```
196 |
197 | Both function expressions and function declarations **doesn't** have a space between the function keyword and the function name.
198 |
199 | ```javascript
200 | // Good
201 | var foo = function() {
202 | statements
203 | };
204 |
205 | // Bad
206 | var foo = function () {
207 | statements
208 | };
209 |
210 | // Good
211 | function bar() {
212 | statements
213 | }
214 |
215 | // Bad
216 | function bar () {
217 | statements
218 | }
219 | ```
220 |
221 | Add spaces **outside** parentheses `()` but avoid it inside.
222 |
223 | ```javascript
224 | // Good
225 | if (x > 10) {
226 | statements
227 | }
228 |
229 | // Bad
230 | if( x > 10 ){
231 | statements
232 | }
233 | ```
234 |
235 | Empty lines have no trailing spaces.
236 |
237 | > Reason: TODO
238 |
239 | ## Conditionals
240 |
241 | Avoid inline conditionals. Every conditional (with single or multiple statements) should use **curly brackets** `{}`. The only exception to this rule is `else if`.
242 |
243 | ```javascript
244 | // Good
245 | if (condition) {
246 | statements
247 | }
248 | else if (condition) {
249 | statements
250 | }
251 | else {
252 | statements
253 | }
254 |
255 | // Bad
256 | if (condition) statement;
257 | else if (condition) statement;
258 | else statement;
259 | ```
260 |
261 | > Reason: TODO
262 |
263 | ## Equality
264 |
265 | Strict equality checks `===` should be used in favor of `==`.
266 |
267 | ```javascript
268 | // Good
269 | if (foo === 'foo') {
270 | statement
271 | }
272 |
273 | // Bad
274 | if (foo == 'foo') {
275 | statement
276 | }
277 |
278 | // Good
279 | if (bar !== 'bar') {
280 | statement
281 | }
282 |
283 | // Bad
284 | if (bar != 'bar') {
285 | statement
286 | }
287 | ```
288 |
289 | > Reason: TODO
290 |
291 | ## Loops
292 |
293 | Avoid inline loops. Every loop (with single or multiple statements) should use **curly brackets** `{}`.
294 |
295 | ```javascript
296 | // Good
297 | for (initialization; condition; expression) {
298 | statements
299 | }
300 |
301 | // Bad
302 | for (initialization; condition; expression) statement;
303 | ```
304 |
305 | > Reason: TODO
306 |
307 | ## References
308 |
309 | * [Google JavaScript Style Guide](http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml)
310 | * [Douglas Crockford's Code Conventions for JavaScript](http://javascript.crockford.com/code.html)
311 | * [idiomatic.js](https://github.com/rwldrn/idiomatic.js/)
312 | * [jQuery JavaScript Style Guide](http://contribute.jquery.org/style-guide/js/)
313 | * [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript)
314 |
315 | ## License
316 |
317 | [MIT License](http://zenorocha.mit-license.org/) © Zeno Rocha
318 |
--------------------------------------------------------------------------------