વાઇબ કોડિંગ વડે એપ કેવી રીતે બનાવવી: આઇડિયાથી પબ્લિશ થયેલી એપ સુધી

વાઇબ કોડિંગ વડે એપ બનાવવા માટે, પહેલા સંસ્કરણનું એક પેજનું વર્ણન લખો, તેને તમારા પહેલા પ્રોમ્પ્ટ તરીકે AI એપ બિલ્ડરને આપો, પછી એપને નાનાં, ચકાસેલાં પગલાંમાં આગળ વધારો: ડેટા, લૉગિન, મુખ્ય વર્કફ્લો, પોલિશ, સુરક્ષા પાસ, અને છેલ્લે પબ્લિશ. આ માર્ગદર્શિકા એક ઉદાહરણ પ્રોજેક્ટને દરેક તબક્કે અનુસરે છે: એક નાના યોગા સ્ટુડિયો માટે ક્લાસ બુકિંગ એપ, દરેક પગલે વપરાયેલા પ્રોમ્પ્ટ સાથે.

જો તમે આ રીતે ક્યારેય કંઈ બનાવ્યું ન હોય, તો અમારું શિખાઉ માટે વાઇબ કોડિંગ ટ્યુટોરિયલ નાનાથી શરૂ થાય છે. વાઇબ કોડિંગ સાથે બંધાયેલા ન હોય તેવા વ્યાપક ઝાંખી માટે, AI વડે એપ કેવી રીતે બનાવવી જુઓ.

પ્રોજેક્ટ

કલ્પના કરો Sara નામની યોગા સ્ટુડિયો માલિકની, જે અઠવાડિયામાં આઠ ક્લાસ ચલાવે છે. બુકિંગ WhatsApp પર આવે છે; તે દરેક ક્લાસ માટે કાગળની યાદી રાખે છે અને ઘણીવાર ઓવરબુકિંગ થઈ જાય છે. તેને આ જોઈએ છે:

• વિદ્યાર્થીઓ અઠવાડિયાનું ટાઇમટેબલ જોઈ શકે અને જગ્યા બુક કરી શકે.
• દરેક ક્લાસની ક્ષમતા હોય.
• દરેક ક્લાસ માટે એક યાદી જે તે દરવાજે ચકાસી શકે.
• વિદ્યાર્થીઓ બે કલાક પહેલાં સુધી રદ કરી શકે.

બસ આટલું જ પહેલું સંસ્કરણ છે. કોઈ પેમેન્ટ નહીં, કોઈ મેમ્બરશિપ નહીં, કોઈ એપ સ્ટોર નહીં. તે પછીથી આવશે, અથવા ક્યારેય નહીં.

પગલું 1: એક પેજની સ્પેક લખો

કોઈ પણ ટૂલ ખોલતા પહેલાં, પહેલું સંસ્કરણ સાદા શબ્દોમાં લખો. અહીં દસ મિનિટ બચાવે છે કલાકોની આગળ-પાછળની વાતચીત. ઉપયોગી માળખું:

• કોણ વાપરે છે: વિદ્યાર્થીઓ (બુક અને રદ કરે), Sara (ક્લાસ સંભાળે, યાદીઓ જુએ).
• સ્ક્રીન: ટાઇમટેબલ, ક્લાસ વિગત, મારી બુકિંગ, એડમિન ક્લાસ, એડમિન ક્લાસ યાદી.
• ડેટા: ક્લાસ (નામ, શિક્ષક, શરૂઆતનો સમય, લંબાઈ, ક્ષમતા), બુકિંગ (વિદ્યાર્થી, ક્લાસ, સ્થિતિ), વિદ્યાર્થીઓ (નામ, ઇમેઇલ, ફોન).
• નિયમો: ભરેલા ક્લાસમાં બુકિંગ નહીં; એક વિદ્યાર્થી દીઠ એક ક્લાસમાં એક બુકિંગ; બે કલાક પહેલાં સુધી રદ; ફક્ત Sara એડમિન પેજ જુએ.
• v1 માં નહીં: પેમેન્ટ, ક્લાસ પેક, વેઇટલિસ્ટ, રીમાઇન્ડર.

“v1 માં નહીં” ની યાદી સૌથી વધુ મહત્ત્વની છે. તે બિલ્ડને પૂરું થઈ શકે તેવું રાખે છે. જો તમે વધુ સંપૂર્ણ સ્પેક ઇચ્છો, તો AI વડે પ્રોડક્ટ રિક્વાયરમેન્ટ્સ ડૉક લખવું વધુ આગળ જાય છે.

