كيفية تثبيت Angular CLI على نظام Linux

أنغولار هو إطار عمل مفتوح المصدر وشهير وقابل للتوسيع بشكل كبير لتطوير تطبيقات الواجهة الأمامية، ويستخدم لبناء تطبيقات الويب والهواتف المحمولة باستخدام تايب سكربت/جافا سكريبت ولغات أخرى شائعة.

أنغولار هو مصطلح مظلة لجميع إصدارات أنغولار التي تأتي بعد أنغولار جي إس (أو أنغولار الإصدار 1.0) بما في ذلك أنغولار 2 و أنغولار 4.

أنغولار مناسب تمامًا لبناء التطبيقات من الحجم الصغير إلى الكبير من البداية. أحد المكونات الرئيسية لمنصة أنغولار لمساعدة تطوير التطبيقات هو أداة أنغولار سي إل آي – إنها أداة سطر أوامر بسيطة وسهلة الاستخدام تستخدم لإنشاء وإدارة وبناء واختبار تطبيقات أنغولار.

في هذه المقالة، سنشرح كيفية تثبيت أداة سطر الأوامر أنغولار على نظام Linux ونتعلم بعض الأمثلة الأساسية لهذه الأداة.

تثبيت Node.js في Linux

لتثبيت أنغولار سي إل آي، يجب أن يكون لديك أحدث إصدار من نود جي إس ونب إم مثبت على نظام Linux الخاص بك.

تثبيت نود جي إس على أوبونتو

------------- For Node.js v19.x ------------- 
$ curl -fsSL https://deb.nodesource.com/setup_19.x | sudo -E bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v18.x -------------
$ curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v16.x -------------
$ curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v14.x -------------
$ curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash - &&\
$ sudo apt-get install -y nodejs

تثبيت نود جي إس على ديبيان

------------- For Node.js v19.x ------------- 
$ curl -fsSL https://deb.nodesource.com/setup_19.x | bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v18.x ------------- 
$ curl -fsSL https://deb.nodesource.com/setup_18.x | bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v16.x ------------- 
$ curl -fsSL https://deb.nodesource.com/setup_16.x | bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v14.x ------------- 
$ curl -fsSL https://deb.nodesource.com/setup_14.x | bash - &&\
$ sudo apt-get install -y nodejs

------------- For Node.js v19.x ------------- 
$ curl -fsSL https://rpm.nodesource.com/setup_19.x | sudo bash -
$ sudo yum install -y nodejs

------------- For Node.js v18.x ------------- 
$ curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
$ sudo yum install -y nodejs

------------- For Node.js v16.x ------------- 
$ curl -fsSL https://rpm.nodesource.com/setup_16.x | sudo bash -
$ sudo yum install -y nodejs

------------- For Node.js v14.x ------------- 
$ curl -fsSL https://rpm.nodesource.com/setup_14.x | sudo bash -
$ sudo yum install -y nodejs

قم بتثبيت Node.js على RHEL و CentOS و Fedora و Rocky و Alma Linux. أيضًا ، لتجميع وتثبيت الوظائف الإضافية الأصلية من NPM قد تحتاج إلى تثبيت أدوات التطوير على نظامك على النحو التالي.

$ sudo apt install -y build-essential  [On Debian/Ubuntu]
$ sudo yum install gcc-c++ make        [On RHEL Systems]

تثبيت Angular CLI في Linux.

بمجرد تثبيت Node.js و NPM كما هو موضح أعلاه ، يمكنك تثبيت Angular CLI باستخدام مدير حزم npm على النحو التالي (تعني العلامة -g تثبيت الأداة على نطاق النظام لتستخدمها جميع مستخدمي النظام).

# npm install -g @angular/cli
OR
$ sudo npm install -g @angular/cli

يمكنك تشغيل Angular CLI باستخدام الأمر ng التنفيذي الذي يجب أن يكون مثبتًا الآن على نظامك. قم بتشغيل الأمر التالي للتحقق من الإصدار المثبت من Angular CLI.

# ng version
OR
# ng --version

إنشاء مشروع Angular باستخدام Angular CLI.

في هذا القسم ، سنوضح كيفية إنشاء وبناء وخدمة مشروع Angular جديد وأساسي. أولاً ، انتقل إلى دليل الجذر الويبي لخادمك ، ثم قم بتهيئة تطبيق Angular جديد كما يلي (تذكر أن تتبع التعليمات):

# cd /var/www/html/
# ng new tecmint-app			#as root
OR
$ sudo ng new tecmint-app		#non-root user

بعد ذلك ، انتقل إلى دليل التطبيق الذي تم إنشاؤه للتو ، وقم بخدمة التطبيق كما هو موضح.

# cd tecmint-app
# ls 			#list project files
# ng serve

قبل أن تتمكن من الوصول إلى تطبيقك الجديد من متصفح الويب ، إذا كان لديك خدمة جدار نار تعمل ، فيجب عليك فتح منفذ 4200 في تكوين جدار الحماية كما هو موضح.

---------- On Firewalld ---------- 
# firewall-cmd --permanent --zone=public --add-port=4200/tcp 
# firewall-cmd --reload

---------- On UFW ----------
$ sudo ufw allow 4200/tcp
$ sudo ufw reload

الآن يمكنك فتح متصفح الويب والتنقل باستخدام العنوان التالي لرؤية تطبيق جديد يعمل كما هو موضح في الصورة التالية.

http://localhost:4200/ 
or 
http://SERVER_IP:4200

ملاحظة: إذا استخدمت الأمر ng serve لبناء تطبيق وخدمته محلياً، كما هو موضح أعلاه، يعيد الخادم بشكل تلقائي بناء التطبيق وإعادة تحميل صفحة الويب عند تغيير أي من ملفات المصدر.

لمزيد من المعلومات حول أداة ng، قم بتشغيل الأمر التالي.

# ng help

صفحة البداية لـ Angular CLI: https://angular.io/cli

في هذه المقالة، قدمنا كيفية تثبيت Angular CLI على توزيعات Linux المختلفة. كما قمنا بشرح كيفية بناء وتجميع وخدمة تطبيق Angular أساسي على خادم تطوير. لأي استفسارات أو أفكار ترغب في مشاركتها معنا، استخدم النموذج أدناه للتعليقات.