整體說明

從小程序的注冊到后面的上線發(fā)布，爭取讓不懂代碼的人，可以用cursor完成第一個小程序項目。

廢話不多說，現(xiàn)在開始。

整體思路

界面一個展示頁面：輸入框、確定按鈕、展示區(qū)域。

當(dāng)用戶在輸入框中輸入明星姓名之后，點(diǎn)擊確定按鈕后，將輸入內(nèi)容發(fā)送給智能體，通過聯(lián)網(wǎng)功能去獲取該明星的丑聞信息，再返回給界面展示。

軟件注冊與下載

微信小程序注冊與下載

• · 點(diǎn)擊網(wǎng)址：

• https://mp.weixin.qq.com/cgi-bin/registermidpage?action=index&lang=zh_CN

• · 接下來便是賬號的基本注冊流程，按照要求繼續(xù)執(zhí)行。

• · 當(dāng)填完賬號信息之后，就是郵箱的激活了，我們會收到1條激活短信。

• · 第三步就是完成個人信息，包括手機(jī)號碼、身份證號碼的信息填寫。

• · 完成注冊之后，進(jìn)入界面，拿到appID，保存在記事本中。

• · 同時繼續(xù)點(diǎn)擊下面服務(wù)器域名配置，將 添加成合法域名。

• · 微信小程序開發(fā)工具下載，點(diǎn)擊下面鏈接：

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

具體安裝步驟按照官方提示操作即可，這里不再展開描述。

cursor注冊與下載

• · 點(diǎn)擊網(wǎng)址https://www./，進(jìn)入到cursor官網(wǎng)。

download 就可以進(jìn)行安裝包的下載，這里直接點(diǎn)擊下一步即可。

• · 點(diǎn)擊sign in，進(jìn)行cursor的注冊，會跳轉(zhuǎn)到這個頁面。

按照要求輸入的你郵箱并接收驗證碼。注冊好之后可以有14天的免費(fèi)試用機(jī)會。

tips：至于如何一直免費(fèi)試用，可以看章節(jié)第6部分。

Coze開發(fā)一個簡單的智能體

本文主要是講解整體cursor開發(fā)內(nèi)容，目標(biāo)是流程跑通。因此我們就用coze開發(fā)一個簡單智能體。

主要為了實現(xiàn)：輸入明星姓名，調(diào)用百度或者頭條插件，將返回的結(jié)果

coze賬號注冊并創(chuàng)建智能體

• · 注冊coze：https://www./，我們選擇基礎(chǔ)版登錄即可。

• · 點(diǎn)擊左側(cè)的添加智能體選項

• · 輸入智能體的名稱，然后點(diǎn)擊保存進(jìn)入編輯頁面。

生成令牌（調(diào)用API的鑰匙）

• · 第一步：點(diǎn)擊左側(cè)的按鈕即可

• · 第二步：在彈出的頁面，點(diǎn)擊“授權(quán)”按鈕。

• · 第三步：點(diǎn)擊添加新令牌。（相當(dāng)于我們后期訪問api的鑰匙）

• · 第四步：接下來點(diǎn)擊勾選權(quán)限，點(diǎn)擊確定。（建議勾選所有權(quán)限，免得后面遇到問題沒辦法解決）

• · 第五步：接下來就會彈出窗，讓用戶保存令牌信息。

！重點(diǎn)：這個令牌只會顯示一次，因此，必須要點(diǎn)擊右下角的按鈕，保存到你的記事本中。（后面會用到）

coze開發(fā)智能體

這里就是我們智能體的主要開發(fā)窗口了。我們主要在這兩塊添加內(nèi)容即可。

• · 添加插件

這里我們選擇頭條搜索作為插件，點(diǎn)擊添加。

• · 人設(shè)和回復(fù)邏輯

這里主要是告訴智能體，我們想要搜索的內(nèi)容以及返回的結(jié)果格式。可以直接復(fù)制下面的內(nèi)容到人設(shè)與回復(fù)邏輯。

可以把我的prompt直接復(fù)制到“人設(shè)和回復(fù)邏輯”編輯窗中。

• · 調(diào)試

點(diǎn)擊右側(cè)的輸入框，輸入內(nèi)容進(jìn)行調(diào)試。

發(fā)布API

• · 點(diǎn)擊右上角的發(fā)布按鈕，就可以點(diǎn)擊右上角進(jìn)行智能體的發(fā)布了。

• · 頁面一直拉到最下面，可以看到'Agent as API'，勾選前面的框。點(diǎn)擊發(fā)布。

• · 發(fā)布成功就會出現(xiàn)下面的頁面。

