1
00:00:03,680 --> 00:00:07,640
Для дальнейшего развития нашего приложения,

2
00:00:07,640 --> 00:00:11,025
мы хотим настроить простой сервер

3
00:00:11,025 --> 00:00:14,890
, который будет обслуживать наши данные, которые требуются нашему приложению.

4
00:00:14,890 --> 00:00:18,440
До сих пор мы не узнали достаточно о том, как

5
00:00:18,440 --> 00:00:22,090
мы можем настроить сервер, который будет обслуживать REST API.

6
00:00:22,090 --> 00:00:26,410
Вместо этого мы будем использовать простой модуль узла под названием json-server,

7
00:00:26,410 --> 00:00:32,990
, который помогает нам быстро настроить простой сервер, который будет обслуживать данные, которые даны

8
00:00:32,990 --> 00:00:36,230
ему в виде файла JSON, а также

9
00:00:36,230 --> 00:00:39,600
обслуживать изображения, которые могут потребоваться нашему приложению.

10
00:00:39,600 --> 00:00:41,020
Итак, для начала,

11
00:00:41,020 --> 00:00:45,450
давайте перейдем к установке модуля узла json-server,

12
00:00:45,450 --> 00:00:50,285
и после этого настроим наш json-server в этом упражнении.

13
00:00:50,285 --> 00:00:53,945
Для начала перейдите в удобное место

14
00:00:53,945 --> 00:00:57,550
на компьютере и создайте папку с именем json-server.

15
00:00:57,550 --> 00:01:01,820
Причина, по которой я создаю эту папку, заключается в том, что я могу хранить все файлы

16
00:01:01,820 --> 00:01:06,170
, которые требуются моему json-server, в этой конкретной папке.

17
00:01:06,170 --> 00:01:15,290
После этого мы установим модуль json-server npm как глобальный модуль MPM.

18
00:01:15,290 --> 00:01:16,620
Итак, чтобы сделать это,

19
00:01:16,620 --> 00:01:20,305
в подсказке в вашем терминале,

20
00:01:20,305 --> 00:01:27,430
тип npm install минус g json-server,

21
00:01:27,430 --> 00:01:30,575
, а затем пусть это завершит установку

22
00:01:30,575 --> 00:01:34,820
модуля json-server npm как глобального модуля.

23
00:01:34,820 --> 00:01:39,525
Теперь, если вы делаете это на Linux или Mac,

24
00:01:39,525 --> 00:01:43,530
обязательно используйте sudo перед ним.

25
00:01:46,460 --> 00:01:49,520
После завершения установки

26
00:01:49,520 --> 00:01:53,545
перейдите к инструкции по настройке json-server,

27
00:01:53,545 --> 00:01:56,935
и там мы предоставляем файл с именем db.json.

28
00:01:56,935 --> 00:02:01,040
Загрузите этот файл и назовите его как db.json и переместите этот файл

29
00:02:01,040 --> 00:02:05,525
в папку json-server, созданную на предыдущем шаге.

30
00:02:05,525 --> 00:02:10,490
Теперь вы видите, что я уже загрузил файл db.json

31
00:02:10,490 --> 00:02:15,500
, а затем перемещаю этот файл db.json в папку json-server.

32
00:02:15,500 --> 00:02:18,830
Кроме того, я также создал другую папку

33
00:02:18,830 --> 00:02:21,690
внутри папки json-server с именем public.

34
00:02:21,690 --> 00:02:26,375
Теперь все, что мы помещаем в эту общую папку, будет доступно

35
00:02:26,375 --> 00:02:33,630
нашего json-сервера в качестве ресурса, который может быть загружен с нашего сервера.

36
00:02:33,630 --> 00:02:40,430
Таким образом, наш json-сервер действует как простой статический веб-сервер, который может помочь нам

37
00:02:40,430 --> 00:02:46,770
обслуживать любые ресурсы, такие как изображения или даже целый веб-сайт.

38
00:02:46,770 --> 00:02:50,300
Если вы хотите, вы можете скопировать это в общую папку и сделать его доступным

39
00:02:50,300 --> 00:02:56,925
для отображения json-server и просмотра в браузере.

40
00:02:56,925 --> 00:02:59,650
Далее, снова, перейдите к инструкции

41
00:02:59,650 --> 00:03:03,915
, а затем скачать этот zip имя файла images.zip,

42
00:03:03,915 --> 00:03:05,570
, а затем распаковать этот файл,

43
00:03:05,570 --> 00:03:08,490
, а затем вы получите папку с именем images,

44
00:03:08,490 --> 00:03:13,880
который содержит набор изображений PNG, которые мы будем использовать в нашем приложении.

45
00:03:13,880 --> 00:03:16,470
Итак, как только папка изображений будет готова,

