ChatGPT کے ساتھ Vibe Coding: Canvas، Codex اور ChatGPT سے ایپس بنانا

آپ ChatGPT کے ساتھ تین طریقوں سے vibe coding کر سکتے ہیں۔ چیٹ میں ایک چھوٹی ایپ مانگیں اور canvas میں اس کا پریویو دیکھیں؛ کسی حقیقی کوڈ بیس پر کام Codex کو دیں، جو OpenAI کا coding agent ہے؛ یا AI app builder جیسے Mythex کو جوڑیں تاکہ ChatGPT ڈیٹا بیس کے ساتھ ایک مکمل ایپ بنا، ہوسٹ اور شائع کر سکے۔ پہلا طریقہ ایک صفحے والے ٹول کے لیے سب سے تیز ہے، دوسرا ڈویلپرز کے لیے موزوں ہے، اور تیسرا آپ کو لاگ اِن اور ڈیٹا والی لائیو ایپ دیتا ہے، ChatGPT چھوڑے بغیر۔

ہر ایک کیسے کام کرتا ہے، ہر ایک کے لیے پرامپٹ، اور وہ کہاں رک جاتا ہے، یہ یہاں ہے۔ اگر آپ اصطلاح کا پس منظر چاہتے ہیں تو vibe coding کیا ہے پڑھیں۔

آپشن 1: ChatGPT چیٹ اور canvas

کسی فوری ٹول کے لیے، بس پوچھ لیں۔ ChatGPT کوڈ لکھتا ہے، اور canvas میں وہ سادہ HTML اور React صفحات دکھا سکتا ہے تاکہ آپ کلک کر کے دیکھ سکیں اور تبدیلیاں مانگ سکیں۔

ایک صفحے کا ٹپ کیلکولیٹر بناؤ جس میں بل کی رقم، ٹپ کی فیصد (10، 15، 20 کے بٹنز اور ایک اپنی مرضی کا فیلڈ) اور لوگوں کی تعداد کے ان پٹس ہوں۔ ٹپ اور ہر شخص کی رقم دکھاؤ، جو میرے ٹائپ کرنے کے ساتھ بدلے۔ فون پر صاف دکھائی دے۔

کس کے لیے اچھا ہے: کیلکولیٹرز، سادہ کھیل، لینڈنگ پیج کے خاکے، اور سیکھنے کے لیے۔ "یہ فائل ایسے سمجھاؤ جیسے میں کوڈنگ میں نیا ہوں" پوچھیں اور آپ تیزی سے سیکھیں گے۔

یہ کہاں رک جاتا ہے: اس میں کوئی بیک اینڈ نہیں۔ آپ جو درج کریں وہ دوسرے صارفین کے لیے محفوظ نہیں ہوتا، کوئی لاگ اِن نہیں، اور اسے شیئر کرنے کے لیے آپ کو کوڈ کہیں کاپی کر کے خود ہوسٹ کرنا ہوگا۔ جس لمحے آپ کہیں "اور اسے محفوظ کرو تاکہ میری ٹیم دیکھ سکے"، آپ چیٹ سے آگے نکل چکے ہیں۔

کاپی پیسٹ vibe coding

بہت سے لوگ ChatGPT سے کوڈ مانگ کر اسے اپنے کمپیوٹر کی فائلوں یا ہوسٹنگ سروس میں چسپاں کر کے شروع کرتے ہیں۔ یہ چھوٹی static سائٹس کے لیے کام کرتا ہے، لیکن جلد ٹوٹ جاتا ہے۔ ہر تبدیلی کا مطلب ہے صحیح فائل ڈھونڈنا، صحیح حصہ چسپاں کرنا، اور امید کرنا کہ جو آپ نے بدلا اس پر کوئی اور چیز منحصر نہ ہو۔ اگر آپ یہ کئی بار سے زیادہ کر رہے ہیں تو اگلے دو آپشنز میں سے ایک پر جائیں۔

آپشن 2: حقیقی کوڈ بیس کے لیے Codex

Codex سافٹ ویئر کے کام کے لیے OpenAI کا ایجنٹ ہے۔ آپ اسے سادہ زبان میں کام دیتے ہیں، اور وہ ایک repository پر کام کرتا ہے: کوڈ پڑھتا ہے، کئی فائلوں میں تبدیلیاں کرتا ہے، کمانڈز اور ٹیسٹ چلاتا ہے، اور نتیجہ آپ کے جائزے کے لیے دیتا ہے۔ OpenAI اسے ChatGPT میں، کمانڈ لائن ٹول کے طور پر اور ایڈیٹر ایکسٹینشن کے طور پر پیش کرتا ہے؛ کون سے پلانز میں یہ شامل ہے اور موجودہ حدیں کیا ہیں، یہ OpenAI کی سائٹ پر دیکھیں۔

