GitLab CI 從團隊導入到運用

這份簡報分為兩個部分：

第一部分怎麼讓一個完全沒有原始碼版本控制的大型專案，逐步的轉變，陸續導入 GitLab 的各種功能，直到現在專案已經有了自己的 CI/CD 流程。這期間期間當然包含了一些政治面、商業面的因素，但整體經歷了哪些事情呢？在這部分會跟大家聊聊這段故事。

第二部分，在使用及導入 GitLab 的過程中，隨著專案演進 .gitlab.yml 定義的流水線 pipeline 上有越來越多工作，怎麼讓工作流程進行的更快一些呢？又，可以怎麼整理 .gitlab.yml 檔，讓他更簡潔一些？在這部分將跟大家分享一些小技巧。

內容中所用到的 source code 如下：
https://gitlab.com/mouson-gitlab-playground/gitlab-ci-demo-sample

可透過切換分支進行查看

Transcript

1. GitLab CI 從團隊導入到運⽤
   墨嗓 (陳佑⽵)
   2020/09/27 @ GitLab Taipei User Group
   

   View Slide

2. About Me
   • 陳佑⽵，朋友都叫我墨嗓
   (Mouson)。專注於資訊科技整
   合、應⽤、開發⽅法及研究的T
   型⼈，現任 PHP 資訊系統分析
   師/⼈夫/⼀隻臘腸狗的爸爸/通⽤
   設計(Universal Design)推廣。
   平時喜好⽻球、登⼭及⼿沖咖
   啡。
   • mouson@gmail.com
   • https://fb.me/mouson
   

   View Slide

3. Part I
   團隊如何導入 GitLab ？
   

   View Slide

4. 請問：⽬前團隊
   有在使⽤ GitLab 的？
   

   View Slide

5. 請問：⽬前團隊
   有在使⽤ GitLab CI 的？
   

   View Slide

6. 進入正題
   

   View Slide

7. ⼤綱
   Image Src: https://pixabay.com/vectors/evolution-charles-darwin-man-296584/
   ⽯器時代 銅器時代 機器時代 資訊時代
   

   View Slide

8. ⽯器時代
   Image Src: https://pixabay.com/vectors/evolution-charles-darwin-man-296584/
   ⽯器時代 銅器時代 機器時代 資訊時代
   

   View Slide

9. 世成科技
   

   View Slide

10. ⽯器時代 - 時代記憶
    • 專案有數⼗萬⾏原始碼
    • 經歷多次團隊迭代
    • 版本控制系統已損毀
    • 沒有系統⽂件
    • 部分執⾏程式沒有原始碼
    

    View Slide

11. ⽯器時代 - 跨時代⾨檻
    • 導入 Issue Tracking System
    • 導入版本控管機制
    

    View Slide

12. ⽯器時代 - 考古遺跡
    • PHP 4.1.2 / Apache 1.3
    • 單 PHP 原始碼超過 1,000隻，總⾏數超過 20 萬
    • 核⼼為 C 編寫的 PHP Extension
    • 使⽤非常⾒的商⽤資料庫
    

    View Slide

13. 版本控制系統 團隊選擇考量
    • 希望可以提供 CI/CD 等配套⽅案
    • 有免費/付費雙⽅案
    • 可⾃架 self-host
    • 好管理
    

    View Slide

14. View Slide

15. 銅器時代
    Image Src: https://pixabay.com/vectors/evolution-charles-darwin-man-296584/
    ⽯器時代 銅器時代 機器時代 資訊時代
    

    View Slide

16. 銅器時代 - 時代記憶
    • Issue Tracking System - Redmine
    • 版本控制系統 - GitLab
    • 沒有系統⽂件
    • 部分執⾏程式沒有原始碼
    

    View Slide

17. 銅器時代 - 跨時代⾨檻
    • 導入單元測試
    • 以單元測試描述新功能規格之能⼒
    

    View Slide

