小編精選 - 技術文章翻譯 · 03月21日

100% AI 驅動的 Web 開發工作流程，與 Devin 一樣出色：MAGE x Aider

長話短說

Devin ，這位自稱「第一個」完全自主的軟體工程師剛剛出現，並引起了很多關注。

它尚未公開，但透過幾個開源工具，您現在可以獲得類似的 Web 開發體驗，而且成本可能只是一小部分。

{% 嵌入 https://www.youtube.com/watch?v=DXunbNBpgZg %}

在其 CLI 中使用Wasp 的 AI 功能，您可以透過簡單的提示產生全端 Web 應用程式程式碼庫。然後，在Aider的幫助下透過加入功能和除錯來迭代它。

在這兩個人工智慧代理的幫助下，您可以增強全端應用程式的開發，而無需編寫一行程式碼（如果您不想）。

請繼續閱讀有關如何開始的詳細說明！

順便說一句，Wasp 是建立全端 Web 應用程式的最快方法，而且它也恰好內建了 AI 生成 - 而且它是免費和開源的！

您可以透過在 GitHub 上為我們的儲存庫加註星標來支持我們。它幫助我們建立更多東西並創造更多像這樣很酷的內容🙏

圖片描述

{% cta https://www.github.com/wasp-lang/wasp %} 連 Ron 也會在 GitHub 上為 Wasp 加註星標 🤩 {% endcta %}

德文到底是誰？

您可能已經看到和聽過圍繞 Devin 的炒作，他自稱是「第一個」完全自主的軟體工程師。

如果沒有，請觀看下面的宣傳影片：

{% 嵌入 https://www.youtube.com/watch?v=fjHtjT7GO1c %}

儘管 Devin 絕對不是同類中的第一個人工智慧編碼助手，但它的推出仍然引起了許多人的注意。簡而言之，這就是 Devin 所做的：

接受提示
制定逐步計劃
在具有程式碼編輯器、終端、瀏覽器和聊天介面的時尚 UI 中展示其工作
能夠迭代現有的程式碼庫

儘管有其他類似的人工智慧編碼代理，其中一些像 GPT-Pilot 是開源的，但 Devin 使用內建所有必要工具的流暢 UI 使其脫穎而出。此外，它能夠迭代現有程式碼庫，這使其與大多數類似工具（Aider 除外）區分開來。

那麼，德文真的那麼令人印象深刻嗎？

是和不是。正如著名 AI YouTuber Matthew Berman在他關於 Devin 的影片中指出的那樣，Devin 最令人印象深刻的事情可能是他們的發布的成功。

圖片描述

但伯曼也指出了一些與他們的行銷主張不一致的地方：

Devin 絕對不是同類中的第一個。 Mage 、 Aider和GPT-Pilot等類似工具已經存在。
他們對效能基準的比較（如上圖所示）並不能真正被認真對待，因為Devin 是一個可以迭代和執行多個任務的代理，而它所比較的 LLM，如GPT-4，只是「零樣本」（即他們嘗試一次才能得到正確的答案）。為了公平比較，Devin 應該與其他代理人進行比較，例如 GPT-Pilot、MetaGPT、Mage 等。

另外，Devin 實際上是建立在 OpenAI 的 GPT-4 API 之上的。所以，是的，他們在其之上建置的一些工具非常令人印象深刻，並且將加快編碼工作流程，但底層模型與像您和我這樣的開發人員可以存取的東西完全相同。

這意味著，透過結合幾個可用的開源工具，您現在可以獲得與 Devin 非常相似的結果，而無需等待早期預覽存取，並且成本可能只是其一小部分。

現在就讓我們來看看吧！

Wasp AI x Aider — 全端 Web 應用程式的開源「Devin」替代品

幾個月前，我們發布了Mage （ Magic App Generator ），這是一個實驗平台，用於透過簡單的提示生成全端 Web 應用程式。自發布以來，Mage 已被用來產生超過 40k 個應用程式！

圖片描述

Mage 使用Wasp（一個全端 React、Node 和 Prisma 框架）來產生比大多數編碼助理更好的全端應用程式。到底是為什麼呢？這是因為 Wasp 使用聲明性設定檔來定義應用程式的功能。

這個設定檔為Wasp 的編譯器提供了將客戶端和伺服器程式碼「黏合」在一起所需的指令，並處理一堆樣板程式碼，因此您和AI 都不必處理諸如身份驗證、路由、端點、伺服器之類的編碼配置等

// wasp config file

app TodoApp {
  wasp: {
    version: "^0.13.0"
  },
  auth: {
    userEntity: User,
    methods: {
      usernameAndPassword: {}
    },
  }
}

entity User {=psl
    id       Int    @id @default(autoincrement())
    tasks    Task[]
psl=}

// rest of the config file...

查看上面的範例，了解如何使用 Wasp 編寫全端 Auth。很容易，對吧？現在想像一下，對於 Mage 或任何其他人工智慧編碼助理來說，編寫 Wasp 程式碼是多麼容易。

另外，由於 Wasp 設定檔的結構已經類似於一組指令，因此它允許 Mage 以與 Devin 類似的方式建立計劃。

這就是 Mage 真正的閃光點，它可以快速且廉價地建立功能齊全的全端 Web 應用程式原型。 Mage 的唯一缺點是它在終端中不可用，而且您無法進一步迭代生成的程式碼庫。

現在情況改變了。隨著新的 Wasp 更新，Mage 的所有功能都被打包到 CLI 中。您只需安裝 Wasp並執行wasp new ，您就可以透過命令列提示產生一個新的全端應用程式！

圖片描述

之後，您可以使用Aider ，這是一個命令列工具，可讓您與 GPT-3.5/GPT-4 進行配對編程，以迭代生成的程式碼庫並建立一系列很酷的新功能。

還不相信嗎？觀看這個很酷的宣傳影片，向您展示這一切是如何運作的：

{% 嵌入 https://www.youtube.com/watch?v=DXunbNBpgZg %}

如果這看起來很酷，並且您想在這些工具的幫助下開始建立自己的全端 Web 應用程式，請按照以下說明進行操作！

CLI 中的 Wasp AI

安裝 Wasp後，前往終端並執行wasp new

這樣做將為您提供一個可供選擇的全端入門模板清單。你會想要：

從選項清單中選擇[5] ai-generated
輸入您的應用程式的描述
選擇您想要用於這一代的 GPT 模型和創造力水平

圖片描述

使用這些生成設定可能會產生不同的結果，因此，如果生成的應用程式不是您第一次尋找的內容，請調整它們並重試。

並且不必太擔心透過 OpenAI API 產生的成本。由於 Wasp 利用 DSL 並為我們管理大量樣板文件，因此它顯著減少了 GPT 必須產生的程式碼量。

例如，當我們混合使用 GPT4 和 GPT3.5（預設選項）時，一個具有 Wasp AI 的應用程式通常消耗大約 25k 到 60k 代幣，每個應用程式大約消耗0.1 到 0.2 美元！如果我們只使用 GPT4 來執行它，那麼成本是 10 倍，這意味著它將花費大約1 到 2 美元。這仍然比大多數其他 AI 編碼代理便宜得多，後者每代的成本通常約為 15-40 美元。 🤯

哦，「gpt-4-1106-preview」指的是 OpenAI 的新 GPT-4-turbo 模型。因此，它比完全使用 GPT-4 更快、更便宜。

Wasp AI（和Mage ）使用 GPT-4 進行規劃 + GPT-3.5-turbo 進行程式碼生成的組合，我們發現它對於簡單的應用程式來說效果出奇的好。如果您的目標是複雜的應用程式，我們建議完全使用 GPT-4，因為它能夠更好地處理更高的複雜性。請注意，GPT-4 將需要更長的時間。