從概念到云部署:使用Cursor與Heroku MCP Server構建應用程序 原創
我一直在嘗試將Cursor作為開發工具使用,它在日常工作中意外地帶來了顯著幫助。它不僅會編寫代碼,還能理解上下文,在合適的時機給出建議,甚至預判我接下來的操作意圖。
在看到Heroku MCP Server的公告時,我不禁心生好奇。也許Cursor不僅能夠編寫代碼,還可通過聊天提示詞和響應來構建應用并部署至Heroku?我決定試試看。
本文中,我將演示如何使用Cursor結合新的MCP集成,構建一個簡單的SvelteKit應用并部署到Heroku。那么,整個流程否可行又是否順暢?我打算通過實測來探究答案。
模型上下文協議(MCP)是什么??
MCP是一種開放標準,允許大語言模型(LLM)以結構化的編程方式與外部工具交互。除了基于上下文生成代碼或文本外,MCP支持讓AI系統執行真實操作——例如發起API調用或執行命令——且完全遵循用戶請求。
在實際應用中,這使得Cursor不再只是AI增強的代碼編輯器。通過MCP支持,Cursor變成了指揮中心。我們可以通過聊天提示詞直接創建云基礎設施、查詢數據庫或搭建新項目。
Heroku MCP Server為Heroku平臺引入這項能力,讓我們能夠要求Cursor執行創建Heroku應用、擴展dyno或附加插件等操作,全程無需離開編輯器或打開終端。
使用Cursor構建SvelteKit應用?
我想讓Cursor嘗試用SvelteKit構建一個待辦事項單頁應用,后端使用PostgreSQL。這個任務對Cursor來說應該足夠簡單,也能幫我這個Svelte新手節約大量時間。以下是操作步驟:
在新項目文件夾中打開Cursor?
我從~/project下的一個空文件夾開始。面對空白畫布,我已準備好讓Cursor開始工作。
描述任務?
我向Cursor解釋了需求。為了幫助它理解Svelte,我還專門為大模型提供了相關說明文檔。
我想用Svelte/SvelteKit構建一個“待辦事項”單頁應用。Svelte文檔地址: ??https://svelte.dev/llms-full.txt???
?我的應用需要支持列出待辦事項、添加新事項、標記完成/未完成狀態以及刪除事項。?
其中應使用PostgreSQL數據庫。?
最終我會將這個應用部署到Heroku并附加Postgres插件。但我也想本地測試。我的本地PostgreSQL實例正在運行。所以,我可以提供本地數據庫憑證,或者在附加插件后使用Heroku的連接字符串。?
請在當前文件夾中創建我的應用。??
這是Cursor的響應,因此我提供了一些偏好指引。
Cursor開始創建應用并添加必要依賴項。當遇到障礙(如過時的命令行選項)時,它會自行解決。
開始編程?
現在輪到Cursor開始實現應用了。此時距離我啟動Cursor僅過了約兩分鐘。
幾秒鐘內,Cursor就生成了代碼并保存了應用所需的文件。
設置本地數據庫?
接下來,Cursor提供了設置數據庫的相關步驟。
在這個步驟中,我向Cursor求助。
請給出創建數據庫和運行架構的命令。還要為我創建.env文件。我的本地PostgreSQL運行在localhost:5432,用戶名和密碼都是postgres。?
我可能需要源碼控制。請為項目初始化Git倉庫。?
Cursor順利設置了.env文件并提供了所需的 psql命令。
Git Repo初始化?
Cursor繼續為項目設置源碼控制。
應用程序本地測試?
Cursor表示已準備好在本地開發服務器測試。
真的?所有代碼都寫好了?下面馬上點擊Run command開始測試。
接下來,我打開瀏覽器訪問??http://localhost:5173?測試應用。
至此,Cursor已完成應用開發。從開始到現在僅用了約五分鐘。接下來準備部署到Heroku,現在要用到Heroku的MCP Server了。
在Cursor協助下部署至Heroku?
Heroku本身的設置和運行已經很簡單了。我迫不及待想看看通過Cursor自動化Heroku任務能如何提升效率。
配置Cursor使用Heroku MCP Server?
這里需要將Cursor與Heroku MCP Server對接,具體步驟如下:
步驟1:獲取Heroku授權令牌?
在終端中,首先確保已通過Heroku CLI認證,然后運行:
Shell
$ heroku authorizations:create
Creating OAuth Authorization... done
Client: <none>
ID: 03aff7da-87a9-4f9b-9400-5387164390e9
Description: Long-lived user authorization
Scope: global
Token: HRKU-1a2b3c4d-5e6f-7890-abcd-abc123def456
Updated at: Thu Apr 17 2025 12:04:14 GMT-0700 (Mountain Standard Time) (less than a minute ago)
這將是唯一一次需要在終端執行此操作。未來所有Cursor項目均可復用此令牌。
步驟2:創建mcp.json文件?
在項目文件夾中,我創建了名為.cursor的子文件夾,并在其中新建 mcp.json 文件,內容如下:
JSON
{
"mcpServers": {
"heroku": {
"command": "npx -y @heroku/mcp-server",
"env": {
"HEROKU_API_KEY": "HRKU-1a2b3c4d-5e6f-7890-abcd-abc123def456"
}
}
}
}
步驟3:啟用新MCP Server?
保存 .cursor/mcp.json后,Cursor會自動檢測到此文件。
這里點擊Enable。
使用Cursor構建并部署應用?
配置完成后,我只需向Cursor發出指令。
請將我的應用部署到Heroku,命名為my-svelte-todo-list。??
看起來不錯,下面點擊 Run tool。
接下來,Cursor要添加Postgres插件。這里出了點小問題:Cursor不清楚底層插件的正確名稱,但很快自行解決并繼續執行。
Postgres插件成功運行,我要求Cursor繼續推進。
你已創建應用和PostgreSQL數據庫。?
幫我初始化數據庫,然后部署代碼。?
Cursor通過MCP工具接入Heroku的Postgres插件(在Heroku CLI中為heroku pg:psql),并創建了表。
接著,Cursor檢查了部署所需的所有設置。
之后,Cursor發現Git repo尚未完成遠程Heroku設置,于是協助處理了這個問題。
請注意,Cursor需要運行bash命令來設置遠程。看來 heroku git:remote在Heroku MCP Server中尚不可用(相信后續會解決)。
即將完成部署,但若要通過MCP工具(deploy_to_heroku)而非手動執行git push heroku main,項目還需要 app.json文件。我提醒了Cursor:
我認為還需要app.json文件才能用Heroku MCP工具部署。?
Cursor順利創建了該文件。
現在,Cursor準備通過MCP工具部署到Heroku。
幾秒鐘后,Cursor顯示:
這就部署成功了?這么簡單?我訪問Heroku應用URL進行了確認。
沒錯,部署順利完成!
Cursor與Heroku MCP Server的其他集成功能?
Cursor報告部署成功后,詢問是否還有其他需求。
建議檢查應用狀態或者查看日志?當然可以。
Cursor使用MCP工具檢查dyno狀態并匯總近期日志。干得漂亮!
寫在最后:前所未有的構建方式?
Cursor不僅幫我搭建了項目框架,還為我不太熟悉的框架編寫了前端代碼。更重要的是,它推動我的項目從概念一路推進至云端部署。這感覺很棒。Heroku本身已讓部署變得相當簡單,在將Cursor和MCP Server結合之后,整個過程幾乎實現了完全自動。
這不僅節省了時間,更改變了我與現有工具的互動方式。無需切換上下文,直接從“我想構建……”到“已上線!”的流暢體驗令人興奮。毫無疑問,兩款工具的結合之力值得在未來更復雜的項目中深入探索。
也祝大家編程愉快!
原文標題:??From Concept to Cloud: Building With Cursor and the Heroku MCP Server?,作者:Alvin Lee
