Vibe coding za početnike: kako da počnete, korak po korak

Vibe coding za početnike svodi se na pet koraka: izaberite alat koji pokreće aplikaciju umesto vas, opišite jednu malu aplikaciju običnim rečima, isprobajte je kao korisnik, tražite jednu popravku po jednu i objavite kad radi. Ne morate znati da programirate. Ovaj vodič prolazi kroz svaki korak sa pravim prvim projektom, tačnim upitima koje ćete kucati i greškama koje gotovo svaki početnik napravi u prvoj nedelji.

Ako prvo želite pozadinu, odakle pojam potiče i zašto se ljudi o njemu spore, pročitajte šta je vibe coding. Ova stranica je praktični deo.

Šta vam je potrebno pre početka

Manje nego što mislite:

• Pregledač i nalog kod alata za vibe coding. Početnici treba da izaberu AI alat za pravljenje aplikacija, koji piše kod, pokreće ga i hostuje, a ne asistenta za kodiranje koji očekuje da sami vodite fajlove i servere.
• Jednu malu ideju. Ne vaš startup. Alat za jednu osobu (vas) sa jednim ili dva ekrana.
• Sat ili dva bez prekida. Prva sesija vas uči ritmu.

To je sve. Bez instalacija, bez kursa programiranja, bez terminala.

Koji alat izabrati kao početnik

Alat je manje bitan od navika, ali treba da radi tri stvari: da pokazuje živi pregled dok gradi, da omogući poništavanje loše izmene i da objavljuje na link koji možete podeliti. Naše poređenje najboljih alata za vibe coding pošteno pokriva glavne opcije. Mythex je jedna od njih: opišete aplikaciju u chatu, on pravi pravu full-stack aplikaciju sa živim pregledom, dodaje bazu kada aplikacija treba da nešto pamti i objavljuje jednim klikom. Free plan ne traži karticu.

Korak 1: Izaberite prvi projekat koji možete da završite

Početnici obično propadaju tako što ciljaju previše. Dobar prvi projekat:

• Vama lično je koristan, pa ćete ga pravilno testirati.
• Staje na jedan ili dva ekrana.
• Čuva malu količinu vaših podataka.
• Nema plaćanja, timova i osetljivih ličnih podataka.

Dobri prvi projekti:

U ostatku ovog vodiča koristićemo listu za čitanje.

Korak 2: Napišite prvi upit

Vaša prva poruka oblikuje sve ostalo. Recite za koga je, šta radi i kako treba da izgleda. Držite je u kratkom pasusu.

Slab prvi upit:

Napravi mi aplikaciju za knjige.

Dobar prvi upit:

Napravi aplikaciju za listu za čitanje za mene. Mogu da dodam knjigu sa naslovom, autorom i statusom (želim da pročitam, čitam, pročitano). Prikaži knjige kao kartice grupisane po statusu, najnovije prve. Mogu da promenim status knjige ili da je obrišem. Neka bude čisto i jednostavno: bela pozadina, jedna boja za akcente, radi na telefonu. Sačuvaj knjige da ostanu tu i posle osvežavanja.

Primetite šta drugi upit radi. Navodi polja, radnje, raspored i jedno pravilo koje početnici uvek zaborave: sačuvaj podatke da prežive osvežavanje. Bez te rečenice, mnogi alati naprave stranicu koja izgleda gotovo, ali zaboravi sve čim je osvežite.

Za više polaznix tačaka pogledajte naš spisak upita za vibe coding.

Tražite plan kada niste sigurni

Ako niste sigurni kako da nešto opišete, zamolite AI da napravi plan pre gradnje:

Pre nego što išta napraviš, objasni mi običnim rečima koje ekrane ćeš napraviti, koje podatke ćeš čuvati i šta treba da odlučim ja.

U Mythex-u je ovo namena režima Plan: agent iznosi pristup, a vi ga odobravate pre nego što se promeni ijedan fajl.

Korak 3: Testirajte kao korisnik, a ne kao osoba koja ju je napravila

Kada se pojavi pregled, nemojte samo da se divite. Koristite ga:

1. Dodajte tri knjige, uključujući jednu sa veoma dugačkim naslovom.
2. Promenite status. Da li se kartica premešta u pravu grupu?
3. Osvežite stranicu. Da li su knjige i dalje tu?
4. Pokušajte da dodate knjigu sa praznim naslovom. Šta se dešava?
5. Otvorite pregled na telefonu ili suzite prozor pregledača.

Zapišite šta nije u redu običnim rečima. „Dugačak naslov lomi raspored kartice“ je savršen izveštaj o grešci. „Pokvareno je“ nije.

Korak 4: Popravljajte jednu stvar po poruci

Ovo je navika koja razdvaja ljude koji završe od onih koji odustanu. Pošaljite jednu izmenu, proverite je, pa pošaljite sledeću.

