5. diel - Prvé HTML rozhranie vo VS Code s Codexom Nové

V minulej lekcii, Wireframy a kontrola špecifikácie vo VS Code s Codexom , sme vo Visual Studio Code navrhli wireframy portálu EnergoSun, doplnili akceptačné kritériá a pomocou Codexu skontrolovali konzistenciu špecifikácie.

V tomto tutoriále kurzu vývoja aplikácií s AI vytvoríme vo Visual Studio Code pomocou Codexu prvú časť používateľského rozhrania portálu EnergoSun. Codex prečíta súbor SPEC.md a podľa neho pripraví statickú stránku v jazyku HTML.

Pôjde zatiaľ iba o statický prototyp, ktorý zobrazí ukážkový obsah, ale nebude skutočne spracovávať požiadavky. Naším cieľom nie je naučiť sa HTML naspamäť. Chceme pochopiť, akú úlohu má HTML vo webovej aplikácii, ako skontrolovať prácu agenta a ako si nejasnú časť kódu nechať vysvetliť.

HTML

Časť webovej aplikácie, ktorú používateľ vidí a ovláda v prehliadači, označujeme ako frontend. HTML v ňom popisuje predovšetkým štruktúru a význam obsahu – napríklad nadpis, tabuľku, formulár alebo tlačidlo. Konkrétnu podobu HTML si ukážeme za chvíľu.

Ukážka budúcej podoby portálu

Na začiatku vývoja nepotrebujeme vytvárať celé MVP naraz. Najprv pripravíme statický HTML prototyp, teda jednoduchú stránku s vopred vloženým obsahom.

V tomto kroku zobrazíme dve časti, ktoré už poznáme z návrhu obrazoviek:

• prehľad požiadaviek žiadateľa,
• formulár novej požiadavky.

Detail požiadavky zatiaľ zámerne nebudeme vytvárať. Rozdelenie práce na menšie kroky nám umožní ľahšie kontrolovať, čo agent skutočne zmenil.

...koniec náhľadu článku...
Pokračuj ďalej