પગલું 2: એવું ટૂલ પસંદ કરો જે આખો લૂપ સંભાળે

ડેટાબેઝ, લૉગિન અને જાહેર URL ધરાવતી એપ માટે, એવું AI એપ બિલ્ડર વાપરો જે કોડ ચલાવે, ડેટાબેઝ જોડે અને પબ્લિશ કરે, નહીં કે એવું ચેટ આસિસ્ટન્ટ જે તમને ફાઇલો આપે. અમારી વાઇબ કોડિંગ ટૂલ્સની સરખામણી વિકલ્પો બતાવે છે. અહીં આપણે Mythex વાપરીશું, કારણ કે તે દરેક પગલું એક જ જગ્યાએ આવરી લે છે: ચેટ, લાઇવ પ્રીવ્યૂ, વાસ્તવિક ડેટાબેઝ અને ફાઇલ સ્ટોરેજ, અને એક-ક્લિક પબ્લિશિંગ.

પગલું 3: પહેલો પ્રોમ્પ્ટ

સ્પેકને એક ફકરામાં ફેરવો. બધી વિગતો સાથેનું આખું દસ્તાવેજ એકસાથે ન પેસ્ટ કરો; મુખ્ય વાત આપો અને બાકીનું પગલાંમાં ઉમેરો.

મારા યોગા સ્ટુડિયો માટે ક્લાસ બુકિંગ એપ બનાવો. વિદ્યાર્થીઓ નામ, ઇમેઇલ અને ફોન સાથે સાઇન અપ કરે, આ અઠવાડિયાનું ટાઇમટેબલ જુએ, અને ક્લાસમાં જગ્યા બુક કરે. દરેક ક્લાસનું નામ, શિક્ષક, શરૂઆતનો સમય, લંબાઈ અને ક્ષમતા હોય; ભરેલો ક્લાસ “Full” બતાવે અને તેમાં બુકિંગ ન થઈ શકે. વિદ્યાર્થીઓ પોતાની બુકિંગ જુએ અને ક્લાસ પહેલાં બે કલાક સુધી રદ કરી શકે. હું એડમિન છું: હું ક્લાસ ઉમેરી અને સુધારી શકું, અને દરેક ક્લાસ માટે કોણે બુક કર્યું છે તેની યાદી જોઈ શકું. શાંત, સરળ ડિઝાઇન જે ફોન પર સારી રીતે કામ કરે.

જો તમને ખાતરી ન હોય કે ટૂલે સમજ્યું કે નહીં, તો પહેલા પ્લાન માંગો. Mythex માં, Plan મોડ કોડ લખતા પહેલાં સ્ક્રીન અને ડેટા ગોઠવે છે, અને તમે તેને મંજૂર કરો છો.

પગલું 4: મુખ્ય લૂપ ચાલુ કરો

મુખ્ય લૂપ એ એક વસ્તુ છે જેના માટે એપ અસ્તિત્વમાં છે: વિદ્યાર્થી ક્લાસ બુક કરે, અને Sara તે જુએ. ફક્ત તે જ ચકાસો:

1. વિદ્યાર્થી તરીકે સાઇન અપ કરો, ક્લાસ બુક કરો.
2. એડમિન વ્યૂ ખોલો. શું બુકિંગ ત્યાં છે?
3. એ જ ક્લાસ ફરી બુક કરો. તે નકારવું જોઈએ.
4. ક્લાસની ક્ષમતા 2 સેટ કરો, બે વિદ્યાર્થી ખાતાઓથી બુક કરો, ત્રીજો પ્રયાસ કરો.

આ તબક્કે સામાન્ય રીતે બે સમસ્યાઓ દેખાય છે. ટાઇમટેબલ સર્વરના ટાઇમ ઝોનમાં સમય બતાવે છે, સ્ટુડિયોના નહીં. અને “Full” ચકાસણી ફક્ત પેજમાં થાય છે, એટલે ઝડપી ડબલ-ક્લિક બે બુકિંગ બનાવે છે.

બધા ક્લાસના સમય સ્ટુડિયોના ટાઇમ ઝોનમાં બતાવો, [Asia/Dubai], મુલાકાતીના ડિવાઇસમાં ગમે તે સેટિંગ હોય.