کام کی طرز کا پرامپٹ اس کے لیے سب سے بہتر ہے:

اس repo میں Orders صفحے پر ایک CSV ایکسپورٹ بٹن شامل کرو۔ یہ موجودہ فلٹر شدہ آرڈرز کو date، customer، total اور status کے کالموں کے ساتھ ایکسپورٹ کرے۔ ایکسپورٹ فنکشن کے لیے ایک ٹیسٹ شامل کرو اور ٹیسٹ سوٹ چلاؤ۔

کس کے لیے اچھا ہے: ڈویلپرز اور تکنیکی بانی جن کے پاس موجودہ پروجیکٹ ہے اور وہ چاہتے ہیں کہ ایک ایجنٹ پوری فہرست کے کام سنبھالے۔ یہ آپ کے اسٹیک اور اصولوں کے ساتھ کام کرتا ہے۔

جو آپ خود سنبھالتے ہیں: ایپ کہاں چلتی ہے، ڈیٹا بیس، secrets، تعیناتی اور ڈومینز۔ Codex کوڈ بدلتا ہے؛ وہ ہوسٹ نہیں ہے۔

Codex اور Mythex ایک ساتھ

Codex MCP سرورز سے بھی جڑ سکتا ہے، بشمول Mythex کا۔ Codex میں https://mcp.mythex.ai/mcp کو ایک custom MCP سرور کے طور پر شامل کریں، Mythex پر رسائی کی منظوری دیں، اور Codex اپنے کلاؤڈ سینڈ باکس میں ایک Mythex پروجیکٹ پر کام کر سکتا ہے، جبکہ پریویو، ڈیٹا بیس اور اشاعت Mythex سنبھالتا ہے۔ Claude، Cursor یا Codex سے Mythex ایپس بنانا والا بلاگ اسے قدم بہ قدم بیان کرتا ہے۔

آپشن 3: ChatGPT سے Mythex کے ساتھ مکمل ایپ بنائیں

اگر آپ ChatGPT کی گفتگو میں رہنا چاہتے ہیں اور آخر میں ایک حقیقی، ہوسٹ شدہ ایپ چاہتے ہیں، تو Mythex جوڑیں۔ Mythex ChatGPT کے اندر ایک ایپ کے طور پر کام کرتا ہے: ChatGPT MCP کے ذریعے Mythex کے ٹولز سے بات کرتا ہے، جو وہ کھلا پروٹوکول ہے جو اسسٹنٹس کو کہیں اور ہوسٹ کیے گئے ٹولز استعمال کرنے دیتا ہے (MCP کیا ہے)۔

جب یہ جڑ جائے تو ChatGPT ایک Mythex پروجیکٹ بنا سکتا ہے، ایک نجی کلاؤڈ سینڈ باکس میں کوڈ لکھ سکتا ہے، لائیو پریویو شروع کر سکتا ہے، ڈیٹا بیس اور فائل اسٹوریج شامل کر سکتا ہے، اور ایپ کو عوامی URL پر شائع کر سکتا ہے۔ نتائج ایک لنک کے ساتھ واپس آتے ہیں تاکہ آپ Mythex میں پروجیکٹ کھول کر پریویو دیکھ سکیں۔

کیسے جوڑیں

1. Mythex میں Account settings کھولیں اور MCP پتہ کاپی کریں۔
2. ChatGPT میں apps یا connectors کی سیٹنگز سے اس پتے کے ساتھ Mythex شامل کریں۔ ChatGPT کے مینو وقتاً فوقتاً بدلتے ہیں، اس لیے اگر نام مختلف ہوں تو ایپ شامل کرنے کے لیے OpenAI کا مدد کا صفحہ دیکھیں۔
3. ایک Mythex صفحہ کھلتا ہے: سائن ان کریں اور Allow access منتخب کریں۔ یہاں کوئی کلید چسپاں کرنے کی ضرورت نہیں۔
4. گفتگو شروع کریں اور اپنی درخواست میں Mythex کا ذکر کریں۔

