Vibe coding తో యాప్ ఎలా తయారు చేయాలి: ఆలోచన నుండి ప్రచురించిన యాప్ వరకు

Vibe coding తో యాప్ తయారు చేయాలంటే, మొదటి వెర్షన్ గురించి ఒక పేజీ వివరణ రాయండి, దాన్ని మీ మొదటి ప్రాంప్ట్‌గా AI యాప్ బిల్డర్‌కు ఇవ్వండి, ఆపై యాప్‌ను చిన్న పరీక్షించిన దశల్లో పెంచండి: డేటా, లాగిన్, ప్రధాన వర్క్‌ఫ్లో, మెరుగులు, భద్రతా పరిశీలన, చివరగా ప్రచురణ. ఈ గైడ్ ఒక ఉదాహరణ ప్రాజెక్ట్‌ను అనుసరిస్తుంది: ఒక చిన్న యోగా స్టూడియో కోసం క్లాస్ బుకింగ్ యాప్, ప్రతి దశలో వాడిన ప్రాంప్ట్‌లతో.

మీరు ఇంతకు ముందు ఇలా ఏదీ నిర్మించకపోతే, మా బిగినర్స్ కోసం vibe coding ట్యుటోరియల్ చిన్నదిగా ప్రారంభిస్తుంది. vibe coding కు మాత్రమే పరిమితం కాని విస్తృత అవలోకనం కోసం, AIతో యాప్ ఎలా తయారు చేయాలి చూడండి.

ప్రాజెక్ట్

సారా అనే యోగా స్టూడియో యజమానిని ఊహించుకోండి, ఆమె వారానికి ఎనిమిది క్లాసులు నడుపుతుంది. బుకింగ్‌లు WhatsApp ద్వారా వస్తాయి; ఆమె ప్రతి క్లాస్‌కు కాగితం జాబితా ఉంచుతుంది, తరచూ ఓవర్‌బుక్ అవుతుంది. ఆమెకు కావాలి:

• విద్యార్థులు వారపు టైమ్‌టేబుల్ చూసి, ఒక స్థానం బుక్ చేసుకోవడం.
• ప్రతి క్లాస్‌కు కెపాసిటీ ఉండటం.
• ప్రతి క్లాస్‌కు ఒక జాబితా, దానిని ఆమె తలుపు వద్ద తనిఖీ చేయగలగాలి.
• రెండు గంటల ముందు వరకు విద్యార్థులు రద్దు చేసుకోవడం.

ఇదే మొత్తం మొదటి వెర్షన్. పేమెంట్లు లేవు, మెంబర్‌షిప్‌లు లేవు, యాప్ స్టోర్ లేదు. అవి తర్వాత వస్తాయి, లేదా ఎప్పటికీ రావు.

దశ 1: ఒక పేజీ స్పెక్ రాయండి

ఏ టూల్ తెరవడానికి ముందు, మొదటి వెర్షన్‌ను సాదా మాటల్లో రాయండి. ఇక్కడ పది నిమిషాలు ఆదా చేస్తాయి గంటల తరబడి ముందూ వెనుకా సంభాషణలను. ఉపయోగకరమైన రూపం:

• ఎవరు వాడతారు: విద్యార్థులు (బుక్ చేయడం, రద్దు చేయడం), సారా (క్లాసులు నిర్వహించడం, జాబితాలు చూడటం).
• స్క్రీన్లు: టైమ్‌టేబుల్, క్లాస్ వివరాలు, నా బుకింగ్‌లు, అడ్మిన్ క్లాసులు, అడ్మిన్ క్లాస్ జాబితా.
• డేటా: క్లాసులు (పేరు, టీచర్, ప్రారంభ సమయం, వ్యవధి, కెపాసిటీ), బుకింగ్‌లు (విద్యార్థి, క్లాస్, స్థితి), విద్యార్థులు (పేరు, ఈమెయిల్, ఫోన్).
• నియమాలు: నిండిన క్లాస్ బుక్ చేయకూడదు; ప్రతి విద్యార్థికి ఒక క్లాస్‌కు ఒక బుకింగ్; క్లాస్‌కు రెండు గంటల ముందు వరకు రద్దు; అడ్మిన్ పేజీలు సారాకు మాత్రమే.
• v1లో లేనివి: చెల్లింపులు, క్లాస్ ప్యాక్‌లు, వెయిట్‌లిస్ట్‌లు, రిమైండర్లు.

“v1లో లేనివి” జాబితా అన్నిటికంటే ముఖ్యం. నిర్మాణం పూర్తి చేయగలిగేలా ఉంచేది అదే. మరింత పూర్తి స్పెక్ కావాలంటే, AIతో ప్రొడక్ట్ అవసరాల డాక్యుమెంట్ రాయడం గైడ్ మరింత వివరిస్తుంది.

