Vibe coding algajatele: kuidas alustada, samm-sammult

Vibe coding algajatele taandub viiele sammule: vali tööriist, mis käitab rakenduse sinu eest, kirjelda ühte väikest rakendust lihtsate sõnadega, proovi seda kasutajana, palu ühte parandust korraga ja avalda, kui see töötab. Sa ei pea oskama koodi kirjutada. See õpetus käib läbi iga sammu päris esimese projektiga, täpsete promptidega, mida kirjutada, ja vigadega, mida peaaegu iga algaja esimesel nädalal teeb.

Kui tahad esmalt taustateadmisi, vaata, kust mõiste pärineb ja miks inimesed selle üle vaidlevad: mis on vibe coding. See leht on praktiline pool.

Mida vajad enne alustamist

Vähem, kui arvad:

• Brauseri ja konto vibe coding tööriistas. Algajad peaksid valima AI-rakenduste looja, mis kirjutab koodi, käivitab selle ja hostib seda, mitte kodeerimisagendi, mis eeldab, et haldad ise faile ja servereid.
• Üks väike idee. Mitte su startup. Tööriist ühele inimesele (sulle) ühe või kahe ekraaniga.
• Tund-paar segamatult. Esimene seanss õpetab rütmi.

Seda ongi kõik. Pole installe, programmeerimiskursust ega terminali.

Millist tööriista algajana valida

Tööriist on vähem oluline kui harjumused, kuid peaks tegema kolme asja: näitama elavat eelvaadet ehitamise ajal, laskma halva muudatuse tagasi võtta ja avaldama lingi, mida saad jagada. Meie ülevaade parimatest vibe coding tööriistadest võrdleb peamisi valikuid ausalt. Mythex on üks neist: kirjeldad rakenduse vestluses, see ehitab päris täisvirna rakenduse elava eelvaate, lisab andmebaasi, kui rakendus peab midagi meeles pidama, ja avaldab ühe klõpsuga. Free-pakett ei nõua kaarti.

Samm 1: vali esimene projekt, mille lõpetad

Algajad ebaõnnestuvad tavaliselt sellepärast, et sihivad liiga suurelt. Hea esimene projekt:

• on sulle isiklikult kasulik, nii et testid seda korralikult.
• mahub ühele või kahele ekraanile.
• salvestab väikese koguse sinu enda andmeid.
• ei sisalda makseid, meeskondi ega tundlikke isikuandmeid.

Head esimesed projektid:

Täiendavalt kasutame lugemisnimekirja kogu selle õpetuse vältel.

Samm 2: kirjuta esimene prompt

Sinu esimene sõnum määrab kõige kuju. Ütle, kellele see on, mida see teeb ja kuidas see peaks välja nägema. Hoia see lühikese lõigu pikkuseks.

Nõrk esimene prompt:

Tee mulle raamatu rakendus.

Hea esimene prompt:

Ehita mulle lugemisnimekirja rakendus. Saan lisada raamatu pealkirja, autori ja staatusega (tahan lugeda, loen, lõpetatud). Näita raamatuid staatuse järgi rühmitatud kaartidena, uusim esimesena. Saan muuta raamatu staatust või selle kustutada. Hoia see puhas ja lihtne: valge taust, üks rõhuvärv, töötab telefonil. Salvesta raamatud, et need oleksid alles ka pärast värskendamist.

Pane tähele, mida teine teeb. Ta loetleb väljad, tegevused, paigutuse ja ühe reegli, mida algajad alati unustavad: salvesta andmed nii, et need säiliksid värskendamisel. Ilma selle reata ehitavad paljud tööriistad lehe, mis näib valmis, kuid unustab kõik laadimisel.

Rohkem alguspunkte leiad vibe coding promptide spikrist.

Palu plaani, kui pole kindel

Kui sa ei ole kindel, kuidas midagi kirjeldada, palu AI-l enne ehitamist plaanida:

Enne kui midagi ehitad, selgita lihtsates sõnades, milliseid ekraane teed, milliseid andmeid salvestad ja mis otsused vajavad minu käest kinnitust.

Mythexis on selleks Plan režiim: agent kirjeldab lähenemise ja sina kiidad selle heaks, enne kui ükski fail muutub.

Samm 3: testi nagu kasutaja, mitte nagu inimene, kes selle ehitas

Kui eelvaade ilmub, ära ainult imetle seda. Kasuta seda:

1. Lisa kolm raamatut, sealhulgas ühe väga pika pealkirjaga.
2. Muuda staatust. Kas kaart liigub õigesse rühma?
3. Värskenda lehte. Kas raamatud on ikka alles?
4. Proovi lisada raamat tühja pealkirjaga. Mis juhtub?
5. Ava eelvaade oma telefonil või kitsenda brauseriakent.

Kirjuta lihtsates sõnades üles, mis on valesti. „Pikk pealkiri rikub kaardi paigutust“ on täiuslik veateade. „See on katki“ ei ole.

Samm 4: paranda üks asi sõnumi kohta

See harjumus eristab neid, kes lõpetavad, neist, kes alla annavad. Saada üks muudatus, kontrolli seda, seejärel järgmine.

