VSCode の LiveShare 機能が強い
ペアプロ実施しました。
今回はテスト駆動開発とコーディング規約を確認しつつ、FizzBuzz を実装するという話をしました。
LiveShare 上のターミナルに node のパスが通ってなかったので、結局 CLI で ESLint と Mocha の実行ができませんでしたが、本来であればそこも含めていい感じの体験になる予定でした。
(新しい cmd では、基本的なパスが通っていない状態で起動される…？)
ペアプログラミングは、一緒にコーディングを行うことで文化や方向性、意図といったものが体感的に伝えることができるので、人材育成やチームメンバーレベルの統一にも適しています。
特に VSCode 上の LiveShare プログラムは、画面共有に比べ遅延が少ないことに加え、ターミナルやサーバーも権限によって共有できるので、直接的でペアプロに適しています。
実施内容について
主に mocha をテストツールとして使用し、TDD で実施していきます。
今回は test/test.js に直に実装してもらいました。画面が切り替わると実装者がどこを見ているのか追えない可能性があるので、1 ファイルにまとめた方が無難でした。
package.json はこちらで書いておき、CLI もしくは VSCode のプラグインやタスクも含めて実行してもらえるようにしておくと良いです。
//test/test.js
var assert = require('assert');
describe('ペアプロ用テスト', function() {
it('ここにテスト1を書いていきます', function() {
//assert.equal(実測値、 期待値)でテストします。
assert.equal(plus(1, 1), 2);
});
});
// コマンド コーディング規約を適用
// npm run eslint test/test.js
// コマンド テスト実行
// npm run mocha
/**
* @param {Number} number1
* @param {Number} number2
*/
function plus(number1, number2){
return number1 + number2
}
//package.json
{
"name": "pairpro",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"eslint": "eslint --fix",
"mocha": "mocha"
},
"author": "",
"license": "ISC",
"devDependencies": {
"eslint": "^6.8.0",
"eslint-config-prettier": "^6.9.0",
"eslint-plugin-jsdoc": "^20.3.0",
"eslint-plugin-prettier": "^3.1.2",
"mocha": "^7.0.0",
"prettier": "^1.19.1"
}
}//.eslintrc
{
"extends": [
"eslint:recommended",
"plugin:prettier/recommended",
"plugin:jsdoc/recommended"
],
"rules": {
"prettier/prettier": [
"error",
{
"singleQuote": true,
"trailingComma": "es6"
}
]
},
"plugins": [
"jsdoc"
]
}
学んでほしかったところ
規約は皆のために
今回は規約の大切さとテストを書くことの敷居を下げてもらうことが目的でした。特に VSCode の jsdoc 対応は素晴らしく、関数名にマウスカーソルを置くと自動でポップアップして概要を表示してくれます。
テストは怖くない。簡単に始められる
テストを書くというのは始めは難しいと思うかもしれませんが、入力と出力を最初に定義することで何をしたかったかを再確認でき、実装の結果をテストで確認することができるようになります。
効率を上げるためにも、コンソールログでログを追いかける作業は極力避ける必要があります。（目視でチェックはつらい…
失敗も含めて開発
テストを書いていると、想定通りに動かないケースも多々あります。デバッグは欠かすことができませんし、学びの一つだと思います。書いてあるエラー文をよく読んで解決できるようにするのも練習です。1 つずつやっていきましょう。（自戒を込めて）
実施後
説明や実際の動きを見せつつだいたい 30 分―40 分程度で実装できました。私の想定と違う実装でしたが、実装の意図は汲めるのでいいかなぁと。
//test/test.js
var assert = require('assert');
describe('ペアプロ用テスト', function() {
it('Fizz', function() {
assert.equal(fizzBuzz(3), 'Fizz');
assert.equal(fizzBuzz(99), 'Fizz');
});
it('Buzz', function() {
assert.equal(fizzBuzz(5), 'Buzz');
assert.equal(fizzBuzz(25), 'Buzz');
});
it('FizzBuzz', function() {
assert.equal(fizzBuzz(15), 'FizzBuzz');
assert.equal(fizzBuzz(60), 'FizzBuzz');
});
it('no string', function() {
assert.equal(fizzBuzz(1), '');
assert.equal(fizzBuzz(98), '');
});
});
// コマンド コーディング規約を適用
// npm run eslint test/test.js
// コマンド テスト実行
// npm run mocha
/**
* @param {Number} number1
* @param {Number} number2
*/
function plus(number1, number2){
return number1 + number2
}
/**
* 3の倍数の時Fizz、5の倍数時にBuzz、15FizzBuzz
* @param {number} number 判定値
* @return {string} 実行結果
*/
function fizzBuzz(number){
if(number % 15 == 0){
return 'FizzBuzz';
} else if(number % 5 == 0) {
return 'Buzz';
} else if(number % 3 == 0) {
return 'Fizz';
}
return '';
}ペアプロは人材を現場にフィットさせるのに即効性があると思っているのですが、どうやって文化として取り入れてもらえるかは作戦を練っていきたいところです。