2024年，身邊不管是大廠的還是創(chuàng)業(yè)者都感覺(jué)到前所未有的寒冷。一個(gè)正處于當(dāng)打之年大廠程序員在公司降本增效后，空窗3個(gè)月，簡(jiǎn)歷的項(xiàng)目面試時(shí)被質(zhì)疑“日常開(kāi)發(fā)需求，沒(méi)有業(yè)務(wù)思考”；一個(gè)創(chuàng)業(yè)的博士朋友嘗試了三個(gè)項(xiàng)目都沒(méi)賺到錢(qián)，坦言“以前創(chuàng)業(yè)只要用代碼實(shí)現(xiàn)軟件，現(xiàn)在開(kāi)發(fā)門(mén)檻太低，創(chuàng)業(yè)者都是為巨頭試錯(cuò)”。

困境里也有很多機(jī)會(huì)。一行代碼都沒(méi)有寫(xiě)的花生用Cursor開(kāi)發(fā)了“小貓補(bǔ)光燈”登上app store付費(fèi)榜第一，所有開(kāi)發(fā)者都應(yīng)該警醒：產(chǎn)品的核心不是開(kāi)發(fā)門(mén)檻，好洞察+好工具才是關(guān)鍵。

前幾天我用Cursor和BetterYeah AI Agent平臺(tái)，1個(gè)小時(shí)0代碼搭建了“全球最火AI工具集”，不禁感嘆：好的AI工具已經(jīng)完全可以替代人了。AI工具省下來(lái)的時(shí)間可以提高認(rèn)知和洞察能力。0基礎(chǔ)小白，一行代碼沒(méi)寫(xiě)就水靈靈地做了個(gè)產(chǎn)品的感覺(jué)真是太奇妙了。下面的操作步驟，看完你肯定也能馬上上手。

第0步，產(chǎn)品設(shè)計(jì)

功能規(guī)劃：這個(gè)工具集網(wǎng)站每日自動(dòng)抓取Producthunt上全球最火的AI工具，同時(shí)也有AI搜索能力，用戶可根據(jù)關(guān)鍵詞推薦對(duì)應(yīng)的AI應(yīng)用。這是成品導(dǎo)航工具地址，可以點(diǎn)擊查看 https://ai-nav-six.vercel.app/ (提示：請(qǐng)科學(xué)上網(wǎng)查看)

在設(shè)計(jì)這個(gè)網(wǎng)站時(shí)，規(guī)劃了3個(gè)頁(yè)面：

• 首頁(yè)：展示所有AI工具列表

• AI工具詳情頁(yè)：每個(gè)AI工具的產(chǎn)品介紹

• AI搜索結(jié)果頁(yè)：首頁(yè)輸入框是個(gè) ai搜索，可以問(wèn)任何問(wèn)題，例如推薦 ai 工具、分析和總結(jié) ai 工具優(yōu)劣勢(shì)等

工具產(chǎn)品會(huì)用到兩個(gè)：

• Cursor：最近大火的AI編程工具，基于VSCode，0代碼就可以自動(dòng)生成代碼，只要提出明確需求，AI就可以快速幫你生成代碼。有免費(fèi)使用天數(shù)，小某書(shū)上也有續(xù)杯教程。

• BetterYeah：國(guó)內(nèi)的一個(gè)很專業(yè)的AI Agent平臺(tái)，穩(wěn)定性高，自研的RAG技術(shù)和知識(shí)庫(kù)的處理能力和自動(dòng)解析功能很智能，我在用了之后非常喜歡，秒殺了不少平臺(tái)。主要用BetterYeah AI搭建agent、flow、數(shù)據(jù)庫(kù)、知識(shí)庫(kù)，實(shí)現(xiàn)導(dǎo)航站所需數(shù)據(jù)的抓取、處理、查詢、展示及AI搜索功能。頁(yè)面的數(shù)據(jù)通過(guò)AI從Producthunt抓取，在頁(yè)面by日更新，底層對(duì)接LLM，能實(shí)現(xiàn)頁(yè)面上的AI搜索能力。平臺(tái)支持開(kāi)放接口，可用性很強(qiáng)，這點(diǎn)開(kāi)發(fā)們也都懂的。國(guó)內(nèi)做agent平臺(tái)的公司不多，BetterYeah是做的比較早的，我很早就開(kāi)始關(guān)注，比如自動(dòng)分段、編輯模式等很多細(xì)節(jié)打磨的很好，能看出來(lái)對(duì)用戶有很深刻的洞察，這里做個(gè)推薦。

