From 904ff7445aa4d18640e553cc813f86ccc220a5ae Mon Sep 17 00:00:00 2001 From: alexpausan Date: Fri, 15 Apr 2016 15:13:19 +0300 Subject: [PATCH 01/12] Update style guide on ES-6 --- README.md | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/README.md b/README.md index 39ce51f1ed..c5012aae51 100644 --- a/README.md +++ b/README.md @@ -375,17 +375,13 @@ Other Style Guides [1, 2, 3].map(x => x + 1); // bad - const flat = {}; [[0, 1], [2, 3], [4, 5]].reduce((memo, item, index) => { const flatten = memo.concat(item); - flat[index] = memo.concat(item); }); // good - const flat = {}; - [[0, 1], [2, 3], [4, 5]].reduce((memo, item, index) => { + [[0, 1], [2, 3], [4, 5]].reduce((memo, item, index) => { const flatten = memo.concat(item); - flat[index] = flatten; return flatten; }); @@ -399,7 +395,7 @@ Other Style Guides } }); - // good + // good - use a 'default' return statement inbox.filter((msg) => { const { subject, author } = msg; if (subject === 'Mockingbird') { @@ -476,6 +472,7 @@ Other Style Guides } // the caller selects only the data they need + // the name of the destructured variables should be the same as the ones returned by the function const { left, top } = processInput(input); ``` @@ -496,7 +493,7 @@ Other Style Guides ``` - - [6.2](#strings--line-length) Strings that cause the line to go over 100 characters should be written across multiple lines using string concatenation. + - [6.2](#strings--line-length) Strings that cause the line to go over 80 characters should be written across multiple lines using string concatenation. - [6.3](#strings--concat-perf) Note: If overused, long strings with concatenation could impact performance. [jsPerf](http://jsperf.com/ya-string-concat) & [Discussion](https://github.com/airbnb/javascript/issues/40). From b4cbc920261cf11dd02d59dd42a950e58f4fe199 Mon Sep 17 00:00:00 2001 From: Alex Pausan Date: Fri, 15 Apr 2016 15:41:43 +0300 Subject: [PATCH 02/12] Default value to arguments when destructuring --- README.md | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/README.md b/README.md index c5012aae51..bd5c30cee6 100644 --- a/README.md +++ b/README.md @@ -775,6 +775,26 @@ Other Style Guides } ``` + + - [7.14](#functions--default-value-destructuring) Always use a default value for an argument when destructuring it. + + > Why? Destructuring an undefined/null argument will result in an error. + + ```javascript + + // bad + function getFullName({ firstName, lastName }) { + return `${firstName} ${lastName}`; + } + + // good, defaults to an empty object + function getFullName({ firstName, lastName } = {}) { + return `${firstName} ${lastName}`; + } + ``` + + + **[⬆ back to top](#table-of-contents)** ## Arrow Functions From ce6ed24cfee0a4d310affcb9b074b3376bb1a95b Mon Sep 17 00:00:00 2001 From: alexpausan Date: Fri, 15 Apr 2016 15:53:51 +0300 Subject: [PATCH 03/12] Always use arrow functions parentheses --- README.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index bd5c30cee6..77b2574374 100644 --- a/README.md +++ b/README.md @@ -864,18 +864,15 @@ Other Style Guides ``` - - [8.4](#arrows--one-arg-parens) If your function takes a single argument and doesn’t use braces, omit the parentheses. Otherwise, always include parentheses around arguments. eslint: [`arrow-parens`](http://eslint.org/docs/rules/arrow-parens.html) jscs: [`disallowParenthesesAroundArrowParam`](http://jscs.info/rule/disallowParenthesesAroundArrowParam) + - [8.4](#arrows--one-arg-parens) Always include parentheses around arguments. eslint: [`arrow-parens`](http://eslint.org/docs/rules/arrow-parens.html) jscs: [`disallowParenthesesAroundArrowParam`](http://jscs.info/rule/disallowParenthesesAroundArrowParam) > Why? Less visual clutter. ```js // bad - [1, 2, 3].map((x) => x * x); - - // good [1, 2, 3].map(x => x * x); - // good + // bad [1, 2, 3].map(number => ( `A long string with the ${number}. It’s so long that we’ve broken it ` + 'over multiple lines!' @@ -886,6 +883,9 @@ Other Style Guides const y = x + 1; return x * y; }); + + // good + [1, 2, 3].map((x) => x * x); // good [1, 2, 3].map((x) => { From 9224e25f874ecf10fce65526ebcc4f12da38c6df Mon Sep 17 00:00:00 2001 From: alexpausan Date: Fri, 15 Apr 2016 16:15:53 +0300 Subject: [PATCH 04/12] Wildcard modules and global variables --- README.md | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 77b2574374..78e6e9dc2b 100644 --- a/README.md +++ b/README.md @@ -1028,7 +1028,7 @@ Other Style Guides - [9.5](#constructors--no-useless) Classes have a default constructor if one is not specified. An empty constructor function or one that just delegates to a parent class is unnecessary. eslint: [`no-useless-constructor`](http://eslint.org/docs/rules/no-useless-constructor) ```javascript - // bad + // bad - constructor does nothing class Jedi { constructor() {} @@ -1037,7 +1037,7 @@ Other Style Guides } } - // bad + // bad - constructor just passes the arguments class Rey extends Jedi { constructor(...args) { super(...args); @@ -1102,16 +1102,16 @@ Other Style Guides ``` - - [10.2](#modules--no-wildcard) Do not use wildcard imports. + - [10.2](#modules--no-wildcard) Do not use wildcard imports unless you need all exports from that specific module. - > Why? This makes sure you have a single default export. + > Why? This makes sure you only import what you need from a module. ```javascript // bad import * as AirbnbStyleGuide from './AirbnbStyleGuide'; // good - import AirbnbStyleGuide from './AirbnbStyleGuide'; + import { importA, importB } from './AirbnbStyleGuide'; ``` @@ -1229,14 +1229,18 @@ Other Style Guides ## Variables - - [13.1](#variables--const) Always use `const` to declare variables. Not doing so will result in global variables. We want to avoid polluting the global namespace. Captain Planet warned us of that. + - [13.1](#variables--const) Always use `const` to declare variables. Not doing so will result in global variables. We want to avoid polluting the global namespace. Captain Planet warned us of that. If you need a primitive that will change its value, use `let`. ```javascript // bad superPower = new SuperPower(); + // bad + var primitiveValue = 0; // good const superPower = new SuperPower(); + // good + let primitiveValue = 0; ``` From e0f7e6b62bfa971723de820c2ca41c6ef1e21c49 Mon Sep 17 00:00:00 2001 From: alexpausan Date: Fri, 15 Apr 2016 17:36:44 +0300 Subject: [PATCH 05/12] Final updates of linting --- README.md | 35 ++++++++++++++++++++++------------- 1 file changed, 22 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index 78e6e9dc2b..f17a34187a 100644 --- a/README.md +++ b/README.md @@ -1314,12 +1314,12 @@ Other Style Guides return name; } - // good + // good function checkName(hasName) { if (hasName === 'test') { return false; } - + // we only need to call the function if hasName !== 'test' const name = getName(); if (name === 'test') { @@ -1584,19 +1584,14 @@ Other Style Guides if (test) return false; - // good + // bad if (test) return false; - - // good - if (test) { - return false; - } - + // bad function foo() { return false; } // good - function bar() { + if (test) { return false; } ``` @@ -2019,7 +2014,8 @@ Other Style Guides ``` - - [18.11](#whitespace--in-braces) Add spaces inside curly braces. eslint: [`object-curly-spacing`](http://eslint.org/docs/rules/object-curly-spacing.html) jscs: [`disallowSpacesInsideObjectBrackets`](http://jscs.info/rule/disallowSpacesInsideObjectBrackets) + - [18.11](#whitespace--in-braces) Add spaces inside curly braces, for object declaration and destructuring + - eslint: [`object-curly-spacing`](http://eslint.org/docs/rules/object-curly-spacing.html) jscs: [`disallowSpacesInsideObjectBrackets`](http://jscs.info/rule/disallowSpacesInsideObjectBrackets) ```javascript // bad @@ -2027,6 +2023,18 @@ Other Style Guides // good const foo = { clark: 'kent' }; + + // bad + const {foo, bar} = fooBar; + + // good + const { foo, bar } = fooBar; + + // bad + function({foo, bar}) {...} + + // good + function({ foo, bar }) {...} ``` @@ -2060,7 +2068,8 @@ Other Style Guides ## Commas - - [19.1](#commas--leading-trailing) Leading commas: **Nope.** eslint: [`comma-style`](http://eslint.org/docs/rules/comma-style.html) jscs: [`requireCommaBeforeLineBreak`](http://jscs.info/rule/requireCommaBeforeLineBreak) + - [19.1](#commas--leading-trailing) Leading commas: **Nope.** Use coma after last element if they are on multiple lines. + - eslint: [`comma-style`](http://eslint.org/docs/rules/comma-style.html) jscs: [`requireCommaBeforeLineBreak`](http://jscs.info/rule/requireCommaBeforeLineBreak) ```javascript // bad @@ -2231,7 +2240,7 @@ Other Style Guides ``` - - [21.5](#coercion--bitwise) **Note:** Be careful when using bitshift operations. Numbers are represented as [64-bit values](http://es5.github.io/#x4.3.19), but bitshift operations always return a 32-bit integer ([source](http://es5.github.io/#x11.7)). Bitshift can lead to unexpected behavior for integer values larger than 32 bits. [Discussion](https://github.com/airbnb/javascript/issues/109). Largest signed 32-bit Int is 2,147,483,647: + - [21.5](#coercion--bitwise) **Note:** Use it only if you know what you're doing! Be careful when using bitshift operations. Numbers are represented as [64-bit values](http://es5.github.io/#x4.3.19), but bitshift operations always return a 32-bit integer ([source](http://es5.github.io/#x11.7)). Bitshift can lead to unexpected behavior for integer values larger than 32 bits. [Discussion](https://github.com/airbnb/javascript/issues/109). Largest signed 32-bit Int is 2,147,483,647: ```javascript 2147483647 >> 0 //=> 2147483647 From 76b17b6172aa5705197a31d30ad1e9b894769662 Mon Sep 17 00:00:00 2001 From: alexpausan Date: Mon, 18 Apr 2016 10:54:04 +0300 Subject: [PATCH 06/12] Removed Ruby Style guide --- README.md | 1 - 1 file changed, 1 deletion(-) diff --git a/README.md b/README.md index f17a34187a..5accddf494 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,6 @@ Other Style Guides - [ES5](es5/) - [React](react/) - [CSS & Sass](https://github.com/airbnb/css) - - [Ruby](https://github.com/airbnb/ruby) ## Table of Contents From 622406770b84f097891c248accbe608371778c00 Mon Sep 17 00:00:00 2001 From: alexpausan Date: Mon, 18 Apr 2016 11:52:10 +0300 Subject: [PATCH 07/12] Display Name and file extension styles guide updated --- react/README.md | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/react/README.md b/react/README.md index bdbd27eb11..442ba5381c 100644 --- a/react/README.md +++ b/react/README.md @@ -70,8 +70,8 @@ ## Naming - - **Extensions**: Use `.jsx` extension for React components. - - **Filename**: Use PascalCase for filenames. E.g., `ReservationCard.jsx`. + - **Extensions**: Use `.js` extension for React components. + - **Filename**: Use PascalCase for filenames. E.g., `ReservationCard.js`. - **Reference Naming**: Use PascalCase for React components and camelCase for their instances. eslint: [`react/jsx-pascal-case`](https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-pascal-case.md) ```jsx @@ -88,7 +88,7 @@ const reservationItem = ; ``` - - **Component Naming**: Use the filename as the component name. For example, `ReservationCard.jsx` should have a reference name of `ReservationCard`. However, for root components of a directory, use `index.jsx` as the filename and use the directory name as the component name: + - **Component Naming**: Use the filename as the component name. For example, `ReservationCard.js` should have a reference name of `ReservationCard`. However, for root components of a directory, use `index.js` as the filename and use the directory name as the component name: ```jsx // bad @@ -115,6 +115,10 @@ // good export default class ReservationCard extends React.Component { } + + // good + export default function DummyComponent () { + } ``` ## Alignment From 1bf15fd4eb19d8051fceb33c014016cf4c281be2 Mon Sep 17 00:00:00 2001 From: Robert Richter Date: Mon, 18 Apr 2016 12:08:08 +0300 Subject: [PATCH 08/12] Update package.json --- package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index dc0225dc08..5ecd16c884 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ }, "repository": { "type": "git", - "url": "https://github.com/airbnb/javascript.git" + "url": "https://github.com/evozonjs/javascript.git" }, "keywords": [ "style guide", @@ -22,7 +22,7 @@ "author": "Harrison Shoff (https://twitter.com/hshoff)", "license": "MIT", "bugs": { - "url": "https://github.com/airbnb/javascript/issues" + "url": "https://github.com/evozonjs/javascript/issues" }, - "homepage": "https://github.com/airbnb/javascript" + "homepage": "https://github.com/evozonjs/javascript" } From 5340278f9015f567a83f7866241c8734a7af9b23 Mon Sep 17 00:00:00 2001 From: Robert Richter Date: Mon, 18 Apr 2016 12:09:43 +0300 Subject: [PATCH 09/12] Update package.json --- packages/eslint-config-airbnb/package.json | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/eslint-config-airbnb/package.json b/packages/eslint-config-airbnb/package.json index 6c8a89d24f..79a2e0195e 100644 --- a/packages/eslint-config-airbnb/package.json +++ b/packages/eslint-config-airbnb/package.json @@ -10,7 +10,7 @@ }, "repository": { "type": "git", - "url": "https://github.com/airbnb/javascript" + "url": "https://github.com/evozonjs/javascript" }, "keywords": [ "eslint", @@ -38,9 +38,9 @@ ], "license": "MIT", "bugs": { - "url": "https://github.com/airbnb/javascript/issues" + "url": "https://github.com/evozonjs/javascript/issues" }, - "homepage": "https://github.com/airbnb/javascript", + "homepage": "https://github.com/evozonjs/javascript", "devDependencies": { "babel-tape-runner": "^1.3.1", "eslint": "^2.7.0", From 6f05fb474cdf07c02c4ff734832f780127d6167a Mon Sep 17 00:00:00 2001 From: alexpausan Date: Thu, 21 Apr 2016 09:58:33 +0300 Subject: [PATCH 10/12] Changed name from Airbnb to EvozonJs --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 5accddf494..495646114d 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# Airbnb JavaScript Style Guide() { +# EvozonJs JavaScript Style Guide() { *A mostly reasonable approach to JavaScript* From 6077c1279546d4e2f95e16d9fa3d0cc9f03d399a Mon Sep 17 00:00:00 2001 From: Robert R Date: Thu, 21 Apr 2016 17:25:05 +0300 Subject: [PATCH 11/12] Added evozonjs eslint support --- .gitignore | 1 + linters/.eslintrc | 2 +- linters/README.md | 2 +- package.json | 16 +++++++++++++--- 4 files changed, 16 insertions(+), 5 deletions(-) diff --git a/.gitignore b/.gitignore index 3c3629e647..34977ee7df 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ node_modules +.idea \ No newline at end of file diff --git a/linters/.eslintrc b/linters/.eslintrc index 9e203a5473..3ca1b9b138 100644 --- a/linters/.eslintrc +++ b/linters/.eslintrc @@ -1,5 +1,5 @@ // Use this file as a starting point for your project's .eslintrc. // Copy this file, and add rule overrides as needed. { - "extends": "airbnb" + "extends": "evozonjs", } diff --git a/linters/README.md b/linters/README.md index 1deac701c7..d6e1c40157 100644 --- a/linters/README.md +++ b/linters/README.md @@ -4,7 +4,7 @@ Our `.eslintrc` requires the following NPM packages: ``` npm install --save-dev \ - eslint-config-airbnb \ + eslint-config-evozonjs \ eslint \ babel-eslint \ eslint-plugin-react diff --git a/package.json b/package.json index 5ecd16c884..ea82887f3a 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { - "name": "airbnb-style", - "version": "2.0.0", - "description": "A mostly reasonable approach to JavaScript.", + "name": "evozonjs-style", + "version": "1.0.0", + "description": "A mostly reasonable approach to JavaScript forked from airbnb-style", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "publish-all": "npm publish && cd ./packages/eslint-config-airbnb && npm publish" @@ -20,6 +20,16 @@ "jsx" ], "author": "Harrison Shoff (https://twitter.com/hshoff)", + "contributors": [ + { + "name": "Alex Pausan", + "url": "https://github.com/alexpausan" + }, + { + "name": "Robert Richter", + "url": "https://github.com/robi-richter" + } + ], "license": "MIT", "bugs": { "url": "https://github.com/evozonjs/javascript/issues" From 9b2642da2ff5e357224224c73b1a5250d0566a51 Mon Sep 17 00:00:00 2001 From: alexpausan Date: Wed, 4 May 2016 20:27:18 +0300 Subject: [PATCH 12/12] Updated arrow function argument --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 495646114d..d7a4c3768b 100644 --- a/README.md +++ b/README.md @@ -834,7 +834,7 @@ Other Style Guides }); // good - [1, 2, 3].map(number => `A string containing the ${number}.`); + [1, 2, 3].map((number) => `A string containing the ${number}.`); // good [1, 2, 3].map((number) => {