প্রিয় ডেভেলপারস! আসসালামু আলাইকুম, আশা করি ভালো আছেন। আজকের এই ব্লগে কীভাবে একটি TypeScript প্রজেক্ট তৈরি করতে হয় এবং রান করতে হয় এই সম্পর্কে বিস্তারিত টিউটোরিয়াল আপনাদের মাঝে শেয়ার করবো, আশা করি আপনারা উপকৃত হবেন। তাহলে শুরু করা যাক…
Create a TypeScript Project and Write Your First Code
গত ব্লগে লোকাল মেশিনে TypeScript
Installation and Environment Setup কীভাবে করতে হয় তা নিয়ে বিস্তারিত আলোচনা করা হয়েছে, আশা করি আপনারাও সফলভাবে সেটাপ করে নিয়েছেন। এখন কীভাবে TypeScript Project
Setup করতে হয় তা নিয়ে বিস্তারিত আলোচনা করবো –
ধাপ ১ – প্রথমে আপনি আপনার লোকাল মেশিনের যে কোনো ডিরেক্টরিতে একটি “notesaid24” নামে একটি ফোল্ডার খুলুন এবং আপনার নতুন তৈরিকৃত ফোল্ডারটি “VS Code Editor” দ্বারা খুলুন।
ধাপ ২ - VS Code Editor এর টার্মিনালটি খুলুন (টারমিনাল খোলার জন্য কি-বোর্ড থেকে শর্টকার্ট “Ctrl + `” ব্যাবহার করেও খুলতে পারেন) এবং নিম্নের কমান্ডটি রান করুন –
[
npm init -y
]
নোটঃ ‘-y’ ফ্লাগ দেওয়ার ফলে npm এর ডিফল্ট সেটংস সেটাপ করে নিবে। তবে যদি ‘-y’ ফ্লাগ না দিয়ে কমান্ড রান করেন তাহলে আপনার প্রজেক্ট সম্পর্কে বেসিক কিছু প্রশ্ন জিজ্ঞাসা করবে এবং তার উত্তর দিয়ে প্রজেক্ট সেটাপ করে নিবেন।
Configuring
TypeScript Project –
প্রজেক্টে এ
TypeScript ব্যবহার করার জন্য TypeScript কনফিগার করতে হবে, প্রজেক্টে এ TypeScript কনফিগার করার জন্য রুট ফোল্ডারের মধ্যে নিম্নের কমান্ডটি টারমিনালে রান করুন –
[
tsc -init
]
এই কমান্ডটি সফলভাবে রান হলে, আপনার প্রজেক্টের রুট ফোল্ডারের মধ্যে নতুন একটি ফাইল ‘tsconfig.json’ তৈরি হবে। এই ফাইলের ভিতরে অনেক রুলস / অপশন পাবেন আপনি আপনার প্রয়োজনমতো রুলস / অপশন পরিবর্তন বা পরিমার্জন করতে পারবেন। এই সম্পর্কে বিস্তারিত জানতে নিম্নের এই ব্লগটি দেখুন – https://www.typescriptlang.org/docs/handbook/tsconfig-json.html
TypeScript কনফিগার ফাইলে গিয়ে নিম্নের পরিবর্তনগুলো করে নিন, বাকিগুলো আপনার প্রজেক্ট অনুযায়ী সেটাপ করে নিবেন –
প্রথমে TypeScript কনফিগ ফাইলে গিয়ে “rootDir” লিখে সার্চ দিয়ে Uncomment করে “./src” লিখুন এবং সেভ করুন। নমুনা – “rootDir”: “./src”
দ্বিতীয় TypeScript কনফিগ ফাইলে গিয়ে “outDir” লিখে সার্চ দিয়ে Uncomment করে “./dist” লিখুন এবং সেভ করুন। নমুনা – “outDir”: “./dist”
এখন আপনার TypeScript প্রজেক্টের রুট ফোল্ডারের মধ্যে ‘src’ নামে একটা ফোল্ডার খুলুন এবং ‘src’ ফোল্ডারের মধ্যে “app.ts” নামে একটি ফাইল খুলুন এবং নিম্নের কোড কপি করে ‘app.ts’ ফাইলে Paste করুন এবং ফাইলটি Save করুন –
[const siteName: string = "Notesaid24";
console.log(siteName);]
কোড লেখা হলে রান করার জন্য আপনার কি বোর্ড থেকে (Ctrl + `) এই কমান্ডটি রান করুন।
তাহলে Visual Studio Code এর ডিফল্ট টারমিনাল
ওপেন হবে। অথবা Visual Studio Code মেনু বার থেকে Terminal > New
Terminal এ ক্লিক করলেই হবে টারমিনাল ওপেন হয়ে
যাবে।
এখন টারমিনালের মধ্যে tsc / tsc app.ts এই কমান্ড রান করুন। যদি সব ঠিকঠাকভাবে
করে থাকেন তাহলে আপনার ফোল্ডারের মধ্যে নতুন একটি ‘dist’ ফোল্ডার তৈরি হবে এবং এই ফোল্ডারের মধ্যে app.js নামে একটি নতুন ফাইল তৈরি হবে। এখন টারমিনালে গিয়ে পুনরায় এই কমান্ডটি node dist/app.js রান করলেই আপনি আপনার ফলাফল টারমিনালে
দেখতে পাবেন।
নোটঃ উপরল্লোখিত “tsc” কমান্ডটি ব্যবহার করা হয় TypeScript কোড কে JavaScript কোডে কম্পাইল করে web browsers অথবা Node.js
environment এ execute করার জন্য। প্রতিবার TypeScript কোড লেখার পর TypeScript কোড কে কম্পাইল করার জন্য ‘tsc’ কমান্ড রান করতে হবে।
তাছাড়াও আমরা নোড প্যাকেজ ম্যানেজার প্যাকেজ এর মাধ্যমে
TypeScript
কোড সহজভাবে রান করতে পারি। এর জন্য নোড এর “ts-node” প্যাকেজটি ইন্সটল করতে হবে, নিম্নে “ts-node” প্যাকেজ ইন্সটল করার পদ্ধতি ধাপে ধাপে বর্ণনা দেওয়া হলো –
ধাপ ১ – প্রথমে আপনার টারমিনালে গিয়ে নিম্নের কমান্ডটি রান করুন “npm i ts-node”
অথবা “npm i -g ts-node”
ধাপ ২ – ‘ts-node’ সফলভাবে ইন্সটল হয়েছে কিনা তা জানার জন্য আপনার টারমিনালে গিয়ে নিম্নের কমান্ডটি রান করুন ‘ts-node –version’. এবং ‘v10.9.1’ এই ভার্সন নাম্বারটি দেখতে পাবেন।
ধাপ ৩ – ‘ts-node’ সফলভাবে ইন্সটল হলে, আপনি সরাসরি TypeScript কোড টারমিনালে কমান্ড লাইনের মাধ্যমে রান করাতে পারবেন। তার জন্য এই কমান্ডটি ‘ts-node
app.ts’ টারমিনালে রান করুন এবং আপনার ফাইলে লেখা কোডের আউটপুট দেখতে পাবেন।
আশা করি আপনি আজকের এই ব্লগটি মনোযোগ
সহকারে পড়েছেন। আজকের ব্লগটি আপনার কাছে কেমন লেগেছে অবশ্যই
কমেন্ট করে জানাবেন, আর যদি কোন ভূল হয়ে থাকে তাহলে ক্ষমা সুন্দর দৃষ্টিতে দেখবেন এবং কোথায় ভূল হয়েছে কমেন্ট করে জানাবেন। পোষ্টে উল্লিখিত কোনো অংশ যদি বুঝতে সমস্যা হয়, তাহলে কমেন্ট বক্সে জানিয়ে দিন। ইনশাআল্লাহ্, সমস্যা সমাধানের চেষ্টা করবো। আর ওয়েবসাইটটি বন্ধুদের মাঝে শেয়ার করবেন। আজকের মতই এখানেই বিদায় নিলাম, ইনশাআল্লাহ দেখা হবে অন্য কোন ব্লগে। ভালো থাকবেন সুস্থ থাকবেন। আল্লাহ হাফেয।
