Angular ডেভেলপমেন্ট শুরু করার আগে সঠিক এনভায়রনমেন্ট সেটআপ করা প্রয়োজন। নিচে স্টেপ-বাই-স্টেপ নির্দেশিকা দেওয়া হলো:
সিস্টেম রিকোয়ারমেন্ট
Angular ডেভেলপমেন্টের জন্য আপনার সিস্টেমে নিম্নোক্ত সফটওয়্যার এবং টুল থাকতে হবে:
- Node.js: Angular CLI এবং প্যাকেজ ম্যানেজমেন্টের জন্য।
- npm (Node Package Manager): প্যাকেজ ইনস্টল ও ম্যানেজ করার জন্য।
- Angular CLI: Angular প্রজেক্ট তৈরি ও ম্যানেজ করার জন্য।
- Code Editor: যেমন Visual Studio Code।
Angular ডেভেলপমেন্ট এনভায়রনমেন্ট সেটআপের ধাপ
Step 1: Node.js ইনস্টল করুন
- Node.js অফিসিয়াল ওয়েবসাইট থেকে LTS (Long-Term Support) সংস্করণ ডাউনলোড করুন।
- ইনস্টলার রান করুন এবং নির্দেশনা অনুসরণ করে ইন্সটল করুন।
ইন্সটল হওয়ার পরে কমান্ড প্রম্পট (Command Prompt) বা টার্মিনাল খুলে Node.js এবং npm এর সংস্করণ যাচাই করুন:
node -v npm -v
Step 2: Angular CLI ইনস্টল করুন
Angular CLI ইনস্টল করতে নিচের কমান্ড রান করুন:
npm install -g @angular/cliইন্সটলেশনের পরে Angular CLI এর সংস্করণ যাচাই করতে:
ng version
Step 3: নতুন Angular প্রজেক্ট তৈরি করুন
Angular CLI দিয়ে নতুন প্রজেক্ট তৈরি করতে:
ng new project-name- project-name এর পরিবর্তে আপনার প্রজেক্টের নাম দিন।
- CLI থেকে কিছু অপশন নির্বাচন করতে বলা হবে (যেমন CSS বা SCSS)। প্রয়োজন অনুযায়ী নির্বাচন করুন।
প্রজেক্ট ফোল্ডারে যেতে:
cd project-name
Step 4: Angular প্রজেক্ট রান করুন
ডেভেলপমেন্ট সার্ভার চালু করতে নিচের কমান্ড দিন:
ng serve- ব্রাউজারে অ্যাপ্লিকেশন দেখতে:
- ডিফল্ট URL:
http://localhost:4200/ - অ্যাপ্লিকেশন পরিবর্তন করলে তা স্বয়ংক্রিয়ভাবে ব্রাউজারে রিফ্রেশ হবে।
- ডিফল্ট URL:
Step 5: Code Editor সেটআপ
- Visual Studio Code ডাউনলোড ও ইন্সটল করুন।
- Angular ডেভেলপমেন্ট সহজ করতে নিচের এক্সটেনশনগুলো ইনস্টল করুন:
- Angular Language Service
- ESLint (Linting এবং Code Formatting এর জন্য)
- Prettier (Code Formatting)
ডেভেলপমেন্ট এনভায়রনমেন্টের গুরুত্বপূর্ণ টিপস
- Live Server: Angular এর
ng serveডেভেলপমেন্ট সার্ভার স্বয়ংক্রিয়ভাবে আপডেট দেখায়। - Version Management: Node.js এবং Angular CLI এর সঠিক সংস্করণ নিশ্চিত করুন।
- Package Management: প্রয়োজনীয় প্যাকেজ এবং ডিপেনডেন্সি ম্যানেজ করতে
package.jsonফাইল ব্যবহার করুন। - Browser Compatibility: Angular অ্যাপ্লিকেশন ক্রস-ব্রাউজার সাপোর্ট নিশ্চিত করতে পরীক্ষা করুন।
এটি Angular ডেভেলপমেন্ট শুরু করার জন্য একটি মৌলিক এনভায়রনমেন্ট তৈরি করবে। সঠিকভাবে সেটআপ করলে Angular দিয়ে দ্রুত এবং কার্যকর ডেভেলপমেন্ট শুরু করা যাবে।
Read more