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

2
00:00:04,686 --> 00:00:09,110
La dernière question qui pourrait se poser dans votre esprit est comment construire et

3
00:00:09,110 --> 00:00:11,590
déployer l'application Angular ?

4
00:00:11,590 --> 00:00:15,787
Si vous vous souvenez, dans le cours précédent sur Bootstrap 4,

5
00:00:15,787 --> 00:00:19,801
, nous avons appris comment utiliser les scripts MPM ou grand ou

6
00:00:19,801 --> 00:00:26,560
culp pour construire le dossier de distribution, afin de construire notre application web.

7
00:00:26,560 --> 00:00:31,504
Maintenant, avec l'application Angular que nous avons développé dans ce cours,

8
00:00:31,504 --> 00:00:33,797
nous avons l'aide de la CLI Angular.

9
00:00:33,797 --> 00:00:39,402
L'Angular CLI fournit une commande de construction qui nous permet de construire notre application Angular

10
00:00:39,402 --> 00:00:45,010
, de construire le dossier de distribution, puis d'avoir tous les fichiers pour

11
00:00:45,010 --> 00:00:50,286
notre application Angular compilés et prêts à être déployés sur un site serveur.

12
00:00:50,286 --> 00:00:53,497
C'est donc ce que nous allons apprendre dans cet exercice.

13
00:00:55,477 --> 00:01:00,065
Pour aller de l'avant avec la construction et le déploiement de notre application Angular à

14
00:01:00,065 --> 00:01:04,969
le type d'invite ng building — parce que nous voulons développer la version de production

15
00:01:04,969 --> 00:01:09,935
de notre application Angular qui peut être déployée sur un serveur.

16
00:01:09,935 --> 00:01:13,925
Donc, à l'invite, comme je l'ai mentionné, tapez ng

17
00:01:15,045 --> 00:01:19,935
build —prod, puis laissez le processus de construction se terminer.

18
00:01:22,225 --> 00:01:26,755
Cela prendra un peu de temps pour que le processus de construction soit terminé.

19
00:01:26,755 --> 00:01:28,924
Une fois le processus de construction terminé,

20
00:01:28,924 --> 00:01:32,391
, vous verrez que le dossier de distribution sera maintenant prêt.

21
00:01:32,391 --> 00:01:35,860
Une fois le processus de construction terminé avec succès, donc

22
00:01:35,860 --> 00:01:41,111
vous pouvez voir que tout est vert là-bas, donc le dossier de distribution est maintenant préparé.

23
00:01:41,111 --> 00:01:44,829
Maintenant, comment déployons-nous l'application Angular ?

24
00:01:44,829 --> 00:01:50,789
Maintenant, dans ce cas, si nous avons un serveur où vous pouvez déployer votre application web,

25
00:01:50,789 --> 00:01:54,547
alors il s'agit juste de copier le contenu de

26
00:01:54,547 --> 00:01:58,420
le dossier de distribution directement sur le serveur.

27
00:01:58,420 --> 00:02:02,770
Et puis votre application Angular sera opérationnelle en un rien de temps.

28
00:02:02,770 --> 00:02:06,842
Maintenant, heureusement, nous avons déjà notre serveur JSON qui fonctionne là-bas.

29
00:02:06,842 --> 00:02:09,411
Nous allons donc utiliser notre serveur JSON et

30
00:02:09,411 --> 00:02:14,468
le dossier public de notre serveur JSON, donc ils vont copier le contenu entier

31
00:02:14,468 --> 00:02:19,057
du dossier de distribution dans le dossier public de notre serveur JSON.

32
00:02:19,057 --> 00:02:23,317
En allant dans le dossier Confusion, où notre application est stockée,

33
00:02:23,317 --> 00:02:26,370
nous allons maintenant passer dans le dossier de distribution.

34
00:02:26,370 --> 00:02:28,720
Vous verrez que le dossier de distribution a été créé.

35
00:02:28,720 --> 00:02:31,390
Donc, vous allez dans le dossier de distribution et

36
00:02:31,390 --> 00:02:36,450
vous verrez qu'un tas de fichiers ont été créés par le processus de construction Angular CLI.

