CodiumAI PR-Agent,在 GitLab 上用 AI 來 Code Review

閱讀時間約 4 分鐘

本篇要解決的問題

最近看到有人寫了一篇用 AI 來 Code Review 的文章後,才發現原來有開源的好工具可以來使用,也剛好組內也有人提說,要不要來 Code Review,但因為需求常常太多,光開發就沒什麼時間了,就沒有時間來看 Code Review 這工程。

如果 AI Code Review 真的好用,那之後就要來想辦法看能不能做在開發流程裡。

這篇先研究 GitLab 的版本,之後有時間再來看 GitHub 版的。

本篇主要看到的參考文章是這篇:將 AI Code Review 整進 CICD Day1

因為作者主要用的程式語言是 Python,所以 August 在實作前端的部份時,主要使用的程式碼都來自於官方的說明文件,以下是參考來源:


準備好必要東西:GitLab 帳號及 Token、OpenAI API Key

本篇主要是在 GitLab 上執行 AI Code Review,所以必要的東西就是標題上寫的這三項:

GitLab 帳號

GitLab 帳號是免費的就可以申請的。

進到官方註冊頁面,可以使用信箱或第三方帳戶進行註冊:https://gitlab.com/users/sign_up

GitLab Access Token

註冊好 GitLab 帳號後,進到後台的 Access tokens 的頁面中,就可以開始新增一組 Token。

點擊 新增令牌

點擊 新增令牌

設定 Token 的部份:

1 先寫好一個自己認得出功用的名稱。

2 到期時間可以點擊「X」把日期欄位清空,這樣就會是預設的 1 年以內有效。

3 選取範圍,第一個「api」打勾。

設定 Token

設定 Token

這三步做完後,最後點擊下方的「建立 個人存取令牌」,就會產生一組 Token,畫面如下:

複製 Token

複製 Token

點擊上圖框起來的按鈕,就可以複製這組新建的 Token,複製好後,我們要自行存起來,如果這邊沒存到,以後要再存就要再重新生成一組新的。

OpenAI API Key

這點要注意的是,每次 API 的調用,都需要酷錢錢~

而且現在好像是要先刷一筆金額進去,比方 5 美金後,才能開始使用的預付制,之前 August 因為沒有先預付,所以 API 一直調用不起來,直接先刷了 5 美金後才成功。

但也不用緊張,因為 OpenAI 的 API 費用愈來愈便宜了,之後我們會有一步是改用 GPT-4o-mini,就可以大量的來使用。

取得 API Key 的方式很簡單,先進到 OpenAI 的 API Key 後台:API Key

點擊右上角的 Create 的按鈕

點擊 Create

點擊 Create

接著就是取一個認得出來在做什麼的名字,然後再點擊 Create。

建立 Key

建立 Key

建立成功,就會看到畫面上顯示著 Key,最後只需要按下 Copy,把這組 Key 給存下來即可。

取得 Key

取得 Key


GitLab 專案,設定 env 變數

上面一步我們取得了 GitLab Access Token,跟 OpenAI API Key,這二個是很重要的,不能隨意的寫在明碼上,必須要放在環境變數上,一般我們開發時會建一個 .env 檔來用,GitLab 的話則是有一個介面讓使用者直接填寫。

GitLab 開好專案後,點擊左側選單的「設定 > CI/CD」:

進到 CI/CD 設定

進到 CI/CD 設定

接著打開「變數」的這項,再點擊「新增變數」:

新增變數

新增變數

需要新增的變數就是我們手上有的二個,我們先新增第一個 GitLab Access Token:

建立變數

建立變數

「保護變數」的部份,照官方說明,如果我們的分支不是保護狀態的話,這個必須要取消勾勾,不然流水線執行時會取不到。

「主鍵」填寫 GITLAB_PERSONAL_ACCESS_TOKEN

「值」填寫我們上一步取得的 GitLab Access Token。

最後按下「新增變數」,就新增了。