18. 銅器時代 - 考古遺跡
    • 透過功能調整需求，了解系統結構、架構
    • 初步升級 PHP 5.2.17 及部分核⼼元件
    • 依然沒有 namespace
    • 依然沒有 PHP Package 可以引入使⽤
    

    View Slide

19. 機器時代
    Image Src: https://pixabay.com/vectors/evolution-charles-darwin-man-296584/
    銅器時代 機器時代 資訊時代
    ⽯器時代
    

    View Slide

20. 機器時代 - 時代記憶
    • 部分系統⽂件建立
    • 部分執⾏程式沒有原始碼
    

    View Slide

21. 機器時代 - 跨時代⾨檻
    • 持續整合、部署 等⾃動化機制導入
    • PHP 版本升級⾄ PHP 7
    

    View Slide

22. 機器時代 - 考古遺跡
    • 導入單元測試，以測試描述規格
    • 導入 TDD 進⾏功能開發
    • 持續針對核⼼演算法重構、補上測試
    • 透過 GitLab CI/CD 完成⾃動化測試
    • 增加線上 Code Review 流程
    

    View Slide

23. 機器時代 - 榮耀紀錄
    • 持續累積研發團隊 Credit
    • 錯了代表以測試案例描述的規格還不完整
    • 補測試後就不會再錯，不再改 A 壞 B
    

    View Slide

24. 機器時代 - 榮耀紀錄
    • 持續累積研發團隊 Credit
    • 錯了代表以測試案例描述的規格還不完整
    • 補測試後就不會再錯，不再改 A 壞 B
    

    View Slide

25. 機器時代 - 榮耀紀錄
    • 持續累積研發團隊 Credit
    • 錯了代表以測試案例描述的規格還不完整
    • 補測試後就不會再錯，不再改 A 壞 B
    • 程式⼜算錯了！
    

    View Slide

26. 機器時代 - 榮耀紀錄
    • 持續累積研發團隊 Credit
    • 錯了代表以測試案例描述的規格還不完整
    • 補測試後就不會再錯，不再改 A 壞 B
    • 不太可能是程式寫錯，
    應該是客⼾設定錯誤
    • 程式⼜算錯了！
    

    View Slide

27. 資訊時代
    Image Src: https://pixabay.com/vectors/evolution-charles-darwin-man-296584/
    ⽯器時代 銅器時代 機器時代 資訊時代
    

    View Slide

28. 資訊時代 - 不退步⾨檻
    • 導入持續部署機制
    • 持續進化、持續改善
    • 讓團隊習慣讓⾃⼰更好、更強
    

    View Slide

29. 凡不能殺死你的，最終都會
    使你更強⼤
    What Doesn't Kill You
    Makes You Stronger Turning
    Bad Breaks Into Blessings
    威廉·尼采
    Wilhelm Nietzsche
    

    View Slide

30. Part I：Q&A
    

    View Slide

31. Part II
    GitLab 運⽤
    

    View Slide

32. Part II：GitLab 運⽤
    • 怎麼讓流⽔線 (Pipeline) 更快⼀點？
    • 可以怎麼整理 .gitlab-ci.yml 檔？
    

    View Slide

33. 怎麼讓流⽔線 (Pipeline)
    更快⼀點？
    

    View Slide

34. 流⽔線加速三原則
    

    View Slide

35. 流⽔線加速三原則
    • ⼯作 少做點
    

    View Slide

36. 流⽔線加速三原則
    • ⼯作 少做點
    • 事情 作快點
    

    View Slide

37. 流⽔線加速三原則
    • ⼯作 少做點
    • 事情 作快點
    • 作事的 多⼀點
    

    View Slide

38. 流⽔線 Pipeline 啟動到結束
    哪些地⽅花了時間？
    

    View Slide

39. 拆解
    

    View Slide

40. .gitlab-ci.yml
    

    View Slide

41. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

42. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

43. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    

    View Slide

44. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