有了這兩個(gè)產(chǎn)品的配合，就可以實(shí)現(xiàn)頁(yè)面的開(kāi)發(fā)和頁(yè)面所需數(shù)據(jù)和功能了。

第一步、前端頁(yè)面代碼生成

1、在Cursor編輯器中創(chuàng)建一個(gè)next.js項(xiàng)目，定義網(wǎng)站開(kāi)發(fā)的PRD文檔，描述需求和期望的效果。

如：網(wǎng)站需要包含3個(gè)頁(yè)面，首頁(yè)、產(chǎn)品詳情頁(yè)、AI搜索結(jié)果的頁(yè)面，頁(yè)面的樣式，以及用到哪些數(shù)據(jù)

2、讓Cusor根據(jù)PRD文檔生成前端代碼，代碼就這么水靈靈的寫(xiě)好了。

不滿意的地方可以再和Cursor對(duì)話，修改。滿意之后，點(diǎn)擊「Accept all」

第二步、數(shù)據(jù)抓取與處理

1、在Producthunt創(chuàng)建三方應(yīng)用，拿到API auth，獲取當(dāng)天發(fā)布的新應(yīng)用數(shù)據(jù)

2、在BetterYeah平臺(tái)注冊(cè)賬號(hào)，點(diǎn)擊創(chuàng)建flow，用于處理從Producthunt獲取的數(shù)據(jù)。再通過(guò)畫(huà)布方式創(chuàng)建整個(gè)數(shù)據(jù)處理邏輯：拉數(shù)據(jù)，讓LLM進(jìn)行處理數(shù)據(jù)，讓數(shù)據(jù)按固定格式輸出

3、在BetterYeah創(chuàng)建數(shù)據(jù)庫(kù)，創(chuàng)建AI工具表，存儲(chǔ)Producthunt獲取的數(shù)據(jù)，用于展示首頁(yè)渲染的數(shù)據(jù)，把LLM處理后的數(shù)據(jù)插入進(jìn)AI工具表中

4、在BetterYeah創(chuàng)建知識(shí)庫(kù)，創(chuàng)建json格式文檔，在flow中把插入數(shù)據(jù)庫(kù)的LLM處理后數(shù)據(jù)也插入知識(shí)庫(kù)中

數(shù)據(jù)庫(kù)中就存儲(chǔ)了當(dāng)天Producthunt新產(chǎn)品的數(shù)據(jù)，知識(shí)庫(kù)中還對(duì)這些數(shù)據(jù)做了向量化處理

5、設(shè)置flow的運(yùn)行方式為定時(shí)運(yùn)行，設(shè)置每天下午四點(diǎn)半抓取Producthunt中最新的數(shù)據(jù)，完成持續(xù)更新機(jī)制設(shè)置

第三步、頁(yè)面數(shù)據(jù)查詢與展示

1、在BetterYeah新建flow，創(chuàng)建數(shù)據(jù)庫(kù)節(jié)點(diǎn)，編寫(xiě)簡(jiǎn)單的查詢SQL，查詢的數(shù)據(jù)用于首頁(yè)和詳情頁(yè)的展示，發(fā)布flow，用API的方式把數(shù)據(jù)傳給導(dǎo)航站的數(shù)據(jù)源。

這里就不得不提一句BetterYeah的平臺(tái)集成性，在這里建的flow、agent的都有對(duì)應(yīng)的開(kāi)放 API，方便集成到各個(gè)應(yīng)用和系統(tǒng)，另外還支持SDK、微信公眾號(hào)、企微、釘釘、飛書(shū)等集成方式，開(kāi)發(fā)同學(xué)都懂這點(diǎn)有多重要。

