Rocro Inspecode Hands On

Rocro Hands On 2017/10/24

Transcript

1. ROCRO INSPECODE ハンズオン Rocro株式会社 峯尾 嘉征 2017/10/24
2. • 開発者向けサービス群 • https://rocro.com • GitHub / Bitbucketと連携 • 9/14 public beta開始 • 名前の由来 • アジャイル開発：イテレーションを回しながらソフトウェアをつくる • 回転させながらものをつくる道具 → ろくろ 2
3. Inspecode • 自動コードレビュー＆コード修正サービス • 約50種類の静的解析ツールをサポート • 一部の言語でユニットテストもサポート開始 • サポート言語： C, C++, Clojure, CoffeeScript, CSS, Go, HTML, Java, JavaScript, PHP, Python, Ruby, Scala, Shell, TypeScriptなど • Public Beta 3
4. What's New • 下記ツールを新規にサポート • Tailor(Swift) • Prospector(Python) • Prettier(CSS/JavaScript/TypeScript) • Unused(多言語対応) • Public Repositoryへの対応 • レポートバッジ • 今回のハンズオンで取り上げます • Fixedステータス • 今回のハンズオンで取り上げます 4
5. ハンズオン資料 https://github.com/your-org/websocket 5 https://github.com/your-org/websocket/releases/download/hands- on/inspecode-hands-on_jp.pdf Click “releases” Download pdf
6. Agenda • セットアップと基本的な使い方 • rocro.ymlの追加 • 自動修正 • 入力分割 • バッジ 6
7. セットアップと基本的な使い⽅ 7
8. https://github.com/your-org/websocket を Fork Click “Fork” 8
9. inspecode.rocro.com からサインイン Sign in with GitHub 9
10. Authorize ROCRO Click “Authorize rocro” 10
11. Repositories ページに移動 Click “Repositories” 11
12. レポジトリを登録 2. Back to “Reports” 1. Register “websocket” repository 12 ※repositoryが現れない場合は、右上の”Sync”ボタンを押してください
13. Report が生成されることを確認 13
14. Report Summaryを表示① Click “Report” 14
15. Report Summaryを表示② 15
16. File一覧を表示① Click “D” bar 16
17. File一覧を表示② ※「Filesタブ→プルダウンメニューでGrade Dを選択」 でも同じ画⾯に⾏けます。 17
18. 特定ファイルのIssue一覧を表示① Click 18
19. 特定ファイルのIssue一覧を表示② 19
20. 特定ファイルのIssue出現箇所を確認① Click “Source” 20
21. 特定ファイルのIssue出現箇所を確認② 21
22. Jobの履歴を表示① 22 Click “History”
23. Jobの履歴を表示② 23
24. Jobの詳細を表示① Click 24
25. Jobの詳細を表示② Click “golint” 25
26. Jobの詳細を表示③ golintのコンソールログを確認 26
27. rocro.ymlの追加 27
28. rocro.yml inspecode: gofmt: thresholds: num-issues: 0 options: [-s] go-test: thresholds: num-issues: 0 misspell: default golint: default gofmt, golintで 1つでもissueが検出されたら Jobをfailさせる Note: Notificationsの設定で “Only failure and recovery” を選択すると Jobのfailに気づきやすくなる 28 https://inspecode.rocro.com/help/configuration/tool.html#field-thresholds
29. rocro-ymlブランチをマージ Click “New pull request” 29
30. base forkとして自分のレポジトリを選択 複数の選択肢が出る。必ずFork先の ⾃分のレポジトリを選択する。 30
31. masterとrocro-ymlをCompare master であることを確認 rocro-yml を選択する 31
32. プルリクエスト作成① Click 32
33. プルリクエスト作成② Click 33
34. マージ① Click 34
35. マージ② Click 35
36. Threshold設定によりJobがFailしたことを確認① 36 Click “History”
37. Threshold設定によりJobがFailしたことを確認② 37 Click
38. Threshold設定によりJobがFailしたことを確認③ 38
39. 自動修正 39
40. rocro.yml inspecode: gofmt: thresholds: num-issues: 0 options: [-s] auto-fix: true go-test: thresholds: num-issues: 0 misspell: default golint: default gofmtの自動修正機能を有効にする 40 https://inspecode.rocro.com/help/configuration/tool.html#field-auto-fix
41. auto-fixブランチをマージ Click “New pull request” 41
42. base forkとして自分のレポジトリを選択 複数の選択肢が出る。必ずFork先の ⾃分のレポジトリを選択する。 42
43. masterとauto-fixをCompare master であることを確認 auto-fix を選択する 43
44. rocro-ymlと同様にマージ 44
45. Report Summaryを表示 2. Click “Report” 45 1. Click “Reports”
46. レポート画面からプルリクエストを作成 Click “Compare” 46 ※“Compare”が表⽰されない場合は、“History”から 最新のJobを選択して”View Report”ボタンを押してください
47. プルリクエストを作成してmasterにマージ Create pull request and merge 47
48. 自動修正によりFailed→Succeededになったことを確認① Click “History” 48
49. 自動修正によりFailed→Succeededになったことを確認② 49 Click
50. 自動修正によりFailed→Succeededになったことを確認③ 50
51. Report画面へ戻る Click “View Report” 51
52. 修正された Issues を確認① Click “Number of Fixed Issues” 52
53. 修正された Issues を確認② 53
54. 入力分割 54
55. rocro.yml inspecode: gofmt: thresholds: num-issues: 0 options: [-s] auto-fix: true go-test: thresholds: num-issues: 0 misspell: default golint: - input: c* - ignore: c* golintの入力を分割して 並列化・高速化する ”c”で始まるファイル群と それ以外のファイル群に２分割 55
56. 参考：Multiple Configurations 56 inspecode: <tool>: input: <pattern> ignore: <pattern> https://inspecode.rocro.com/help/configuration/tool.html#multiple-configurations inspecode: <tool>: - input: <pattern> ignore: <pattern> - input: <pattern> ignore: <pattern> Single Configuration inputで入力パターンを指定（複数可） ignoreで除外パターンを指定（複数可） Multiple Configurations リスト形式で複数のconfigurationを 記述可能
57. divide-inputブランチをマージ Click “New pull request” 57
58. base forkとして自分のレポジトリを選択 複数の選択肢が出る。必ずFork先の ⾃分のレポジトリを選択する。 58
59. masterとdivide-inputをCompare master であることを確認 divide-input を選択する 59
60. rocro-ymlと同様にマージ 60
61. golintが分割・並列実行されたことを確認① 61 Click “History”
62. golintが分割・並列実行されたことを確認② 62 Click
63. golintが分割・並列実行されたことを確認③ 63
64. バッジ 64
65. バッジ • READMEに貼るアイコン • ステータスバッジ • 最新のジョブのステータス（Succeeded, Failedなど）を表示 • クリックすると最新のジョブの詳細画面へジャンプ • レポートバッジ • 最新のレポートの５段階評価（A, B, C, D, F）を表示 • クリックすると最新のレポート画面へジャンプ 65
66. Settings 画面を開く Click “Settings” 66
67. Badges 画面を開く Click “Badges” 67
68. Markdownスニペットをコピー Copy this snippet 68
69. README.mdを編集① Click “README.md” 69
70. README.mdを編集② Click 70
71. README.mdを編集③ 1. コピーしたスニペットを 8⾏⽬に貼り付ける 2. Click “Commit changes” 71
72. レポートバッジを確認 バッジが表⽰される 72