TypeScript کیا ہے؟ غیر ڈیولپرز کے لیے آسان زبان میں گائیڈ

TypeScript ٹائپس والا JavaScript ہے۔ آپ ہر قدر کے ساتھ لیبل لگاتے ہیں کہ وہ کس قسم کا ڈیٹا ہونی چاہیے، جیسے نمبر، متن، آرڈرز کی فہرست — اور TypeScript کوڈ چلنے سے پہلے ہی بے میلی چیک کر لیتا ہے۔ TypeScript کی سائٹ اسے “ٹائپس کے لیے سنٹیکس والا JavaScript” کہتی ہے؛ کوڈ کو عام JavaScript میں بدلتے وقت ٹائپس نکال دی جاتی ہیں، اور پھر وہ JavaScript وہاں چلتا ہے جہاں JavaScript چلتا ہے۔

AI کے ساتھ بناتے وقت یہ کیوں اہم ہے

AI ماڈلز تیزی سے کوڈ لکھتے ہیں، اور تیز کوڈ میں غلطیاں ہوتی ہیں: ایک فائل میں customerName اور دوسری میں customer_name، ایک قیمت نمبر کے بجائے متن کے طور پر دی گئی، یا کسی فنکشن کو ایک قدر کے بغیر بلایا گیا۔ سادہ JavaScript میں ان میں سے بہت سی غلطیاں تب ہی ظاہر ہوتی ہیں جب کوئی غلط بٹن دبا دے۔

TypeScript ان میں سے بہت سی غلطیاں پہلے ہی پکڑ لیتا ہے، جب کوڈ لکھا جا رہا ہوتا ہے:

• AI کو فوری فیڈ بیک ملتا ہے۔ ٹائپ کی غلطیاں ٹھیک غلط لائن کی نشاندہی کرتی ہیں، تاکہ ایجنٹ آپ کے دیکھنے سے پہلے اسے ٹھیک کر سکے۔
• تبدیلیاں محفوظ ہوتی ہیں۔ کوئی فیلڈ کا نام بدلیں تو TypeScript ہر اس جگہ کو نشان زد کرتا ہے جو اب بھی پرانا نام استعمال کرتی ہے۔
• کوڈ خود کو سمجھاتا ہے۔ ٹائپس بتاتی ہیں کہ کوئی فنکشن کیا چاہتا ہے اور کیا لوٹاتا ہے، جو آپ، AI اور بعد میں اس پر کام کرنے والے کسی بھی ڈیولپر کے لیے مفید ہے۔
• ایڈیٹرز زیادہ ذہین ہوتے ہیں۔ Autocomplete اور “go to definition” بہتر کام کرتے ہیں کیونکہ ایڈیٹر جانتا ہے کہ ہر قدر کیا ہے۔

اسی لیے بہت سے AI ایپ بلڈرز ڈیفالٹ کے طور پر TypeScript استعمال کرتے ہیں۔

روزمرہ کی ایک مثال

لیبل والے خانوں والے گودام کا تصور کریں۔ ہر خانے پر ایک بورڈ ہے: “صرف پیلیٹس”، “ریفریجریٹڈ”، “زیادہ سے زیادہ 500 کلو”۔ جب مال آتا ہے تو دروازے پر ایک جانچنے والا سامان کا بورڈ سے موازنہ کرتا ہے۔ خشک سامان والے خانے کی طرف جانے والی منجمد مچھلی دروازے پر ہی روک لی جاتی ہے، نہ کہ ایک ہفتے بعد بدبو سے پتا چلے۔

TypeScript دروازے پر کھڑا جانچنے والا ہے۔ ٹائپس بورڈز ہیں۔ جانچ اس مال، یعنی آپ کے کوڈ، کے استعمال میں آنے سے پہلے ہوتی ہے۔ اور جب سب کچھ اپنی جگہ پر ہو جائے تو بورڈز ہٹا دیے جاتے ہیں: چلتے ہوئے JavaScript میں کوئی ٹائپ باقی نہیں رہتی۔

TypeScript کیسے کام کرتا ہے