దశ 2: మొత్తం లూప్‌ను నిర్వహించే టూల్‌ను ఎంచుకోండి

డేటాబేస్, లాగిన్‌లు, పబ్లిక్ URL ఉన్న యాప్ కోసం, ఫైళ్లు ఇచ్చే చాట్ అసిస్టెంట్ కాకుండా, కోడ్‌ను నడిపి, డేటాబేస్ జోడించి, ప్రచురించే AI యాప్ బిల్డర్‌ను వాడండి. ఎంపికల కోసం మా vibe coding టూల్స్ పోలిక చూడండి. ఇక్కడ మేము Mythex ను వాడతాము, ఎందుకంటే ప్రతి దశను ఒకే చోట కవర్ చేస్తుంది: చాట్, లైవ్ ప్రివ్యూ, నిజమైన డేటాబేస్ మరియు ఫైల్ స్టోరేజ్, ఒక్క క్లిక్‌లో ప్రచురణ.

దశ 3: మొదటి ప్రాంప్ట్

స్పెక్‌ను ఒక పేరాగా మార్చండి. ప్రతి వివరాన్నీ ఒకేసారి అతికించకండి; కోర్‌ను ఇచ్చి, మిగతావి దశల్లో జోడించండి.

“నా యోగా స్టూడియో కోసం ఒక క్లాస్ బుకింగ్ యాప్ నిర్మించండి. విద్యార్థులు పేరు, ఈమెయిల్, ఫోన్‌తో సైన్ అప్ అవుతారు, ఈ వారపు టైమ్‌టేబుల్ చూసి ఒక క్లాస్‌లో స్థానం బుక్ చేసుకుంటారు. ప్రతి క్లాస్‌కు పేరు, టీచర్, ప్రారంభ సమయం, వ్యవధి, కెపాసిటీ ఉంటాయి; నిండిన క్లాస్ “Full” అని చూపి బుక్ కాకూడదు. విద్యార్థులు తమ బుకింగ్‌లు చూసి, క్లాస్‌కు రెండు గంటల ముందు వరకు రద్దు చేసుకోవచ్చు. నేను అడ్మిన్: క్లాసులు జోడించి, సవరించి, ప్రతి క్లాస్‌కు ఎవరు బుక్ చేశారో జాబితా చూడగలను. ప్రశాంతమైన, సరళమైన డిజైన్ ఫోన్‌లలో బాగా పనిచేయాలి.”

బిల్డర్ సరిగ్గా అర్థం చేసుకుందో లేదో తెలియకపోతే, ముందుగా ప్లాన్ అడగండి. Mythex లో, Plan మోడ్ కోడ్ రాయడానికి ముందు స్క్రీన్లు, డేటాను వివరిస్తుంది, మీరు ఆమోదిస్తారు.

దశ 4: ప్రధాన లూప్ పని చేయించండి

ప్రధాన లూప్ అంటే యాప్ ఉనికికే కారణమైన పని: విద్యార్థి క్లాస్ బుక్ చేస్తాడు, సారా దాన్ని చూస్తుంది. దానిని మాత్రమే పరీక్షించండి:

1. విద్యార్థిగా సైన్ అప్ అయి ఒక క్లాస్ బుక్ చేయండి.
2. అడ్మిన్ వ్యూ తెరవండి. బుకింగ్ అక్కడ ఉందా?
3. అదే క్లాస్‌ను మళ్లీ బుక్ చేయండి. అది నిరాకరించాలి.
4. ఒక క్లాస్ కెపాసిటీని 2కి సెట్ చేసి, రెండు విద్యార్థి ఖాతాల నుండి బుక్ చేయండి, మూడోది ప్రయత్నించండి.

ఈ సమయంలో సాధారణంగా రెండు సమస్యలు కనిపిస్తాయి. టైమ్‌టేబుల్ సమయాలను స్టూడియో టైమ్ జోన్‌లో కాకుండా సర్వర్ టైమ్ జోన్‌లో చూపుతుంది. “Full” తనిఖీ పేజీలో మాత్రమే జరుగుతుంది, కాబట్టి వేగంగా రెండుసార్లు క్లిక్ చేస్తే రెండు బుకింగ్‌లు సృష్టించబడతాయి.

ప్రతి క్లాస్ సమయాన్ని స్టూడియో టైమ్ జోన్‌లో, [Asia/Dubai], చూపండి; సందర్శకుడి పరికరంలో ఏ సమయం సెట్ అయి ఉన్నా సరే.

