動態

詳情 返回 返回

挑戰一週用 AI 開發商業化項目!4 大痛點反思 + 新手專屬提示詞分享 - 動態 詳情

見字如面,我是陽哥,我的文章都首發在同名公眾號:王中陽,歡迎鏈接。

我最近在挑戰用AI編程工具,用一週時間開發一個商業化的項目,踩了不少坑:

  1. 從開發者思維-->到產品經理思維的轉變
  2. 小問題AI為什麼反反覆覆改不好?
  3. token限額了怎麼辦?
  4. 有了AI編程,程序員的價值在哪裏?

這篇文章內容比較多,我會從以上幾個大家關心的話題分享。

先聊乾貨,再聊細節

有了AI編程,程序員的價值在哪裏?

AI的興起,很大程度就是程序員自己革命自己嘛,走在前面的程序員幹掉了走在後面的,市場一直如此,這是AI讓這種現象更直觀,更露骨,你覺得呢?

AI不是萬能的,有經驗的開發者用AI真的是能解決掉很多問題,且效率翻倍。但是隻會CRUD的開發者,真的會被AI幹掉。

token限額了怎麼辦?

比如codebuddy這種,目前免費註冊,免費使用,且不用擔心網絡問題。

但是有個問題,就是會限額,當提示如下圖所示的被限制時:

可以考慮切換個微信賬號,或者換個其他的AI編輯器。
(收費的AI編輯器就不用擔心這個問題了,只關心消費token花多少錢就行了,哈哈)

小問題AI為什麼反反覆覆改不好?

  1. 不要在一個對話窗口中一直追問,這樣的話效率和效果都會越來越差。
  2. 創建新窗口再對話
  3. 切換模型再對話
  4. 或者,我也聽聽大家的經驗,歡迎評論區討論。

一、新手友好版通用基礎提示詞(幫你快速上手)

核心目標:用簡單的話講清規則,避免新手踩坑

這也是我前面提到的:從開發者思維-->到產品經理思維的轉變

回憶一下,咱們開需求評審會的時候,產品經理是怎麼介紹需求的,一定是非常細緻的,而不是簡單一句話:“我們要實現電商功能,請程序員大佬們去開發吧!”,這麼搞的話,程序員肯定幹不好,AI也是一樣的。

需要具體且明確的需求給到AI。

我來分享一下我具體是怎麼做的:

  1. 工具選擇:推薦先用「Cursor」或者國內的Trae、codebuddy(對新手最友好,像聊天一樣寫代碼),後面再嘗試Claude Code。所有操作都會告訴你具體點擊哪裏,不用怕找不到功能。
  2. 前置檢查:如果需要數據庫、中間件這些“輔助工具”,會先給你「檢查命令」(複製粘貼到電腦終端就能用),比如檢查MySQL是否安裝:直接複製 systemctl status mysqld 到終端按回車。沒安裝的話,會給你“傻瓜式安裝腳本”,跟着複製執行就行,還會提醒會不會影響你電腦裏已有的軟件。
  3. 開發原則(簡單版):

    • 前端:把頁面拆成“小零件”(比如登錄按鈕、聊天框),以後想再用直接拿,不用重複寫。先用假數據(會告訴你假數據存在哪個文件裏)展示效果,不用等後端接口。
    • 後端:用GoZero框架把代碼分成“不同功能塊”(比如用户登錄、消息發送),還會給你簡單的Docker配置,以後部署更方便。
  4. 文檔要求:寫完功能後,會幫你整理文檔,直接存在項目裏的「doc文件夾」,文件名格式是“文檔類型\_功能名\_王中陽.md”(比如“技術文檔\_微信掃碼登錄\_王中陽.md”),方便以後自己回看,也方便後面給AI作為補充上下文信息。
  5. 代碼保存:每做完一個小功能(比如寫完登錄頁面),會告訴你怎麼把代碼存到遠程(複製 git add . && git commit -m "做完了登錄頁面" && git push 到終端就行),防止代碼丟了。

二、分場景新手專屬提示詞(跟着做就行)

1. 先搞懂現有項目(避免一上來就瞎改)

注意:下文中,我只是拿Cursor舉例子,trae、codebuddy等都是一樣的。

【項目文件解析(新手版)】

  1. 工具操作:打開Cursor,點擊“打開文件夾”,選擇你的項目文件夾。然後AI會幫你掃描所有文件,按“文件夾→文件”的順序告訴你每個東西是幹嘛的,比如:

    • src/:放前端代碼的地方
    • src/components/:放“小零件”(比如按鈕、彈窗)的地方
  2. 重點關注:你想改哪個功能(比如“微信掃碼登錄”“智能客服聊天”),就告訴AI,它會找出和這個功能相關的所有文件,甚至會挑出關鍵代碼片段,告訴你這段代碼是幹嘛的(不用怕看不懂,會用簡單的話講)。
  3. 幫你補漏:如果項目裏少了關鍵文件(比如數據庫配置文件),AI會列出來,還會給你一個例子,告訴你這個文件裏應該寫點啥,你照着填就行。