之後還要再新增 OpenAI API Key,方式一樣,在「主鍵」的部份改成 OPENAI_KEY 就行。

都建立完後,會看到我們的變數清單像這樣子:

變數清單

變數清單


提交必要檔案

接著,我們把官方提供的程式碼,提交到 GitLab 專案上,就可以使用 AI Code Review 了。

1 .pr_agent.toml

這個檔案是 AI Code Review 的設定檔,我們要在這個檔案中指定使用的 Model 是 gpt-4o-mini,如果不特別指定,我們 OpenAI API 的費用就會看見飛高高,高到心臟不夠強的話會覺得原來自己在財力上很渺小 XD。

專案根目錄下,新增名為「.pr_agent.toml」的檔案,檔案內容如下:

[config]
model = "gpt-4o-mini-2024-07-18"
model_turbo = "gpt-4o-mini-2024-07-18"
fallback_models = ["gpt-4o-mini-2024-07-18", "gpt-4o-mini"]

這個檔案建立了以後,先提交到 GitLab 上。

先提交到 GitLab 上!

先提交到 GitLab 上!!

先提交到 GitLab 上!!!

因為很重要,所以多說三次。

如果不先把這個檔提交上去,下一步我們把 gitlab-ci 檔提交上去後,預設會先執行的是 gpt4-turbo 的 model,就會看到酷錢錢跟水一樣流走。

因為這套 AI Code Review 是在合併請求時,才會執行,所以 GitLab 預設分支是 main,August 另外建了一個 master 分支,來讓後續可以執行合併。

第一次把 pr_agent 提交上去後,就會有合併的提示,就要先合併了。

合併請求提示

合併請求提示

.gitlab-ci.yml

這個檔案就是啟動 AI Code Review 用的,在 GitLab CI/CD 時,如果是合併請求的話,就會執行。

專案根目錄下新增名為「.gitlab-ci.yml」的檔案,檔案內容如下:

stages:
- pr_agent

pr_agent_job:
stage: pr_agent
image:
name: codiumai/pr-agent:latest
entrypoint: [""]
script:
- cd /app
- echo "Running PR Agent action step"
- export MR_URL="$CI_MERGE_REQUEST_PROJECT_URL/merge_requests/$CI_MERGE_REQUEST_IID"
- echo "MR_URL=$MR_URL"
- export gitlab__PERSONAL_ACCESS_TOKEN=$GITLAB_PERSONAL_ACCESS_TOKEN
- export config__git_provider="gitlab"
- export openai__key=$OPENAI_KEY
- python -m pr_agent.cli --pr_url="$MR_URL" describe
- python -m pr_agent.cli --pr_url="$MR_URL" review
- python -m pr_agent.cli --pr_url="$MR_URL" improve
rules:
- if: '$CI_PIPELINE_SOURCE == "merge_request_event"'

檔案建立完後,也可以先提交了,或是想之後開發到一個階段再提交也可以。

這個檔案一提交上去,之後只要有合併請求,就會自動觸發 AI Code Review。


測試一下威力

最後我們來測試一下 AI Code Review 強不強大。

說是測試,臨時也想不到什麼厲害的錯誤程式碼,所以就讓 GPT 寫了一個:

function calculateSum(a, b) {
return a + b;
}

