1
00:00:00,000 --> 00:00:04,686
[MÚSICA]

2
00:00:04,686 --> 00:00:09,110
A última pergunta que pode surgir em sua mente é como faço para construir e

3
00:00:09,110 --> 00:00:11,590
implantar o aplicativo Angular?

4
00:00:11,590 --> 00:00:15,787
Se você se lembra, no curso anterior no Bootstrap 4,

5
00:00:15,787 --> 00:00:19,801
aprendemos sobre como usar os scripts MPM ou grand ou

6
00:00:19,801 --> 00:00:26,560
culp para construir a pasta de distribuição, a fim de construir nossa aplicação web.

7
00:00:26,560 --> 00:00:31,504
Agora, com a aplicação Angular que temos vindo a desenvolver neste curso,

8
00:00:31,504 --> 00:00:33,797
temos a ajuda do Angular CLI.

9
00:00:33,797 --> 00:00:39,402
O Angular CLI fornece um comando de compilação que nos permite construir nosso aplicativo Angular

10
00:00:39,402 --> 00:00:45,010
, construir a pasta de distribuição e, em seguida, ter todos os arquivos para

11
00:00:45,010 --> 00:00:50,286
nosso aplicativo Angular compilado e pronto para implantar em um site de servidor.

12
00:00:50,286 --> 00:00:53,497
Então é isso que vamos aprender neste exercício.

13
00:00:55,477 --> 00:01:00,065
Para avançar com a construção e implantação da nossa aplicação Angular em

14
00:01:00,065 --> 00:01:04,969
o prompt tipo ng building — porque queremos desenvolver a versão de produção

15
00:01:04,969 --> 00:01:09,935
do nosso aplicativo Angular que pode ser implantado em um servidor.

16
00:01:09,935 --> 00:01:13,925
Então, para fazer isso, no prompt, como eu mencionei, digite ng

17
00:01:15,045 --> 00:01:19,935
build —prod, e então deixe o processo de compilação completo.

18
00:01:22,225 --> 00:01:26,755
Isso levará um pouco de tempo para que o processo de compilação seja concluído.

19
00:01:26,755 --> 00:01:28,924
Depois que o processo de compilação estiver concluído,

20
00:01:28,924 --> 00:01:32,391
você verá que a pasta de distribuição agora estará pronta.

21
00:01:32,391 --> 00:01:35,860
Uma vez que o processo de construção seja concluído com sucesso, então

22
00:01:35,860 --> 00:01:41,111
você pode ver que está tudo verde lá, então a pasta de distribuição está preparada agora.

23
00:01:41,111 --> 00:01:44,829
Agora, como implantamos o aplicativo Angular?

24
00:01:44,829 --> 00:01:50,789
Agora, neste caso, se temos um servidor onde você pode implantar seu aplicativo web,

25
00:01:50,789 --> 00:01:54,547
então é apenas uma questão de copiar o conteúdo de

26
00:01:54,547 --> 00:01:58,420
a pasta de distribuição diretamente para o servidor.

27
00:01:58,420 --> 00:02:02,770
E então seu aplicativo Angular estará funcionando em pouco tempo.

28
00:02:02,770 --> 00:02:06,842
Agora, felizmente, já temos nosso servidor JSON em execução lá.

29
00:02:06,842 --> 00:02:09,411
Então vamos usar o nosso servidor JSON e

30
00:02:09,411 --> 00:02:14,468
a pasta pública do nosso servidor JSON, para que eles copiem todo o conteúdo

31
00:02:14,468 --> 00:02:19,057
da pasta de distribuição para a pasta pública do nosso servidor JSON.

32
00:02:19,057 --> 00:02:23,317
Indo para a pasta Confusão, onde a nossa aplicação está armazenada,

33
00:02:23,317 --> 00:02:26,370
vamos passar agora para a pasta de distribuição.

34
00:02:26,370 --> 00:02:28,720
Você verá que a pasta de distribuição foi criada.

35
00:02:28,720 --> 00:02:31,390
Então você vai para a pasta de distribuição e