બુકિંગ બને ત્યારે ક્ષમતા અને ડુપ્લિકેટ બુકિંગ સર્વર પર ચકાસો, ફક્ત પેજમાં નહીં. જો છેલ્લી જગ્યા માટે બે વિનંતી સાથે આવે, તો ફક્ત એક જ સફળ થવી જોઈએ.

કંઈ પણ ઉમેરતા પહેલાં મુખ્ય લૂપ ઠીક કરો. બાકી બધું તેના પર આધારિત છે.

પગલું 5: બાકીના નિયમો, એક સંદેશ દીઠ એક

હવે સ્પેકના નિયમોમાંથી એક-એક કરીને પસાર થાઓ:

વિદ્યાર્થીઓ ક્લાસ શરૂ થવાના બે કલાક પહેલાં સુધી બુકિંગ રદ કરી શકે. તે પછી રદ કરવાનું બટન છુપાવો અને સર્વર પર સ્પષ્ટ સંદેશ સાથે રદ કરવાની વિનંતી નકારો.

ફક્ત મારું ખાતું એડમિન પેજ ખોલી શકે. દરેક એડમિન ક્રિયા માટે સર્વર પર ચકાસો, ફક્ત મેનુ છુપાવીને નહીં.

દરેક પછી, તેને ચકાસો, અને જ્યારે તે કામ કરે ત્યારે જ આગળ વધો. જો કોઈ ફેરફાર કંઈક તોડે, તો છેલ્લા સારા ચેકપોઇન્ટ પર રોલબેક કરો અને વધુ સ્પષ્ટ વિનંતી અજમાવો, ઉપર ફિક્સ ચડાવવાને બદલે.

પગલું 6: વાસ્તવિક યુઝર્સ જે નોંધશે તે પોલિશ કરો

વાસ્તવિક યુઝર્સ નાની બાબતો નોંધે છે. Sara ની એપ માટે ટૂંકી યાદી:

• ખાલી સ્થિતિઓ: ખાલી પેજને બદલે “આ અઠવાડિયે હજી કોઈ ક્લાસ નથી”.
• પુષ્ટિ: બુક કર્યા પછી “તમારી બુકિંગ થઈ ગઈ છે: Vinyasa, મંગળવાર 18:00”.
• ફોન લેઆઉટ: મોટા બટન, 375px સ્ક્રીન પર વાંચી શકાય એવું ટાઇમટેબલ.
• બાકી જગ્યાઓ: દરેક ક્લાસ પર “3 જગ્યાઓ બાકી”, જેથી વિદ્યાર્થીઓ વહેલા બુક કરે.

દરેક ક્લાસ કાર્ડ પર બાકી જગ્યાઓ બતાવો, દા.ત. “12 માંથી 3 બાકી”. બુક કર્યા પછી, ક્લાસનું નામ, દિવસ અને સમય સાથે પુષ્ટિ બતાવો અને મારી બુકિંગ પર જવાનું બટન.

પગલું 7: અજાણ્યાની જેમ ટેસ્ટ કરો

બીજા કોઈ તેનો ઉપયોગ કરે તે પહેલાં, તેને તોડવાનો પ્રયાસ કરવામાં અડધો કલાક ગાળો:

તમે AI ને ધારના કિસ્સાઓમાંથી પસાર થવા પણ કહી શકો:

વાસ્તવિક વિદ્યાર્થી બુકિંગ કે રદ કરવાને તોડી શકે તેવી દસ બાબતો યાદી કરો, દરેકનું પરીક્ષણ કરો અને જે નિષ્ફળ થાય તે ઠીક કરો. મેં શું બદલ્યું તે કહો.

પગલું 8: સુરક્ષા પાસ

આ એપ નામ, ઇમેઇલ અને ફોન નંબર સંગ્રહે છે, એટલે ટૂંકો સુરક્ષા પાસ યોગ્ય છે. મુખ્ય પ્રશ્નો:

• શું એક વિદ્યાર્થી બીજાની બુકિંગ કે સંપર્ક વિગતો જોઈ શકે?
• શું બ્રાઉઝરમાં ચાલતા કોડમાં કોઈ કી કે પાસવર્ડ છે?
• શું સાઇન-અપ ફોર્મ બોટ સામે સુરક્ષિત છે?
• શું ડેટાનો બેકઅપ છે?

શું વાઇબ કોડિંગ સુરક્ષિત છે પરનું અમારું પેજ દરેક ચકાસણી સમજાવે છે અને તેના માટેના પ્રોમ્પ્ટ આપે છે, અને AI વડે બનેલી એપ માટે સુરક્ષા ચેકલિસ્ટ લાંબું સંસ્કરણ છે.

