30 промпти за vibe coding што можете да ги копирате (листа)

Најдобрите промпти за vibe coding се кратки, конкретни и се однесуваат на однесувањето: кој ја користи апликацијата, што може да направи, што чува и како изгледа. Подолу се 30 промпти што можете да ги копирате и залепите, групирани според фазата во која сте, од првото градење до објавувањето. Заменете ги деловите во [загради] со ваши детали.

Тие работат во кој било AI градител на апликации или агент за кодирање. Ако сакате образложението зад нив, нашиот подолг водич за како да пишувате промпти за AI градители на апликации ги објаснува начелата. Оваа страница е листата.

Како да ја користите листата

• Започнете со еден промпт за прво градење, па користете ги останатите по една во исто време.
• Тестирајте после секој промпт. Прокликнете ја промената пред да испратите следна.
• Задржете го она што функционира. Повеќето промпти за дополнување тука завршуваат со „сè друго остави исто“ од причина.
• Залепете го точниот текст. Пораките за грешки, натписите на копчињата и зборовите на екранот ги надминуваат описите секогаш.

Промпти за прво градење

Овие ја поставуваат формата на апликацијата. Секој именува корисници, дејства, податоци и изглед.

1. Едноставна следилка

Изгради ми следилка за [навика]. Можам да додадам [навика] со име и боја, да ја штиклирам еднаш дневно и да гледам мрежа од 30 дена и моја моментална серија. Зачувај сè да остане по освежување. Чист, минимален дизајн што работи на телефон.

2. Страница за резервации за мал бизнис

Изгради страница за резервации за мојот [фризерски салон]. Клиентите избираат услуга ([подстрижување 30 мин, боење 90 мин]), датум и слободен термин помеѓу [9:00 и 18:00], па внесуваат име, телефон и е-пошта. Двајца не можат да резервираат ист термин. Ми треба приватна админ страница, зад најава, што ги наведува претстојните резервации по ден.

3. Внатрешна алатка

Изгради внатрешна алатка за мојот тим за следење на [позајмување опрема]. Секој предмет има име, код и статус (достапен, позајмен, расипан). Персоналот се најавува, може да земе предмет на свое име и да го врати. Прикажи табела со филтри по статус и историја за тоа кој го имал секој предмет.

4. Целна страница со листа на чекање

Изгради едностраничен сајт за [мојот производ: апликација за планирање оброци за зафатени родители]. Херој со наслов, еднореченичен поднаслов и пријава со е-пошта. Потоа три предности, краток дел „како функционира“ и ЧПП. Зачувај ги е-поштите од пријавите во база и прикажи ми ја листата на приватна админ страница.

5. Клиентски портал

Изгради клиентски портал за мојот [дизајнерски студио]. Секој клиент се најавува и ги гледа само своите проекти, со статус, датотеки што јас ги качив и коментари. Јас се најавувам како админ и ги гледам сите клиенти. Клиентите никогаш не смеат да ги видат податоците на другите.

6. Калкулатор или алатка за понуди

Изгради калкулатор на понуди за мојот [бизнис за чистење]. Влезови: број на спални, бањи, дополнителни услуги (рерна, прозорци, фрижидер) и учестаност (еднократно, неделно, месечно). Прикажи ја цената додека се менуваат опциите, со разложување. Цени: [залепете го вашиот ценовник]. Додај копче за испраќање на барањето за понуда до мене по е-пошта.

Промпти за планирање

Користете ги пред голема функција или кога не сте сигурни како да опишете нешто.

7. Планирајте пред градење

Пред да напишеш каков било код, опиши со обични зборови кои екрани ќе ги изградиш, какви податоци ќе чуваш и какви одлуки ти требаат од мене. Почекај на мое одобрување.

8. Претворете неуредна идеја во прва верзија

Еве ја мојата идеја: [залепете белешки]. Предложи го најмалиот прв развој што е сè уште корисен, во 5 до 8 точки. Наведи што би оставил за подоцна и зошто.

9. Прашајте што недостасува

Кои прашања би ми ги поставил програмер пред да го изградиш ова? Прашај ги едно по едно, па сумирај ги моите одговори во краток спецификација.

10. Проверете прво голема промена

Сакам да додадам [сметки за тим каде неколку луѓе делат еден работен простор]. Објасни што мора да се промени во податоците, екраните и дозволите и што може да се расипе. Не менувај ништо уште.

Промпти за дизајн

11. Поставете јасен стил