36
00:02:31,390 --> 00:02:36,450
você verá que um monte de arquivos foram criados pelo processo de compilação Angular CLI.

37
00:02:38,015 --> 00:02:43,199
Vamos apenas copiar todo o conteúdo desta pasta, e

38
00:02:43,199 --> 00:02:50,327
então vamos para o servidor JSON, que está na pasta json-server aqui e

39
00:02:50,327 --> 00:02:54,760
ir para a pasta pública da pasta json-server.

40
00:02:54,760 --> 00:02:59,597
E então vamos simplesmente copiar o conteúdo para esta pasta pública.

41
00:02:59,597 --> 00:03:05,596
Agora seu aplicativo Angular deve estar disponível em localhost:3000 porque

42
00:03:05,596 --> 00:03:12,031
seu servidor JSON servirá tudo o que estiver na pasta pública no localhost:3000.

43
00:03:12,031 --> 00:03:18,886
Indo para um navegador, agora em uma nova guia vou digitar localhost:3000 e

44
00:03:18,886 --> 00:03:26,080
você verá que seu aplicativo Angular agora estará funcionando em nenhum momento.

45
00:03:26,080 --> 00:03:29,230
Então é assim que você implantaria seu aplicativo Angular.

46
00:03:29,230 --> 00:03:32,970
Agora, é claro, neste caso, já que temos nosso servidor sob nosso controle,

47
00:03:32,970 --> 00:03:36,270
é apenas uma questão de copiar os arquivos para o lado do servidor.

48
00:03:36,270 --> 00:03:42,030
Agora, se você estiver fazendo essa implantação em um servidor real na Nuvem,

49
00:03:42,030 --> 00:03:46,395
então você só precisa seguir as instruções que são dadas pelo

50
00:03:46,395 --> 00:03:51,056
o provedor de serviços Cloud para aumentar o lado do servidor.

51
00:03:51,056 --> 00:03:56,982
Então eles podem ter uma pasta pública que pode ser suportada em seu servidor de nuvem.

52
00:03:56,982 --> 00:04:02,706
Então, nesse caso, você pode simplesmente precisar copiar o conteúdo da pasta

53
00:04:02,706 --> 00:04:09,920
de distribuição para a pasta do servidor público em seu provedor de serviços de nuvem.

54
00:04:09,920 --> 00:04:14,204
É claro que você também precisa garantir que haja um servidor de back-end

55
00:04:14,204 --> 00:04:17,982
em execução que suporte a API REST.

56
00:04:17,982 --> 00:04:21,266
No nosso caso, o servidor JSON está servindo a finalidade.

57
00:04:21,266 --> 00:04:25,719
Quando você concluir o curso final nesta especialização,

58
00:04:25,719 --> 00:04:30,434
onde lidamos com o desenvolvimento do lado do servidor usando Node-JS,

59
00:04:30,434 --> 00:04:36,370
você aprenderá o procedimento para construir seu próprio servidor de API REST personalizado.

60
00:04:36,370 --> 00:04:41,240
Então, nesse caso, em seguida, dentro do servidor REST API haverá uma pasta pública que

61
00:04:41,240 --> 00:04:43,870
irá suportar, e então você teria

62
00:04:43,870 --> 00:04:48,360
necessidade de copiar seu aplicativo Angular para a pasta pública no lado do servidor.

63
00:04:49,490 --> 00:04:53,170
É assim que você implantaria seu aplicativo Angular.

64
00:04:53,170 --> 00:04:55,860
Com isso, completamos este exercício.

65
00:04:55,860 --> 00:05:00,300
Neste exercício, aprendemos como implantar nosso aplicativo Angular

66
00:05:00,300 --> 00:05:02,341
em um servidor.

67
00:05:02,341 --> 00:05:07,124
E como fazer uso do Angular CLI para construir uma versão de produção do nosso aplicativo

68
00:05:07,124 --> 00:05:11,352
Angular antes de fazer a implantação do nosso aplicativo Angular

69
00:05:11,352 --> 00:05:13,604
para o lado do servidor.

70
00:05:13,604 --> 00:05:19,459
[MÚSICA]