টাইপস্ক্রিপ্ট: বেসিক থেকে অ্যাডভান্সড – একটি বিস্তারিত গাইড (উদাহরণ সহ)

ভূমিকাঃ

টাইপস্ক্রিপ্ট (TypeScript) হলো জাভাস্ক্রিপ্টের একটি সুপারসেট যা জাভাস্ক্রিপ্টের সমস্ত বৈশিষ্ট্য বজায় রেখে অতিরিক্ত কিছু সুবিধা যুক্ত করে, যেমন টাইপ সেফটি, উন্নত ডেভেলপার অভিজ্ঞতা, এবং কোড রিফ্যাক্টরিং সহজ করা। মাইক্রোসফট দ্বারা ডেভেলপকৃত এই ভাষা ওয়েব ডেভেলপারদের মধ্যে জনপ্রিয় হয়ে উঠেছে কারণ এটি বড় এবং জটিল অ্যাপ্লিকেশন তৈরি করতে সহায়ক।

এই ব্লগে, আমরা টাইপস্ক্রিপ্টের বেসিক থেকে শুরু করে অ্যাডভান্সড বিষয়গুলো নিয়ে বিস্তারিত আলোচনা করব, যাতে আপনি টাইপস্ক্রিপ্ট শিখে আপনার ওয়েব ডেভেলপমেন্ট প্রজেক্টগুলোতে দক্ষতা অর্জন করতে পারেন।

টাইপস্ক্রিপ্ট কী এবং কেন এটি ব্যবহার করবেন?

টাইপস্ক্রিপ্ট হলো জাভাস্ক্রিপ্টের একটি টাইপ সেফ সংস্করণ। এটি একটি স্ট্যাটিক টাইপিং ভাষা, অর্থাৎ কম্পাইল টাইমে টাইপ ত্রুটি সনাক্ত করা যায়। এটি জাভাস্ক্রিপ্টের সীমাবদ্ধতাগুলির সমাধান করে এবং বড় স্কেল প্রকল্পগুলিতে কোড বজায় রাখা সহজ করে তোলে।

টাইপস্ক্রিপ্টের মূল বৈশিষ্ট্যসমূহ:

টাইপ সেফটি (Type Safety): টাইপস্ক্রিপ্টে আপনি প্রতিটি ভেরিয়েবল, ফাংশন প্যারামিটার, এবং অবজেক্টের টাইপ নির্ধারণ করতে পারেন। এটি কম্পাইলারকে টাইপ ত্রুটি সনাক্ত করতে সাহায্য করে, যা কোড লিখতে এবং বজায় রাখতে সাহায্য করে।
উন্নত কোড কমপ্লিশন (Enhanced Code Completion): টাইপস্ক্রিপ্ট ইন্টেলিজেন্ট কোড কমপ্লিশন এবং ইনটেলিসেন্স (IntelliSense) প্রদান করে, যা ডেভেলপারদের দ্রুত কোড লিখতে সহায়ক।
রিফ্যাক্টরিং সহজ করে: টাইপস্ক্রিপ্টে টাইপিং এবং ইন্টারফেসের মাধ্যমে কোডের স্ট্রাকচার ভালোভাবে বোঝা যায়, যা রিফ্যাক্টরিং সহজ করে।
ভবিষ্যত-প্রুফ জাভাস্ক্রিপ্ট: টাইপস্ক্রিপ্ট জাভাস্ক্রিপ্টের সর্বশেষ বৈশিষ্ট্যগুলি (ESNext) ব্যবহার করতে দেয় যা বিভিন্ন ব্রাউজার বা জাভাস্ক্রিপ্ট RUNTIME-এ সমর্থিত না হলেও, টাইপস্ক্রিপ্ট সেগুলিকে পূর্ববর্তী সংস্করণে ট্রান্সপাইল করে।

টাইপস্ক্রিপ্ট সেটআপ:

টাইপস্ক্রিপ্ট ব্যবহার শুরু করার জন্য, আপনাকে প্রথমে আপনার সিস্টেমে টাইপস্ক্রিপ্ট ইনস্টল করতে হবে। এটি করার সবচেয়ে সহজ উপায় হল npm (Node Package Manager) ব্যবহার করা:

npm install -g typescript