注意:當你熟悉項目之後,讓AI更聚焦,讓他知道不同的功能在哪個位置,這樣不僅效率高,而且消耗的token也少。

2. 數據庫設計(不用懂複雜 SQL)

【數據庫設計(新手版)】

  1. 功能關聯:你想實現什麼功能(比如“保存客服和用户的聊天記錄”“記錄微信登錄用户信息”),直接告訴AI,它會幫你設計“表格結構”,比如:

    • 表格名:chat\_record(聊天記錄)
    • 字段:id(記錄ID)、user\_id(用户ID)、content(聊天內容)、create\_time(發送時間)
      每個字段是幹嘛的、用什麼格式,都會講清楚。
  2. 現成SQL:AI會給你“直接能用的SQL代碼”,你不用自己寫。還會提醒你這個SQL適用於MySQL哪個版本,會不會和你電腦裏已有的數據庫衝突。
  3. 操作步驟(一步一步來):

    • 打開Cloud Code(或Cursor裏的數據庫工具)
    • 點擊“連接數據庫”,輸入你的數據庫賬號密碼(如果不知道,AI會告訴你怎麼找)
    • 把AI給的SQL代碼複製粘貼進去,點擊“執行”,表格就建好了。

3. 代碼拆分(避免代碼亂糟糟)

【模塊代碼拆分(新手版)】

  1. 目標模塊:你想拆分哪個部分(比如“前端的登錄頁面”“後端的用户登錄功能”),告訴AI後,它會給你“拆分方案”,比如:

    • 拆分後有3個文件:Login.vue(登錄頁面)、LoginApi.js(調用登錄接口)、LoginUtil.js(登錄相關小工具)
      每個文件裏寫什麼,都會説清楚。
  2. 複用設計:AI會標出哪些代碼以後還能再用(比如“判斷用户是否登錄”的函數),還會告訴你這個函數怎麼調用、能返回什麼結果,以後不用重複寫。
  3. 工具操作(跟着點擊):

    • 打開Cursor,找到你要拆分的代碼文件
    • 選中要拆分的代碼,右鍵點擊,選擇“Refactor”(重構)→ “Extract Component”(提取組件)
    • 給組件起個名字(比如“LoginButton”),選擇要保存的文件夾,點擊確定就拆好了。

4. 智能客服改造(從現有項目改,難度降低)

下面是個很典型的例子,我們是基於過去已經開發好的項目,讓AI去快速的二開。

【智能客服改造】

  1. 可行性判斷:AI會先告訴你,用現有的項目改造成AI智能客服行不行,難不難。比如會説“現有項目用的GoZero框架和Vue前端,改造成智能客服沒問題,主要改對話邏輯就行”。
  2. 要你確認的簡單問題(不用想複雜):

    • 前端:你有沒有智能客服頁面的設計圖(比如聊天窗口長什麼樣)?沒有的話AI會給你簡單示例。
    • 後端:聊天內容要不要對接AI(比如讓阿里雲的AI幫客服自動回覆)?
    • 現有項目:用户登錄、註冊這些功能要不要保留?
  3. 分階段步驟(先易後難,新手能搞定):

    • 階段1(3小時能做完):做前端靜態頁面

      • 用假數據做一個聊天窗口(有輸入框、消息列表)
      • AI會給你代碼,你複製到Cursor裏,改改文字和顏色就行
    • 階段2(2小時能做完):加簡單交互

      • 實現“點擊發送按鈕,假消息顯示在列表裏”
      • AI會幫你寫好點擊事件代碼,不用自己想邏輯
    • 階段3(後面再做):改後端

      • 等前端效果跑通了,再改後端接口,AI會一步一步教。
  4. 工具操作(新手友好):

    • 打開Cursor,找到現有項目的登錄頁面文件(比如Login.vue)
    • 複製這個文件,重命名為ChatPage.vue
    • AI會給你聊天頁面的代碼,你替換掉ChatPage.vue裏的內容,保存後就能看到效果。

5. 每日任務拆分(新手一天能做完的事)

不要貪多,不要貪多,整個開發過程最耗時的是後期修復小問題,而不是從0到1開發!!!