Pikk pealkiri „The Hitchhiker's Guide to the Galaxy: The Complete Trilogy“ ületab kaardi. Mähi pikad pealkirjad kaks rida ja lõika ülejäänu välja märgiga „…“.

Seejärel:

Kui ma saadan vormi tühja pealkirjaga, ei juhtu midagi ja puudub teade. Näita väljal „Lisa pealkiri“ ja ära salvesta raamatut.

Miks üks korraga? Kui palud viit muudatust ühes sõnumis, võib AI neist neli hästi teha ja ühe muu vaikselt katki teha, ning sa ei tea, milline muudatus selle põhjustas. Väikesed sammud muudavad ka tagasivõtmise kasulikuks: kui üks muudatus läheb valesti, kerige tagasi versioonini, mis oli enne, ja proovi selgemat päringut.

Kui midagi puruneb

See juhtub. Iga looja jõuab vigadeni. Kopeeri täpne veateade või kirjelda täpselt, mida klõpsasid ja mida nägid, ning kleebi see tagasi:

Kui ma klõpsan kaardil Kustuta, näen teadet „Midagi läks valesti“ ja raamat jääb alles. Leia põhjus ja paranda see. Ütle, mis põhjus oli.

Põhjust küsimine on oluline. See õpetab sulle, kuidas rakendused töötavad, ja takistab AI-l arvata. Meie juhend kuidas siluda AI-ga ehitatud rakendust läheb sügavamale.

Samm 5: tee see enda omaks

Kui see töötab, paranda seda samades väikestes sammudes:

• „Lisa ärasõnud raamatute kaartidele 1–5 tähega hinnang, mis kuvatakse lõpetatud raamatutel.“
• „Lisa kaartide kohale otsingukast, mis filtreerib pealkirja või autori järgi.“
• „Kasuta sooja kreemjat tausta ja tumerohelist rõhuvärvi.“
• „Lisa ülaossa loendur: sel aastal lõpetatud raamatud.“

Iga neist on üks, testitav muudatus.

Samm 6: avalda ja jaga

Kui see teeb, mida vajad, avalda see. Mythexis on see üks klõps ja saad avaliku URL-i, mida saab avada igal seadmel või saata sõbrale. Kui hiljem tahad oma domeeni, on see Pro-funktsioon ja meie juhend kohandatud domeeni ühendamisest selgitab seda.

Enne kui jagad midagi kaugemale mõnest sõbrast, loe kas vibe coding on ohutu?. Isiklik lugemisnimekiri on madala riskiga. Rakenduse puhul, kus võõrad registreeruvad ja hoiavad andmeid, tuleb enne teha kontrollid.

Algaja levinud vead

• Kõike korraga küsimine. „Tee mulle Goodreads“ annab midagi, mis näeb muljetavaldav välja, kuid töötab halvasti. Alusta kõige väiksema kasuliku versiooniga.
• Värskendamise testimata jätmine. Andmed, mis kaovad laadimisel, on kõige sagedasem algaja üllatus.
• Päringu uuesti kirjutamine nullist iga kord. Ütle, mida muuta ja mida hoida: „Jäta paigutus alles, muuda ainult värve.“
• „See on parandatud“ usaldamine. AI ütleb sageli, et viga on parandatud. Kontrolli seda igal korral ise.
• Paroolide või API-võtmete kleepimine vestlusse. Kui su rakendus vajab välise teenuse võtit, pane see tööriista saladuste seadetesse, mitte sõnumisse ega koodi. Vaata kuidas hoida API-võtmeid turvaliselt.
• Loobumine pärast esimest viga. Vead on normaalsed. Kleebi need tagasi ja palu põhjust.

Mida õppida töö käigus

Kursust pole vaja, kuid mõned mõisted muudavad iga päringu täpsemaks. Palu AI-l need selgitada sinu enda rakenduse kontekstis:

• Esikülg ja backend: mis jookseb külastaja brauseris ja mis serveris. (Frontend vs backend)
• Andmebaas: kus sinu rakendus oma andmeid hoiab. (Mis on andmebaas?)
• Autentimine: kuidas rakendus teab, kes keegi on.
• Saladused: privaatsed võtmed, mida rakendus kasutab ja mida külastajad ei tohi kunagi näha.

Hea prompt selleks: „Selgita, kuidas mu lugemisnimekiri raamatu salvestab alates Lisa-nupu klõpsamisest kuni andmete salvestamiseni. Kasuta lihtsaid sõnu ja viita tegelikele failidele.“

Su teine ja kolmas projekt

Pärast esimest rakendust vali midagi ühe sammu raskemat. Harjumuste jälgija nädalase diagrammiga. Broneerimisvorm, mis saadab sulle e-kirja. Väike juhtpaneel, mis loeb Google'i tabelist. Meie vibe coding näited näitavad päris rakendustüüpe promptide ja vigadega, ning kuidas ehitada rakendus vibe codingu abil viib suurema projekti ideest avaldatud rakenduseni, millel on kasutajad.

Kui oled valmis alustama, ava AI-rakenduste looja, kleebi ülal olev lugemisnimekirja prompt ja muuda see enda ideeks.

Küsimused