1
00:00:00,000 --> 00:00:04,686
[MUSIC]

2
00:00:04,686 --> 00:00:09,110
السؤال الأخير الذي قد ينشأ في عقلك هو كيف يمكنني بناء

3
00:00:09,110 --> 00:00:11,590
ونشر تطبيق Angular؟

4
00:00:11,590 --> 00:00:15,787
إذا كنت تتذكر، في الدورة السابقة على Bootstrap 4،

5
00:00:15,787 --> 00:00:19,801
تعلمنا عن كيفية استخدام البرامج النصية MPM أو الكبرى أو

6
00:00:19,801 --> 00:00:26,560
culp لإنشاء مجلد التوزيع، من أجل بناء تطبيق الويب الخاص بنا.

7
00:00:26,560 --> 00:00:31,504
الآن، مع تطبيق Angular الذي قمنا بتطويره في هذه الدورة،

8
00:00:31,504 --> 00:00:33,797
لدينا مساعدة من CLI Angular.

9
00:00:33,797 --> 00:00:39,402
يوفر Angular CLI أمر بناء يمكننا من بناء

10
00:00:39,402 --> 00:00:45,010
تطبيق Angular الخاص بنا، وبناء مجلد التوزيع ومن ثم يكون جميع الملفات الخاصة

11
00:00:45,010 --> 00:00:50,286
بتطبيق Angular الخاص بنا تم تجميعها وجاهزة للنشر في موقع الخادم.

12
00:00:50,286 --> 00:00:53,497
لذلك هذا ما سنتعلمه في هذا التمرين.

13
00:00:55,477 --> 00:01:00,065
للمضي قدما في بناء ونشر تطبيق Angular الخاص بنا في

14
00:01:00,065 --> 00:01:04,969
بناء نوع ng الفوري - لأننا نريد تطوير

15
00:01:04,969 --> 00:01:09,935
إصدار الإنتاج من تطبيقنا Angular الذي يمكن نشره على الخادم.

16
00:01:09,935 --> 00:01:13,925
لذلك للقيام بذلك، في موجه، كما ذكرت، اكتب ng

17
00:01:15,045 --> 00:01:19,935
build - prod، ومن ثم السماح لعملية البناء كاملة.

18
00:01:22,225 --> 00:01:26,755
سيستغرق ذلك بعض الوقت لإكمال عملية الإنشاء.

19
00:01:26,755 --> 00:01:28,924
بعد اكتمال عملية الإنشاء،

20
00:01:28,924 --> 00:01:32,391
سترى أن مجلد التوزيع سيكون جاهزًا الآن.

21
00:01:32,391 --> 00:01:35,860
بمجرد اكتمال عملية البناء بنجاح، حتى

22
00:01:35,860 --> 00:01:41,111
تتمكن من رؤية أن كل شيء أخضر هناك، لذلك يتم إعداد مجلد التوزيع الآن.

23
00:01:41,111 --> 00:01:44,829
الآن كيف نقوم بنشر تطبيق Angular؟

24
00:01:44,829 --> 00:01:50,789
الآن في هذه الحالة إذا كان لدينا خادم حيث يمكنك نشر تطبيق الويب الخاص بك،

25
00:01:50,789 --> 00:01:54,547
ثم انها مجرد مسألة نسخ محتويات

26
00:01:54,547 --> 00:01:58,420
مجلد التوزيع مباشرة إلى الخادم.

27
00:01:58,420 --> 00:02:02,770
ثم سيتم تشغيل تطبيق Angular الخاص بك في أي وقت من الأوقات.

28
00:02:02,770 --> 00:02:06,842
الآن، لحسن الحظ، لدينا بالفعل خادم JSON لدينا يعمل هناك.

29
00:02:06,842 --> 00:02:09,411
لذلك سنقوم باستخدام خادم JSON الخاص بنا

30
00:02:09,411 --> 00:02:14,468
والمجلد العام لخادم JSON الخاص بنا، بحيث يقومون بنسخ

31
00:02:14,468 --> 00:02:19,057
محتويات مجلد التوزيع بالكامل إلى المجلد العام لخادم JSON الخاص بنا.

32
00:02:19,057 --> 00:02:23,317
الذهاب إلى مجلد الارتباك، حيث يتم تخزين التطبيق لدينا،

33
00:02:23,317 --> 00:02:26,370
سننتقل الآن إلى مجلد التوزيع.

34
00:02:26,370 --> 00:02:28,720
سترى أنه تم إنشاء مجلد التوزيع.

35
00:02:28,720 --> 00:02:31,390
لذلك ستذهب إلى مجلد التوزيع

36
00:02:31,390 --> 00:02:36,450
وسترى أنه تم إنشاء مجموعة من الملفات بواسطة عملية بناء Angular CLI.