37
00:02:38,015 --> 00:02:43,199
Copions simplement tout le contenu de ce dossier, et

38
00:02:43,199 --> 00:02:50,327
alors nous irons vers le serveur JSON, qui est dans le dossier json-server ici et

39
00:02:50,327 --> 00:02:54,760
aller dans le dossier public du dossier json-server.

40
00:02:54,760 --> 00:02:59,597
Et puis nous allons simplement copier le contenu dans ce dossier public.

41
00:02:59,597 --> 00:03:05,596
Maintenant, votre application Angular devrait être disponible sur localhost:3000 parce que

42
00:03:05,596 --> 00:03:12,031
votre serveur JSON servira tout ce qui se trouve dans le dossier public de localhost:3000.

43
00:03:12,031 --> 00:03:18,886
En allant dans un navigateur, maintenant dans un nouvel onglet, je vais juste taper localhost:3000 et

44
00:03:18,886 --> 00:03:26,080
, vous verrez que votre application Angular sera maintenant opérationnelle en un rien de temps.

45
00:03:26,080 --> 00:03:29,230
C'est donc ainsi que vous déployeriez votre application Angular.

46
00:03:29,230 --> 00:03:32,970
Maintenant, bien sûr, dans ce cas, puisque nous avons notre serveur sous notre contrôle,

47
00:03:32,970 --> 00:03:36,270
c'est juste une question de copier les fichiers dans le côté serveur.

48
00:03:36,270 --> 00:03:42,030
Maintenant, si vous allez faire ce déploiement sur un vrai serveur dans le Cloud,

49
00:03:42,030 --> 00:03:46,395
alors vous avez juste besoin de suivre les instructions données par

50
00:03:46,395 --> 00:03:51,056
le fournisseur de services Cloud pour augmenter le côté serveur.

51
00:03:51,056 --> 00:03:56,982
Ils peuvent donc avoir un dossier public qui peut être pris en charge sur leur serveur cloud.

52
00:03:56,982 --> 00:04:02,706
Donc, dans ce cas, vous devrez peut-être simplement copier le contenu de votre dossier de distribution

53
00:04:02,706 --> 00:04:09,920
dans le dossier du serveur public de votre fournisseur de services cloud.

54
00:04:09,920 --> 00:04:14,204
Bien sûr, vous devez également vous assurer qu'il y a un serveur back-end

55
00:04:14,204 --> 00:04:17,982
en cours d'exécution qui prend en charge l'API REST.

56
00:04:17,982 --> 00:04:21,266
Dans notre cas, le serveur JSON sert le but.

57
00:04:21,266 --> 00:04:25,719
Lorsque vous terminez le cours final dans cette spécialisation,

58
00:04:25,719 --> 00:04:30,434
où nous traitons du développement côté serveur en utilisant Node-JS,

59
00:04:30,434 --> 00:04:36,370
vous apprendrez la procédure pour construire votre propre serveur API REST personnalisé.

60
00:04:36,370 --> 00:04:41,240
Donc, dans ce cas, alors dans le serveur de l'API REST, il y aura un dossier public que

61
00:04:41,240 --> 00:04:43,870
le prendra en charge, et alors vous auriez

62
00:04:43,870 --> 00:04:48,360
besoin de copier votre application Angular dans le dossier public de votre côté serveur.

63
00:04:49,490 --> 00:04:53,170
C'est ainsi que vous déployeriez votre application Angular.

64
00:04:53,170 --> 00:04:55,860
Avec cela, nous terminons cet exercice.

65
00:04:55,860 --> 00:05:00,300
Dans cet exercice, nous avons appris à déployer notre application Angular

66
00:05:00,300 --> 00:05:02,341
sur un serveur.

67
00:05:02,341 --> 00:05:07,124
Et comment utiliser l'interface de ligne de commande Angular pour construire une version de production de notre application

68
00:05:07,124 --> 00:05:11,352
Angular avant de faire le déploiement de notre application Angular

69
00:05:11,352 --> 00:05:13,604
côté serveur.

70
00:05:13,604 --> 00:05:19,459
[MUSIQUE]