45. •什麼⼯作先作比較好？
    .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

46. 什麼⼯作先做比較好？
    

    View Slide

47. 什麼⼯作先做比較好？
    • 跑的快的⼯作
    

    View Slide

48. 什麼⼯作先做比較好？
    • 跑的快的⼯作
    • 早點做完早點確認結果
    

    View Slide

49. 什麼⼯作先做比較好？
    • 跑的快的⼯作
    • 早點做完早點確認結果
    • 有決定性的⼯作
    

    View Slide

50. 什麼⼯作先做比較好？
    • 跑的快的⼯作
    • 早點做完早點確認結果
    • 有決定性的⼯作
    • 沒通過直接 Reject
    

    View Slide

51. •什麼⼯作先做比較好？
    .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

52. •什麼⼯作先做比較好？
    •每個⼯作都是該做的嗎？
    .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

53. 每個⼯作都是該做的嗎？
    

    View Slide

54. 每個⼯作都是該做的嗎？
    • 同⼀專案中包含前端及後端的測試
    

    View Slide

55. 每個⼯作都是該做的嗎？
    • 同⼀專案中包含前端及後端的測試
    • 可以考慮對應原始碼變更才執⾏對應的測試
    

    View Slide

56. 每個⼯作都是該做的嗎？
    • 同⼀專案中包含前端及後端的測試
    • 可以考慮對應原始碼變更才執⾏對應的測試
    

    View Slide

57. •什麼⼯作先做比較好？
    •每個⼯作都是該做的嗎？
    .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

58. •什麼⼯作先做比較好？
    •每個⼯作都是該做的嗎？
    •有沒有⼯作花太久時間等
    待進 Queue ?
    .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

59. ⼯作花太久時間等待進 Queue?
    

    View Slide

60. ⼯作花太久時間等待進 Queue?
    build test deploy
    build_a test_a deploy_a
    build_b test_b deploy_b
    build_c test_c deploy_c
    

    View Slide

61. ⼯作花太久時間等待進 Queue?
    build test deploy
    build_a test_a deploy_a
    build_b test_b deploy_b
    build_c test_c deploy_c
    build_b
    

    View Slide

62. ⼯作花太久時間等待進 Queue?
    build test deploy
    build_a test_a deploy_a
    build_b test_b deploy_b
    build_c test_c deploy_c
    build_b
    

    View Slide

