Kiro: AWS 代理式 IDE 告別盲盒式 Vibe Coding

Post Title Image (圖說:正在安裝 Kiro。圖片來源:Ernest’s MBP。)

✳️ TL;DR

  • 覺得 AI | Vibe coding 寫程式像開盲盒嗎?
  • Kiro 1 用 Specs 幫你拆盒前就看說明書
  • 一句提示 → 自動展開使用者故事,還附 EARS 需求標準

  • Ernest 嘗試拆解 Kiro 的四層架構(意圖層、知識層、執行層、監督層)2
  • Kiro AI = Kiro Agentic IDE

  • Tasks 列表直接串單元/整合測試,減少忘記寫測試的窘境
  • Hooks 讓大家發揮想像力,事件驅動的自動化,自己的自動化自己接
  • Steering 專案指導原則,確保一致性,讓 Kiro 遵循組織文化,串接知識管理
  • 支援 RWD 與 A11y,前端也有被照顧

  • 預覽期間免費,支援 Mac/Win/Linux (快蹭!
  • Kiro 基於 Code OSS,與 VS Code 相容
  • VS Code 使用者 (應) 可無痛搬家,有些外掛在 Kiro 還沒見到
  • Kiro + WSL2 解法 2

  • 延伸玩法: Kiro + dev container 做隔離
  • 延伸玩法: Kiro + Remote SSH + EC2 (CloudShell?) within VPC

345

✳️ 知識圖譜

(更多關於知識圖譜…)

graph LR
    A["Agentic IDE"] --> |"integrates"| B["AI Agent"]
    A --> |"provides"| C["Development Environment"]
    
    B --> |"executes"| D["Specs"]
    B --> |"uses"| E["Steering Files"]
    B --> |"triggers"| F["Agent Hooks"]
    B --> |"operates in"| G["Autopilot Mode"]
    B --> |"operates in"| H["Supervised Mode"]
    
    D --> |"contains"| I["Requirements Phase"]
    D --> |"contains"| J["Design Phase"]
    D --> |"contains"| K["Implementation Phase"]
    
    I --> |"uses"| L["EARS Notation"]
    I --> |"generates"| M["User Stories"]
    
    J --> |"produces"| N["Technical Architecture"]
    J --> |"creates"| O["Sequence Diagrams"]
    
    K --> |"breaks down into"| P["Discrete Tasks"]
    P --> |"tracked by"| Q["Task Execution Interface"]
    
    E --> |"stored in"| R[".kiro/steering/"]
    E --> |"includes"| S["Product Overview"]
    E --> |"includes"| T["Technology Stack"]
    E --> |"includes"| U["Project Structure"]
    
    F --> |"responds to"| V["File Events"]
    F --> |"automates"| W["Development Workflows"]
    V --> |"triggers"| X["File Created"]
    V --> |"triggers"| Y["File Saved"]
    V --> |"triggers"| Z["File Deleted"]
    
    AA["MCP Protocol"] --> |"connects"| B
    AA --> |"enables"| BB["External Tool Integration"]
    AA --> |"provides"| CC["API Access"]
    
    DD["Chat Interface"] --> |"facilitates"| B
    DD --> |"supports"| EE["Natural Language Interaction"]
    
    %% Styling for concept classes (orange)
    classDef conceptClass fill:#FF8000,stroke:#000,stroke-width:2px
    class A,B,D,E,F,AA,DD conceptClass
    
    %% Styling for instances (blue)
    classDef instanceClass fill:#0080FF,stroke:#000,stroke-width:2px
    class I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z,BB,CC,EE,G,H instanceClass

✳️ 延伸閱讀