重點(diǎn)：一定將瀏覽器中這串?dāng)?shù)字保存到記事本中，這個是我們這個智能體的id值。

用cursor進(jìn)行微信小程序的開發(fā)

這一章節(jié)就進(jìn)入到我們的重頭戲，通過cursor不寫代碼就完成小程序的開發(fā)。

小程序工具初始化項目

• · 打開小程序開發(fā)工具，點(diǎn)擊添加按鈕。

• · 進(jìn)入創(chuàng)建小程序界面。APPID填入我們系統(tǒng)APPID（如果不記得，看2.1章節(jié)）

后端服務(wù)：選擇不使用云服務(wù)、模板選擇：不使用模板。

最后點(diǎn)擊右下角的創(chuàng)建就可以了。這個時候就自動創(chuàng)建一份文件，具體的文件目錄看截圖。

• · 出現(xiàn)下面界面代表已經(jīng)成功了。

cursor開發(fā)調(diào)試基本功能

• · 打開cursor工具，然后點(diǎn)擊open a folder，打開剛才新建的文件目錄。

打開的界面如下圖所示

• · 在根目錄新建文件“instruction.md”,并輸入下面的文字，點(diǎn)擊保存。要想讓cursor完全理解你的需求是不現(xiàn)實的。

因此，我們必須要告訴大模型，下一步是怎么處理的。

1. 這是個小程序開發(fā)系統(tǒng)
2. 你的角色是一個ui設(shè)計師，務(wù)必要求審美過關(guān),我比較喜歡element-ui 的風(fēng)格和樣式
3. 小程序已經(jīng)使用官方腳本初始化完成，你只需要實現(xiàn)接下來的功能即可。在page目錄下完成
4. 功能如下： 進(jìn)入首頁有三塊內(nèi)容：一個文本輸入框、一個提交按鈕、一個展示區(qū)域。其中輸入框和按鈕在一起，展示區(qū)域在下面。盡量合理布局。距離頂部要有一定距離。
5. 點(diǎn)擊按鈕后，文本輸入框的內(nèi)容會顯示在展示區(qū)域。

• · 接下來，快捷鍵“comand/ctrl + i”就是等待，生成。在彈出框中輸入下面的文字：“根據(jù)instrction.md文檔的內(nèi)容，生成具體的代碼”。

• · 等待幾秒鐘，cursor就自動生成對應(yīng)的腳本。點(diǎn)擊accept all才生效。

• · 這時候，就要打開微信開發(fā)工具，點(diǎn)擊編譯按鈕，就能快速預(yù)覽內(nèi)容了。可是不幸的事情發(fā)了，竟然報錯了。

我們接下來把報錯的信息復(fù)制到cursor中，讓cursor給我們解決吧。

• · 就這樣，cursor快速給出了結(jié)果。點(diǎn)擊“accept all”再試試。

就這樣，我們完成了初級的布局功能。輸入“李誕”點(diǎn)擊提交，展示區(qū)域就顯示“李誕”的名稱。

與coze的API關(guān)聯(lián)起來

現(xiàn)在我們的需求是輸入內(nèi)容，點(diǎn)擊提交，去調(diào)用coze的api并返回結(jié)果。

• · 我們只需要把我們的想法告訴cursor。

• · 告訴cursor你的botid 是XXX，token 是XXX。

• · 中間會出現(xiàn)返回結(jié)果不匹配。需要結(jié)合文檔返回的格式要求來告訴cursor去修改。

微信小程序上線

• · 點(diǎn)擊客戶端的上傳按鈕，上傳代碼到服務(wù)器上。

• · 接下來進(jìn)入網(wǎng)頁端進(jìn)行上線的最后配置。點(diǎn)擊版本管理-提交審核。

展望

每次寫完一篇文章，我都要思考一下。這個東西到底有什么用？我用GPT幫我想到了這幾招：

每日健康打卡小程序:記錄每日飲水量、步數(shù)、鍛煉時間等健康數(shù)據(jù)，并設(shè)置打卡提醒，培養(yǎng)健康習(xí)慣

失物招領(lǐng)與社區(qū)互助小程序:小區(qū)鄰居都可以在這里發(fā)布招領(lǐng)信息，促進(jìn)鄰里和諧。

食材管理與菜譜推薦小程序:以后再也不怕老婆說隨便兩個字了，用它接入大模型，根據(jù)你的需要，生成你想要的菜譜。

學(xué)生點(diǎn)名小程序:如果你是老師，來個隨機(jī)點(diǎn)名小程序，學(xué)生絕對不敢再逃課了。

情侶空間小程序:情侶之間互相分享的空間，數(shù)據(jù)可以放在自己服務(wù)器，再也不怕信息泄漏了。