【每日任務拆分(新手+AI輔助,一天能搞定)】

  1. 任務優先級(先做重要的,不浪費時間):

    優先級 任務名稱 具體做什麼(一步一步) 工具操作(點擊哪裏) 做完能看到什麼效果
    最高 做智能客服聊天頁面 1. 在Cursor裏新建ChatPage.vue文件;2. 複製AI給的頁面代碼;3. 保存後預覽 打開Cursor → 右鍵項目src/views文件夾 → 新建文件 → 命名ChatPage.vue → 粘貼代碼 → 保存 打開預覽頁面,能看到聊天窗口樣式
    次高 加假消息交互 1. 新建mock/chatMock.json文件,複製AI給的假消息數據;2. 複製AI給的交互代碼到ChatPage.vue 右鍵src文件夾 → 新建mock文件夾 → 新建chatMock.json → 粘貼數據 → 回到ChatPage.vue粘貼代碼 點擊發送按鈕,假消息會顯示在列表裏
    最低 寫文檔記錄 1. 在doc文件夾新建“技術文檔\_聊天頁面\_王中陽.md”;2. 複製AI給的文檔內容 右鍵doc文件夾 → 新建文件 → 命名 → 粘貼內容 → 保存 文檔裏有頁面文件路徑和交互邏輯,以後能看
  2. 遇到問題怎麼辦:如果預覽看不到頁面,或者點擊按鈕沒反應,在Cursor裏選中有問題的代碼,右鍵點擊“Ask AI”,把問題告訴AI,它會幫你找錯(比如少寫了一個括號)。

6. 服務器部署(不用懂複雜運維)

【服務器部署(新手版,linux服務,docker容器化部署)】

  1. 先檢查服務器狀態(複製命令就行):

    • 看有沒有佔用端口:複製 netstat -tuln 到服務器終端,按回車,AI會告訴你怎麼看結果
    • 看Docker有沒有裝:複製 docker --version ,有版本號就是裝了,沒有的話AI會給你安裝命令
    • 看內存夠不夠:複製 free -m ,AI會告訴你多少內存夠用
  2. 部署步驟(複製命令執行,不用自己寫):

    • 第一步:創建專屬“隔離區”,避免影響其他項目:複製 docker network create kefu_network (kefu\_network改成你的項目名)
    • 第二步:AI會給你Dockerfile和docker-compose.yml兩個文件的代碼,你在Cursor裏新建這兩個文件,複製代碼進去
    • 第三步:啓動項目:複製 docker-compose up -d ,執行後就部署好了
  3. 驗證是否成功:複製 curl 你的服務器IP:8081 (8081是你的項目端口,AI會幫你選不衝突的端口),如果能看到頁面代碼,就是成功了。
  4. 文檔記錄:AI會幫你寫“部署文檔”,裏面有所有命令和遇到問題的解決辦法(比如端口被佔了怎麼改),存在doc文件夾裏。

7. 微信掃碼登錄(含關注公眾號,新手也能對接)

這也是一個很典型的場景:

【微信掃碼登錄(新手版,掃碼後自動關注公眾號)】

  1. 流程講清楚(不用懂原理,跟着走):

    • 用户點擊“微信登錄”→ 彈出二維碼 → 用户掃碼 → 登錄成功 → 自動跳轉到公眾號關注頁面(或悄悄關注)
  2. 你需要準備的東西(AI會告訴你怎麼找):

    • 微信開放平台:AppID和AppSecret(AI會給你找的步驟:打開微信開放平台 → 登錄 → 找到你的應用 → 複製)
    • 微信公眾號:AppID、原始ID(步驟同上,在公眾號後台找)
    • 項目配置:登錄後跳回的網址(比如你的網站域名/callback,AI會告訴你怎麼在微信平台備案)
  3. 實現步驟(先做前端,簡單):

    • 前端:AI會給你掃碼按鈕和彈窗的代碼,你複製到Cursor裏的登錄頁面,用假數據先展示二維碼圖片(不用真對接微信,先看效果)
    • 後端:等前端效果好後,AI會給你後端接口代碼,幫你處理微信返回的數據,還會告訴你怎麼關聯公眾號關注功能
  4. 避坑提醒:微信平台需要備案域名,沒有的話AI會告訴你怎麼用測試域名先調試,不用花錢買正式域名。

三、新手使用小貼士(我強烈建議的操作)

  1. 小白入門,工具優先選 Cursor(或者國內的codebuddy):界面像記事本,操作簡單,右鍵 “Ask AI” 就能隨時問問題,不用記複雜功能位置。
  2. 先跑通再優化:比如先做出能點擊的聊天按鈕,再調顏色和位置,不用一開始就追求完美。
  3. 遇到報錯別慌:把報錯信息複製給 AI,比如 “Uncaught ReferenceError: $ is not defined”,AI 會告訴你是少引了 jQuery,還會給你解決步驟。
  4. 文檔及時存:做完一個功能就寫文檔,比如 “今天做了聊天頁面,文件在 src/views/ChatPage.vue”,以後忘了能快速找。
如果你對這篇文章的內容感興趣,歡迎鏈接我:wangzhongyang1993。直接把這篇文章轉發給我就好,我就懂了。
user avatar jilodream 頭像 tongbo 頭像 aitibao_shichangyingxiao 頭像 best_6455a509a2177 頭像 fanjiapeng 頭像 xiaoal 頭像 gouguoyin 頭像 ansurfen 頭像 phytium_developers 頭像 wuliaodeqie 頭像 immerse 頭像 dblens_com 頭像
點贊 19 用戶, 點贊了這篇動態!
點贊

Add a new 評論

Some HTML is okay.