Tava pirmā aplikācija internetā: sāc ar vienu promptu

Lai izveidotu savu pirmo aplikāciju, nav jāprot programmēt. Pietiek uzrakstīt AI, ko gribi, un pēc brīža tu jau vari spēlēt pats savu spēli. Kad tā patīk, to var publicēt internetā un aizsūtīt saiti draugiem.

Sāksim ar pašu vienkāršāko — krustiņiem un nullītēm bez kontiem un datubāzes. Bezmaksas AI čats šim darbam parasti ir pietiekams. Raksta beigās parādīšu, kā pievienot datubāzi niku un rezultātu glabāšanai, ja to gribēsi.

1. solis: uzraksti promptu

Atver AI čatu, piemēram, Claude vai ChatGPT, un iekopē šo:

Uztaisi krustiņu un nullīšu spēli vienā HTML failā, kas strādā pārlūkā.

- Es spēlēju ar X pret datoru. Dators ir pietiekami gudrs, bet to var uzvarēt.
- Spēle parāda, kurš uzvarēja vai ka ir neizšķirts, un ir poga "Jauna spēle".
- Lapa ir latviešu valodā, skaista un ērti lietojama gan datorā, gan telefonā.
- Bez reģistrācijas, datubāzes un ārējiem rīkiem.

Es neprotu programmēt, tāpēc pasaki vienkāršiem vārdiem, kā spēli atvērt. Iedod visu failu pilnībā.

Daudzi AI čati parāda spēli turpat blakus sarunai. Ja tā nenotiek, palūdz AI failu lejupielādei, saglabā to kā index.html un atver ar dubultklikšķi.

Par vecumu. Claude var lietot no 18 gadiem, ChatGPT — no 13 gadiem ar vecāku atļauju, GitHub — no 13 gadiem. Noteikumi mainās, tāpēc pārbaudi tos pirms reģistrēšanās. Ja tev vēl nav 18 gadu, kontus labāk izveido kopā ar vecākiem vai skolotāju.

2. solis: uzspēlē un uzlabo

Tagad nāk interesantākā daļa: spēlē un saki AI, kas jāmaina. Pa vienai lietai vienā reizē:

Dators ir pārāk viegli uzvarams. Padari to gudrāku, bet atstāj iespēju uzvarēt. Pārējo nemaini.

Uztaisi tumšu dizainu ar neona krāsām un pievieno nelielu animāciju, kad kāds uzvar.

Pievieno spēli divatā pie viena datora, lai pirms spēles var izvēlēties režīmu.

Ja kaut kas nestrādā, apraksti ko darīji, ko gaidīji un ko redzēji. Ekrānšāviņš palīdz vairāk nekā viens vārds „nestrādā”. Nebrīnies, ja AI reizēm kļūdās. Tava daļa ir pamēģināt rezultātu un pateikt, kas nav kārtībā. Par šādu darba veidu vairāk rakstīju rakstā par vibe coding.

Krustiņi un nullītes ir tikai treniņš. Tādā pašā veidā vari uzbūvēt viktorīnu klasei, atmiņas spēli vai pats savu ideju.

3. solis: publicē internetā

Lai spēle būtu pieejama ar saiti, vajag divus bezmaksas rīkus: GitHub glabā failu, bet Vercel to publicē.

1. Saglabā spēli failā ar nosaukumu index.html.
2. Reģistrējies GitHub un izveido jaunu publisku repozitoriju krustini-nullites: augšā + → New repository.
3. Repozitorijā izvēlies uploading an existing file vai Add file → Upload files, ievelc index.html un spied Commit changes.
4. Reģistrējies Vercel ar Continue with GitHub un izvēlies bezmaksas Hobby plānu.
5. Spied Add New → Project, pie sava repozitorija Import, tad Deploy.

Pēc brīža tev būs sava adrese, piemēram, krustini-nullites.vercel.app, un to var sūtīt draugiem. Pogu nosaukumi laika gaitā mainās, tāpēc, ja kādu neatrodi, iedod AI ekrānšāviņu un pajautā, kur spiest.

Kad gribēsi spēli mainīt, augšupielādē GitHub jaunu index.html, un Vercel pats publicēs jauno versiju.

Repozitorijs ir publisks, tāpēc failā nedrīkst būt paroļu vai slepenu atslēgu. Šajā spēlē to nav. Vercel Hobby plāns ir domāts personīgiem, nekomerciāliem projektiem.

Ar to pirmā aplikācija ir gatava. Pārējais šajā rakstā ir neobligāts.

Neobligāti: nikus un rezultātus glabā datubāzē

Pagaidām spēle neko nesaglabā. Ja gribi kopīgu labāko spēlētāju tabulu, vajag datubāzi, piemēram, Supabase, kurai ir bezmaksas plāns.

Šāda var izskatīties spēle ar rezultātu tabulu. Rezultāti attēlā ir piemērs

1. Reģistrējies Supabase un izveido jaunu projektu Eiropas reģionā.
2. Iedod AI savu spēles failu un šo promptu:

Te ir mana spēle: [iekopē index.html vai pievieno failu].

Pievieno nika ievadi un kopīgu 10 labāko spēlētāju tabulu, izmantojot Supabase. Pēc katras spēles jāsaglabā niks un rezultāts.
Iedod man SQL kodu Supabase SQL Editor un visu atjaunināto index.html, un pa soļiem pasaki, kur ko ievietot.

Drošība:
- ieslēdz Row Level Security: ikviens drīkst tikai skatīt un pievienot rezultātus, bet ne mainīt vai dzēst;
- nika garums līdz 20 rakstzīmēm un tikai derīgi rezultāti;
- kodā izmanto tikai publishable atslēgu, nekad secret vai service_role atslēgu;
- niku rādi ar textContent, nevis innerHTML;
- nevāc nekādus citus personas datus.