1. آپ (یا AI) .ts یا .tsx فائلیں لکھتے ہیں — TypeScript، ٹائپ لیبلز کے ساتھ۔
2. ٹائپ چیکر کوڈ پڑھتا ہے اور بے میلیوں کو ایڈیٹر یا build میں غلطیوں کے طور پر دکھاتا ہے۔
3. ایک build مرحلہ ٹائپس نکال دیتا ہے، اور سادہ JavaScript بنتا ہے۔
4. JavaScript براؤزر میں یا سرور پر (Node.js، Deno، Bun) چلتا ہے۔

ایک اہم نتیجہ: TypeScript وہ کوڈ چیک کرتا ہے جو آپ نے لکھا، نہ کہ وہ ڈیٹا جو ایپ چلتے وقت آتا ہے۔ اگر کوئی بیرونی API غیر متوقع چیز واپس بھیجے تو TypeScript اسے نہیں دیکھ سکتا، جب تک آپ رن ٹائم validation شامل نہ کریں۔

عملی مثال: ایک بکنگ فارم

فرض کریں آپ ایک ہیئر سیلون کے لیے بکنگ ایپ بنا رہے ہیں۔ بکنگ کی وضاحت کرنے والی ایک ٹائپ یہ ہے:

type Booking = {
  id: number;
  customerEmail: string;
  service: "haircut" | "colour" | "blow-dry";
  startsAt: Date;
  price: number;
  notes?: string; // ? کا مطلب ہے کہ یہ اختیاری ہے
};

اور ایک فنکشن جو ایڈوانس ڈپازٹ نکالتا ہے:

function depositFor(booking: Booking): number {
  return booking.price * 0.2;
}

اب دیکھیں TypeScript کیا پکڑتا ہے۔

غلط ہجے والی فیلڈ۔

depositFor({ id: 1, customerEmail: "lena@example.com", service: "haircut",
  startsAt: new Date(), prise: 40 });

TypeScript بتاتا ہے کہ prise ایک معلوم property نہیں ہے اور price غائب ہے۔ سادہ JavaScript میں یہ خاموشی سے NaN (ایک نمبر نہیں) کا ڈپازٹ حساب کر دیتا۔

غلط قسم کی قدر۔

const booking: Booking = { ...otherFields, price: "40" };

TypeScript بتاتا ہے کہ جہاں نمبر درکار ہو وہاں متن استعمال نہیں ہو سکتا۔ اس کے بغیر "40" * 0.2 اتفاق سے کام کر جاتا ہے، لیکن "40" + 5 دیتا ہے "405" — ایسی غلطی جو انوائس پر ظاہر ہوتی ہے۔

ایسی سروس جو موجود نہیں۔

const booking: Booking = { ...otherFields, service: "perm" };

TypeScript بتاتا ہے کہ "perm" اجازت یافتہ سروسز میں سے نہیں ہے۔ بعد میں جب سیلون perms شامل کرے تو آپ اسے ٹائپ میں شامل کرتے ہیں، اور TypeScript ہر وہ جگہ دکھاتا ہے جسے اپ ڈیٹ کرنا ضروری ہے — قیمتوں کی فہرست، فارم، کیلنڈر کے رنگ۔

وہ کیا نہیں پکڑ سکتا۔ اگر بکنگ فارم براؤزر سے سرور کو price: "40" بھیجے تو سرور پر TypeScript رن ٹائم پر اسے نہیں دیکھتا۔ اسی لیے اچھی طرح بنی ایپس آنے والے ڈیٹا کی validation بھی کرتی ہیں، اکثر کسی validation لائبریری کے ذریعے جو ساخت چیک کر کے اسے ایک درست Booking میں بدل دیتی ہے۔

TypeScript بمقابلہ JavaScript

عام اصطلاحات کی وضاحت

عام غلطیاں اور غلط فہمیاں

