30 prompt-e vibe coding që mund t'i kopjosh (fletë referimi)

Prompt-et më të mira vibe coding janë të shkurtra, të sakta dhe kanë të bëjnë me sjelljen: kush e përdor aplikacionin, çfarë mund të bëjë, çfarë ruan dhe si duket. Më poshtë janë 30 prompt-e që mund t'i kopjosh dhe ngjitësh, të grupuara sipas fazës ku je, nga ndërtimi i parë deri te publikimi. Zëvendëso pjesët në [kllapa] me detajet e tua.

Funksionojnë në çdo ndërtues aplikacionesh me AI ose agjent kodimi. Nëse dëshiron arsyet pas tyre, udhëzuesi ynë më i gjatë për si të shkruash prompt-e për ndërtuesit e aplikacioneve me AI i shpjegon parimet. Kjo faqe është fleta referuese.

Si ta përdorësh këtë fletë

• Nis me një prompt ndërtimi të parë, pastaj përdor të tjerët një në një.
• Testo pas çdo prompt-i. Kliko nëpër ndryshim përpara se të dërgosh tjetrin.
• Mbaj atë që funksionon. Shumica e prompt-eve pasuese këtu përfundojnë me „mbaje gjithçka tjetër njësoj“, dhe jo pa arsye.
• Ngjit tekstin e saktë. Mesazhet e gabimit, etiketat e butonave dhe fjalët në ekran i mundin përshkrimet çdo herë.

Prompt-e ndërtimi të parë

Këta vendosin formën e aplikacionit. Secili emëron përdoruesit, veprimet, të dhënat dhe pamjen.

1. Një gjurmues i thjeshtë

Ndërto një gjurmues [zakoni] për mua. Mund të shtoj një [zakon] me emër dhe ngjyrë, ta shënoj një herë në ditë, dhe të shoh një rrjetë 30-ditore dhe seritë e mia aktuale. Ruaji gjithçka që të jetë akoma aty pas rifreskimit. Dizajn i pastër, minimal që funksionon në telefon.

2. Një faqe rezervimi për biznes të vogël

Ndërto një faqe rezervimi për [sallonin tim të flokëve]. Klientët zgjedhin një shërbim ([prerje 30 min, ngjyrosje 90 min]), një datë dhe një orar të lirë mes [9:00 dhe 18:00], pastaj shkruajnë emrin, telefonin dhe email-in. Dy persona nuk mund ta rezervojnë të njëjtin orar. Kam nevojë për një faqe private administratori, pas hyrjes, që liston rezervimet e ardhshme sipas ditës.

3. Një mjet i brendshëm

Ndërto një mjet të brendshëm për ekipin tim për të gjurmuar [huazimet e pajisjeve]. Çdo artikull ka një emër, një kod dhe një status (i lirë, i huazuar, i prishur). Stafi hyn, mund ta marrë një artikull për vete dhe ta kthejë. Shfaq një tabelë me filtra sipas statusit dhe një histori të kujt e ka pasur çdo artikull.

4. Një faqe zbarkimi me listë pritjeje

Ndërto një faqe për një faqe [produktin tim: një aplikacion planifikimi ushqimesh për prindër të zënë]. Titull kryesor me nën-titull të shkurtër dhe regjistrim me email. Pastaj tre përfitime, një seksion të shkurtër si funksionon dhe një FAQ. Ruaj email-et e regjistrimit në një bazë të dhënash dhe më shfaq listën në një faqe private administratori.

5. Një portal klientësh

Ndërto një portal klientësh për [studion time të dizajnit]. Çdo klient hyn dhe sheh vetëm projektet e tij, me status, skedarët që kam ngarkuar dhe një fije komentesh. Unë hyj si administrator dhe shoh të gjithë klientët. Klientët kurrë nuk duhet të shohin të dhënat e njëri-tjetrit.

6. Një kalkulator ose mjet oferte

Ndërto një kalkulator oferte për [biznesin tim të pastrimit]. Hyrjet: numri i dhomave, banjove, shërbimeve shtesë (furrë, dritare, frigorifer) dhe frekuenca (një herë, javore, mujore). Shfaq çmimin ndërsa ndryshojnë opsionet, me një detaj. Çmimet: [ngjit listën tënde të çmimeve]. Shto një buton që dërgon kërkesën e ofertës tek unë me email.

Prompt-e planifikimi

Përdor këto përpara një veçorie të madhe, ose kur nuk je i sigurt si ta përshkruash diçka.

7. Planifiko para se të ndërtosh

