Mula Vibe Coding Tungo sa Mas Mataas na Antas: Spec-Driven Development gamit ang Kiro

Pagpapakilala sa Kiro

Kahawig ng Visual Studio Code (VS Code) ang Kiro dahil hinango ito sa codebase ng VS Code. Nagdagdag ang Amazon ng mga feature rito at ginawa itong subscription-based service dahil umaasa ang mga agentic coding feature nito sa mga Large Language Model (LLM).

Spec Mode at Spec-Driven Development

Spec Mode: Isang natatanging feature ng Kiro na tinatawag na spec mode o spec-driven development.
Tradisyonal na Vibe Coding: Sanay ang karamihan ng developer sa vibe coding, kung saan binibigyan nila ng prompt ang isang coding agent upang tumulong sa pag-code o pag-debug.
Spec-Driven Development: Ibang paraan ito ng pagbuo ng software na nagsisimula sa requirements, design, task planning, at saka lamang sa coding. Gumagamit ito ng nakabalangkas na requirements at design bago simulan ang aktuwal na coding.

Feature na Agent Steering

Agent Steering: Feature na nagbibigay-daan sa mga developer na gabayan ang coding assistant kung paano magsulat ng software.
Markdown File para sa Product Overview: Maaaring magbigay ang mga developer ng markdown file na naglalarawan sa produkto, kasama ang overview, workflow, at use case nito. Tumutulong itong ihanay ang requirements at design sa product overview.
Pagtukoy sa Project Structure: Maaaring tukuyin ng mga developer ang project structure sa isang markdown file bago magsimula ang coding. Kabilang dito ang enterprise standards o mga partikular na paraan ng pag-aayos ng project files at test files.
Naming Conventions: Maaaring tukuyin ng mga developer ang naming conventions sa markdown file upang matiyak na sumusunod sa tamang conventions ang mga gagawing file.

Pagtukoy sa Technology Stack

Pagtukoy sa Technology Stack: Ang ikatlong halimbawa ng agent steering ay ang pagtukoy sa technology stack ng proyekto.
Front-end: Tukuyin ang mga framework gaya ng React.
Back-end: Tukuyin ang mga framework o teknolohiya para sa back-end.
Dependencies: Tukuyin ang project dependencies sa mga markdown file.

Coding Conventions

Coding Conventions: Paunang tukuyin ang coding conventions ng organisasyon upang matiyak na sinusunod ng coding assistant ang mga ito.

Suporta para sa agents readme

Suporta sa Agents Readme: Nagdagdag ang pinakabagong release ng Kiro ng suporta para sa agents.readme, isang open standard para sa agent markdown files.
Interoperability: Tumukoy ng agent readme file sa Kiro at gamitin ito sa iba pang coding assistant gaya ng Cursor upang matiyak ang pagsunod sa agent markdown standards.

Agent Hooks

Agent Hooks: Gaya ng web hooks, nagpapasimula ang agent hooks ng mga workflow kapag may partikular na event (hal., pag-save o pag-update ng file).
Mga Pamantayan sa Seguridad:
Halimbawa: Tumukoy ng mga pamantayan sa seguridad upang matiyak na walang hard-coded credentials o security vulnerabilities ang code.
Security Scan Kapag Nag-save: Tumukoy ng agent hook para sa security review na nag-scan ng mga API key, private key, IP address, at iba pa, at awtomatikong nag-aayos sa mga ito.
Demonstrasyon:
Umiiral na Code: Isang simpleng halimbawang may hard-coded IP address.
Paglikha ng Agent Hook: Tumukoy ng agent hook na magsasagawa ng security scan kapag sine-save ang file.
Resulta: Tinutukoy ng security scan ang hard-coded IP address bilang high-risk at inaayos ito sa pamamagitan ng paggamit ng environment variable, na gumagamit ng localhost bilang default kapag wala ito.
Shift-Left Security: Isinasagawa ang security scan sa mismong pag-save ng file, kaya naililipat nang mas maaga ang security checks sa development process sa halip na sa CI/CD pa.

Iba Pang Gamit ng Agent Hooks

