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

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

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

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

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

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

• 首頁：展示所有AI工具列表

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

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

工具產(chǎn)品會用到兩個：

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

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

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

第一步、前端頁面代碼生成

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

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

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

不滿意的地方可以再和Cursor對話，修改。滿意之后，點擊「Accept all」

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

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

2、在BetterYeah平臺注冊賬號，點擊創(chuàng)建flow，用于處理從Producthunt獲取的數(shù)據(jù)。再通過畫布方式創(chuàng)建整個數(shù)據(jù)處理邏輯：拉數(shù)據(jù)，讓LLM進行處理數(shù)據(jù)，讓數(shù)據(jù)按固定格式輸出

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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