2、把BetterYeah里flow的請(qǐng)求Curl示例和返回示例給到Cursor，讓Cursor自動(dòng)對(duì)接API，把flow中的數(shù)據(jù)傳給導(dǎo)航站

3、刷新導(dǎo)航站，查看首頁(yè)和詳情頁(yè)的數(shù)據(jù)，渲染成功

很多導(dǎo)航站的搜索功能都是根據(jù)關(guān)鍵字模糊匹配，并不能搜索到想要的東西，因此我們?cè)黾恿苏Z(yǔ)義化的AI搜索能力，還是借助BetterYeah搭建AI搜索Agent，具體實(shí)現(xiàn)步驟如下：

第四步、構(gòu)建AI搜索功能

1、在BetterYeah上創(chuàng)建“AI搜索agent”，并且編寫(xiě)AI搜索功能的prompt，在agent中創(chuàng)建搜索flow用于搜索功能

2、這個(gè)flow用于接收用戶輸入的問(wèn)題，再去知識(shí)庫(kù)中查詢，如果在知識(shí)庫(kù)未查詢到相關(guān)內(nèi)容，則啟用bing搜索，確保用戶搜索有結(jié)果輸出；如果知識(shí)庫(kù)中有數(shù)據(jù)，會(huì)拿到RawId，然后根據(jù)ID去數(shù)據(jù)庫(kù)精確查詢對(duì)應(yīng)的AI工具

3、在agent中將flow設(shè)置為強(qiáng)制調(diào)用，確保用戶問(wèn)任何問(wèn)題都會(huì)調(diào)用搜索flow

4、發(fā)布AI搜索agent，把發(fā)送會(huì)話信息的請(qǐng)求和響應(yīng)示例給到Cursor，讓Cursor完成AI搜索功能的對(duì)接

5、在頁(yè)面中，輸入AI工具相關(guān)的問(wèn)題，查看搜索效果，并且還能根據(jù)搜索關(guān)鍵詞進(jìn)行相關(guān)問(wèn)題的推薦

第五步、分配域名發(fā)布上線

在 github 上創(chuàng)建一個(gè)私有倉(cāng)庫(kù)，把代碼上傳到github，注冊(cè)vercel，和github中的項(xiàng)目關(guān)聯(lián)，自動(dòng)部署和分配域名發(fā)布上線

如果已經(jīng)有編程基礎(chǔ)其實(shí)整個(gè)操作用不了1個(gè)小時(shí)。一頓試下來(lái)不禁感嘆，現(xiàn)在的AI工具真的猛如虎，要放在早幾年前，替代開(kāi)發(fā)者這件事是真的也不是很敢想的。AI技術(shù)的車輪在不斷往前性，我們都應(yīng)該盡快登上這列車。

從BetterYeah那里也了解到他們最近有新手注冊(cè)福利，應(yīng)薅盡薅。

羊毛1：注冊(cè)就送1000Yeah積分，平臺(tái)免費(fèi)使用14天，市面上的主流模型和產(chǎn)品的全功能都可以無(wú)限制暢享，國(guó)內(nèi)的模型就不說(shuō)了，各種高級(jí)模型也都能用，太香了！單獨(dú)如果需要開(kāi)發(fā)一款A(yù)I 應(yīng)用，比如投資助手、小紅書(shū)爆款分析、AI客服等等，直接使用BetterYeah就能辦到，比較強(qiáng)的是知識(shí)庫(kù)、flow、插件能力，支持開(kāi)放接口，集成性很贊。

羊毛2：注冊(cè)后掃下面的二維碼加BetterYeah微信客服，免費(fèi)領(lǐng)取教程中從Producthunt社區(qū)抓取的AI工具數(shù)據(jù)包，你的第一個(gè)AI工具導(dǎo)航站這不就信手拈來(lái)了么。趕快用PC端打開(kāi)www.betteryeah.com，體驗(yàn)做一個(gè)AI應(yīng)用。