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 的方式,敬請期待~

留言
avatar-img
留言分享你的想法!
avatar-img
Let's Write 的沙龍
9會員
19內容數
沙龍到底是…做什麼用的勒?
Let's Write 的沙龍的其他內容
2024/08/07
了解如何使用 Cloudflare Workers AI 與 Whisper 建立免費開源的語音辨識功能。本文詳細說明註冊步驟、部署流程及程式碼修改,讓你輕鬆將語音轉換成文字。
Thumbnail
2024/08/07
了解如何使用 Cloudflare Workers AI 與 Whisper 建立免費開源的語音辨識功能。本文詳細說明註冊步驟、部署流程及程式碼修改,讓你輕鬆將語音轉換成文字。
Thumbnail
2024/06/05
學習如何使用 Tensorflow.js 的 COCO-SSD 模型在網頁上進行圖片物件辨識,包括基本使用方法、進階應用及實作範例,輕鬆辨識圖片中的人數和物件。
Thumbnail
2024/06/05
學習如何使用 Tensorflow.js 的 COCO-SSD 模型在網頁上進行圖片物件辨識,包括基本使用方法、進階應用及實作範例,輕鬆辨識圖片中的人數和物件。
Thumbnail
2024/02/01
詳細解說如何在 Mac 上透過 Docker 安裝 MongoDB 社群版。包括 MongoDB Compass 的安裝與配置,以及 MongoDB Shell 的使用方法,為開發者提供 MongoDB 學習資源。
Thumbnail
2024/02/01
詳細解說如何在 Mac 上透過 Docker 安裝 MongoDB 社群版。包括 MongoDB Compass 的安裝與配置,以及 MongoDB Shell 的使用方法,為開發者提供 MongoDB 學習資源。
Thumbnail
看更多
你可能也想看
Thumbnail
TOMICA第一波推出吉伊卡哇聯名小車車的時候馬上就被搶購一空,一直很扼腕當時沒有趕緊入手。前陣子閒來無事逛蝦皮,突然發現幾家商場都又開始重新上架,價格也都回到正常水準,估計是官方又再補了一批貨,想都沒想就立刻下單! 同文也跟大家分享近期蝦皮購物紀錄、好用推薦、蝦皮分潤計畫的聯盟行銷!
Thumbnail
TOMICA第一波推出吉伊卡哇聯名小車車的時候馬上就被搶購一空,一直很扼腕當時沒有趕緊入手。前陣子閒來無事逛蝦皮,突然發現幾家商場都又開始重新上架,價格也都回到正常水準,估計是官方又再補了一批貨,想都沒想就立刻下單! 同文也跟大家分享近期蝦皮購物紀錄、好用推薦、蝦皮分潤計畫的聯盟行銷!
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
無論你是想要在Instagram上撰寫出引人入勝的文案,或者要在職場上發揮巧思,透過ChatGPT、AI指令及各種範本框架的方法,讓你的文案寫作效率大幅提升。除此之外,該文依據文章框架與流程分步引導,並細緻列舉了使用範例以及指令的技巧,讓讀者在瞭解運作原理的同時,更上手地運用相關工具。
Thumbnail
無論你是想要在Instagram上撰寫出引人入勝的文案,或者要在職場上發揮巧思,透過ChatGPT、AI指令及各種範本框架的方法,讓你的文案寫作效率大幅提升。除此之外,該文依據文章框架與流程分步引導,並細緻列舉了使用範例以及指令的技巧,讓讀者在瞭解運作原理的同時,更上手地運用相關工具。
Thumbnail
Hi, 我是茶桁。 我们已经介绍了 OpenAI 的主要接口。这是基础知识系列的最后一讲,我们将讨论 OpenAI GPT 系列模型的其他接口。你可能不会经常使用其中一些接口,但了解它们不会有任何坏处,说不定你会在某些需求中用到它们。 在这篇文章中,我们将一起探讨 OpenAI 为文本改写和内容
Thumbnail
Hi, 我是茶桁。 我们已经介绍了 OpenAI 的主要接口。这是基础知识系列的最后一讲,我们将讨论 OpenAI GPT 系列模型的其他接口。你可能不会经常使用其中一些接口,但了解它们不会有任何坏处,说不定你会在某些需求中用到它们。 在这篇文章中,我们将一起探讨 OpenAI 为文本改写和内容
Thumbnail
不用问我都知道,你们一定是被ChatGPT的火热出圈导致的开始关注人工智能,也是由于此才看到我这篇文章。 放心,大家想要的我一定会给予,既然大家都想先认识ChatGPT,那么我们就从这个主题开始。 接下来,我们学学如何利用openAI的API来和其沟通。在整个使用过程中,我们都使用的是GPT-3
Thumbnail
不用问我都知道,你们一定是被ChatGPT的火热出圈导致的开始关注人工智能,也是由于此才看到我这篇文章。 放心,大家想要的我一定会给予,既然大家都想先认识ChatGPT,那么我们就从这个主题开始。 接下来,我们学学如何利用openAI的API来和其沟通。在整个使用过程中,我们都使用的是GPT-3
Thumbnail
如果你想开始学习AI应用开发,那么在学习之前,有一些学前提醒需要注意。在当今AI爆发的时代,学习AI应用开发需要的学习方法和策略也发生了变化。本课程的目标是通过多尝试、多体验、多做头脑风暴的学习方法,帮助学生在短时间内掌握AI应用开发的基本技能。我们并不会传授过于深奥的数学和理论知识,而是会通过简单
Thumbnail
如果你想开始学习AI应用开发,那么在学习之前,有一些学前提醒需要注意。在当今AI爆发的时代,学习AI应用开发需要的学习方法和策略也发生了变化。本课程的目标是通过多尝试、多体验、多做头脑风暴的学习方法,帮助学生在短时间内掌握AI应用开发的基本技能。我们并不会传授过于深奥的数学和理论知识,而是会通过简单
Thumbnail
我們已經介紹過關於Transformer模型的平台「【Hugging Face】Ep.1 平凡人也能玩的起的AI平台」,而這次就來實際動手進行開發,讓我們自己的AI自己做。 由於AI模型的訓練往往都會比較耗時, 因此建議需要有GPU環境會比較有效率一些, 否則訓練模行動輒好幾個小時才能看到結果, 一
Thumbnail
我們已經介紹過關於Transformer模型的平台「【Hugging Face】Ep.1 平凡人也能玩的起的AI平台」,而這次就來實際動手進行開發,讓我們自己的AI自己做。 由於AI模型的訓練往往都會比較耗時, 因此建議需要有GPU環境會比較有效率一些, 否則訓練模行動輒好幾個小時才能看到結果, 一
Thumbnail
由于 ChatGPT 的出現讓我們看到了聊天機器人的新可能性,我們這篇文章的目的,就是要來製作第一個屬於自己的聊天機器人。 我們先來準備範例的程式碼,並且稍後會再跟大家介紹要設計自己的 ChatGPT 聊天機器人的重要概念。 初始專案與環境設定 下載程式碼 請先使用下面這一段指令下載我們的範例程式碼
Thumbnail
由于 ChatGPT 的出現讓我們看到了聊天機器人的新可能性,我們這篇文章的目的,就是要來製作第一個屬於自己的聊天機器人。 我們先來準備範例的程式碼,並且稍後會再跟大家介紹要設計自己的 ChatGPT 聊天機器人的重要概念。 初始專案與環境設定 下載程式碼 請先使用下面這一段指令下載我們的範例程式碼
Thumbnail
今天終於可以揮別那些假的ChatGPT串接教學了! 在今天(2023/03/02)之後,終於可以串接真正的ChatGPT API了! 這是真正的GPT 3.5 API官方版本,內文提供簡介與python 串接教學。
Thumbnail
今天終於可以揮別那些假的ChatGPT串接教學了! 在今天(2023/03/02)之後,終於可以串接真正的ChatGPT API了! 這是真正的GPT 3.5 API官方版本,內文提供簡介與python 串接教學。
Thumbnail
最近AI算圖真的是很有趣,可是網路上的算圖大多提詞是要付費的,這裡也寫個筆記我,有興趣的可以自己架設算圖伺服器。 這裡先把相關需要安裝的軟體網址先記錄下來,還有要玩前最好先有nivdia顯卡。 1.GIT服務器:下載適用自己作業系統的版本 Git - Downloads (git-scm.com)
Thumbnail
最近AI算圖真的是很有趣,可是網路上的算圖大多提詞是要付費的,這裡也寫個筆記我,有興趣的可以自己架設算圖伺服器。 這裡先把相關需要安裝的軟體網址先記錄下來,還有要玩前最好先有nivdia顯卡。 1.GIT服務器:下載適用自己作業系統的版本 Git - Downloads (git-scm.com)
Thumbnail
程式原碼: https://github.com/JokerWuXin/ChatGpt-LineBot 步驟: S1.至OPEN AI 取得 API KEY S2.至LineBot 取得 Channel access token 、Channel secret 並 進行相關設定 S3.至Verce
Thumbnail
程式原碼: https://github.com/JokerWuXin/ChatGpt-LineBot 步驟: S1.至OPEN AI 取得 API KEY S2.至LineBot 取得 Channel access token 、Channel secret 並 進行相關設定 S3.至Verce
Thumbnail
安裝Python 安裝Open Ai 參考資料 註冊申請 Open AI API 至官方網站申請為會員,接著選 View API Key 進入後 選擇 Create CHAT 範例 官方範例 中文CHAT
Thumbnail
安裝Python 安裝Open Ai 參考資料 註冊申請 Open AI API 至官方網站申請為會員,接著選 View API Key 進入後 選擇 Create CHAT 範例 官方範例 中文CHAT
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News