Fixes #1474 - added pre-commit linter

docs/pr-coding-guidelines.md

@@ -19,34 +19,34 @@ All code contributions should come in the form of a pull request, as a topic bra
 
     ```bash
     # makes sure, you are on the master branch
-    git checkout master 
-    
+    git checkout master
+
     # if you are SURE your fork is up-to-date
     git pull origin master
-    
-    # OR 
+
+    # OR
     # if you are NOT SURE your fork is up-to-date
     git pull upstream master  
-    
+
     # creates new branch
     git checkout -b issues/NumberOfIssue/VersionOfPR  
     ```
 
 5. Create your patch; commit your changes. Referencing the issue number you're working on from the message is recommended.
 
     > Note: Please keep the title under 50 chars. If you'd like to provide more information, just add the details to the commit body.
-    
+
     ```bash
     # check for changed files
     git status
-    
+
     # add files to commit, e.g. as following
-    git add file.js foldername/foldername2/file2.js 
-    
+    git add file.js foldername/foldername2/file2.js
+
     # add commit message including issue number
     git commit -m 'Issue #NumberOfIssue - Fixes broken layout on mobile browsers'    
     ```
-    
+
 6. Push your branch to GitHub:
 
     `git push origin issues/NumberOfIssue/VersionOfPR`
@@ -148,7 +148,18 @@ The js folder contains two subfolders: `lib` contains all project source files a
 
 > Note: All code changes should be made to the files in `lib`
 
-@@something to write by miketaylr@@
+#### Linting
+
+To make it easier for everyone to contribute, we use [eslint](http://eslint.org/) to keep the code base steady. You can view the rules in our [ESLint config](https://github.com/webcompat/webcompat.com/blob/master/.eslintrc#L34). For further explanation of the rules, please have a look at the [ESLint documentation](http://eslint.org/docs/rules/).
+
+For the linting process, we use [Prettier](http://jlongster.com/A-Prettier-Formatter).
+
+In order to avoid errors during a Pull Request, `npm run lint` will be executed before each commit.
+
+`npm run lint` checks all relevant JavaScript files and displays, if something needs to be fixed.
 
+If you get an error displayed, there are two ways to fix it.
+1. You can run `npm run fix` automatically, which is great for small issues like missing spaces or lines in various files.
+2. You can correct it manually as every error message includes the file and line of the error as well as the rule which was violated will be displayed..
 
 Hopefully this will help you clear up a few struggles.

package.json

@@ -13,12 +13,16 @@
   "engines": {
     "node": ">= 4.x"
   },
-  "devDependencies": {
+  "dependencies": {
     "cssrecipes-custom-media-queries": "0.3.0",
     "cssrecipes-defaults": "^0.5.0",
     "cssrecipes-grid": "^1.0.0",
     "cssrecipes-reset": "^0.5.0",
     "cssrecipes-utils": "^0.6.2",
+    "suitcss-utils-align": "^0.2.0",
+    "suitcss-utils-display": "^0.4.0"
+  },
+  "devDependencies": {
     "eslint": "^3.4.0",
     "eslint-config-prettier": "^1.6.0",
     "eslint-plugin-prettier": "^2.0.1",
@@ -32,17 +36,17 @@
     "grunt-contrib-watch": "^1.0.0",
     "grunt-postcss": "^0.8.0",
     "grunt-travis-lint": "0.0.3",
+    "husky": "^0.13.3",
     "intern": "3.4.0",
+    "lint-staged": "^3.4.0",
     "load-grunt-tasks": "^3.5.2",
     "postcss": "^5.2.14",
     "postcss-browser-reporter": "^0.4.0",
     "postcss-cssnext": "^2.9.0",
     "postcss-import": "^8.0.2",
     "postcss-reporter": "^3.0.0",
     "postcss-url": "^5.1.1",
-    "prettier": "^1.1.0",
-    "suitcss-utils-align": "^0.2.0",
-    "suitcss-utils-display": "^0.4.0"
+    "prettier": "1.1.0"
   },
   "scripts": {
     "setup": "npm run module && npm run virtualenv && npm install && npm run config",
@@ -57,7 +61,11 @@
     "virtualenv": "pip install virtualenv && virtualenv env && source env/bin/activate || . env/bin/activate && npm run pip",
     "pip": "pip install -r config/requirements.txt",
     "config": "cp config/secrets.py.example config/secrets.py",
-    "project-update": "pip install --upgrade pip && npm update"
+    "project-update": "pip install --upgrade pip && npm update",
+    "precommit": "lint-staged"
+  },
+  "lint-staged": {
+    "*.js": "lint"
   },
   "license": "MPL-2.0"
 }