Angular هو framework لتطبيقات الويب مفتوح المصدر (open-source) لبناء تطبيقات الويب للجوال وسطح المكتب.
هو مكتوب بلغة TypeScript / JavaScript وتم إنشاؤه في عام 2009 بواسطة Google.
إنه مصمم خصيصًا لبناء تطبيقات صغيرة أو كبيرة الحجم من البداية.
يأتي مزودًا بأداة Angular CLI التي تساعدك على إنشاء تطبيقات Angular وإدارتها وإنشائها واختبارها.
سنشرح هنا تثبيت Angular على Ubuntu 20.04.
المتطلبات الأساسية
خادم يعمل بنظام التشغيل Ubuntu 20.04.
اعداد كلمة مرور الـ root على الخادم.
تثبيت Node.js.
ستحتاج إلى تثبيت Node.js و npm في نظامك.
لا يتوفر أحدث إصدار من Node.js في Ubuntu 20.04 الافتراضي. لذلك ستحتاج إلى إضافة Node.js إلى نظامك.
اضافة Node.js بالأمر التالي:
curl -sL https://deb.nodesource.com/setup_14.x | bash -
بمجرد الإضافة قم بتثبيت Node.js باستخدام الأمر التالي:
apt-get install nodejs -y
تحقق من الإصدار المثبت من Node.js باستخدام الأمر التالي:
node --version
سترى النتيجة التالية
v14.7.0
قم بتحديث إصدار npm إلى أحدث إصدار عن طريق تشغيل الأمر التالي:
npm install npm@latest -g
تحقق من إصدار npm باستخدام الأمر التالي:
npm --version
سترى النتيجة التالية
6.14.7
تثبيت Angular
يمكنك تثبيت Angular باستخدام npm كما هو موضح أدناه:
npm install -g @angular/cli
تحقق من الإصدار المثبت من Angular باستخدام الأمر التالي:
ng version
سترى النتيجة التالية
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ ? \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 10.0.5
Node: 14.7.0
OS: linux x64
Angular:
...
Ivy Workspace:
Package Version
------------------------------------------------------
@angular-devkit/architect 0.1000.5
@angular-devkit/core 10.0.5
@angular-devkit/schematics 10.0.5
@schematics/angular 10.0.5
@schematics/update 0.1000.5
rxjs 6.5.5
إنشاء مشروع Angular
تم تثبيت Angular في نظامك وحان الوقت لإنشاء مشروع جديد مع Angular.
أولاً ، قم بتغيير المجلد إلى / opt وأنشئ مشروعًا جديدًا باسم myproject باستخدام الأمر التالي:
cd /opt
ng new myproject
قم بتغيير المجلد إلى myproject وقم بخدمة (serve) المشروع بالأمر التالي:
cd myproject
ng serve --host your-server-ip --port 8088
سترى النتيجة التالية
WARNING: This is a simple server for use in testing or debugging Angular applications
locally. It hasn't been reviewed for security issues.
Binding this server to an open connection can result in compromising your application or
computer. Using a different host than the one passed to the "--host" flag might result in
websocket connection issues. You might need to use "--disableHostCheck" if that's the
case.
Compiling @angular/animations : es2015 as esm2015
Compiling @angular/core : es2015 as esm2015
Compiling @angular/animations/browser : es2015 as esm2015
Compiling @angular/animations/browser/testing : es2015 as esm2015
Compiling @angular/common : es2015 as esm2015
Compiling @angular/common/http : es2015 as esm2015
Compiling @angular/common/http/testing : es2015 as esm2015
Compiling @angular/forms : es2015 as esm2015
Compiling @angular/platform-browser : es2015 as esm2015
Compiling @angular/platform-browser/animations : es2015 as esm2015
Compiling @angular/core/testing : es2015 as esm2015
Compiling @angular/platform-browser-dynamic : es2015 as esm2015
Compiling @angular/platform-browser/testing : es2015 as esm2015
Compiling @angular/compiler/testing : es2015 as esm2015
Compiling @angular/platform-browser-dynamic/testing : es2015 as esm2015
Compiling @angular/common/testing : es2015 as esm2015
Compiling @angular/router : es2015 as esm2015
Compiling @angular/router/testing : es2015 as esm2015
chunk {main} main.js, main.js.map (main) 60.6 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 12.3 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 2.65 MB [initial] [rendered]
Date: 2020-08-09T14:10:36.644Z - Hash: a053188b5496361814a2 - Time: 14873ms
** Angular Live Development Server is listening on 69.87.218.220:8088, open your browser on http://69.87.218.220:8088/ **
: Compiled successfully.
At this point, Angular project is deployed and listening on port 8088. You can access it using the URL http://your-server-ip:8088. You should see the following screen:
واجهة ويب Angular
تم نشر مشروع Angular على المنفذ 8088.
يمكنك الوصول إليه باستخدام عنوان URL http: // your-server-ip: 8088 . يجب أن ترى الشاشة التالية:
