這是蒼何的第 445 篇原創(chuàng)！

大家好，我是刷 GitHub 停不下來(lái)的蒼何。

刷了很久的 GitHub，發(fā)現(xiàn)個(gè)有意思的開(kāi)源項(xiàng)目。

看了下，這是京東開(kāi)源的 joycode-agent，目前在 SWE-Bench Verified 基準(zhǔn)測(cè)試中憑借 74.6% 的高通過(guò)率位居榜單全球 Top3。

SWE-Bench Verified 是通過(guò)使用真實(shí)世界開(kāi)源項(xiàng)目中的 Bug 報(bào)告和 Issue 來(lái)測(cè)試 Agent 從理解問(wèn)題到自主生成、集成和驗(yàn)證修復(fù)代碼的完整端到端能力，是 AI Coding 技術(shù)走向和產(chǎn)品落地的行業(yè)風(fēng)向標(biāo)之一。

從跑分和能力上來(lái)看，JoyCode 針對(duì)的應(yīng)該是企業(yè)級(jí)研發(fā)場(chǎng)景。

我點(diǎn)進(jìn)去他們官網(wǎng)，就可以直接下載 JoyCode 這款智能編碼工具。

進(jìn)入后，導(dǎo)入 vscode 配置，做下簡(jiǎn)單設(shè)置，然后用京東賬號(hào)登錄。

可以看到，JoyCode 內(nèi)置了很多的資源和 MCP 工具。

也內(nèi)置了很多主流的大模型，都可以直接使用，也可自定義添加模型，集成了 Git 做代碼的版本管理，自動(dòng)生成 commit message 信息。

看了 JoyCode 設(shè)置，可以開(kāi)啟代碼評(píng)審，針對(duì)每次提交的代碼，自動(dòng)進(jìn)行質(zhì)量、安全、編碼規(guī)范、邏輯錯(cuò)誤等多維度的掃描，并提供修復(fù)建議。

稍微總結(jié)下它的核心能力：

1、多智能體架構(gòu)：可定制智能體，通過(guò)”先規(guī)劃、后執(zhí)行”的策略，以團(tuán)隊(duì)協(xié)作方式智能拆解復(fù)雜任務(wù)。

2、支持規(guī)約編程：基于需求、設(shè)計(jì)、實(shí)施的三階段工作流程，可實(shí)現(xiàn)從需求到交付的端到端覆蓋。

3、CSR上下文引擎：通過(guò)對(duì)代碼倉(cāng)庫(kù)的深度解析，全面理解代碼倉(cāng)庫(kù)上下文等集成開(kāi)發(fā)環(huán)境信息。

4、可一鍵云端部署。

看了京東云官方公眾號(hào)消息，說(shuō)是 JoyCode 已服務(wù)京東上萬(wàn)名研發(fā)人員，支撐數(shù)億級(jí)用戶產(chǎn)品研發(fā)，生成代碼采納率超 50%，開(kāi)發(fā)周期縮短 40%。

于是乎，我又開(kāi)始了一頓測(cè)試，來(lái)看看 JoyCode 實(shí)際能力如何。

既然主打的是企業(yè)級(jí)智能編碼工具，那就來(lái)幾個(gè)企業(yè)級(jí)開(kāi)發(fā)最為關(guān)心的幾大問(wèn)題。

快速上手老項(xiàng)目

大部分時(shí)間，企業(yè)中并不總是在開(kāi)發(fā)新項(xiàng)目，而是在原有項(xiàng)目上做些功能的迭代或者業(yè)務(wù)的更新。

特別是對(duì)于新人，新加入項(xiàng)目團(tuán)隊(duì)后，要快速掌握整個(gè)項(xiàng)目，絕非一件容易的事，稍微規(guī)范點(diǎn)的團(tuán)隊(duì)會(huì)有相關(guān)文檔，但很多團(tuán)隊(duì)項(xiàng)目，就真的只有一份代碼。

最讓人痛苦的是，這份代碼，連個(gè)注釋都沒(méi)有，業(yè)務(wù)邏輯和數(shù)據(jù)結(jié)構(gòu)，要人肉去理解，花費(fèi)時(shí)間及其漫長(zhǎng)，痛苦面具+1。

我嘗試用 JoyCode 來(lái)做這方面的工作，就拿我的真實(shí)企業(yè)級(jí)開(kāi)源項(xiàng)目 PmHub 來(lái)測(cè)試吧。

先讓 JoyCode 基于項(xiàng)目源碼幫我生成項(xiàng)目架構(gòu)圖。

可以看到 JoyCode 自動(dòng)切換到架構(gòu)圖設(shè)計(jì)模式，然后上來(lái)就先分析了項(xiàng)目中的 pom. xml 依賴文件及 Readme 文件，以及對(duì)整個(gè)項(xiàng)目理解就開(kāi)始吭哧吭哧自動(dòng)調(diào)用 draw. io 幫畫(huà)項(xiàng)目架構(gòu)圖了。

這里我等了不少時(shí)間，中途甚至有些想放棄，罵一句辣雞，然后滾去睡覺(jué)。但最后出來(lái)的結(jié)果，讓人很驚喜。

除了還原了整個(gè)項(xiàng)目的技術(shù)架構(gòu)，還把各個(gè)層的流轉(zhuǎn)用流動(dòng)箭頭做了標(biāo)記?？梢哉f(shuō)，這是目前為止，我最滿意的一次架構(gòu)圖設(shè)計(jì)實(shí)驗(yàn)。

JoyCode 生成. drawio 文件后，通過(guò)插件或者 draw.io 就能打開(kāi)了。

了解了整個(gè)項(xiàng)目架構(gòu)，還需要根據(jù)數(shù)據(jù)結(jié)構(gòu)來(lái)從數(shù)據(jù)層面了解業(yè)務(wù)。可以讓它生成對(duì)應(yīng)的 ER 圖，來(lái)幫助了解。

prompt：基于該 sql 文件，生成實(shí)體-關(guān)系圖，并按照業(yè)務(wù)域?qū)?shù)據(jù)庫(kù)表進(jìn)行分類 

這里有個(gè)細(xì)節(jié)，由于 sql 文件非常大，在 Chat 界面可以看到，JoyCode 會(huì)對(duì)整個(gè)上下文進(jìn)行合理壓縮，然后制定該任務(wù)的 todolist，agent 會(huì)執(zhí)行任務(wù)。

先看下稍微簡(jiǎn)單一些的任務(wù)，將表按照業(yè)務(wù)域做分類，這個(gè)完全沒(méi)啥問(wèn)題。

到了畫(huà)圖這，由于表過(guò)多，我本就沒(méi)打算它能一次成，在一番處理后，終于生成好了。

說(shuō)實(shí)話，這和我理想中的 ER 圖有些距離，不過(guò)用來(lái)做項(xiàng)目輔助理解，多少有些用。

有了清晰的數(shù)據(jù)結(jié)構(gòu)，對(duì)于有些復(fù)雜的業(yè)務(wù)邏輯，可以借助 AI 來(lái)進(jìn)行代碼脈絡(luò)查看，可以通過(guò)流程圖來(lái)輔助理解。

比如 PmHub 項(xiàng)目中的這串代碼：

/**
 * 任務(wù)待逾期提醒
 */
@Component
@Slf4j
publicclass TaskNotifyJob {

    @Autowired
    private ProjectTaskMapper projectTaskMapper;
    @Autowired
    private ProjectTaskNotifyMapper projectTaskNotifyMapper;

    @Scheduled(cron = "0 0 9 * * ?")
    @Transactional(rollbackFor = Exception.class)
    public void taskNotify() {
        List 
                  
 tasks = projectTaskMapper.queryTaskNotifyJob(); 
         
        // 當(dāng)前時(shí)間
        LocalDate localDate = LocalDate.now();
        tasks.stream().filter(taskNotifyDTO -> StringUtils.isNotBlank(taskNotifyDTO.getUserWxName()) && taskNotifyDTO.getCloseTime() != null)
                .forEach(taskNotifyDTO -> {
                    if (ProjectStatusEnum.PAUSE.getStatus().equals(taskNotifyDTO.getStatus())) {
                        return;
                    }
                    LocalDate closeDate = taskNotifyDTO.getCloseTime().toInstant().atZone(ZoneId.systemDefault()).toLocalDate();
                    if (ChronoUnit.DAYS.between(localDate, closeDate) == taskNotifyDTO.getNotifyDay()) {
                        log.info("待逾期任務(wù)提醒開(kāi)始, 用戶id:{}, 企微id:{}, 任務(wù)id:{}", taskNotifyDTO.getUserId(), taskNotifyDTO.getUserWxName(), taskNotifyDTO.getTaskId());
                        // 進(jìn)行待逾期消息提醒
                        TaskOverdueRemindDTO taskOverdueRemindDTO = new TaskOverdueRemindDTO();
                        // 設(shè)置任務(wù)名稱
                        taskOverdueRemindDTO.setTaskName(taskNotifyDTO.getTaskName());
                        // 設(shè)置通知用戶id
                        taskOverdueRemindDTO.setUserIds(Collections.singletonList(taskNotifyDTO.getUserWxName()));
                        // 設(shè)置天數(shù)
                        taskOverdueRemindDTO.setNum(taskNotifyDTO.getNotifyDay());
                        // 設(shè)置任務(wù)詳情地址
                        String url = SsoUrlUtils.ssoCreate(appid, agentid, host + path + ssoPath + URLEncoder.encode(host + "/pmhub-project/my-task/info?taskId=" + taskNotifyDTO.getTaskId()));
                        taskOverdueRemindDTO.setDetailUrl(url);
                        taskOverdueRemindDTO.setOaTitle("任務(wù)即將逾期提醒");
                        taskOverdueRemindDTO.setOaContext("您的任務(wù)【" + taskNotifyDTO.getTaskName() + "】還有【" + taskNotifyDTO.getNotifyDay() + "】天到期，請(qǐng)及時(shí)處理！");
                        taskOverdueRemindDTO.setUserName(taskNotifyDTO.getUserName());
                        taskOverdueRemindDTO.setLinkUrl(OAUtils.ssoCreate(host + "/pmhub-project/my-task/info?taskId=" + taskNotifyDTO.getTaskId()));
                        RocketMqUtils.push2Wx(taskOverdueRemindDTO);
                        // 進(jìn)行查詢 如果數(shù)據(jù)庫(kù)不存在記錄 則就插入記錄
                        LambdaQueryWrapper 
                  
 qw = Wrappers.lambdaQuery(ProjectTaskNotify 
         .class).eq(ProjectTaskNotify::getTaskId, taskNotifyDTO.getTaskId()).eq(ProjectTaskNotify::getOverdue, 0);
                        if (projectTaskNotifyMapper.selectOne(qw) == null) {
                            // 插入記錄
                            ProjectTaskNotify projectTaskNotify = new ProjectTaskNotify();
                            projectTaskNotify.setProjectId(taskNotifyDTO.getProjectId());
                            projectTaskNotify.setTaskId(taskNotifyDTO.getTaskId());
                            projectTaskNotify.setOverdue(0);
                            projectTaskNotify.setUserId(taskNotifyDTO.getUserId());
                            projectTaskNotify.setUserWxName(taskNotifyDTO.getUserWxName());
                            projectTaskNotify.setCloseTime(taskNotifyDTO.getCloseTime());
                            projectTaskNotify.setTaskName(taskNotifyDTO.getTaskName());
                            projectTaskNotifyMapper.insert(projectTaskNotify);
                        }
                        log.info("待逾期任務(wù)提醒結(jié)束");
                    }

                });
    }

}

可以選中這段代碼后，解釋該代碼。

然后讓 JoyCode 生成流程圖。

代碼評(píng)審

在團(tuán)隊(duì)開(kāi)發(fā)中，開(kāi)發(fā)完代碼通常需要進(jìn)行代碼評(píng)審，也簡(jiǎn)稱為 CR，這個(gè)工作通常會(huì)團(tuán)隊(duì)內(nèi)交叉進(jìn)行，最終上線需要技術(shù) leader 進(jìn)行最終 CR。

現(xiàn)在就可以把這個(gè)工作先交給 AI 來(lái)做一輪前置評(píng)審，識(shí)別出相關(guān)風(fēng)險(xiǎn)，保證代碼質(zhì)量。

JoyCode 會(huì)給出一份評(píng)審報(bào)告，并列出改進(jìn)建議和優(yōu)先級(jí)排序。

在完成開(kāi)發(fā)后，做代碼提交，JoyCode 能夠自動(dòng)添加 git commit 信息。

接口變生產(chǎn)代碼

在實(shí)際企業(yè)級(jí)開(kāi)發(fā)中，前后端會(huì)同步開(kāi)發(fā)，往往是先定義好接口，然后前后端都基于該接口進(jìn)行開(kāi)發(fā)。

所以如何將定義好的接口（API 文檔）轉(zhuǎn)化為生產(chǎn)級(jí)代碼，就顯得很重要。