3. Izpildi SQL kodu sadaļā SQL Editor.
4. Failā ieraksti savu Project URL un publishable key (projekts → Connect vai Project Settings → API Keys).
5. Augšupielādē jauno index.html GitHub un pārbaudi: nospēlē spēli, pārlādē lapu un paskaties, vai rezultāts paliek tabulā.

Trīs lietas, kas jāzina:

• Secret un service_role atslēgas nekad neliec kodā. Publishable atslēga pārlūkā ir paredzēta, jo to ierobežo Row Level Security noteikumi.
• Rezultātu tabulu var viltot. Prasmīgs lietotājs var nosūtīt izdomātu rezultātu vai rupju niku. Spēlei ar draugiem tas ir pieņemami, bet balvām šāds risinājums neder.
• Izmanto izdomātus nikus. Reālus vārdus, e-pastus un citus personas datus nevajag. Bezmaksas Supabase projekts pēc nedēļas ar mazu aktivitāti tiek apturēts, bet dati saglabājas, un to var atjaunot.

Neobligāti: lai AI visu dara pats

Ja kopēšana apnīk, nākamais solis ir AI aģents, piemēram, Claude Code. Tas pats strādā ar failiem, GitHub, Vercel un Supabase, bet tu tikai ielogojies pārlūkā un apstiprini darbības. Bezmaksas Claude plānā tas nav pieejams: lētākais plāns ar to ir Pro, apmēram 20 USD mēnesī.

Pirmajam uzdevumam der šāds prompts:

Publicē šo spēli manā vietā. Es neprotu programmēt, tāpēc lūdz man tikai ielogošanos un apstiprinājumus.
Izmanto GitHub un Vercel, un, ja vajag rezultātu glabāšanu, jaunu Supabase projektu ar bezmaksas plānu un Row Level Security.
Secret atslēgas nekad neliec kodā. Pirms darbībām, kas maksā naudu vai dzēš datus, jautā man.
Darbs ir pabeigts tikai tad, kad esi pats atvēris publicēto lapu, nospēlējis spēli un pārbaudījis rezultātu. Beigās iedod saiti.

Aģentam ir tādas pašas tiesības kā tavam kontam, tāpēc atstāj apstiprināšanu ieslēgtu un izmanto kontus, kuros nav svarīgu datu.

Kādus skillus izmantot

Skill ir instrukciju komplekts, ko aģents lieto noteiktam darbam. Tas ir kā pieredzējuša kolēģa darba metode. Sākumam pietiek ar pirmajiem trim no šī saraksta:

Skill	Kad noder	Avots
brainstorming	pirms darba, lai noskaidrotu ideju un izvēlētos risinājumu	Superpowers
frontend-design	lai lapa neizskatītos pēc tipiska AI šablona	Anthropic
verification-before-completion	lai AI pārbaudītu rezultātu, pirms saka „gatavs”	Superpowers
writing-plans	lielākam darbam, lai sadalītu to soļos	Superpowers
systematic-debugging	kad kļūda atkārtojas un labojumi nepalīdz	Superpowers
webapp-testing	lai aģents pats izmēģinātu lapu pārlūkā	Anthropic
supabase	darbam ar Supabase	Supabase
supabase-postgres-best-practices	datubāzes struktūrai, ātrdarbībai un drošībai	Supabase
deploy-to-vercel	publicēšanai Vercel	Vercel
web-design-guidelines	lapas lietojamības un pieejamības pārskatam	Vercel

Uzstādīšanu vari uzticēt pašam aģentam:

Uzstādi Claude Code pluginus superpowers@claude-plugins-official un frontend-design@claude-plugins-official. Vispirms pasaki, ko katrs dara un no kurienes tas nāk.

Pārējos uzstāda līdzīgi: pasaki aģentam skilla nosaukumu un repozitoriju no tabulas. Uzstādi tikai tos skillus, kuru avotam uzticies, jo tie ietekmē aģenta darbības.

Neobligāti: savs domēns

Adrese krustini-nullites.vercel.app strādā lieliski, bet savs domēns izskatās nopietnāk. Reģistrētājam jābūt vismaz 18 gadus vecam; jaunāka cilvēka vārdā to dara vecāki.

1. Lapā NIC pārbaudi, vai .lv nosaukums ir brīvs, un reģistrē to tur vai pie kāda no reģistratoriem. NIC norādītā cena ir 14,52 EUR gadā ar PVN; reģistratoru cenas atšķiras, tāpēc pirms pirkšanas pārbaudi aktuālo cenu.
2. NIC maksā nav iekļauti DNS jeb nosaukumu serveri, tāpēc iesācējam ērtāk izvēlēties reģistratoru, kura pakalpojumā var pārvaldīt DNS ierakstus.
3. Vercel projektā atver Settings → Domains un pievieno domēnu.
4. Pie reģistratora ieraksti tieši tās DNS vērtības, ko rāda Vercel. Izmaiņas parasti sāk darboties dažu stundu laikā, bet var aizņemt līdz 48 stundām.

Tagad tava kārta

Pirmajam projektam jābūt mazam. Uztaisi spēli, aizsūti saiti draugam un noskaidro, ko draugs vēlētos mainīt. Tad pamaini vienu lietu un parādi vēlreiz. Tā strādā arī lieli produkti, un Biome3D stāstā redzams, cik tālu to var aizvest.

Ja izveido ko savu vai kādā solī iestrēgsti, uzraksti man. Labprāt apskatīšos, kas tev sanācis.