Projekts - Pieskaitītājs
No pašiem HTML, CSS, JS, Bootstrap 5 pamatiem patstāvīgi izstrādāt skaitītāja lietotni, kā arī izmantot mākslīgā intelekta (MI) rīkus tās radošai papildināšanai un akcepttestēšanai.
Saturs
- Uzdevuma apraksts
- Sasniedzamie rezultāti
- Darba gaita
- Nepieciešamie resursi
- Nepieciešamās zināšanas
- Ieteikumi
- Programmēšana II SR
Uzdevuma apraksts
Nepieciešams izstrādāt lietotni, kas palielinātu HTML elementa vērtību par lietotāja ievadīto skaitli.
1. solis: Pamata prasības (Obligātā bāze)
(Šo soli ieteicams veikt primāri pašu spēkiem, lai nostiprinātu izpratni par notikumu klausītājiem (event listeners) un DOM manipulāciju.)
- HTML: sākotnējais rezultāts = 0;
- HTML: iespēja ievadīt skaitli;
- HTML: ievades laukam pievienota BS ikona;
- JS: piespiežot pogu sākotnējais rezultāts palielinās par ievadītā skaitļa vērtību;
- JS: funkcija vispirms pārbauda vai vispar ir ievadīta vērtība un vai ievadītā vērtība ir skaitliska;
- JS: parādās paziņojums, ja ir ievadīta nepareiza vērtība;
- JS: aprēķins tiek veits nospiežot "Enter" taustiņu;
- CSS: body piešķirta fona krāsa;
2. solis: Radošais paplašinājums (Izstrādātāja brīvība ar MI)
Kad pamata prasības ir izpildītas, tavs uzdevums ir iejusties produkta dizainera lomā. Izvēlies un pievieno lietotnei vismaz 2 jaunas, noderīgas funkcionalitātes. Šajā solī tehniskās barjeras nepastāv – droši izmanto MI asistentus, lai ģenerētu nepieciešamo kodu.
Idejas iedvesmai:
- Vēstures saraksts: attēlo visus iepriekšējos pieskaitījumus un to rezultātus.
- Atiestatīšanas poga: "Reset" poga, kas atgriež rezultātu uz 0.
- Vizuāls efekts vai skaņa: brīdī, kad skaitlis tiek pieskaitīts vai parādās kļūda.
- Dinamiska krāsu maiņa: rezultāta teksts kļūst sarkans, ja rezultāts ir negatīvs, un zaļš, ja tas ir pozitīvs.
3. solis: Prasību definēšana un akcepttestēšana
Tā kā papildu funkcionalitātes kodu ģenerē MI, tavs uzdevums ir to pareizi vadīt un pārbaudīt. Savā dokumentācijā fiksē šādu informāciju:
- Prasību specifikācija (Pirms ģenerēšanas): Uzraksti precīzu definīciju katrai jaunajai funkcijai. Ko tieši tu vēlies panākt? (Šo tekstu izmantosi kā uzvedni/promptu savam MI asistentam).
- Lietotāja pieredze: Īsi pamato, kādēļ šī jaunā funkcionalitāte ir nepieciešama un kā tā uzlabo lietotni.
- Akcepttestēšana (Pēc koda integrēšanas): Apraksti testēšanas soļus, lai pierādītu, ka MI uzrakstītais kods strādā atbilstoši tavai specifikācijai (piemēram: "Ievadīju zīmi mīnus un skaitli 5, rezultāts kļuva negatīvs un iekrāsojās sarkanā krāsā").
Šiet ir paraugs kā šāda lietotne varētu izskatīties bāzes prasībām.
Sasniedzamie rezultāti
- Patstāvīgi spēj pievienot .js un .css datnes HTML dokumentam;
- HTML: spēj pievienot
h1,input,buttonelementus; - CSS: spēj nomainīt
<body>elementa fona krāsu; - JS: spēj pievienot notikum klausīšanās funkciju;
- JS: spēj nolasīt un nomainīt HTML elementa tekstu;
- BS5: spēj izmantot klases HTML elementu noformēšanai;
Darba gaita
- izplānot un uzzīmēt blokshēmu procesam, kā tiek pieskaitīts lietotāja ievadītais skaitlis;
- izplānot nepieciešamo failu struktūru (.html, .css, .js);
- izveidot pamata .html failu un sasaistīt to ar .css, .js, BS5 un Bootstrap ikonām;
- izstrādāt .html skatu, noformējot to ar BS5 klasēm;
- noformēt fona krāsu ar .css;
- izstrādāt pogas funkcionalitāti ar .js;
- Pievienot radošo paplašinājumu ar MI palīdzību un veikt tā akcepttestēšanu.
Paredzamais izpildes laiks: 80-120 min
Nepieciešamie resursi
Nepieciešamās zināšanas
Var izmantot WEB Zinašanu krātuvi, kur ir apkopojums par pamata lietām, kas ir jāzina par JavaScript, HTML, CSS un Bootstrap 5, lai uzsāktu Programmēšana II kursu. Tāpat noderēs iepriekšējā pieredze vai norādes, kā pielietot MI rīkus ideju ģenerēšanai un koda rakstīšanai.
Ieteikumi
- regulāri pārbaudīt un atkļūdot risinājumu;
- ievērot labas prakses principus.
Programmēšana II SR
Aktivitāte vērsta uz šādām Programmēšana II sasniedzamajiem rezultātiem (SR):
- Prasmes: Izvēlas piemērotu programmatūras izstrādes modeli, programmēšanas valodu un programmatūras izstrādes vidi.
- Prasmes: Izmanto programmēšanas valodu un to bibliotēku dokumentāciju un palīdzības sistēmu, lai patstāvīgi apgūtu citas to piedāvātās iespējas.
- Prasmes: Veido programmas kādā no programmēšanas valodām, t. sk. objektorientētajā valodā.
- Prasmes: Veic atkļūdošanu.
- Prasmes: Veido programmatūras prasību specifikāciju.
- Prasmes: Salīdzina programmatūras prasību specifikāciju ar produkta funkcionalitāti (akcepttestēšana).
- Zināšanu, izpratnes, prasmju un ieradumu kombinācijas: Problēmrisināšana: izstrādā izvēlētajai mērķauditorijai nepieciešamu programmproduktu, veicot izpēti un definējot risināmo problēmu, izvēloties piemērotāko risinājumu, plānojot resursus un veicot akcepttestēšanu.
- Ieradumi: Izmanto labās prakses principus programmas koda pierakstā un strukturēšanā.