Dugački naslov „Autostoper kroz galaksiju: Kompletna trilogija“ izlazi van kartice. Prelomi duge naslove u dva reda i skrati ostatak sa „…“.

Zatim:

Ako pošaljem formular sa praznim naslovom, ništa se ne dešava i nema poruke. Prikaži „Dodajte naslov“ ispod polja i nemoj da čuvaš knjigu.

Zašto jedno po jedno? Kada tražite pet izmena u jednoj poruci, AI može četiri da uradi dobro, a jednu tiho pokvari, a vi nećete znati koja izmena je to izazvala. Mali koraci takođe čine poništavanje korisnim: ako jedna izmena pođe loše, vratite se na verziju pre nje i pokušajte jasniji zahtev.

Kada nešto pukne

Hoće. Svaki alat za pravljenje nailazi na greške. Kopirajte tačan tekst greške ili opišite tačno šta ste kliknuli i šta ste videli, pa ga nalepite nazad:

Kada kliknem Delete na kartici, vidim „Nešto je pošlo po zlu“, a knjiga ostaje. Otkrij zašto se to dešava i popravi. Reci mi koji je bio uzrok.

Važno je tražiti uzrok. To vas uči kako aplikacije rade i sprečava AI da nagađa. Naš vodič o kako ispraviti grešku u aplikaciji napravljenoj AI-jem ide dublje.

Korak 5: Prilagodite je sebi

Kada radi, unapređujte je u istim malim koracima:

• „Dodaj ocenu od 1 do 5 zvezdica koja se prikazuje na pročitanim knjigama.“
• „Dodaj polje za pretragu iznad kartica koje filtrira po naslovu ili autoru.“
• „Koristi toplu bež pozadinu i tamnozelenu boju za akcente.“
• „Dodaj brojač na vrhu: knjige pročitane ove godine.“

Svaka od ovih je jedna, proverljiva izmena.

Korak 6: Objavite i podelite

Kada radi ono što vam treba, objavite je. Na Mythex-u je to jedan klik, a dobijate javnu adresu koju možete otvoriti na bilo kom uređaju ili poslati prijatelju. Ako kasnije želite sopstveni domen, to je Pro funkcija, a naš vodič za povezivanje prilagođenog domena to objašnjava.

Pre nego što išta podelite sa više od nekoliko prijatelja, pročitajte da li je vibe coding bezbedan. Za ličnu listu za čitanje rizik je mali. Za aplikaciju u kojoj se nepoznati ljudi prijavljuju i čuvaju podatke, postoje provere koje morate prvo da uradite.

Greške početnika koje treba izbeći

• Traženje svega odjednom. „Napravi mi Goodreads“ daje nešto što izgleda impresivno, a loše radi. Počnite sa najmanjom korisnom verzijom.
• Nepotpuno testiranje osvežavanja. Podaci koji nestanu pri učitavanju su najčešće iznenađenje za početnike.
• Ponovno pisanje zahteva od nule svaki put. Recite šta treba promeniti, a šta zadržati: „Zadrži raspored, samo promeni boje.“
• Verovanje da je „popravljeno“. AI će često reći da je greška popravljena. Proverite sami svaki put.
• Lepljenje lozinki ili API ključeva u chat. Ako aplikaciji treba ključ za spoljni servis, stavite ga u podešavanja tajni alata, nikada u poruku ili kod. Pogledajte kako čuvati API ključeve bezbednim.
• Odustajanje posle prve greške. Greške su normalne. Nalepite ih nazad i tražite uzrok.

Šta da učite usput

Ne treba vam kurs, ali nekoliko pojmova će učiniti svaki zahtev preciznijim. Zamolite AI da ih objasni u kontekstu vaše aplikacije:

• Frontend i backend: šta radi u pregledaču posetioca, a šta na serveru. (Frontend vs backend)
• Baza: gde aplikacija čuva svoje podatke. (Šta je baza podataka?)
• Autentifikacija: kako aplikacija zna ko je neko.
• Tajne: privatni ključevi koje aplikacija koristi a koje posetioci nikada ne smeju da vide.

Dobar upit za ovo: „Objasni kako moja lista za čitanje čuva knjigu, od klika na Add do čuvanja podataka. Koristi obične reči i pozovi se na stvarne fajlove.“

Vaš drugi i treći projekat

Posle prve aplikacije izaberite nešto korak teže. Pratilac navika sa nedeljnim grafikonom. Formular za rezervacije koji vam šalje mejl. Mala kontrolna tabla koja čita podatke iz Google tabele. Naši primeri vibe coding-a prikazuju prave vrste aplikacija sa upitima iza njih i šta je pošlo po zlu, a kako napraviti aplikaciju vibe coding-om vodi veći projekat od ideje do objavljene aplikacije sa korisnicima.

Kada budete spremni, otvorite AI alat za pravljenje aplikacija, nalepite gornji upit za listu za čitanje i promenite ga u svoju ideju.

Pitanja