Преправи ја апликацијата: топла бела позадина, темен текст, една акцентна боја [#1F6F50], заоблени агли, широк простор и модерен sans-serif фонт. Задржи го распоредот и секоја функција точно како што се.

12. Копирајте го чувството на референца

Нека таблата изгледа како смирена финансиска апликација: многу бел простор, броевите големи и задебелени, етикетите мали и сиви, еден едноставен дијаграм на врвот. Не копирај ничие лого или текст од некој бренд.

13. Поправете го распоредот на телефон

На телефон широк 375 пиксели, табелата на [страницата со нарачки] се лизга настрана и копчињата се преклопуваат. Претвори секој ред во наредена картичка на мали екрани. Не менувај го распоредот на десктоп.

14. Празни, вчитувачки и состојби на грешка

Додај соодветни состојби на [списокот на проекти]: пријателска празна состојба со копче за додавање на првиот проект, скелет за вчитување додека се вчитуваат податоци и јасна порака со копче за обид повторно ако вчитувањето не успее.

15. Поддршка за десно-кон-лево

Додај арапска верзија на интерфејсот со целосен распоред десно-кон-лево. Иконите што покажуваат насока треба да се превртат; броевите и датумите треба да користат формат на локалот. Задржи го англискиот како стандарден.

Промпти за податоци и функции

16. Направете ги податоците трајни

Сега податоците ми исчезнуваат кога ќе освежам. Наместо тоа чувај ги во вистинска база на податоци и нека тековните екрани работат исто како досега.

17. Додајте најава

Додај регистрација и најава со е-пошта и лозинка. Секој корисник да ги гледа и уредува само своите [записи]. Прикажи ја е-поштата на корисникот во горниот бар со копче за одјава.

18. Додајте улоги

Додај две улоги: админ и член. Администраторите можат да додаваат, уредуваат и бришат [производи]; членовите можат само да ги гледаат. Спроведи го ова на серверот, не само со скривање копчиња.

19. Додајте пребарување и филтри

Додај поле за пребарување над [списокот со контакти] што се совпаѓа со име, компанија или е-пошта додека пишувам, плус филтер за [статус]. Задржи го тековниот редослед на подредување.

20. Додајте качување датотеки

Дозволи корисниците да прикачат до [5] слики на секој [оглас], најмногу [5 MB] секоја. Прикажи минијатури на огласот и поголем приказ по клик. Само сопственикот може да брише свои слики.

21. Увоз од табела

Додај копче Import што прима CSV со колони [име, е-пошта, телефон, белешки], прикажува преглед на првите 10 редови и дозволува да потврдам пред зачувување. Прескокни редови без е-пошта и кажи ми колку се прескокнати.

Промпти за поправки

22. Јасно пријавете грешка

Кога [кликнувам Зачувај на формата за уредување], се појавува „[точниот текст на грешката]“ и промената не се зачувува. Очекувано: промената се зачувува и се враќам на списокот. Најди ја причината, објасни ја во една или две реченици, па поправи ја.

23. Запрете јамка од поправки

Обидовме да ова поправиме три пати и уште не функционира. Престани да менуваш код. Наведи ги трите најверојатни причини, како да се провери секоја и која мислиш дека е.

24. Поништете странични ефекти

Твојата последна промена го поправи избирачот на датум, но [страничната лента] исчезна. Врати ја страничната лента точно како што беше и задржи ја поправката на избирачот.

25. Објаснете пред да менувате

Објасни како [збирот на касата] се пресметува сега, чекор по чекор, упатувајќи на вклучените датотеки. Не менувај ништо.

Промпти за тестирање и преглед

26. Гранични случаи

Наведи 10 начини на кои вистински корисник би можел да ја скрши [формата за резервации]: празни полиња, многу долг текст, двоен клик, двајца истовремено, погрешни часовни зони. Тестирај секој и поправи што паѓа. Пријави што си променил.

27. Сумирајте ги последните промени

Сумирај ги сите промени што си ги направил во последните [пет] чекори со едноставни зборови и означи што може да влијае на постоечките податоци.

Промпти за безбедност

Спарете ги со нашата страница за дали vibe coding е безбедно.

28. Проверете го пристапот до податоците

Провери го серверскиот код: може ли најавен корисник да чита или менува [записи] на друг корисник со менување на ID во барање? Покажи ми каде се проверува пристапот и поправи ги празнините.

29. Проверете за изложени тајни

Наведи секој API клуч, лозинка или токен што ја користи апликацијата и каде е чуван секој. Осигурај се дека ниту еден не е во код што работи во прелистувачот или ставен во датотеки во репозиториум. Префрли ги во тајни ако се.

Промпти за објавување

30. Преглед пред лансирање

Ќе ја објавам оваа апликација за вистински корисници. Помини низ неа како рецензент: расипани линкови, недостасувачки наслови и описи на страниците, форми без проверка, бавни страници, грешки во конзолата и сè што изгледа недовршено на телефон. Дај ми листа подредена по важност, па поправи ги првите пет.

Промпти што треба да се избегнуваат

Некои промпти постојано даваат полоши резултати:

• „Направи го подобро.“ Подобро како? Именувајте го екранот и промената.
• „Поправи сè.“ AI-от ќе промени многу и нема да знаете што се поместило.
• „Користи [библиотека] и [рамка] и [шема].“ Освен ако немате причина, опишете го однесувањето и нека алатката го избере стекот.
• „Еве го мојот API клуч: …“ Никогаш не лепете тајни во разговор. Користете ги поставките за тајни на алатката.
• Десет функции во една порака. Поделете ги.

Да го направите промптот навика

По неколку проекти ќе имате свои верзии од овие. Чувајте ги во белешка и користете повторно оние што функционираат. Mythex исто така памети кој сте и како работите низ проектите, па преференциите што ги повторувате, како вашиот вообичаен стил или стек, се пренесуваат без повторно пишување.

Ако сте заглавени на прв промпт, бесплатниот генератор на промпти за апликации ја претвора една реченица идеја во поцелосен почетен промпт. А за да видите што тие промпти прават во пракса, прочитајте ги нашите примери за vibe coding, или залепете го промптот 1 во AI градителот на апликации и променете ги заградите во своја идеја.

Прашања