在 DevOps 文化越來越流行的當下，我們該如何透過 DevOps 的精神來幫助 Open Source 的 Project 進行，從需求著手，了解 Open Source Project 使用者使用後的 Feedback，加上自動化工具的幫助，持續進行完成對使用者更加友善的 Open Source Project。

1. Open Source 的 DevOps 工具箱
陳鋒逸（小風）
2016/08/20 @ Coscup

2. 自我介紹
• 陳鋒逸（陳小風）
• 講師經歷
• 微軟最有價值專家 （MVP）
• Skilltree 兼任講師
• Techday 講師 (2014)
• JSDC 講師 (2013)
• 社群研討會講師
• AgileCommunity.tw
• Javascript.tw
• twMVC
2
粉絲團: 愛流浪的小風

3. 什麼是 DevOps ?

4. 什麼是 DevOps ?
Dev Ops
開發加上維運
自動化
快速部署
用程式碼建置環境
功能開關
Kanban

5. DevOps 是一種文化
同伴
流程
產品
• 開發與維運
• 協同合作
• 工作流程
• 持續改善
• 產品走向與規劃

6. 為什麼需要 DevOps?
變化快速
協同合作
時間就是金錢
配合趨勢

7. 為什麼需要 DevOps?
變化快速
協同合作
時間就是金錢
配合趨勢

8. 為什麼需要 DevOps?
• 沒有對的，只有最 適合 的
• 擁抱變化，適應變化
• 降低成本
• 專注開發

9. Open Source Project
• 大家共同建置的 產品
• 多人合作的專案
• 流程很重要
• Pull Request
• Code Review
• Contribute Guide

10. How to start?
計畫
開發測
試
發行版
本
經驗學
習

11. 目標
計畫
開發測
試
發行版
本
經驗學
習
 想要解決的問題
 核心功能
 Roadmap
 發展方向
 單元、整合測試
 Code Review
 程式碼品質
 溝通討論
 問題修正
 使用者反饋
 新功能想法
 Nightly Build
 發行正式版本
 Changelogs
 說明文件

12. 教練...我想寫 Code...
• 讓開發者專注 開發
• 重複的事情交給 自動化工具
• 只要會用 Github
• 讓每個人都容易上手

13. 專案的工作
Github
Testing
Code
Quality
Document Package Changelogs Report
我們要做的
Developer
Coding
Code
Review

14. 理想的流程
Github
Build
Testing
Code
Quality
Document
Release
Package
Changelogs Report
CI Server 自動處理我們要做的
Developer
Coding
Code
Review

15. 從計畫開始

16. 開始動手
• 建立一個新的專案
• 找出專案想 解決 的問題
• 列出希望擁有的功能
• 動手 實現第一個功能
• Baby Step

17. 使用 issue 管理項目
• 足夠使用

18. Zenhub
• 一秒變看板

19. Zenhub 的好處
• https://www.zenhub.com/
• 使用 firefox 或 chrome 的 擴充功能
• 為 敏捷開發 而設計
• 容易 管理 問題及功能
• 方便 規劃進度

20. Zenhub - Burndown
• 檢視 Milestone 進度

21. Zenhub - Todo
• 管理 待辦清單

22. Zenhub - Epic
• 複雜功能 拆解

23. Recap
• 動手進行你的專案
• 設定目標
• 逐步實現

24. 開發與測試

25. 多人開發的問題？
風險
潛在問
題
品質不
穩定
程式看
不懂

26. 開發與測試
function calculator() {
this.getDiscountPrice = function(totalPrice) {
if (totalPrice >= 200) {
return totalPrice * 0.8;
} else if (totalPrice >= 100 && totalPrice < 200) {
return totalPrice * 0.9
}
return totalPrice
}
}
describe('Calculator', function() {
describe('#GetDiscountPrice(totalPrice)', function() {
describe('if total price over 200, get 80% discount', function() {
it('should return 200 if total price is 250', function() {
var result = calculator.getDiscountPrice(250);
result.should.equal(200);
});
});
describe('if total price over 100 and less than 200, get 90% discount', function() {
it('should return 135 if total price is 150', function() {
var result = calculator.getDiscountPrice(150);
result.should.equal(135);
});
});
describe('if total price less than 100, no discount', function() {
it('should return 80 if total price is 80', function() {
var result = calculator.getDiscountPrice(80);
result.should.equal(80);
});
});
});
});
商業邏輯
測試程式
不容易理解，需花時間看 Code