Paghahambing sa Figma Design:
Integration: Gumamit ng agent hooks upang ihambing ang mga na-code na element sa isang Figma UX design kapag sine-save ang file.
MCP para sa Figma: I-integrate sa MCP para sa Figma upang matiyak na naaayon ang code sa itinakdang design.
Halimbawa: Bigyan ng prompt ang system na magpatupad ng Figma design sa Angular at direktang bumuo ng code mula sa Figma design.

MCP Server Integration (Figma Tungo sa Code)

Halimbawa: I-integrate ang MCP para sa Figma at bigyan ng prompt ang system na bumuo ng Angular code mula sa isang Figma design.
Resulta: Direktang bumubuo ang system ng code mula sa Figma design at gumagawa ng site batay sa design.

MCP Server Integration (Pinakabagong Documentation)

Integration: Gumamit ng MCP server upang sumangguni sa pinakabagong documentation, gaya ng AWS documentation at knowledge base.
Halimbawa: I-integrate sa AWS documentation at ipasuri sa system kung maaaring tumakbo sa AWS Lambda ang code na isinulat nang lokal.
Resulta: Hindi lamang tinutukoy ng system ang mga problema sa code kapag dineploy ito sa Lambda; gumagawa rin ito ng migration plan at nagmumungkahi ng mga pagbabago gaya ng paggamit ng S3 pre-signed URLs para sa paglilipat ng file.

Spec-Driven Development sa Kiro

Spec-Driven Development: Itinampok bilang pinakamagandang pagsulong sa agile development mula nang magsimula ito.
Mga Hamon sa Agile: Madalas, iba ang aktuwal na nabubuo sa tinukoy ng mga user dahil nagbabago ang requirements at nagkakaroon ng maling komunikasyon sa pagitan ng mga project manager, business analyst, at user.
Adaptive Approach: Hinaharap ng spec-driven development ng Kiro ang mga hamong ito sa pamamagitan ng dinamikong pag-angkop sa buong development process.

Demo ng Aktuwal na Use Case

User Requirement: Nais ng user na gumawa ng application para sa file chunking, partikular na hatiin ang isang 500 MB file sa limang chunk na tig-100 MB.
[ 1 ] Mga Hindi Tuwirang Requirement:
Graphical User Interface (GUI)
Drag-and-drop functionality para sa pag-input ng file
Mga opsyon sa configuration ng paghahati (hal., limang chunk o mga chunk na tig-10 MB)
Mga opsyon para i-download ang bawat file at isang zip file na naglalaman ng lahat ng hinating file
[ 2 ] Oras ng Development:
Tradisyonal na Tantiya: Dalawang linggo
Development gamit ang Kiro: Anim na oras (ipinakita sa isang 10 minutong pinabilis na video)
[ 3 ] Demonstrasyon sa Video:
Isang 10 minutong video na nagpapakita ng anim na oras na development process gamit ang Kiro, na may real-time timer sa kaliwang sulok sa itaas.

Paunang Requirements at Design

Input ng User: Tina-type ng product owner ang paunang requirement para sa isang application na maghahati ng malalaking file sa mas maliliit na chunk.
Tugon ng Kiro: Sa loob ng isang minuto, bumubuo ang Kiro ng pitong user requirement na may acceptance criteria.
Feedback ng User: Sinusuri at inaaprubahan ng product owner ang requirements.

Mga Pagbabago sa Design

Paunang Design: Gumagawa ang Kiro ng paunang design na ipinapalagay na gagamit ng Command Line Interface (CLI).
Pagwawasto ng User: Humihiling ang product owner ng Graphical User Interface (GUI) sa halip na CLI.
Real-Time na Update: Inaayos ng Kiro ang design nang real time upang magsama ng GUI at backend API.

Paulit-ulit na Proseso ng Design