37
00:02:38,015 --> 00:02:43,199
دعونا فقط نسخ محتويات هذا المجلد بالكامل،

38
00:02:43,199 --> 00:02:50,327
وبعد ذلك سنذهب إلى خادم JSON، الموجود في مجلد json-server هنا

39
00:02:50,327 --> 00:02:54,760
وانتقل إلى المجلد العام لمجلد json-server.

40
00:02:54,760 --> 00:02:59,597
وبعد ذلك سنقوم ببساطة بنسخ المحتويات في هذا المجلد العام.

41
00:02:59,597 --> 00:03:05,596
الآن يجب أن يكون التطبيق الزاوي متاحًا في localhost:3000 لأن

42
00:03:05,596 --> 00:03:12,031
خادم JSON الخاص بك سيخدم ما هو موجود في المجلد العمومي في localhost:3000.

43
00:03:12,031 --> 00:03:18,886
الذهاب إلى متصفح، والآن في علامة تبويب جديدة، سأكتب فقط localhost:3000

44
00:03:18,886 --> 00:03:26,080
وسترى أن تطبيق Angular الخاص بك سيكون الآن قيد التشغيل وتشغيله في أي وقت من الأوقات.

45
00:03:26,080 --> 00:03:29,230
إذن هذه هي الطريقة التي ستنشر بها تطبيق Angular الخاص بك.

46
00:03:29,230 --> 00:03:32,970
الآن، بالطبع، في هذه الحالة، بما أن خادمنا تحت سيطرتنا،

47
00:03:32,970 --> 00:03:36,270
فهي مجرد مسألة نسخ الملفات إلى جانب الخادم.

48
00:03:36,270 --> 00:03:42,030
الآن، إذا كنت ستقوم بهذا النشر على خادم حقيقي في Cloud،

49
00:03:42,030 --> 00:03:46,395
فأنت بحاجة فقط إلى اتباع التوجيهات التي يقدمها

50
00:03:46,395 --> 00:03:51,056
مزود خدمة Cloud من أجل زيادة جانب الخادم.

51
00:03:51,056 --> 00:03:56,982
لذلك قد يكون لديهم مجلد عمومي قد يكون مدعومًا على خادم السحابة الخاص بهم.

52
00:03:56,982 --> 00:04:02,706
لذلك في هذه الحالة، قد تحتاج ببساطة إلى نسخ

53
00:04:02,706 --> 00:04:09,920
محتويات مجلد التوزيع الخاص بك إلى مجلد الخادم العام في موفر الخدمة السحابية الخاص بك.

54
00:04:09,920 --> 00:04:14,204
بالطبع تحتاج أيضًا إلى التأكد من وجود

55
00:04:14,204 --> 00:04:17,982
خادم خلفي يعمل يدعم واجهة برمجة تطبيقات REST.

56
00:04:17,982 --> 00:04:21,266
في حالتنا، يخدم خادم JSON الغرض.

57
00:04:21,266 --> 00:04:25,719
عند إكمال الدورة النهائية في هذا التخصص،

58
00:04:25,719 --> 00:04:30,434
حيث نتعامل مع تطوير جانب الخادم باستخدام عقدة JS،

59
00:04:30,434 --> 00:04:36,370
ستتعلم الإجراء الخاص ببناء خادم REST API المخصص الخاص بك.

60
00:04:36,370 --> 00:04:41,240
لذلك في هذه الحالة، سيكون هناك مجلد عمومي

61
00:04:41,240 --> 00:04:43,870
يدعمه داخل خادم REST API، ومن ثم

62
00:04:43,870 --> 00:04:48,360
ستحتاج إلى نسخ تطبيق Angular الخاص بك إلى المجلد العمومي على جانب الخادم الخاص بك.

63
00:04:49,490 --> 00:04:53,170
هذه هي الطريقة التي ستقوم بنشر تطبيق Angular الخاص بك.

64
00:04:53,170 --> 00:04:55,860
مع هذا، نكمل هذا التمرين.

65
00:04:55,860 --> 00:05:00,300
في هذا التمرين تعلمنا كيفية نشر

66
00:05:00,300 --> 00:05:02,341
تطبيق Angular الخاص بنا على خادم.

67
00:05:02,341 --> 00:05:07,124
وكيفية الاستفادة من CLI Angular لبناء نسخة إنتاج من

68
00:05:07,124 --> 00:05:11,352
تطبيق Angular الخاص بنا قبل أن نقوم بنشر

69
00:05:11,352 --> 00:05:13,604
تطبيق Angular الخاص بنا إلى جانب الخادم.

70
00:05:13,604 --> 00:05:19,459
[ موسيقى]