একবার ইনস্টল হয়ে গেলে, আপনি tsc (TypeScript Compiler) কমান্ড ব্যবহার করে টাইপস্ক্রিপ্ট ফাইলগুলো জাভাস্ক্রিপ্টে কম্পাইল করতে পারবেন।

tsc your-file.ts

টাইপস্ক্রিপ্ট কনফিগারেশন:

টাইপস্ক্রিপ্টের প্রকল্প কনফিগার করতে, আপনি একটি tsconfig.json ফাইল তৈরি করতে পারেন, যা কম্পাইলারের জন্য প্রয়োজনীয় সব সেটিংস নির্ধারণ করে।

উদাহরণস্বরূপ:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

এটি টাইপস্ক্রিপ্ট কম্পাইলারের জন্য বিভিন্ন অপশন নির্ধারণ করে, যেমন কোন জাভাস্ক্রিপ্ট ভার্সনে কম্পাইল করতে হবে, কোন মডিউল সিস্টেম ব্যবহার করতে হবে ইত্যাদি।

টাইপস্ক্রিপ্ট বেসিকস:

১. টাইপ এনোটেশন (Type Annotation):

টাইপ এনোটেশন টাইপস্ক্রিপ্টের মৌলিক বৈশিষ্ট্য। এটি প্রতিটি ভেরিয়েবলের জন্য টাইপ নির্ধারণ করার সুবিধা দেয়, যা টাইপ সংক্রান্ত ত্রুটি কম্পাইল টাইমে সনাক্ত করতে সাহায্য করে।

উদাহরণস্বরূপ:

let age: number = 30;   // 'age' হলো একটি সংখ্যা (number)
let name: string = "জন"; // 'name' হলো একটি স্ট্রিং (string)
let isStudent: boolean = true; // 'isStudent' হলো একটি বুলিয়ান (boolean)

এখানে, :number, :string, এবং :boolean টাইপ এনোটেশন ব্যবহার করে প্রতিটি ভেরিয়েবলের টাইপ স্পষ্টভাবে উল্লেখ করা হয়েছে।

২. ফাংশন টাইপিং (Function Typing):

টাইপস্ক্রিপ্টে ফাংশনের ইনপুট এবং আউটপুটের টাইপও নির্ধারণ করা যায়, যা ফাংশনের ভ্যালিডিটি এবং নিরাপত্তা নিশ্চিত করে।

উদাহরণস্বরূপ:

function add(a: number, b: number): number {
    return a + b;
}

উপরের উদাহরণে, a এবং b ফাংশনের প্যারামিটার হিসেবে সংখ্যা (number) নির্ধারিত এবং আউটপুটের টাইপও সংখ্যা (number) হিসেবে নির্ধারিত।

৩. অ্যারে এবং অবজেক্ট টাইপিং (Array and Object Typing):

টাইপস্ক্রিপ্টে আপনি অ্যারে এবং অবজেক্টের জন্য নির্দিষ্ট টাইপ নির্ধারণ করতে পারেন।

উদাহরণস্বরূপ:

let numbers: number[] = [1, 2, 3]; // শুধুমাত্র সংখ্যা ধারণকারী অ্যারে
let person: { name: string, age: number } = { name: "জন", age: 25 }; // নির্দিষ্ট টাইপের অবজেক্ট

এখানে numbers হলো একটি অ্যারে যা শুধুমাত্র সংখ্যা ধারণ করতে পারে এবং person হলো একটি অবজেক্ট যা নির্দিষ্ট স্ট্রাকচার অনুসরণ করতে হবে।

৪. ইন্টারফেস (Interfaces):

ইন্টারফেস হলো একটি শক্তিশালী টুল যা অবজেক্টের টাইপ নির্ধারণে ব্যবহার করা হয়। এটি আপনার কোডে কনসিসটেন্সি এবং টাইপ সেফটি যোগ করে।

উদাহরণস্বরূপ:

interface Person {
    name: string;
    age: number;
    isStudent: boolean;
}

let student: Person = {
    name: "রনি",
    age: 22,
    isStudent: true
};

ইন্টারফেস ব্যবহার করে আমরা একটি Person টাইপ তৈরি করেছি যা নির্দিষ্ট প্রপার্টিস ধারণ করতে হবে। student অবজেক্টটি Person ইন্টারফেসের সাথে মিলছে, তাই এটি টাইপস্ক্রিপ্টের সাথে সামঞ্জস্যপূর্ণ।