iT邦幫忙

2025 iThome 鐵人賽

DAY 3
1
Software Development

《電商修仙術:AI × Magento 開發心法》系列 第 3

[Day 3] 不再踩坑:用 AI 全自動搭好 Magento 開發環境

  • 分享至 

  • xImage
  •  

前言:新的修行時代

過去的開發模式,需要我們一行一行地敲程式、自己解 bug、慢慢摸索。
但今天,AI 工具已經改變了遊戲規則。

這就是 這個世代與上個世代最大的不同

人類既然發明了這麼強大的工具,就該學會善用它。我們要學的,或許不再只是「怎麼寫程式」,而是要以 規劃者的角度 去思考整體架構、流程與策略,然後交給 AI 去落實細節與執行。

這也正是為什麼這次我選擇讓 AI 幫我完成 Docker 環境架設,而不是再用傳統的手動方式一個一個去搭建。


第一步:搭建 Magento 環境 - Docker Compose

https://ithelp.ithome.com.tw/upload/images/20250903/201784034C6Q8B8AAi.jpg

在進入正式開發之前,第一步一定是要先有一個能跑的 Magento 環境
那麼問題來了:要怎麼快速搭建一個乾淨又可重現的環境?答案就是 —— Docker
.
.
不過如果只用單純的 Docker 指令,我們得一個一個容器去建立(像是 PHP、MySQL、Elasticsearch、Nginx…),還要自己處理網路和掛載設定,過程相當繁瑣。
.
.

這時候就需要 Docker Compose
它其實就是一份設定檔,幫你把所有容器的配置(服務、網路、資料掛載)都寫好。
.
.
有了 Docker Compose,架設一個 Magento 環境就變得非常簡單。
你只需要先寫好一份設定檔 docker-compose.yml,接著執行:

docker-compose up -d

整個環境就能自動跑起來,不用再一個一個容器手動建立。


我的AI夥伴

https://ithelp.ithome.com.tw/upload/images/20250903/201784034lpb7MOLuW.png

這次我請來的幫手是 Claude Code。我自己在平常開發時,其實最常用的就是 Claude Code。
.
.
原因很簡單:在處理一些比較複雜的開發需求時,我覺得 Claude 更能「長出」我心裡想要的程式碼樣子。
.
.
尤其是它除了網頁介面之外,Claude 也有 CLI(Command Line Interface)版本,可以直接跟專案互動,對我來說非常好用。
.
.
當然,這也算是一種個人偏好。如果是單純的聊天、發問,我自己更喜歡用 ChatGPT
一方面是因為我覺得它的回答比較有人情味,另一方面是跟它對話的過程比較自然、舒服。
.
.
對我來說,兩者就像是不同性格的朋友:

  • Claude 是一個典型的理工腦,很強、很會解決問題。
  • ChatGPT 則更像是一個可以隨時聊聊的對話對象。

Claude CLI 簡介

安裝與使用方式很簡單:
在官網註冊好帳號之後,只要在終端機輸入:

claude

就能直接開始使用了。(第一次使用會需要先下載與設定東西)

https://ithelp.ithome.com.tw/upload/images/20250903/201784031mfvLfCi5o.jpg

不過要注意,目前Claude是付費使用的。如果你想嘗試免費的選項,其實也可以考慮Google 的 Gemini或是直接使用Cursor,這些工具都有提供免費額度,可以先上手體驗。


開始動手:請 AI 幫我生一個 Docker Compose

說了這麼多,還是得真的 動手才有感覺
我打開 VS Code,進到專案目錄,開啟終端機,直接叫出 Claude
https://ithelp.ithome.com.tw/upload/images/20250903/20178403CkYJI5wudp.jpg
.
.


Step 1. 丟 Prompt 給 Claude

我把事先整理好的 Prompt 丟給它:

請幫我生成一個 docker-compose.yml,能夠正確安裝 Magento 2.4.3。
需求如下:
1. 版本必須是 Magento 2.4.3。
2. 服務包含:
   - PHP 7.4 FPM(Magento 2.4.3 相容版本)
   - MySQL 8.0
   - Elasticsearch 7.9(Magento 2.4.3 需要)
   - Nginx 作為反向代理
   - Redis(快取)
3. 資料要能持久化,請掛載 volumes。
4. 每個服務請用官方或常見穩定的 docker image。
5. 請額外提供一份 Nginx 的設定範例(適用 Magento 2.4.3)。
6. 不要用最新版本,請固定 image tag(避免相容性問題)。
7. 完整提供指令流程:我要如何用這份 docker-compose 一鍵啟動並安裝 Magento 2.4.3。

這段 Prompt 不是隨便寫的,而是我先用 ChatGPT 整理,自己測試並修改,最後確定能跑才留下來的版本。
https://ithelp.ithome.com.tw/upload/images/20250903/20178403qxuTbZId1w.jpg
.
.