Përpara se të shkruash ndonjë kod, përshkruaj me fjalë të thjeshta ekranet që do të ndërtosh, të dhënat që do të ruash dhe çdo vendim që të duhet nga unë. Prit miratimin tim.

8. Kthe një ide të përzier në një version të parë

Ja ideja ime: [ngjit shënimet]. Sugjero versionin më të vogël të parë që është akoma i dobishëm, në 5–8 pika. Listo çfarë do të lije për më vonë dhe pse.

9. Pyet çfarë mungon

Çfarë pyetjesh do t'i bënte një zhvillues përpara se ta ndërtonte këtë? Më pyet një nga një, pastaj përmblidh përgjigjet e mia në një specifikim të shkurtër.

10. Kontrollo një ndryshim të madh më parë

Dua të shtoj [llogari ekipi ku disa persona ndajnë një hapësirë pune]. Shpjego çfarë duhet të ndryshojë në të dhënat, ekranet dhe lejet, dhe çfarë mund të prishet. Mos ndrysho asgjë akoma.

Prompt-e dizajni

11. Vendos një stil të qartë

Ri-stilo aplikacionin: sfond off-white të ngrohtë, tekst të errët, një ngjyrë theksi [#1F6F50], cepa të rrumbullakosur, hapësirë bujare dhe një font sans-serif modern. Mbaj paraqitjen dhe çdo veçori saktësisht ashtu si janë.

12. Kopjo ndjesinë e një reference

Bëje dashboard-in të ndihet si një aplikacion financiar i qetë: shumë hapësirë e bardhë, numra të mëdhenj e të theksuar, etiketa të vogla gri, një grafik të thjeshtë lart. Mos kopjo logon ose tekstin e asnjë marke.

13. Rregullo paraqitjen për telefon

Në një telefon 375px gjerësi, tabela në [faqen e Porosive] lëviz anash dhe butonat mbivendosen. Shndërro çdo rresht në një kartë të stivosur në ekrane të vegjël. Mos e ndrysho paraqitjen për desktop.

14. Gjendjet bosh, ngarkimi dhe gabimi

Shto gjendje të përshtatshme për [listën e Projekteve]: një gjendje e zbrazët miqësore me një buton për të shtuar projektin e parë, një skelet ngarkimi ndërsa merren të dhënat, dhe një mesazh i qartë me buton ri-provimi nëse ngarkimi dështon.

15. Mbështetje nga e djathta në të majtë

Shto një version arabisht të ndërfaqes me paraqitje të plotë nga e djathta në të majtë. Ikonat që tregojnë një drejtim duhet të kthehen; numrat dhe datat duhet të përdorin formatin e gjuhës. Mbaj anglishten si parazgjedhje.

Prompt-e për të dhënat dhe veçoritë

16. Bëji të dhënat të qëndrueshme

Tani të dhënat e mia zhduken kur rifreskoj. Ruaji në një bazë të vërtetë të dhënash në vend të kësaj, dhe mbaj ekranet aktuale të punojnë njësoj.

17. Shto hyrje

Shto regjistrim dhe hyrje me email dhe fjalëkalim. Çdo përdorues duhet të shohë dhe redaktojë vetëm [hyrjet] e tij. Shfaq email-in e përdoruesit në shiritin e sipërm me një buton daljeje.

18. Shto role

Shto dy role: administrator dhe anëtar. Administratorët mund të shtojnë, redaktojnë dhe fshijnë [produktet]; anëtarët mund vetëm t'i shohin. Zbatoje këtë në server, jo vetëm duke fshehur butonat.

19. Shto kërkim dhe filtra

Shto një kuti kërkimi mbi [listën e kontakteve] që përputhet me emrin, kompaninë ose email-in ndërsa shkruaj, plus një filtër për [statusin]. Mbaj renditjen aktuale.

20. Shto ngarkim skedarësh

Lejo përdoruesit të bashkëngjisnë deri në [5] imazhe për çdo [shpallje], maksimumi [5 MB] secili. Shfaq miniatura te shpallja dhe një pamje më të madhe me klikim. Vetëm pronari mund të fshijë imazhet e tij.

21. Importo nga një spreadsheet

Shto një buton Import që merr një CSV me kolonat [emri, email, telefoni, shënimet], shfaq një pamje paraprake të 10 rreshtave të parë dhe më lë ta konfirmoj para ruajtjes. Kalo rreshtat pa email dhe më trego sa u kaluan.

Prompt-e gabimesh

22. Raporto qartë një gabim

Kur [klikoj Ruaj në formularin e redaktimit], shfaqet „[teksti i saktë i gabimit]“ dhe ndryshimi nuk ruhet. Pritet: ndryshimi ruhet dhe kthehem te lista. Gjej shkakun, shpjegoje në një ose dy fjali, pastaj rregulloje.

23. Ndalo një cikël rregullimesh

Kemi provuar ta rregullojmë këtë tre herë dhe akoma dështon. Ndalo së ndryshuari kodin. Listo tre shkaqet më të mundshme, si ta kontrollojmë secilin dhe cilin mendon se është.

24. Zhbëj efektet anësore

Ndryshimi yt i fundit rregulloi zgjedhësin e datës, por [shiriti anësor] u zhduk. Kthe shiritin anësor saktësisht si ishte dhe mbaj rregullimin e zgjedhësit të datës.

25. Shpjego përpara se të ndryshosh

Shpjego hap pas hapi si llogaritet tani [totali i arkëtimit], duke treguar skedarët përkatës. Mos ndrysho asgjë.

Prompt-e testimi dhe rishikimi

26. Rastet kufi

Listo 10 mënyra me të cilat një përdorues real mund ta prishë [formularin e rezervimit]: fusha bosh, tekst shumë i gjatë, klikime të dyfishta, dy persona njëkohësisht, zona kohore të gabuara. Testo secilën dhe rregulloj çfarë dështon. Raporto çfarë ndryshove.

27. Përmblidh ndryshimet e fundit

Përmblidh çdo ndryshim që bëre në [pesë] hapat e fundit me fjalë të thjeshta, dhe shëno çdo gjë që mund të ndikojë te të dhënat ekzistuese.

Prompt-e sigurie

Çiftoji këto me faqen tonë për nëse vibe coding është i sigurt.

28. Kontrollo qasjen te të dhënat

Kontrollo kodin e serverit: mund të lexojë ose të ndryshojë një përdorues i hyrë të dhënat e një përdoruesi tjetër [regjistrimet] duke ndryshuar një ID në një kërkesë? Më trego ku kontrollohet qasja dhe rregullo çdo boshllëk.

29. Kontrollo për sekrete të ekspozuara

Listo çdo çelës API, fjalëkalim ose token që përdor ky aplikacion dhe ku ruhet secili. Sigurohu që asnjë nuk ndodhet në kod që ekzekutohet në shfletues ose i commit-uar në skedarë. Zhvendosi te sekretet nëse janë.

Prompt-e publikimi

30. Kontroll para lansimit

Jam gati ta publikoj këtë për përdorues real. Kalo nëpër të si rishikues: lidhje të prishura, titujt dhe përshkrimet e faqeve që mungojnë, formularë pa validim, faqe të ngadalta, gabime në konsolë dhe çdo gjë që duket e papërfunduar në telefon. Më jep një listë të renditur sipas rëndësisë, pastaj rregullo pesë të parat.

Prompt-e që duhet të shmangësh

Disa prompt-e prodhojnë rezultate më të këqija në mënyrë të besueshme:

• „Bëje më mirë.“ Më mirë si? Emëro ekranin dhe ndryshimin.
• „Rregulloj gjithçka.“ AI-ja do të ndryshojë shumë gjëra dhe nuk do ta dish çfarë u lëviz.
• „Përdor [bibliotekë] dhe [framework] dhe [model].“ Nëse nuk ke arsye, përshkruaj sjelljen dhe lëre mjetin të zgjedhë stack-un.
• „Ja çelësi im API: …“ Kurrë mos ngjit sekrete në një chat. Përdor cilësimet e sekreteve të mjetit.
• Dhjetë veçori në një mesazh. Ndaji.

Ta bësh prompt-in zakon

Pas disa projektesh do të kesh versionet e tua të këtyre. Mbaji në një shënim dhe ripërdor ata që funksionojnë. Mythex gjithashtu kujton kush je dhe si punon nëpër projekte, kështu që preferencat që përsërit, si stili ose stack-u yt i zakonshëm, kalojnë pa të rishkruar.

Nëse ngec te prompt-i i parë, gjeneratori falas i prompt-eve për aplikacione e kthen një ide në një rresht në një prompt fillestar më të plotë. Dhe për të parë çfarë prodhojnë këto prompt-e në praktikë, lexo shembujt e vibe coding, ose ngjit prompt-in 1 në ndërtuesin e aplikacioneve me AI dhe ndrysho kllapat me idenë tënde.

Pyetje