• “TypeScript کوڈ کو بگ فری بنا دیتا ہے۔” یہ ڈیٹا کی ساخت میں بے میلیاں پکڑتا ہے، غلط منطق نہیں۔ 20 فیصد کی جگہ 2 فیصد کا ڈپازٹ ٹائپ چیک میں بالکل ٹھیک گزر جاتا ہے۔
• “ٹائپس مجھے خراب ان پٹ سے بچاتی ہیں۔” ٹائپس رن ٹائم پر غائب ہو جاتی ہیں۔ صارفین، فارمز اور APIs سے آنے والے ڈیٹا کی validation کریں۔
• ہر جگہ any۔ جب AI پھنس جاتا ہے تو وہ غلطیاں خاموش کرانے کے لیے any یا // @ts-ignore کا سہارا لے سکتا ہے۔ یہ مسائل کو ٹھیک کرنے کے بجائے چھپا دیتا ہے۔
• پریویو کام کرنے کی وجہ سے ٹائپ کی غلطیوں کو نظر انداز کرنا۔ بعض ٹولز پھر بھی ٹائپ غلطیوں والا کوڈ چلا دیتے ہیں۔ غلطیاں پھر بھی آنے والی بگز ہیں۔
• “TypeScript سست ہے۔” ٹائپس چلانے سے پہلے نکال دی جاتی ہیں؛ جو JavaScript چلتا ہے وہ تقریباً ویسا ہی ہے۔
• “یہ صرف بڑی ٹیموں کے لیے ہے۔” اکیلے بلڈرز کو بھی فائدہ ہوتا ہے، خاص طور پر جب زیادہ تر ترامیم AI کر رہا ہو۔

اپنے AI بلڈر سے کیا مانگیں

• “TypeScript کو strict mode کے ساتھ استعمال کریں۔”
• “ہمارے اہم ریکارڈز — Customer، Booking، Invoice — کے لیے مشترکہ ٹائپس بنائیں اور انہیں frontend اور backend دونوں پر استعمال کریں۔”
• “غلطیوں سے گزرنے کے لیے any یا @ts-ignore استعمال نہ کریں؛ اصل مسئلہ ٹھیک کریں اور بتائیں کہ وہ کیا تھا۔”
• “سرف ٹائپس کے ساتھ نہیں، بلکہ سرور پر تمام آنے والے ڈیٹا کی validation کریں۔”
• “ٹائپ چیکر چلائیں اور یہ کہنے سے پہلے ہر غلطی ٹھیک کریں کہ کام مکمل ہے۔”
• “جب آپ کوئی فیلڈ کا نام بدلیں تو TypeScript جہاں جہاں نشان زد کرے وہاں سب اپ ڈیٹ کریں۔”
• “اس ٹائپ کی غلطی کو سادہ اردو یا انگریزی میں سمجھائیں۔”

AI کے بنائے ہوئے کوڈ کی جانچ کے بارے میں مزید جاننے کے لیے AI سے بنے کوڈ کا جائزہ کیسے لیں اور AI سے بنی ایپ کی خرابیاں کیسے ڈھونڈیں دیکھیں۔

Mythex میں TypeScript

جب آپ کچھ خاص نہ مانگیں تو Mythex نئے پروجیکٹس Vite + React + TypeScript + Tailwind پر شروع کرتا ہے۔ کوڈ ایڈیٹر میں زبان کی سمجھ بوجھ شامل ہے — TypeScript اور JavaScript کے لیے completions، diagnostics اور go-to-definition، دیگر زبانوں کے ساتھ — اس لیے ٹائپ کی غلطیاں صرف پریویو میں نہیں، کوڈ میں بھی نظر آتی ہیں۔ ایڈیٹر Free پلان پر صرف پڑھنے کے لیے ہے اور Pro پر مکمل طور پر قابلِ تدوین۔ آپ اب بھی پہلے prompt میں کوئی اور سیٹ اپ مانگ سکتے ہیں؛ ٹیک کیسے چنی جاتی ہے کا docs صفحہ اس کی وضاحت کرتا ہے، اور کوڈ ایڈیٹر کی docs بتاتی ہیں کہ ایڈیٹر کیا دکھاتا ہے۔

سوالات