我嘗試在 JoyCode 中測(cè)試該功能，比如照著我們開(kāi)源的 PmHub 項(xiàng)目的接口文檔，我們嘗試做點(diǎn)有意思的事情。

PmHub 接口文檔地址：https://laigeoffer-pmhub.apifox.cn

給到如下提示詞：

基于該API文檔：https://laigeoffer-pmhub.apifox.cn 中的"我的項(xiàng)目"模塊進(jìn)行開(kāi)發(fā)，請(qǐng)嚴(yán)格遵循開(kāi)發(fā)規(guī)范和接口定義，前后端分離，保證項(xiàng)目可運(yùn)行。

他會(huì)先根據(jù) API 文檔創(chuàng)建需求文檔、設(shè)計(jì)文檔和任務(wù)文檔。

然后就開(kāi)始吭哧吭哧的由前端到后端的開(kāi)發(fā)。我這里選的是 JoyCode 的規(guī)約編程模式。

一句話解釋規(guī)約編程：你不用手把手教 AI 怎么做，你只管用規(guī)則（規(guī)約）把“要什么”和“標(biāo)準(zhǔn)是什么”定義清楚，AI 就能自己寫(xiě)出 100% 滿足你要求的代碼。

在任務(wù)列表中可以分解了 22 個(gè)任務(wù)，等待執(zhí)行，我們點(diǎn)擊確認(rèn)全部執(zhí)行。

在任務(wù)隊(duì)列中就可看到所有任務(wù)，JoyCode 會(huì)按照任務(wù)順序依次執(zhí)行。

這里我發(fā)現(xiàn)了一處小細(xì)節(jié)，在 JoyCode 中多個(gè)任務(wù)是可以并行的，比如這個(gè)命令：

cd pmhub-ui && npm install 

它就能在終端自己并行執(zhí)行，在 Chat 中的代碼任務(wù)也在同步執(zhí)行。

在生成前端代碼這個(gè)任務(wù)中，可以看到無(wú)論是使用的框架還是文件類命名的風(fēng)格都出奇的和規(guī)范保持一致，甚至還學(xué)習(xí)了命名風(fēng)格，環(huán)境配置。

我列了一張對(duì)比圖：

出奇的相似。前端頁(yè)面也完全可用。

登錄進(jìn)來(lái)后就可以看到項(xiàng)目管理功能模塊了。

這是一個(gè)基于 API 文檔利用 JoyCode 生成的項(xiàng)目管理系統(tǒng)，全程我唯一要做的是把 API 丟給 JoyCode，然后讓他規(guī)劃任務(wù)，按照指定的規(guī)約進(jìn)行編程。

JoyCode 的表現(xiàn)還不錯(cuò)，在嚴(yán)肅的企業(yè)級(jí)場(chǎng)景中，不會(huì)瞎搞，像是個(gè)憨實(shí)的程序員。

一句話需求到 PRD

我從 GitHub 了解到，JoyCode 內(nèi)置了一些工具，能將一句話需求快速轉(zhuǎn)變?yōu)?strong>專業(yè)產(chǎn)研翻譯，生成 PRD 文檔。

來(lái)測(cè)試下效果。

提示詞：幫我生成專業(yè)的PRD文檔，我需要開(kāi)發(fā)一個(gè)項(xiàng)目管理系統(tǒng)，支持新建項(xiàng)目、項(xiàng)目中新建任務(wù)。 

可以看到將口語(yǔ)的一句話需求轉(zhuǎn)化為了專業(yè)的業(yè)務(wù)語(yǔ)言。

全棧開(kāi)發(fā)

我也蠻想試試在 JoyCode 中進(jìn)行全棧開(kāi)發(fā)，

這里我直接利用原先 PmHub 的 PRD 文檔和設(shè)計(jì)原型文檔，進(jìn)行全棧開(kāi)發(fā)。

ps：這也是規(guī)約編程的執(zhí)行標(biāo)準(zhǔn)，不建議直接上手開(kāi)發(fā)，在開(kāi)發(fā)前定義好相應(yīng)需求和設(shè)計(jì)，才能讓 AI 更好的完成任務(wù)。

我的目的很簡(jiǎn)單，幫我一比一復(fù)刻一個(gè) PmHub 出來(lái)。

但由于 PmHub 功能很多，完全復(fù)刻需要時(shí)間，這里我就以基礎(chǔ)的能力來(lái)做了復(fù)刻。下面是我整體的實(shí)現(xiàn)流程。

第一步，PRD 分析。

PmHub 的需求分析長(zhǎng)這樣：

提示詞：你是一名全棧架構(gòu)師，以上是項(xiàng)目管理系統(tǒng)的prd，幫我根據(jù)這個(gè)prd，
生成一個(gè)關(guān)鍵設(shè)計(jì)說(shuō)明。并生成系統(tǒng)整體交互流程UML時(shí)序圖 

生成的時(shí)序圖，經(jīng)過(guò)調(diào)整和樣式簡(jiǎn)單優(yōu)化得到如下：

這里的 UML 邏輯需要多次核對(duì)，Chat 修改，最終能得到符合的效果，稍微有些花時(shí)間。

第二步，設(shè)計(jì)原型文檔分析。

這是 PmHub 的原型設(shè)計(jì)圖，直接將他丟給 JoyCode。

以上是項(xiàng)目管理系統(tǒng)的原型設(shè)計(jì)文檔「URL鏈接」，請(qǐng)基于此進(jìn)行技術(shù)方案設(shè)計(jì)。 

可以看到結(jié)果會(huì)更偏向設(shè)計(jì)需求：

第三步、生成 API 接口文檔

接口先行，并行開(kāi)發(fā)，是敏捷開(kāi)發(fā)的必要點(diǎn)，這里我創(chuàng)新性的讓 JoyCode 先根據(jù)以上信息生成 API 接口文檔，然后根據(jù)上面的步驟再依次生成前后端代碼及數(shù)據(jù)庫(kù)代碼。

由于模塊很多，建議區(qū)分單個(gè)模塊生成。

基于以上信息及文檔，幫我生成項(xiàng)目管理模塊中的項(xiàng)目列表和添加項(xiàng)目的 api 接口文檔，我要能直接導(dǎo)入到apifox中。 

然后還生成了 api 文檔說(shuō)明。

這里需要導(dǎo)入到 Apifox 中進(jìn)行 check，確保符合后繼續(xù)接下來(lái)的操作。

第四步，生成代碼。

這里我的經(jīng)驗(yàn)是根據(jù) api 文檔以及原型設(shè)計(jì)稿會(huì)有很好的效果，AI 不會(huì)瞎搞，樣式和接口都是按照預(yù)定的來(lái)。

包括技術(shù)設(shè)計(jì)、架構(gòu)設(shè)計(jì)，這些在規(guī)約中已經(jīng)指定，這就是規(guī)約編程的魅力吧。

和之前一樣，JoyCode 會(huì)根據(jù)要求，老老實(shí)實(shí)寫(xiě)代碼。

由于時(shí)間關(guān)系，我就只讓開(kāi)發(fā)了登錄頁(yè)面、項(xiàng)目列表頁(yè)和新建項(xiàng)目，包括整個(gè)框架這次我也讓生成好了，這樣下次單模塊開(kāi)發(fā)就能直接使用。

登錄頁(yè)：

這是項(xiàng)目列表頁(yè)：

這是添加項(xiàng)目頁(yè)面：

可以說(shuō)，98%以上還原了我 PmHub，包括頁(yè)面組件樣式和功能。

雖然，過(guò)程中會(huì)有一些問(wèn)題需要調(diào)整，但在 JoyCode 中也能方便的處理。

我體驗(yàn)下來(lái)，JoyCode 對(duì)于復(fù)雜任務(wù)的理解和處理效果是很好的，如果給的足夠詳細(xì)，比如原型設(shè)計(jì)，基于 API 接口開(kāi)發(fā)等。

更能發(fā)揮出好的效果。

還可以在 JoyCode 中一鍵部署，不過(guò)我的功能還沒(méi)開(kāi)發(fā)完全，就先不部署了，到時(shí)再多調(diào)調(diào)，看下能否完全復(fù)刻出一個(gè) PmHub 出來(lái)。

呼，現(xiàn)在真方便了。有了 AI 規(guī)約編程，你不用手把手教 AI 怎么做，你只管用規(guī)則（規(guī)約）把“要什么”和“標(biāo)準(zhǔn)是什么”定義清楚，AI 就能自己寫(xiě)出滿足你要求的代碼。

以后接手沒(méi)有注釋和文檔的屎山項(xiàng)目時(shí)，也許我們終于不用再戴上痛苦面具了。