作ったもの: Trivariate Estimates 計算機
[f:id:wand_ta:20200316015506g:plain]
[https://wand2016.github.io/trivariateestimatescalculator/:embed:cite]
- The Clean Coderで学んだ見積もり術
-
楽観的(O)・平均的(N)・悲観的(P)な3つの見積もりを出し、簡単な計算を行うことで、期待値と標準偏差を求めることができる
- 楽観的・悲観的見積もりは確度1%以下の極端な値を用いること
- たいてい悲観側にずれ込む
期待値μ = (O + 4N + P) / 6
標準偏差σ = (P - O) / 6
- Excelでいいじゃん、という内容だが、Reactの練習にちょうどよかったので作成
例: O=1, N=2, P=6(時間)
「期待値的には2時間半(μ)程度で終わる」
「小一時間(1σ)〜1.5時間(2σ)程度伸びてしまうかも」
- 上のような見積もりを出せるようになる
- 上司に「2時間でできます!」と言ってはいけないこともわかる
ソースコード
[https://github.com/wand2016/trivariateestimatescalculator:embed:cite]
技術
- React
- GitHub Pages
学び
React
-
create-react-appでスキャフォールドを作ってejectして開発
- お手軽でびっくり
- WSL2で
npm run start
すると「cmd.exeがねーぞ」と怒られるのでこうする:
PATH=$PATH:/mnt/c/Windows/System32 npm run start
-
ステートレスな感じにするのが流儀なんですかね?
- 関数コンポーネントとかあるくらいだし
-
Vueとの違いを色々感じた
- Reactのほうが好きかも
GitHub Pages
- お金をかけずにデプロイ
- Reactよりこっちのほうが詰まって時間食ったかも
制限
https://<ユーザ名>.github.io/<リポジトリ名>/index.html
もしくはhttps://<ユーザ名>.github.io/<ディレクトリ名>/index.html
で公開される- masterブランチの
/
しか公開できない
相対パス対応
- create-react-appデフォルトだと、
index.html
がルートパスの/static/*.js
を読みに行ってしまうので、https://<ユーザ名>.github.io/<ディレクトリ名>/index.html
に置くと動かない - ルートパスではなく
index.html
からの相対パスを読みに行くように、ビルドコンフィグをいじる
paths.js
...
const publicUrlOrPath = getPublicUrlOrPath(
process.env.NODE_ENV === 'development',
require(resolveApp('package.json')).homepage,
process.env.PUBLIC_URL
);
...
package.json
のhomepage
の設定があればそれを、なければ/
を使うことになっている
package.json
...
"babel": {
"presets": [
"react-app"
]
- }
+ },
+ "homepage": "./"
}
subtree切り出し
-
ビルド成果物
build/
をコミット- .gitignore外す
build/
ツリーがリポジトリルートになるようにsubtree切り出し
git subtree split --prefix=build/ --branch=pages master
# origin is git@github.com:wand2016/trivariate_estimates_calculator.git
git push origin pages
- GitHub Pages用リポジトリを別途用意し、masterに上記subtreeを取り込み
[https://github.com/wand2016/wand2016.github.io:embed:cite]
git remote add trivariate_estimates git@github.com:wand2016/trivariate_estimates_calculator.git
git subtree add --prefix=trivariate_estimates_calculator/ trivariate_estimates refs/heads/pages
https://wand2016.github.io/trivariate_estimates_calculator/index.html
というURLでアクセスできるようになる