પગલું 9: પબ્લિશ કરો

જ્યારે મુખ્ય લૂપ, નિયમો અને ચકાસણીઓ પાસ થાય, ત્યારે પબ્લિશ કરો. Mythex પર તે એક ક્લિક છે, અને એપને જાહેર URL મળે છે જેમાં ડેટાબેઝ અને હોસ્ટિંગ પહેલેથી ગોઠવેલા હોય છે. Pro પર તમે તમારું પોતાનું ડોમેન જોડી શકો છો, જેમ કે book.sarasyoga.com; જુઓ કસ્ટમ ડોમેન કેવી રીતે જોડવું.

લિંક મોકલતા પહેલાં, પબ્લિશ થયેલું વર્ઝન ફરી એક વાર તપાસો. તમારા ફોન પરથી ક્લાસ બુક કરો. પ્રોડક્શન અને પ્રીવ્યૂ એક સરખા વર્તવા જોઈએ, પણ તે ખાતરી કરો.

પગલું 10: પહેલા યુઝર્સ અને આગામી સંસ્કરણ

લિંક પહેલા પાંચ નિયમિત વિદ્યાર્થીઓને આપો, બધાને નહીં. તેમને તેમનો આગલો ક્લાસ તેના મારફતે બુક કરવા કહો અને શું ગૂંચવણભર્યું હતું તે જણાવવા કહો. પછી તેઓ જે ટોચની ત્રણ બાબતો કહે તે ઠીક કરો.

વાસ્તવિક ઉપયોગના થોડા અઠવાડિયા પછી, આના જેવી એપ માટે v2 ની યાદી સામાન્ય રીતે આપમેળે બની જાય છે: ભરેલા ક્લાસ માટે વેઇટલિસ્ટ, આગલી સાંજે ઇમેઇલ રીમાઇન્ડર, અને ઓનલાઇન ચૂકવેલા ક્લાસ પેક. દરેકને એ જ સારવાર મળે: થોડી લાઇનમાં સ્પેક કરો, પ્રોમ્પ્ટ કરો, ટેસ્ટ કરો, પબ્લિશ કરો. પેમેન્ટ ઉમેરવા માટે તમારી એપમાં પેમેન્ટ કેવી રીતે ઉમેરવા જુઓ. વાત ફેલાવવા માટે, એપ લૉન્ચ કરીને પહેલા યુઝર્સ કેવી રીતે મેળવવા જુઓ.

તેને ફોન એપમાં ફેરવવું

ઘણા સ્ટુડિયો ઇચ્છે છે કે વિદ્યાર્થીઓના ફોન પર આઇકન હોય. Mythex Pro પર, પબ્લિશ થયેલી એપ Android એપ (Google Play પર અપલોડ કરી શકાય તેવી ફાઇલ) અને તમારી પોતાની App Store Connect કી સાથે TestFlight પર મોકલાયેલી iPhone એપ બની શકે, Mac વિના. ફોન એપ પબ્લિશ થયેલી વેબ એપ ખોલે છે, એટલે દરેક વખતે તમે અપડેટ પબ્લિશ કરો ત્યારે ફોન એપમાં પણ તે હોય છે.

આમાંથી શું લેવું

બિલ્ડ પોતે ટૂંકો ભાગ હતો. એપને ઉપયોગી બનાવનારી બાબતો હતી: સ્પેકની “v1 માં નહીં” યાદી, બીજી બધી વસ્તુ પહેલાં મુખ્ય લૂપનું ટેસ્ટિંગ, ક્ષમતા અને ઍક્સેસ માટે સર્વર-બાજુના નિયમો, અને પચાસ પહેલાં પાંચ વાસ્તવિક યુઝર્સ. જ્યારે એપે બીજા લોકો માટે કામ કરવું પડે, ત્યારે વાઇબ કોડિંગ આવું દેખાય છે.

તમારી પોતાની અજમાવવા તૈયાર છો? તમારું એક પેજનું સ્પેક લખો, પછી પહેલો ફકરો AI એપ બિલ્ડર માં પેસ્ટ કરો. વધુ એપ પ્રકારો અને તેની પાછળના પ્રોમ્પ્ટ જોવા માટે, અમારા વાઇબ કોડિંગ ઉદાહરણો વાંચો.

પ્રશ્નો