27. 換種工具試試看…
• 改用 BDD
• 用 口語 的方式撰寫測試程式
功能: Calculator
場景: 當金額高於 200 元時，可享有 80% 折扣
假設 顧客消費總金額為 "250" 元
當 計算折扣後金額
那麼 折扣後金額應該為 "200" 元

28. 搭配 Pickles
• http://www.picklesdoc.com/
• 測試就是你的 說明文件
• Windows only (期待 .Net Core)
• 支援多種格式 (包含 Markdown)
• 整合 Github Page

29. 產出可瀏覽的網站
• 轉換 Feature 為不同格式
Features
Html
Word
Excel

30. 測試即文件
變成說明文件

31. 從測試到文件
• 合併回 master 自動產生
• 透過 CI Server 自動部署到 Github Page
• 使用說明搭配範例講解
• 保持與程式碼 同步
Check In Code CI Build
建置
測試
自動更新文件

32. 程式碼品質
Simian
測試涵蓋率
程式碼品質
程式碼規則

33. SonarQube
• 軟體品質的 健檢報告

34. SonarQube – Tech Debt
• 量化技術債

35. SonarQube – Tech Debt
• 修改說明

36. SonarQube – code coverage
• 測試涵蓋率

37. SonarQube – Pull Request
• 整合 Pull Request

38. Recap
• 讓測試變成最好的文件
• 替自己專案作健康檢查

39. 發行最新版本

40. 使用 CI Server
• Continuous Integration Server
• 有更新就 建置 及 測試
• 分析 Pull-Request
• 第一時間找出 錯誤
• 處理自動化相關工作
產生文件
發行版本
程式碼檢查
事件通知
建置檔案

41. YAML
• 讓 建置設定 也可以做版控
• 避免機器 汰換 風險
YAMLYAML Github
產生文件
發行版本
程式碼檢查
事件通知
建置檔案

42. 搭配 git flow
• 配合 產品 生命週期
• master 代表 穩定 的版本 (搭配 Tag)
• develop 代表 進行中 的版本
• 新功能一律建立 feature branch
• 搭配 CI Server 合併及發行版本

43. 搭配 git flow
• 平行開發 不互相影響
master
develop
Feature A Feature B
Tag 1.0.0
自動發行 1.0.0 版
每次 commit 發行 PreRelease 版
MileStone 完成

44. Commitizen
• Commit message 撰寫工具
• 統一 Commit Message 的撰寫風格
• 產生 Changelogs
• 讓每次 Commit 目的更明確

45. 版本更新紀錄
• 清楚的 Commit Message

46. 版本更新紀錄
• 使用 Commit Message 產生 Changelogs

47. Badge
• Github 的專案狀態

48. Badge
• 專案 入口
• 一眼了解 重要數據
建置通過 測試涵蓋率 程式碼品質 最新版本

49. Badge
• http://shields.io/

50. Shields.io
• 支援 大部分 線上服務
• 沒有的可以自己發 PR
• 支援 客製化
• https://img.shields.io/badge/{類別}-{資料}-{顏色}.svg

51. Recap
• 隨時確認程式碼健康狀態
• 利用 git flow 管理產品生命週期
• 撰寫更清楚的 Commit message
• 透過 Badge 一眼判斷狀態

52. 持續改善

53. 讓功能更好用
• 沒有完美的，只有最 適合 的
• 了解 其他角度 的需求
• 找出 最多人 碰到的問題
• 讓 專案 更加的好用

54. Google Group
• 發問與討論

55. Gitter
• 與 Github 整合的聊天室工具

56. Github issue
• Now support Reactions
https://github.com/blog/2119-add-reactions-to-pull-requests-issues-and-comments

57. 良好循環
計畫 開發測試
發行版本經驗學習
• 吸收經驗，作為新的 目標

58. Recap
• 了解使用者使用狀況
• 打造更好用的專案

59. 總結
• 工具很好用
• 沒有最好的，只有最適合的
• 讓大家開發更愉快
• 重點在本體

60. Reference
• DevOps Sample Project
https://github.com/kirkchen/EFRepository
• Github DevOps-tools
https://github.com/showcases/devops-tools

61. Q＆A