کنیکشن کسی بھی Mythex پلان پر کام کرتا ہے۔ سینڈ باکس ٹولز، یعنی بنانا، پریویو کرنا، شائع کرنا، Mythex Pro ($25 فی مہینہ) مانگتے ہیں، اور سینڈ باکس کا وقت اور ہوسٹنگ آپ کے Mythex کریڈٹس سے آتے ہیں۔ آپ کا ChatGPT استعمال آپ کے OpenAI پلان پر رہتا ہے۔

آزمانے کے لیے پہلا پرامپٹ

میرے لیے ایک نوکری کی درخواستوں کا ٹریکر بنانے کے لیے Mythex استعمال کرو۔ میں کمپنی، کردار، لنک، درخواست کی تاریخ، حیثیت (درخواست دی، انٹرویو، آفر، مسترد) اور نوٹس کے ساتھ درخواستیں شامل کروں۔ حیثیت کے لحاظ سے ایک بورڈ دکھاؤ جہاں میں کارڈز کو گھسیٹ سکوں، اور ہر ہفتے درخواستوں کا ایک سادہ چارٹ۔ سب کچھ ڈیٹا بیس میں محفوظ کرو اور لاگ اِن سے محفوظ رکھو۔ پریویو شروع کرو اور مجھے لنک دو۔

پھر ایک پیغام میں ایک تبدیلی:

Mythex پروجیکٹ میں ہر درخواست کے ساتھ ایک یاددہانی کی تاریخ شامل کرو اور وہ کارڈز نمایاں کرو جن کی یاددہانی آج یا گزر چکی ہو۔

اسے شائع کرو اور مجھے لائیو URL بھیجو۔

کس کے لیے اچھا ہے: وہ لوگ جو پہلے ہی ChatGPT میں منصوبہ بندی اور سوچ بچار کرتے ہیں اور چاہتے ہیں کہ نتیجہ لائیو ہو، ایسے ڈیٹا کے ساتھ جو برقرار رہے، بغیر ہوسٹنگ سیکھے۔ چونکہ یہ ایک عام Mythex پروجیکٹ ہے، آپ کسی بھی وقت Mythex چیٹ میں کام جاری رکھ سکتے ہیں۔

آپ جو بنا رہے ہیں اس کے لیے کون سا آپشن موزوں ہے

ChatGPT میں کام کرنے والی پرامپٹنگ کی عادات

• جب آپ چاہیں کہ ٹول استعمال ہو تو اس کا نام لیں۔ "Mythex استعمال کرتے ہوئے…" واضح کرتا ہے کہ درخواست آپ کے پروجیکٹ کے لیے ہے، عام جواب کے لیے نہیں۔
• ایک پیغام میں ایک تبدیلی۔ تدوین کی لمبی فہرستیں ضمنی اثرات کی لمبی فہرستیں پیدا کرتی ہیں۔
• بڑے قدموں سے پہلے منصوبہ مانگیں۔ "کچھ بدلنے سے پہلے بتاؤ کہ کیا بدلو گے اور میری منظوری کا انتظار کرو۔"
• درست ایررز چسپاں کریں۔ پورا ایرر متن کسی بھی تفصیل سے زیادہ قیمتی ہے۔
• پوچھیں کیا بدلا۔ "اپنی آخری تین تبدیلیوں کا سادہ الفاظ میں خلاصہ کرو" آپ کو راستہ دکھاتا رہتا ہے جب آپ کوڈ نہیں پڑھ رہے ہوں۔

مزید vibe coding پرامپٹس کی چیٹ شیٹ میں ہیں۔

محفوظ رہیں

• ChatGPT کی گفتگو میں کبھی اصلی پاس ورڈ یا API کلیدیں نہ چسپاں کریں۔ اگر آپ کی ایپ کو کلید چاہیے تو اسے پروجیکٹ کے secrets میں رکھیں۔ Mythex کے ٹولز صرف secret کے نام بتاتے ہیں، کبھی قدریں نہیں۔
• شائع کرنے سے پہلے جانچیں کہ صارفین ایک دوسرے کا ڈیٹا نہ دیکھ سکیں، اور کوئی کلید براؤزر میں چلنے والے کوڈ میں نہ ہو۔ ہماری گائیڈ کیا vibe coding محفوظ ہے؟ ان جانچوں کو قابلِ نقل پرامپٹس کے ساتھ بیان کرتی ہے۔

کیا آپ Claude بھی استعمال کرتے ہیں؟ ساتھی گائیڈ Claude اور Claude Code کے ساتھ vibe coding بیان کرتی ہے۔ ماڈل کے لحاظ سے نظارہ کے لیے دیکھیں ایپس بنانے کے لیے ChatGPT بمقابلہ Claude بمقابلہ Gemini۔

سوالات