Purpose 1: Rapid Multi-File AI "Vibe Coding" Bootstrap 用途一:AI「Vibe Coding」多檔案架構極速孵化 用途一:AI“Vibe Coding”多文件架构极速孵化
WORKFLOW #01
When to use: You want an AI assistant (Gemini, ChatGPT, Claude) to generate an entire multi-file web application (e.g., database config, API endpoint, and frontend UI) in a single response and deploy all files to disk in one click.
適用情境:當您希望 AI 助手在單次回覆中同時生成多個檔案(例如:設定檔、API 與前端介面),並透過一次點擊瞬間在伺服器端展開所有實體檔案與版本母檔。
适用情境:当您希望 AI 助手在单次回复中同时生成多个文件(例如:配置文件、API 与前端界面),并通过一次点击瞬间在服务器端展开所有实体文件与版本母档。
-
1Copy the AI Payload: In the top header of EggDiva IDE, click
AI Payloadand clickCopy Payload. Paste this protocol instruction at the beginning of your AI chat session. 複製 AI 提示詞載荷:點擊 EggDiva 右上角的AI Payload並複製內容,貼給 AI 助手以約束其輸出標準 Flowgen 格式。 复制 AI 提示词载荷:点击 EggDiva 右上角的AI Payload并复制内容,贴给 AI 助手以约束其输出标准 Flowgen 格式。 -
2Paste the AI Stream: Copy the AI's generated code block and click
📋 Pastein the EggDiva Command Deck. Verify in the Stream Outline bar that all file pills appear cleanly. 貼上串流代碼:複製 AI 產生的區塊,點擊命令列的📋 Paste。觀察上方的 Stream Outline 膠囊列,確認所有檔案皆已被正確識別。 粘贴串流代码:复制 AI 产生的区块,点击命令列的📋 Paste。观察上方的 Stream Outline 胶囊列,确认所有文件皆已被正确识别。 -
3Compile Architecture: Click
⚡ Compile Architecture(or pressCtrl+Enter). EggDiva hatches every physical file (`chmod 0755` for `.php`), auto-appends a timestamped `.php` security checkpoint if the last file wasn't `.php`, and saves the master__filemotherstream. 編譯架構:點擊⚡ Compile Architecture(或按Ctrl+Enter)。系統會自動建立所有實體檔案、設定 PHP 權限,並自動產生帶有安全防護標記的__filemother母檔。 编译架构:点击⚡ Compile Architecture(或按Ctrl+Enter)。系统会自动建立所有实体文件、设定 PHP 权限,并自动产生带有安全防护标记的__filemother母档。
app_config.php:=:
<?php
$appTitle = "Nexus AI Portal";
$version = "1.0.0";
?>
:==:
app_index.php:=:
<?php
require_once 'app_config.php';
echo "<h1>{$appTitle} (v{$version})</h1>";
?>
:==:
app_index_20261030.php:=:
:==:
Purpose 2: Compositional Inclusions (:-:) for Single-File Compilation
用途二:使用嵌入標記 (:-:) 進行無縫模組組裝
用途二:使用嵌入标记 (:-:) 进行无缝模块组装
WORKFLOW #02
When to use: You want to write clean, modular code blocks (like a shared header, database connection, or utility library) and have EggDiva physically inline them into target files at compile-time (up to 5 levels deep).
適用情境:在單一扁平目錄中開發時,將共用設定、資料庫連線或 UI 元件拆分為獨立區塊,並在編譯時由 EggDiva 自動將原始碼實體嵌入目標檔案中(支援最多 5 層巢狀嵌入)。
适用情境:在单一扁平目录中开发时,将共用设定、数据库连线或 UI 元件拆分为独立区块,并在编译时由 EggDiva 自动将源代码实体嵌入目标文件中(支持最多 5 层嵌套嵌入)。
-
1Define Dependency First: Place the shared module (e.g.,
svc_msg_config.php) higher up in the stream than the file that includes it. 先定義被依賴的模組:將共用模組(如svc_msg_config.php)放在串流較上方的位置。 先定义被依赖的模块:将共用模块(如svc_msg_config.php)放在串流较上方的位置。 -
2Insert the
:-:Directive: On a brand-new line with zero leading spaces, type:-:svc_msg_config.php(or click the[+ :-: Include]chip). Be mindful of whether you are inside HTML or<?php ?>tags! 插入:-:嵌入指令:在目標檔案中獨立新的一行(開頭不可有空白)輸入:-:svc_msg_config.php。請注意插入點位於 HTML 區段或<?php ?>標籤內。 插入:-:嵌入指令:在目标文件中独立新的一行(开头不可有空白)输入:-:svc_msg_config.php。请注意插入点位于 HTML 区段或<?php ?>标签内。 -
3Verify Expanded Output: After compiling, click
View Blockon the generated file, then click🔍 View Actual Source Codeinside the modal to inspect the fully expanded physical file on disk. 檢視展開後的實際原始碼:編譯後點擊該檔案的View Block,再點擊彈窗左下角的🔍 View Actual Source Code,即可檢視已完成嵌入展開的實體檔案內容。 查看展开后的实际源代码:编译后点击该文件的View Block,再点击弹窗左下角的🔍 View Actual Source Code,即可查看已完成嵌入展开的实体文件内容。
svc_msg_config.php:=: // Common configuration parameters $channel = "AMDT_SECURE_BUS"; :==: svc_msg_api.php:=: <?php :-:svc_msg_config.php echo "Messaging system initialized on: " . $channel; ?> :==: svc_msg_api_20261030.php:=: :==:
Purpose 3: Non-Destructive "Vibe Iteration" & Stream Deduplication 用途三:無損版本疊代測試與一鍵串流去重 用途三:无损版本迭代测试与一键串流去重
WORKFLOW #03
When to use: You have a working file (`api.php` V1) in your stream, and you ask the AI to generate an experimental V2 of `api.php`. Instead of deleting V1, you append V2 near the bottom to test it safely.
適用情境:當您已有穩定運作的舊版區塊(V1),想測試 AI 新寫好的新版區塊(V2)時,無需刪除舊版,直接將 V2 附加在母檔上方進行覆蓋測試。
适用情境:当您已有稳定运作的旧版区块(V1),想测试 AI 新写好的新版区块(V2)时,无需删除旧版,直接将 V2 附加在母档上方进行覆盖测试。
-
1Stack Experimental Blocks at the Bottom: Keep V1 of
api.phpat its original position higher up, and insert V2 ofapi.phpright above the final checkpoint block. Notice how the Stream Outline highlights duplicates in amber (`v1`, `v2`). 將新版本堆疊於下方:保留上方的 V1 區塊,將新版api.php放在最後一個母檔區塊正上方。此時上方導覽列會以琥珀色標示重複版本 (`v1`, `v2`)。 将新版本堆叠于下方:保留上方的 V1 区块,将新版api.php放在最后一个母档区块正上方。此时上方导航列会以琥珀色标示重复版本 (`v1`, `v2`)。 -
2Test V2 Live: Click
⚡ Compile Architecture. Because EggDiva processes sequentially, the bottom-most occurrence (`v2`) overwrites the physical `api.php` on disk while `v1` remains safely preserved inside the stream text. 實機測試 V2:點擊編譯後,由於系統採循序解析,最下方的 V2 會成為硬碟上的實體檔案,而 V1 依然安全保留在文字串流中。 实机测试 V2:点击编译后,由于系统采循序解析,最下方的 V2 会成为硬盘上的实体文件,而 V1 依然安全保留在文本串流中。 -
3Deduplicate & Commit: Once V2 is confirmed working, click
✨ Deduplicate Stream. EggDiva automatically keeps V1's original sequence position while adopting V2's latest code, injects the cleaned stream directly into the main editor, and prompts you to click⚡ Compile Architectureto commit. 一鍵去重並提交:確認 V2 穩定後,點擊✨ Deduplicate Stream。系統會保留該檔案第一次出現的順序位置、採用最後一次出現的最新內容,直接注入主編輯區並提醒您再次點擊編譯以完成提交。 一键去重并提交:确认 V2 稳定后,点击✨ Deduplicate Stream。系统会保留该文件第一次出现的顺序位置、采用最后一次出现的最新内容,直接注入主编辑区并提醒您再次点击编译以完成提交。
Purpose 4: Surgical Block Inspection, Live Modal Editing & Hot-Injection 用途四:區塊精準檢索、彈窗內即時編輯與熱注入 用途四:区块精准检索、弹窗内即时编辑与热注入
WORKFLOW #04
When to use: You are working with a large `__filemother` or searching across multiple streams via Partial Search, and you want to quickly tweak a single file block and inject it right above your active motherfile checkpoint.
適用情境:在大型專案或透過左側「部分關鍵字搜尋 (Partial Search)」找到特定區塊後,直接在彈窗中修改代碼,並一鍵注入主編輯區最下方的母檔區塊正上方。
适用情境:在大型项目或通过左侧“部分关键字搜索 (Partial Search)”找到特定区块后,直接在弹窗中修改代码,并一键注入主编辑区最下方的母档区块正上方。
-
1Locate & Inspect: Use the left sidebar
Partial search...box (or clickView Blockafter compilation) to open the Block Inspector modal. Note that in Partial Search results, clicking any browser-viewable filename (`.php`, `.html`, `.txt`) opens it directly in a new tab! 搜尋並開啟檢視器:使用左側搜尋框尋找目標檔案(點擊搜尋結果的檔名可直接在新分頁預覽網頁),點擊Inspect / Edit Block開啟彈窗。 搜索并打开查看器:使用左侧搜索框寻找目标文件(点击搜索结果的文件名可直接在新标签页预览网页),点击Inspect / Edit Block打开弹窗。 -
2Edit Inside the Modal: Type or modify code directly inside the Block Inspector textarea. The moment you make an edit, the bottom button illuminates with a pulsing neon-emerald glow:
⚡ Inject Edited Block (Above Last File). 於彈窗內直接修改:在彈窗文字框內編輯代碼,左下角按鈕會立即亮起霓虹綠光:⚡ Inject Edited Block (Above Last File)。 在弹窗内直接修改:在弹窗文字框内编辑代码,左下角按钮会立即亮起霓虹绿光:⚡ Inject Edited Block (Above Last File)。 -
3Hot-Inject Above Motherfile: Click the glowing button. EggDiva splices your edited block directly above the final block (the motherfile checkpoint) in the main editor and scrolls to it. Click
⚡ Compile Architectureto commit. 熱注入至母檔上方:點擊發光按鈕,系統會自動將修改後的區塊精準插入主編輯區最後一個母檔區塊的正上方,接著點擊編譯即可生效。 热注入至母档上方:点击发光按钮,系统会自动将修改后的区块精准插入主编辑区最后一个母档区块的正上方,接着点击编译即可生效。
Purpose 5: Rearranging File Sequence & Physical Backup Rollback 用途五:調整檔案排列順序與實體備份安全還原 用途五:调整文件排列顺序与实体备份安全还原
WORKFLOW #05
When to use: You need to reorder blocks so that an included file (`:-:`) sits above its caller, or you need to undo a compilation by restoring the physical pre-overwrite backup copy of your `__filemother`.
適用情境:需要調整串流中各檔案的前後順序(確保被 `:-:` 嵌入的檔案位於上方),或在編譯後發現錯誤、需要將被覆蓋前的母檔備份還原至編輯器。
适用情境:需要调整串流中各文件的前后顺序(确保被 `:-:` 嵌入的文件位于上方),或在编译后发现错误、需要将被覆盖前的母档备份还原至编辑器。
-
1Rearrange File Sequence: Click
🔀 Rearrange Orderin the Command Deck. Use the⏫ Top,⬆️ Up,⬇️ Down, and⏬ Bottombuttons to reorder your files, then click✔ Apply New Sequenceand compile. 視覺化重排順序:點擊命令列的🔀 Rearrange Order,使用上下移動按鈕調整區塊順序,點擊套用後再按編譯即可更新母檔結構。 可视化重排顺序:点击命令列的🔀 Rearrange Order,使用上下移动按钮调整区块顺序,点击应用后再按编译即可更新母档结构。 -
2Physical Backup Rollback (
Reverse): Every time you click⚡ Compile Architecture, EggDiva saves a hidden physical backup copy (`.eggdiva_bak_*`) of the `__filemother` being overwritten. If you want to undo, click⎌ Reverse (Undo Changes)in the green result banner. 實體備份安全還原:每次點擊編譯覆蓋母檔前,系統皆會自動建立隱藏備份檔。若需反悔,點擊編譯成功訊息中的⎌ Reverse (Undo Changes)按鈕。 实体备份安全还原:每次点击编译覆盖母档前,系统皆会自动建立隐藏备份档。若需反悔,点击编译成功讯息中的⎌ Reverse (Undo Changes)按钮。 -
3Review & Finalize Rollback: Clicking
Reverseloads the previous overwritten `__filemother` back into the main IDE textarea and displays an amber notice banner. Review the restored code and click⚡ Compile Architectureto finalize the rollback. (Backups are automatically erased when you load another filemother or log out.) 檢視並確認還原:點擊還原後,系統會將上一版母檔載入主編輯區並顯示醒目提示,確認無誤後再次點擊⚡ Compile Architecture即可完成實體檔案回滾(當切換其他母檔或登出時,暫存備份會自動清除)。 查看并确认还原:点击还原后,系统会将上一版母档载入主编辑区并显示醒目提示,确认无误后再次点击⚡ Compile Architecture即可完成实体文件回滚(当切换其他母档或登出时,暂存备份会自动清除)。
Purpose 6: Stateless Multi-Tab Parallel Engineering Across Folders 用途六:無狀態多視窗、跨資料夾平行專案開發 用途六:无状态多窗口、跨文件夹平行项目开发
WORKFLOW #06
When to use: You are building multiple microservices or separate projects across different server directories (`/var/www/proj_a`, `/var/www/proj_b`) in different browser tabs at the exact same time.
適用情境:同時開啟多個瀏覽器分頁,在不同資料夾(甚至 EggDiva 家目錄以外的外部系統路徑)平行開發多個微服務或專案。
适用情境:同时打开多个浏览器标签页,在不同文件夹(甚至 EggDiva 主目录以外的外部系统路径)平行开发多个微服务或项目。
-
1Switch or Create Folders (Far-Left Column): Use the leftmost 📁 Working Folders column to create a new subdirectory (`+ Create`), navigate to `.. (Parent Directory)`, or type any custom path (`Go`). 切換或建立工作目錄:使用最左側的 📁 Working Folders 欄位建立新資料夾、切換至上層目錄,或輸入任意伺服器路徑。 切换或创建工作目录:使用最左侧的 📁 Working Folders 栏位创建新文件夹、切换至上层目录,或输入任意服务器路径。
-
2Zero Session Collision: Because EggDiva passes `workdir` via hidden form inputs and URL parameters rather than `$_SESSION`, Tab A and Tab B stay 100% isolated. Generated file links automatically calculate `../` relative paths back to your browser! 分頁完全隔離不互衝:工作目錄路徑透過隱藏表單欄位與網址參數傳遞,不依賴共用 Session,因此多個分頁同時編譯絕不互相干擾,且產生的檔案連結會自動計算相對路徑 (`../`)。 标签页完全隔离不冲突:工作目录路径透过隐藏表单栏位与网址参数传递,不依赖共用 Session,因此多个标签页同时编译绝不互相干扰,且产生的文件链接会自动计算相对路径 (`../`)。
-
3Auto-Collapse Screen Space: After 2 minutes of inactivity, the Working Folders column smoothly collapses to `0px` to maximize editor width. Simply move your mouse to the far-left edge of your screen to pop it right back open. 閒置兩分鐘自動收折:左側資料夾欄在閒置 2 分鐘後會自動收折以擴大編輯空間;只要將滑鼠移至畫面最左緣感應區即可瞬間展開。 闲置两分钟自动收折:左侧文件夹栏在闲置 2 分钟后会自动收折以扩大编辑空间;只要将鼠标移至画面最左缘感应区即可瞬间展开。
Quick Reference: Feature & Purpose Matrix EggDiva 功能與開發目的速查矩陣 EggDiva 功能与开发目的速查矩阵
CHEAT SHEET| Tool / Button | Location | Primary Engineering Purpose |
|---|---|---|
⚡ Compile Architecture |
Command Deck / Ctrl+Enter |
Parses stream, expands :-: inclusions, writes physical files, saves .eggdiva_bak_* backup, and updates __filemother. |
[+ New Block (Above Motherfile)] |
Quick Insert Bar | Splices a new Flowgen block template directly above the final motherfile checkpoint block. |
✨ Deduplicate Stream |
Command Deck | Merges duplicate file blocks (keeping first-occurrence position and last-occurrence code) directly into the main editor. |
🔀 Rearrange Order |
Command Deck | Opens interactive modal to move file blocks Up/Down/Top/Bottom before compiling. |
⚡ Inject Edited Block |
Block Inspector Modal | Lights up when you edit code inside the Inspector popup; injects the modified block right above the motherfile. |
⎌ Reverse (Undo Changes) |
Post-Compile Banner | Loads the physical pre-overwrite backup copy of the __filemother into the editor for safe review and re-compilation. |
Workspace Files |
Middle Sidebar | Opens Directory Viewer with multi-sort (Name, Type, Size, Time), raw file inspection, and password-protected batch delete. |