Step 2. Claude 幫我生出 Docker Compose

Claude 收到之後,會先幫我規劃該怎麼做,接著再詢問我要不要照這個方向走。
通常我只要大致看過,直接回答「Yes」就可以。

https://ithelp.ithome.com.tw/upload/images/20250903/20178403C5ddlmUzk1.jpghttps://ithelp.ithome.com.tw/upload/images/20250903/20178403sxs3VWXkJK.jpg

接著,Claude 就會開始生成一份完整的 docker-compose.yml,裡面包含:

  • PHP 7.4 FPM
  • MySQL 8.0
  • Elasticsearch 7.9
  • Redis
  • Nginx

甚至還附上了一份 Magento 專用的 Nginx 設定檔
https://ithelp.ithome.com.tw/upload/images/20250903/20178403a77TOjHf5m.jpg

同時,它還貼心地提供了一鍵安裝腳本。
(如果 Claude 沒有幫你生成,可以再請它補上,甚至直接幫你執行安裝)
https://ithelp.ithome.com.tw/upload/images/20250903/20178403cqT6BxQNQQ.jpg
.
.


Step 3. 開始一鍵安裝

準備好之後,直接執行安裝流程,畫面大概會長這樣:

https://ithelp.ithome.com.tw/upload/images/20250903/20178403nEe1BGfTc9.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/20178403JWbFZ1aFno.jpghttps://ithelp.ithome.com.tw/upload/images/20250903/20178403azMPlH8UXq.jpg

安裝過程中多少會遇到一些 bug,例如:

  • Docker Compose 沒有建構好
  • Port 已被佔用
  • 版本不相容
    不過這就是 Claude 的強項 ——
    它會自己 debug,找到問題並修正。

https://ithelp.ithome.com.tw/upload/images/20250903/2017840358dxK7W6qT.jpghttps://ithelp.ithome.com.tw/upload/images/20250903/20178403GOYJ2vrjDI.jpg

像這裡我就遇到 端口衝突(因為我原本有其他 Docker Compose 在跑),Claude 也會自己檢查並解決。
https://ithelp.ithome.com.tw/upload/images/20250903/20178403t1yF0vf1H1.jpg

甚至一開始 Claude 下載錯了 Magento 的付費版,後來它自己發現問題,再改成正確的 免費開源版
https://ithelp.ithome.com.tw/upload/images/20250903/20178403NBOX2gnHtx.jpghttps://ithelp.ithome.com.tw/upload/images/20250903/20178403YoF9P19CfS.jpg

接著就繼續 debug,直到安裝成功為止:
https://ithelp.ithome.com.tw/upload/images/20250903/20178403oeVsxrVpTf.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/20178403KGbtQF5t1U.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/201784031BFmpExyfo.jpg

.
.


Step 4. 確認網站能否運行

安裝完成後,Claude 還會自己打 request 測試網站是否能正常跑。

https://ithelp.ithome.com.tw/upload/images/20250903/20178403QvA81xDCCp.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/20178403VpnLXCBDaM.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/20178403MEmzX5kUZZ.jpg

最後打開 http://localhost,前台可以順利看到 Magento 頁面了!
https://ithelp.ithome.com.tw/upload/images/20250903/20178403WkO2kSwVAx.jpg

不過這裡 Claude 給的後台 URL:http://localhost/admin 並沒有成功登入。
我直接再問 Claude,它就會告訴你原因並幫忙修正。
https://ithelp.ithome.com.tw/upload/images/20250903/20178403FNxFMtXtiA.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/20178403nD6mUrvI6q.jpg
.
.


最後成果

大功告成! 🎉
這樣就能成功進入 Magento 的 前台與後台
https://ithelp.ithome.com.tw/upload/images/20250903/20178403pJULNHllpi.jpg
https://ithelp.ithome.com.tw/upload/images/20250903/201784037GlKgZRAeu.jpg
.
.


以上的實戰案例,也清楚展現了 Claude Code CLI 的開發模式有多方便。
在我的指揮下,它就像一個聰明的小助手,自動自發地完成了 Docker 開發環境的建置。
它不僅幫我處理繁瑣的細節,還能即時 debug、修正錯誤,讓我能把心力專注在 更高層次的架構與策略
.
.
而這種人機合作的模式,本身就是這個時代的「靈丹妙藥」,讓我們得以突破傳統開發的限制,幫助我們走向 更高的可能性
.
.
環境已經搭建完成,算是踏入了山門。
接下來,便是深入 Magento 的後端世界
這些看似艱澀的概念,正是支撐整個 Magento 修仙體系的基礎法門。

👉 Day 4,我將與AI一起帶你走進 Magento 後端框架的真實面貌。


上一篇
[Day 2] 什麼是 Magento?開源電商框架初探
下一篇
[Day 4] AI 帶我認識後端框架(上)— MVC 概覽
系列文
《電商修仙術:AI × Magento 開發心法》5
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言