బుకింగ్ సృష్టించేటప్పుడు కెపాసిటీ, డూప్లికేట్ బుకింగ్‌లను సర్వర్‌లో తనిఖీ చేయండి, కేవలం పేజీలో కాదు. చివరి స్థానం కోసం రెండు అభ్యర్థనలు ఒకేసారి వస్తే, ఒక్కటే విజయవంతం కావాలి.

ఏదైనా జోడించే ముందు ప్రధాన లూప్‌ను సరిచేయండి. మిగతావన్నీ దానిపై ఆధారపడతాయి.

దశ 5: మిగిలిన నియమాలను, ఒక్కో సందేశంలో ఒక్కటి చొప్పున జోడించండి

ఇప్పుడు స్పెక్‌లోని నియమాలను ఒకదాని తర్వాత ఒకటి చూడండి:

విద్యార్థులు క్లాస్ ప్రారంభానికి రెండు గంటల ముందు వరకు బుకింగ్ రద్దు చేసుకోవచ్చు. ఆ తర్వాత రద్దు బటన్ దాచండి, సర్వర్‌లో కూడా స్పష్టమైన సందేశంతో రద్దును నిరాకరించండి.

అడ్మిన్ పేజీలు నా ఖాతా మాత్రమే తెరవగలగాలి. ప్రతి అడ్మిన్ చర్యను కేవలం మెనూ దాచడం ద్వారా కాకుండా సర్వర్‌లోనే తనిఖీ చేయాలి.

ప్రతిదాని తర్వాత, పరీక్షించి, పని చేస్తేనే తదుపరిదానికి వెళ్లండి. ఒక మార్పు ఏదైనా విరగగొడితే, చివరి మంచి చెక్‌పాయింట్‌కు తిరిగి వెళ్లి, పైన మరిన్ని సరిదిద్దలు పేర్చే బదులు స్పష్టమైన అభ్యర్థనతో మళ్లీ ప్రయత్నించండి.

దశ 6: నిజమైన వినియోగదారులు గమనించే వాటిని మెరుగుపరచండి

నిజమైన వినియోగదారులు చిన్న విషయాలనూ గమనిస్తారు. సారా యాప్ కోసం ఒక చిన్న జాబితా:

• ఖాళీ స్థితులు: ఖాళీ పేజీకి బదులుగా “ఈ వారం ఇంకా క్లాసులు లేవు”.
• నిర్ధారణ: బుక్ చేసిన తర్వాత “మీరు Vinyasa కోసం బుక్ అయ్యారు, మంగళవారం 18:00”.
• ఫోన్ లేఅవుట్: పెద్ద బటన్లు, 375px తెరపై చదవగలిగే టైమ్‌టేబుల్.
• మిగిలిన స్థానాలు: ప్రతి క్లాస్ కార్డ్‌పై “3 spots left”, విద్యార్థులు త్వరగా బుక్ చేసేలా.

ప్రతి క్లాస్ కార్డ్‌పై మిగిలిన స్థానాలు చూపండి, ఉదా. “12లో 3 మిగిలాయి”. బుక్ చేసిన తర్వాత, క్లాస్ పేరు, రోజు, సమయంతో నిర్ధారణ చూపి, నా బుకింగ్‌లకు బటన్ ఇవ్వండి.

దశ 7: ఒక అపరిచితుడిలా పరీక్షించండి

ఎవరైనా ఉపయోగించే ముందు, యాప్‌ను విరగొట్టడానికి అరగంట ప్రయత్నించండి:

అంచు కేసులను ఒకసారి నడపమని AIని కూడా అడగవచ్చు:

నిజమైన విద్యార్థి బుకింగ్ లేదా రద్దును విరగొట్టగల పది పనులను జాబితా చేయండి, ప్రతిదాన్ని పరీక్షించి, విఫలమైన వాటిని సరిచేయండి. ఏం మార్చారో చెప్పండి.

దశ 8: భద్రతా పరిశీలన

ఈ యాప్ పేర్లు, ఈమెయిళ్లు, ఫోన్ నంబర్లు నిల్వ చేస్తుంది కాబట్టి, చిన్న భద్రతా పరిశీలన విలువైనది. ప్రధాన ప్రశ్నలు:

• ఒక విద్యార్థి మరొకరి బుకింగ్‌లు లేదా సంప్రదింపు వివరాలు చూడగలడా?
• ఏ కీలు లేదా పాస్‌వర్డ్‌లు బ్రౌజర్‌లో నడిచే కోడ్‌లో ఉన్నాయా?
• సైన్-అప్ ఫారం బాట్‌ల నుండి రక్షించబడిందా?
• డేటాకు బ్యాకప్ ఉందా?