63. ⼯作花太久時間等待進 Queue?
    • 套⽤ DAG 機制 (GitLab 12.2）
    build test deploy
    build_a test_a deploy_a
    build_b test_b deploy_b
    build_c test_c deploy_c
    build_b
    

    View Slide

64. ⼯作花太久時間等待進 Queue?
    • 套⽤ DAG 機制 (GitLab 12.2）
    build test deploy
    build_a test_a deploy_a
    build_b test_b deploy_b
    build_c test_c deploy_c
    build_b
    

    View Slide

65. ⼯作花太久時間等待進 Queue?
    • 套⽤ DAG 機制 (GitLab 12.2）
    build test deploy
    build_a test_a deploy_a
    build_b test_b deploy_b
    build_c test_c deploy_c
    build_b
    

    View Slide

66. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    

    View Slide

67. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

68. Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

69. Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

70. •可以取得⼯作的 Runner 夠
    嗎？
    Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

71. •可以取得⼯作的 Runner 夠
    嗎？
    •可以有更多 Runner 嗎？
    Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

72. •可以取得⼯作的 Runner 夠
    嗎？
    •可以有更多 Runner 嗎？
    •Runner Server 可以同步執
    ⾏ Runner 嗎？
    Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

73. Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    

    View Slide

74. Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    

    View Slide

75. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    

    View Slide

76. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    

    View Slide

77. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    

    View Slide

78. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    

    View Slide

79. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    

    View Slide

80. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    

    View Slide

81. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    

    View Slide

82. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    •Network Performance ?
    

    View Slide

83. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    •Network Performance ?
    •Docker image size ?
    

    View Slide

84. Docker Image Size ?
    

    View Slide

85. Docker Image Size ?
    

    View Slide

86. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    •Network Performance ?
    •Docker image size ?
    •Git Repo Size ?
    

    View Slide

87. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    •Network Performance ?
    •Docker image size ?
    •Git Repo Size ?
    •Programming Language
    Dependence Package
    Size ?
    

    View Slide

88. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    •Network Performance ?
    •Docker image size ?
    •Git Repo Size ?
    •Programming Language
    Dependence Package
    Size ?
    •Artifacts Size ?
    

    View Slide

89. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    •Network Performance ?
    •Docker image size ?
    •Git Repo Size ?
    •Programming Language
    Dependence Package
    Size ?
    •Artifacts Size ?
    •Script Performance ?
    

    View Slide

90. Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    

    View Slide

91. .gitlab-ci.yml Job
    Job
    Job
    Job
    Job
    Job
    Job Queue
    Runner
    Server
    Runner
    Server
    Runner
    Server
    Runner
    Runner
    Runner
    Runner
    Run Job
    ____________________________
    * pull docker image
    * git repo fetch
    * package install
    * download artifacts
    * script execute
    

    View Slide

92. 可以怎麼
    整理 .gitlab-ci.yml 檔？
    

    View Slide

93. 你會怎麼整理？
    針對 ubuntu:20.04 及 ubuntu:18.04 兩個作業系統版本
    分別組譯 v1.0、v2.0、v3.0 三個版本
    

    View Slide

94. 怎麼整理？
    針對 ubuntu:20.04 及 ubuntu:18.04 兩
    個作業系統版本
    分別組譯 v1.0、v2.0、v3.0 三個版本
    

    View Slide

95. 第⼀招
    擷取⼀致的 script 變為 default:
    

    View Slide

96. 第⼀招
    擷取⼀致的 script 變為 default:
    

    View Slide

97. 第⼆招
    擷取為變數
    讓 Script 變成⼀樣
    

    View Slide

98. 第⼆招
    擷取為變數
    讓 Script 變成⼀樣
    

    View Slide

99. 第⼆招
    擷取為變數
    讓 Script 變成⼀樣
    

    View Slide

100. 第三招
     利⽤ hidden job
     整理 job 共同的部分
     並使⽤ extends 繼承
     

     View Slide

101. 第三招
     利⽤ hidden job
     整理 job 共同的部分
     並使⽤ extends 繼承
     

     View Slide

102. 第三招
     利⽤ hidden job
     整理 job 共同的部分
     並使⽤ extends 繼承
     

     View Slide

103. 第四招
     使⽤ Parallel Matrix
     GitLab 13.3 提供
     

     View Slide

104. 第四招
     使⽤ Parallel Matrix
     GitLab 13.3 提供
     

     View Slide

105. 第四招
     使⽤ Parallel Matrix
     GitLab 13.3 提供
     

     View Slide

106. 第四招
     使⽤ Parallel Matrix
     GitLab 13.3 提供
     

     View Slide

107. 第四招
     使⽤ Parallel Matrix
     GitLab 13.3 提供
     

     View Slide

108. Recap
     • 第⼀招：利⽤ default stage 整理所有 job 都共同的
     • 第⼆招：萃取出變數
     • 第三招：利⽤ .hidden 建立模板⼯作，並⽤繼承使⽤
     • 第四招：利⽤ Parallel Matrix 功能
     • Sample Source Code: https://bit.ly/3mTiBgJ
     

     View Slide

109. Sample Code
     • https://bit.ly/3mTiBgJ
     

     View Slide

110. • PHP 後端⼯程師
     • Angular 前端⼯程師
     WE WANT YOU !!
     https://bit.ly/NovaxJobs
     

     View Slide

111. Part II Q&A
     https://bit.ly/NovaxJobs
     

     View Slide