ethanlin-twer / frontend-nanodegree-arcade-game Goto Github PK

EthanLin-TWer/ethanlin-twer.github.io#141

1 on 1 scheduled: https://calendly.com/udacity-china/1-on-1/03-20-2017

• yad babel-core babel-preset-es2015 babel-preset-stage-0
• touch .babelrc with presets es2015 and stage-0

work with es7 for babel:

• https://github.com/babel/babel-eslint
• http://eslint.org/docs/user-guide/configuring

• npm init
• npm install -g yarn
• commit yarn.lock file
• run npm test in travis script section
• add node_modules to .gitignore file
• cache yarn in travis

Pitfall: use yarn to install dependencies every time after yarn.lock is introduced instead of using npm. Otherwise dependencies can't get resolved correctly by travis calling yarn

• introduce browserify, babelify, watchify
• add npm build script: browserify js/*.js -o dist/bundle.js
• add npm buildDev script: watchify js/*.js -o dist/bundle.js -t babelify

code to copy:

• https://github.com/linesh-simplicity/peak-chrome-extension/blob/master/package.json
• https://github.com/linesh-simplicity/frontend-nanodegree-arcade-game/blob/master/package.json

• https://gist.github.com/pgilad/5d7e4db725a906bd7aa7
• https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks
• http://stackoverflow.com/questions/29568414/git-hook-commit-msg-to-ensure-the-commit-message-contains-a-string-that-conforms

• 必须有自己的名字
• 必须有 issue number（没需求就不做卡）
• 必须有 前缀（feature/refactor/fix/chore/style/docs）
• 前缀后面必须有冒号
• 冒号后面必须有一个空格
• 空格后面必须小写开头
• 必须不多于70个字符
• 详细的错误信息

后两个太难，暂时放弃了。

#!/bin/sh

commit_regex="\[Linesh\]\[#\d*\]\s\(Chore\|Feature\|Fix\|Docs\|Style\|Refactor\|Test\):\s[a-z]"
error_msg="Aborting commit, please double check your commit message."

if ! echo "$1" | grep -iqE "$commit_regex" ;
then
        echo "$error_msg" >&2
        exit 1
fi

• yad mocha chai sinon

• http://eslint.org/docs/user-guide/getting-started
• https://docs.travis-ci.com/user/languages/javascript-with-nodejs/
• existing eslint styleguide: https://github.com/linesh-simplicity/frontend-nanodegree-arcade-game/blob/master/.eslintrc.json

• npm install -g eslint
• yad eslint
• run eslint --init or copy existing eslint styleguide
• add eslint js/ test/ to npm scripts
• add npm run lint to .travis.yml but disable it for the moment
• enable eslint in IDE

• include 'dist/bundle.js' in index.html
• fix browser errors

• yad babel-register for mocha to compile es6 tests
• create test directory and a sample test file
• import { expect } from 'chai'
• import { describe, it } from 'mocha'
• add npm test script: "test": "mocha test/ --recursive --compilers js:babel-core/register"

https://docs.travis-ci.com/user/languages/javascript-with-nodejs/

上次的 code review

• https://github.com/beautify-web/js-beautify
• https://gist.github.com/PurpleBooth/109311bb0361f32d87a2
• https://github.com/matiassingers/awesome-readme
• https://github.com/eslint/eslint
• http://ife.baidu.com/
• http://usejsdoc.org/about-getting-started.html
• https://review.udacity.com/#!/reviews/406997

自残

Read recommended es6 styleguide and eslint configurations:

• https://github.com/airbnb/javascript
• https://github.com/feross/standard
• https://github.com/feross/eslint-config-standard
• https://github.com/ouvens/es6-code-style-guide
• https://github.com/starriness/es6-coding-style

http://legacy.sinonjs.org/docs/

https://github.com/udacity/frontend-nanodegree-styleguide-zh/blob/master/%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%B8%88%E7%BA%B3%E7%B1%B3%E5%AD%A6%E4%BD%8D%E6%A0%B7%E5%BC%8F%E6%8C%87%E5%8D%97%20-%20JavaScript.md

自己根据 ES6 Styleguide 进行了一些取舍：

• UTF-8。不知道如何使用 ESLint 验证
• 注释。我觉得注释蛮没有必要的，保留意见
• 分号。我觉得始终不采用分号
• 变量命令。完全遵循同意
• 字符串使用单引号。完全同意
• 尽量使用 const。 prefer-const
• 始终不使用 var。no-var
• http://eslint.org/docs/rules/quote-props.html