let sum = calculateSum(5, 10;
console.log("Sum is: " + sum);

很明顯就是有新手錯誤(咦),然後我們提交上去後,會看到合併請求的提示:

第二次合併請求

第二次合併請求

建立了合併請求後,就會看到流水線自動在執行:

自動執行流水線

自動執行流水線

流水線執行完後,就會看到通過的訊息:

流水線通過

流水線通過

頁面往下滑,就會看見 AI 給的 Code Review 結果:

Code Review 結果

Code Review 結果

很明顯的有把錯誤指出來,還會給出錯誤的嚴重程度。


小結一下

這套 AI Code Review 的工具真的好用,除了 Code Review,還會給分數、自動下標籤、提供描述。

gpt-4o-mini 又是使用成本很低的一個 Model,這幾天不斷的嘗試下來,大概只用掉了 0.1 美金。

However,因為有被說不能把程式碼放上 GitLab、GitHub 等外部平台,所以這個工具還是難以推坑給其他同事。

此外,August 希望在每次 Commit 時就進行 Code Review,以避免提交上線後出現無法回頭的狀況。

下一篇,August 會寫的筆記文就是不依賴 GitLab 的 Pipeline,而且可以在開發者按下 Commit 時,就自動執行 AI Code Review 的方式,敬請期待~

9會員
19內容數
沙龍到底是…做什麼用的勒?
留言0
查看全部
發表第一個留言支持創作者!
Let's Write 的沙龍 的其他內容
了解如何使用 Cloudflare Workers AI 與 Whisper 建立免費開源的語音辨識功能。本文詳細說明註冊步驟、部署流程及程式碼修改,讓你輕鬆將語音轉換成文字。
學習如何使用 Tensorflow.js 的 COCO-SSD 模型在網頁上進行圖片物件辨識,包括基本使用方法、進階應用及實作範例,輕鬆辨識圖片中的人數和物件。
詳細解說如何在 Mac 上透過 Docker 安裝 MongoDB 社群版。包括 MongoDB Compass 的安裝與配置,以及 MongoDB Shell 的使用方法,為開發者提供 MongoDB 學習資源。
本文提供如何使用 Google Colab 結合 Faster Whisper 來提升語音辨識速度與準確性,包含安裝指南與使用方法。探索如何將語音轉換為文本,並對檔案進行不同格式的輸出。
本篇筆記了如何使用Google Colab和OpenAI的Whisper Large V3進行免費且開源的語音辨識。涵蓋從基礎設定到實際運用的步驟,適合初學者和技術愛好者輕鬆學習語音辨識技術。
透過 Web Workers,您可以將這些耗時的操作放在另一個執行緒中處理,減輕主執行緒的負擔,提高網站的效能和響應速度。這篇文章提供了詳細的解釋和示例,幫助您快速上手使用 Web Workers。不要錯過這個可以改善網站效能的實用技巧!
了解如何使用 Cloudflare Workers AI 與 Whisper 建立免費開源的語音辨識功能。本文詳細說明註冊步驟、部署流程及程式碼修改,讓你輕鬆將語音轉換成文字。
學習如何使用 Tensorflow.js 的 COCO-SSD 模型在網頁上進行圖片物件辨識,包括基本使用方法、進階應用及實作範例,輕鬆辨識圖片中的人數和物件。
詳細解說如何在 Mac 上透過 Docker 安裝 MongoDB 社群版。包括 MongoDB Compass 的安裝與配置,以及 MongoDB Shell 的使用方法,為開發者提供 MongoDB 學習資源。
本文提供如何使用 Google Colab 結合 Faster Whisper 來提升語音辨識速度與準確性,包含安裝指南與使用方法。探索如何將語音轉換為文本,並對檔案進行不同格式的輸出。
本篇筆記了如何使用Google Colab和OpenAI的Whisper Large V3進行免費且開源的語音辨識。涵蓋從基礎設定到實際運用的步驟,適合初學者和技術愛好者輕鬆學習語音辨識技術。
透過 Web Workers,您可以將這些耗時的操作放在另一個執行緒中處理,減輕主執行緒的負擔,提高網站的效能和響應速度。這篇文章提供了詳細的解釋和示例,幫助您快速上手使用 Web Workers。不要錯過這個可以改善網站效能的實用技巧!
你可能也想看
Thumbnail
1.加權指數與櫃買指數 週五的加權指數在非農就業數據開出來後,雖稍微低於預期,但指數仍向上噴出,在美股開盤後於21500形成一個爆量假突破後急轉直下,就一路收至最低。 台股方面走勢需觀察週一在斷頭潮出現後,週二或週三開始有無買單進場支撐,在沒有明確的反轉訊號形成前,小夥伴盡量不要貿然抄底,或是追空
Thumbnail
近期的「貼文發佈流程 & 版型大更新」功能大家使用了嗎? 新版式整體視覺上「更加凸顯圖片」,為了搭配這次的更新,我們推出首次貼文策展 ❤️ 使用貼文功能並完成這次的指定任務,還有機會獲得富士即可拍,讓你的美好回憶都可以用即可拍珍藏!
Thumbnail
不知道從什麼時候開始,書店變成網紅打卡的景點、書本成為顯示格調的裝飾品、人們於對談加入許多「主義」,又擔心觸犯道德糾察隊的「政治正確」……。
Thumbnail
你喜歡文字嗎? 格編很喜歡。私心認為,能夠撰寫出讓人產生想像、共鳴、畫面的文字工作者是相當相當厲害的,因為它不像繪畫、影像能夠直接引導/刺激大腦更快產生畫面連結;而是依照每個人的咀嚼消化程度各自表述。
Thumbnail
你有多久沒與自己對話了呢? 讓我們透過書寫,跟自己好好說說話,或許,能趁此次徵文,將自我碎片,一「篇」一「篇」,撿拾回來!
Thumbnail
走在路上經過大街小巷,有時候會忽然有種熟悉感,喚起深層記憶;或是觀察到路人的對話和行為,讓你心生感觸,如同電影花絮。 這次的主題「路上觀察」,希望能引起大家多注意周遭環境,所帶來的情感:有街道回憶、人文故事,路上觀察到的人與人的情感交流,希望能挖掘每個人深藏在心裡的情感
Thumbnail
試試看幫自己改寫故事,無論是單戀、失戀、曖昧未果、遭到傷害、朋友失和、被世界遺棄等經歷,用文字營造一個天堂,完成未竟的心願、補足現實的缺憾,將過往的傷痛改編成快樂的結局。 在你的筆下,所有都有可能。
Thumbnail
你是否也有藏於內心,而遲遲未能說出口的話呢? 可能是...... 一段戀情,因為錯過而未能傾訴自己的心意; 一位摯友,因不理解而產生衝突最終不歡而合; 一個想致謝的人,因他影響與幫助而改變自己的人生; 亦有可能是至今仍無法原諒,或難以向他人述說之事等。
Thumbnail
都說大學好似整容院,一進入便會脫胎換骨。親身經歷之後,我認為這句話真是一點都沒錯!在經過大學的洗禮之後,多數人都屏棄了國高中時的生活方式,進而尋找最適合自己的一套生存法則。
Thumbnail
當疫情成為日常,我們已漸漸熟悉進出量體溫、出門戴口罩的日子,偶有壞消息、偶有人離開,因此身邊的人健康與否,已然成為我們最在乎的事。 同婚過後,不管什麼性傾向、不管對同婚看法如何,我們還是在同一片土地上一起生活著,曾經的誤會與傷害,是否漸漸消弭了呢?一起來分享這段時間你的故事吧! 徵文的內容
Thumbnail
這是透過方格子 Project v 計畫發起的徵文活動,由格友 Amazing Key 擔任內容策展人。格編覺得這個主題很有意思,為了生活難免會為五斗米折腰,但有時候也是會很不服氣。歡迎格友們來投稿分享你的故事和看法。
Thumbnail
「還好當時」想抓住的是,那些過去讓自己意想不到的選擇,因為這樣的「當時」,造就「現在」的自己。還好當時選了這個科系、還好當時勇敢告白、還好當時趕上了飛機、還好當時寄出那封信⋯⋯在此邀請格友們,一起用「還好當時⋯⋯」紀錄下即便是細小卻不能被遺忘的選擇與事件。
Thumbnail
1.加權指數與櫃買指數 週五的加權指數在非農就業數據開出來後,雖稍微低於預期,但指數仍向上噴出,在美股開盤後於21500形成一個爆量假突破後急轉直下,就一路收至最低。 台股方面走勢需觀察週一在斷頭潮出現後,週二或週三開始有無買單進場支撐,在沒有明確的反轉訊號形成前,小夥伴盡量不要貿然抄底,或是追空
Thumbnail
近期的「貼文發佈流程 & 版型大更新」功能大家使用了嗎? 新版式整體視覺上「更加凸顯圖片」,為了搭配這次的更新,我們推出首次貼文策展 ❤️ 使用貼文功能並完成這次的指定任務,還有機會獲得富士即可拍,讓你的美好回憶都可以用即可拍珍藏!
Thumbnail
不知道從什麼時候開始,書店變成網紅打卡的景點、書本成為顯示格調的裝飾品、人們於對談加入許多「主義」,又擔心觸犯道德糾察隊的「政治正確」……。
Thumbnail
你喜歡文字嗎? 格編很喜歡。私心認為,能夠撰寫出讓人產生想像、共鳴、畫面的文字工作者是相當相當厲害的,因為它不像繪畫、影像能夠直接引導/刺激大腦更快產生畫面連結;而是依照每個人的咀嚼消化程度各自表述。
Thumbnail
你有多久沒與自己對話了呢? 讓我們透過書寫,跟自己好好說說話,或許,能趁此次徵文,將自我碎片,一「篇」一「篇」,撿拾回來!
Thumbnail
走在路上經過大街小巷,有時候會忽然有種熟悉感,喚起深層記憶;或是觀察到路人的對話和行為,讓你心生感觸,如同電影花絮。 這次的主題「路上觀察」,希望能引起大家多注意周遭環境,所帶來的情感:有街道回憶、人文故事,路上觀察到的人與人的情感交流,希望能挖掘每個人深藏在心裡的情感
Thumbnail
試試看幫自己改寫故事,無論是單戀、失戀、曖昧未果、遭到傷害、朋友失和、被世界遺棄等經歷,用文字營造一個天堂,完成未竟的心願、補足現實的缺憾,將過往的傷痛改編成快樂的結局。 在你的筆下,所有都有可能。
Thumbnail
你是否也有藏於內心,而遲遲未能說出口的話呢? 可能是...... 一段戀情,因為錯過而未能傾訴自己的心意; 一位摯友,因不理解而產生衝突最終不歡而合; 一個想致謝的人,因他影響與幫助而改變自己的人生; 亦有可能是至今仍無法原諒,或難以向他人述說之事等。
Thumbnail
都說大學好似整容院,一進入便會脫胎換骨。親身經歷之後,我認為這句話真是一點都沒錯!在經過大學的洗禮之後,多數人都屏棄了國高中時的生活方式,進而尋找最適合自己的一套生存法則。
Thumbnail
當疫情成為日常,我們已漸漸熟悉進出量體溫、出門戴口罩的日子,偶有壞消息、偶有人離開,因此身邊的人健康與否,已然成為我們最在乎的事。 同婚過後,不管什麼性傾向、不管對同婚看法如何,我們還是在同一片土地上一起生活著,曾經的誤會與傷害,是否漸漸消弭了呢?一起來分享這段時間你的故事吧! 徵文的內容
Thumbnail
這是透過方格子 Project v 計畫發起的徵文活動,由格友 Amazing Key 擔任內容策展人。格編覺得這個主題很有意思,為了生活難免會為五斗米折腰,但有時候也是會很不服氣。歡迎格友們來投稿分享你的故事和看法。
Thumbnail
「還好當時」想抓住的是,那些過去讓自己意想不到的選擇,因為這樣的「當時」,造就「現在」的自己。還好當時選了這個科系、還好當時勇敢告白、還好當時趕上了飛機、還好當時寄出那封信⋯⋯在此邀請格友們,一起用「還好當時⋯⋯」紀錄下即便是細小卻不能被遺忘的選擇與事件。