To-Do File: Gumagamit ng to-do file upang subaybayan ang mga karagdagang tanong at requirement habang lumilitaw ang mga ito.
[ 1 ] Itinatanong ng product owner ang mekanismo ng pagpapadala ng mga file mula front end papunta sa back end.
Update sa Design: Ina-update ang design upang maidokumento ang upload mechanism.
[ 2 ] Bagong Requirement: Nagdagdag ang product owner ng requirement na sumuporta sa mga file na hanggang isang terabyte.
Update sa Design: Ina-update ang design upang kayanin ang isang terabyte na file.
[ 3 ] Itinatanong ng product owner kung paano malalaman ng back end ang laki ng file bago ito hatiin sa mga chunk.
Update sa Design: Dinadagdagan ng detalye ang design upang masagot ang tanong na ito.

Task Planning

Paglikha ng Task Plan: Matapos gawing pinal ang requirements at design, gumagawa ng task plan na naghahati sa proyekto sa mga indibidwal na task (Task 1 hanggang Task 10).
Ginugol na Oras: Wala pang 20 minuto ang buong proseso mula paunang requirements hanggang task planning.

Task Planning at Coding

Task Traceability: Natutunton pabalik sa requirements ang bawat task, kaya nasisiguro ang end-to-end traceability mula requirements patungong design at task plan.
Unit Tests: Kasabay ng coding, bumubuo ang Kiro ng mga unit test. Kailangang pumasa ang mga task sa lahat ng unit test bago ituring na kumpleto.
Debugging: Awtomatikong dini-debug at inaayos ng Kiro ang mga pumalyang unit test.
Error Handling at Optimization: Isinasagawa ng Kiro ang error handling, validation, at performance optimization bilang bahagi ng task.

Testing at Pag-aayos ng Bug

Paunang Testing: Sa unang pagsubok sa application, natuklasan ang mga problema sa UX (hal., asul na font na mahirap basahin).
Pagtukoy sa Bug: Nagkaroon ng error habang nag-a-upload ng file at natukoy ito sa pamamagitan ng mga log message.
Debugging sa Tulong ng Agent: Kinopya at ini-paste sa agent ang error code, at sinubukan nitong ayusin ang bug.
Matagumpay na Upload: Naayos ang bug at matagumpay na na-upload ang malaking file.
Paghahati at Pag-download: Matagumpay na hinahati ng application ang mga file sa mga chunk at nagbibigay-daan sa pag-download ng bawat chunk at mga zip file.

Mga Pagpapahusay sa UX

Pagbabago ng Kulay: Pinalitan ng cyan ang asul na font upang mas madaling basahin.
Hitsura ng Button: Pinalitan ang abong kulay ng mga button ng mas katanggap-tanggap na kulay.
Pag-upload ng Maramihang File: Sinubukan ang application gamit ang dalawang gigabyte na file upang matiyak na kaya nitong pangasiwaan ang malalaking file.

Testing Automation

Manwal na Testing: Noong una, manwal na isinagawa ang testing, kasama ang paghahati ng maraming file at pagsusuri sa mga problema sa UX.
Automation: Gumagawa ang Kiro ng design at documentation gamit ang mga mermaid diagram at ino-automate ito gamit ang Playwright.
Cross-Browser Testing: Pinatatakbo ang automated tests sa Firefox, Chrome, Safari, at mga mobile device.
End-to-End Flow: Ipinapakita ng proseso ang end-to-end flow mula requirements, pagbuo ng software, hanggang automated live verification—lahat sa loob ng IDE.

Buod

Ipinapakita ng proseso ang kakayahan ng Kiro na pangasiwaan ang spec-driven development, mula requirements at design hanggang coding, unit testing, at mga pagpapahusay sa UX, sa higit na mas maikling panahon kumpara sa mga tradisyonal na pamamaraan.

Kongklusyon at Kinabukasan ng Agile Development

Laki ng Agile Team: Binubuo ng isang bihasang engineer at isang domain o functional expert na magkasamang nagtatrabaho sa isang IDE.
Paghahambing ng Oras: Natapos sa anim na oras ang buong proseso, mula requirements hanggang automated testing, kumpara sa dalawang linggong tantiya ng isang buong agile team.
Spec-Driven Development: Layunin ng session na magbigay ng sulyap sa maaaring makamit sa spec-driven development gamit ang Kiro.