46
00:03:16,470 --> 00:03:19,160
переместить эту папку изображений в общую папку, которую мы только что создали

47
00:03:19,160 --> 00:03:22,665
в папке json-server.

48
00:03:22,665 --> 00:03:24,485
Перейдя в нашу папку,

49
00:03:24,485 --> 00:03:26,420
вы увидите, что внутри общей папки,

50
00:03:26,420 --> 00:03:31,070
я уже перемещаю подпапку изображений в общую папку здесь,

51
00:03:31,070 --> 00:03:36,510
и это содержит все изображения, которые будут полезны для моего приложения.

52
00:03:36,510 --> 00:03:39,125
Чтобы запустить свой json-server,

53
00:03:39,125 --> 00:03:43,470
перейдите в папку json-server в вашем терминале и в подсказке,

54
00:03:43,470 --> 00:03:50,665
введите json-server и минус watch db.json.

55
00:03:50,665 --> 00:03:54,650
Причина использования этого флага часов

56
00:03:54,650 --> 00:03:58,610
заключается в том, что этот json-сервер будет держать часы в файле bb.json,

57
00:03:58,610 --> 00:04:01,279
и в любое время, когда файл db.json изменяется,

58
00:04:01,279 --> 00:04:07,810
он перезагрузит файл db.json и начнет обслуживать измененные данные с сервера.

59
00:04:07,810 --> 00:04:13,280
Кроме того, мы также можем дать флаг минус d со значением,

60
00:04:13,280 --> 00:04:15,035
скажем, например, 2,000,

61
00:04:15,035 --> 00:04:19,430
, что означает, что когда сервер получает запрос,

62
00:04:19,430 --> 00:04:25,380
он будет возвращать данные запрашивавшей после 2-секундной задержки.

63
00:04:25,380 --> 00:04:31,880
Теперь это будет использоваться для имитации задержки при доступе к серверу через Интернет.

64
00:04:31,880 --> 00:04:35,270
Итак, вот почему я также предлагаю использовать флаг минус d

65
00:04:35,270 --> 00:04:39,255
2000 для json-server.

66
00:04:39,255 --> 00:04:41,390
Итак, давайте запустим наш json-server,

67
00:04:41,390 --> 00:04:44,735
и тогда вы заметите, что json-server запускает

68
00:04:44,735 --> 00:04:49,680
и объявляет все ресурсы, доступные с json-сервера.

69
00:04:49,680 --> 00:04:57,825
Таким образом, вы можете видеть, что он имеет набор ресурсов, которые доступны по всем этим URL-адресам.

70
00:04:57,825 --> 00:05:02,300
Кроме того, общедоступный статический сервер, который обслуживает

71
00:05:02,300 --> 00:05:07,825
статические данные, доступен по этому URL-адресу, localhost:3000.

72
00:05:07,825 --> 00:05:13,445
Теперь вы можете перейти в любой браузер, а затем, если вы напечатаете

73
00:05:13,445 --> 00:05:20,515
localhost:3000 и слэш блюда,

74
00:05:20,515 --> 00:05:27,020
вы увидите, что это начнет обслуживать наши данные в виде массива JSON здесь.

75
00:05:27,020 --> 00:05:30,530
Итак, это будет полезно для нашего приложения.

76
00:05:30,530 --> 00:05:37,395
Аналогично, вы можете набирать лидеров,

77
00:05:37,395 --> 00:05:39,110
и вы увидите, снова,

78
00:05:39,110 --> 00:05:41,095
данные обслуживаются и так далее.

79
00:05:41,095 --> 00:05:45,760
Если вы введете локальный хост:3000,

80
00:05:45,760 --> 00:05:48,665
вы увидите, что сервер будет обслуживать

81
00:05:48,665 --> 00:05:53,395
данные как статический сервер, а затем в настоящее время он пуст.

82
00:05:53,395 --> 00:05:57,860
Теперь, если вы хотите получить доступ к изображениям, которые доступны с сервера,

83
00:05:57,860 --> 00:06:06,520
Я могу просто ввести изображения и ввести имя файла PNG

84
00:06:06,520 --> 00:06:10,020
, а затем вы увидите, что он будет обслуживать соответствующее изображение.

85
00:06:10,020 --> 00:06:12,570
Теперь, это очень полезно для нас,

86
00:06:12,570 --> 00:06:16,170
, поскольку мы разрабатываем наше приложение в этом курсе.

87
00:06:16,170 --> 00:06:19,169
С этим мы завершим это упражнение

88
00:06:19,169 --> 00:06:24,560
, где мы создали простой сервер под названием json-server для обслуживания

89
00:06:24,560 --> 00:06:30,850
данных и поддержки REST API, к которому мы можем получить доступ из нашего приложения.