vibe coding సురక్షితమేనా పేజీ ప్రతి తనిఖీని వివరిస్తుంది, వాటికి ప్రాంప్ట్‌లు ఇస్తుంది. AI-నిర్మిత యాప్‌ల కోసం భద్రతా చెక్‌లిస్ట్ పూర్తి వెర్షన్.

దశ 9: ప్రచురించండి

ప్రధాన లూప్, నియమాలు, తనిఖీలు పాసైన తర్వాత ప్రచురించండి. Mythex లో అది ఒక్క క్లిక్; యాప్‌కు డేటాబేస్, హోస్టింగ్‌తో పబ్లిక్ URL వస్తుంది. Pro లో మీ స్వంత డొమైన్ కనెక్ట్ చేయవచ్చు, ఉదా. book.sarasyoga.com; కస్టమ్ డొమైన్ ఎలా కనెక్ట్ చేయాలి చూడండి.

లింక్ పంపే ముందు, ప్రచురించిన వెర్షన్‌ను మరోసారి తనిఖీ చేయండి. మీ ఫోన్ నుండి ఒక క్లాస్ బుక్ చేయండి. ప్రొడక్షన్, ప్రివ్యూ ఒకేలా ప్రవర్తించాలి, అయినా ఒకసారి నిర్ధారించుకోండి.

దశ 10: మొదటి వినియోగదారులు మరియు తదుపరి వెర్షన్

లింక్‌ను మొదట ఐదుగురు రెగ్యులర్ విద్యార్థులకు ఇవ్వండి, అందరికీ కాదు. వారి తదుపరి క్లాస్‌ను దాని ద్వారా బుక్ చేయమని అడగండి, ఏది గందరగోళంగా అనిపించిందో చెప్పమని అడగండి. ఆ తర్వాత వారు చెప్పిన టాప్ మూడు విషయాలను సరిచేయండి.

కొన్ని వారాల నిజమైన వినియోగం తర్వాత, ఇలాంటి యాప్ కోసం v2 జాబితా దాదాపు తనంతట తానే రాసుకుంటుంది: నిండిన క్లాసులకు వెయిట్‌లిస్ట్, ముందు సాయంత్రం ఈమెయిల్ రిమైండర్లు, ఆన్‌లైన్‌లో చెల్లించే క్లాస్ ప్యాక్‌లు. ప్రతిదానికీ అదే విధానం: కొన్ని లైన్లలో స్పెక్ రాయండి, ప్రాంప్ట్ ఇవ్వండి, పరీక్షించండి, ప్రచురించండి. చెల్లింపులు జోడించడానికి, మీ యాప్‌కు చెల్లింపులు ఎలా జోడించాలి చూడండి. మాట వ్యాప్తి చేయడానికి, యాప్‌ను ఎలా లాంచ్ చేసి మొదటి వినియోగదారులను ఎలా పొందాలి.

దీన్ని ఫోన్ యాప్‌గా మార్చడం

చాలా స్టూడియోలు విద్యార్థుల ఫోన్లలో ఐకాన్ కావాలనుకుంటాయి. Mythex Pro లో, ప్రచురించిన యాప్‌ను Android యాప్‌గా (Google Playకి అప్‌లోడ్ చేయగల ఫైల్) మరియు మీ స్వంత App Store Connect కీతో TestFlightకు పంపిన iPhone యాప్‌గా మార్చవచ్చు, Mac లేకుండానే. ఫోన్ యాప్ ప్రచురించిన వెబ్ యాప్‌ను తెరుస్తుంది, కాబట్టి మీరు ప్రతి అప్‌డేట్ ప్రచురించినప్పుడు ఫోన్ యాప్‌కూ అది అందుతుంది.

ఇక్కడ నుండి తీసుకోవాల్సినవి

నిర్మాణం నిజానికి చిన్న భాగం. యాప్‌ను ఉపయోగయోగ్యం చేసినది స్పెక్‌లోని “v1లో లేనివి” జాబితా, ప్రధాన లూప్‌ను ముందుగా పరీక్షించడం, కెపాసిటీ, యాక్సెస్ కోసం సర్వర్ వైపు నియమాలు, యాభై మంది కంటే ముందు ఐదుగురు నిజమైన వినియోగదారులు. ఇతరులకు పని చేయాల్సిన యాప్ ఉన్నప్పుడు vibe coding ఎలా ఉంటుందో అదే.

మీదే ప్రయత్నించడానికి సిద్ధమా? మీ ఒక పేజీ స్పెక్ రాసి, మొదటి పేరాను AI యాప్ బిల్డర్లో అతికించండి. మరిన్ని యాప్ రకాలు, వాటి వెనుక ప్రాంప్ట్‌లు చూడాలంటే, మా vibe coding ఉదాహరణలు చదవండి.

ప్రశ్నలు