1
00:00:00,120 --> 00:00:00,500
어느 한 쪽.

2
00:00:00,510 --> 00:00:01,450
다시 오신 것을 환영합니다.

3
00:00:01,770 --> 00:00:06,290
그래서 이번 강의에서는 우리 캠프의 유용성을 향상시키는 데 초점을 맞추고 있습니다.

4
00:00:06,510 --> 00:00:13,710
지금은 사용자에게 피드백이나 오류 메시지 또는 성공 메시지를 제공하는 것과 같이 일종의 재앙입니다.

5
00:00:13,920 --> 00:00:17,090
그리고 재앙으로 나는 그것이 전혀 존재하지 않는다는 것을 의미합니다.

6
00:00:17,100 --> 00:00:21,400
분명히 사용자가 볼 수없는 협의회 로그가 있습니다.

7
00:00:21,480 --> 00:00:27,000
우리는 영사관에서 서버가 실행되고 있지만 아무도 그것을 볼 수없는 개발자로 여기 있습니다.

8
00:00:27,360 --> 00:00:32,370
그래서 우리는 몇 가지 메시지를 추가하는 것에 중점을 둘 예정이며, 잠시 후에 그 메시지가 어떻게 보이는지 보여 드리겠습니다.

9
00:00:32,460 --> 00:00:36,790
내가하기 전에 지금 우리가 이야기 할 세 가지 주요 목표가 있습니다.

10
00:00:36,990 --> 00:00:37,980
그래서 그것을 데모하고 싶습니다.

11
00:00:37,980 --> 00:00:46,630
먼저 그것이 어떻게 동작 하는지를 어떻게 예상 할지를 보여줍니다. 그러면 connect flash라는 패키지를 실제로 설치하고 구성 할 것입니다.

12
00:00:46,830 --> 00:00:53,940
그래서 우리가하고있는 일은 플래시 나 플래셔에 다른 대명사의 플래시를 추가하고 사람들이 그것을 부르는 것입니다.

13
00:00:54,000 --> 00:00:56,070
다른 프레임 워크에서는 플래시 해시가 사용됩니다.

14
00:00:56,070 --> 00:01:05,520
사람들은이 메시지를 플래시 메시지라고 부르지 만 근본적으로 우리는 성공적으로 로그인하거나 성공적으로 로그 아웃 한 것처럼 사용자에게 메시지를 보여줄 것입니다.

15
00:01:05,700 --> 00:01:08,310
아니면 네가 그런 일을 할 권한이 없다든지.

16
00:01:08,320 --> 00:01:12,270
또는 캠프장을 추가하기 전에 로그인하십시오.

17
00:01:12,390 --> 00:01:17,640
우리는 한 번 사용자에게 그것을 보여주고 싶습니다 그리고 우리는 그것이 페이지에 영구적 인 고정물이되고 싶지 않아요.

18
00:01:17,700 --> 00:01:31,470
한 번 플래시 한 다음 다음 페이지로 넘어가거나 사용자가 새로 고침 한 다음 마지막으로 플래시 메시지를 헤더에 추가하고 스타일을 지정할 일부 부트 스트랩 클래스를 추가하면됩니다.

19
00:01:31,470 --> 00:01:34,230
그래서 부트 스트랩으로 일을 처리하는 방법이 있습니다.

20
00:01:34,350 --> 00:01:44,100
이것은 부트 스트랩이 활용할 스타일을 위해 내장 된 모든 종류의 사이트에서 사용자에게 플래시되는 메시지를 갖는 일반적인 기능입니다.

21
00:01:44,250 --> 00:01:47,850
그래서 나는 그것이 어떻게 생겼는지 보여줄 것입니다.

22
00:01:47,940 --> 00:01:49,530
그래서 나는 캠프를 운영하고있다.

23
00:01:49,610 --> 00:01:59,970
잘 보겠습니다. 지금 로그 아웃하면 보여 드리겠습니다. 로그 아웃하면 냉장고에 로그인했습니다. loungy라는 메시지가 나오면 메시지 텍스트를 바꿀 수 있습니다.

24
00:01:59,970 --> 00:02:09,340
분명히 내가 로그인하지 않은 상태에서 지금 새로운 캠프장을 추가하려고하면 로그인해야한다는 메시지가 나타납니다.

25
00:02:09,420 --> 00:02:11,070
그리고 그것이 여기에서 읽힌다는 것을주의하십시오.

26
00:02:11,520 --> 00:02:13,420
이것이 부트 스트랩 클래스입니다.

27
00:02:13,440 --> 00:02:18,610
이 경고는 페이지가 사라지면 신선하게 보입니다.

28
00:02:18,690 --> 00:02:25,690
그래서 지금 내가 시도하고 등록하면 나는 이미 존재하는 레시 (resti)로 가입한다고 말해야한다.

29
00:02:25,950 --> 00:02:28,500
그래서 나는 과거에 그렇게 할 수 없어야했습니다.

30
00:02:28,500 --> 00:02:30,070
페이지가 새로 고침됩니다.

31
00:02:30,330 --> 00:02:36,470
그러나 우리가 끝내는 메시지는 주어진 사용자 이름을 가진 사용자가 이미 등록되었다는 메시지입니다.

32
00:02:36,870 --> 00:02:37,370
승인.

33
00:02:37,470 --> 00:02:39,490
그래서 나는 누군가 새로운 사람으로 등록하게한다.

34
00:02:39,690 --> 00:02:42,620
큰 실수를 해보 죠.

35
00:02:42,630 --> 00:02:50,890
이제 야채에서 가전 제품으로 옮겼습니다. 성공적으로 메시지를 성공적으로 등록했습니다.

36
00:02:50,910 --> 00:02:52,330
밴더를 만나서 반갑습니다.

37
00:02:52,380 --> 00:02:55,130
페이지를 새로 고침하면 사라집니다.

38
00:02:55,710 --> 00:03:00,560
그래서 우리가 그 메시지를 가지고있는 다른 장소들이 있지만 당신을 보여줄 것입니다.

39
00:03:00,690 --> 00:03:04,050
예를 들어 내가 소유하지 않은이 캠프장을 시도하고 편집하면.

40
00:03:04,050 --> 00:03:05,580
Tater 꼬마들이 그것을 소유하고 있습니다.

41
00:03:05,580 --> 00:03:07,260
나는이 믹서기에 로그인했습니다.

42
00:03:07,770 --> 00:03:10,950
숨겨진 상태이므로 편집하려면 여기로 이동하는 링크가 없습니다.

43
00:03:11,280 --> 00:03:17,950
그러나 기술적으로 나는 아직도 당신이 그 일을 할 수있는 권한이 없다는 메시지를받는 곳으로 갈아 탈 수 있습니다.

44
00:03:18,030 --> 00:03:19,710
나를 다시 여기로 보낸다.

45
00:03:20,070 --> 00:03:26,950
코멘트가있는 것과 같은 것은 여기에 코멘트가 있다면 그것은 다른 누군가에 의해 만들어졌습니다.

46
00:03:27,150 --> 00:03:34,720
필자가 수동으로 해당 링크로 이동하여 슬래시를 추가하면 메시지가 표시되지만 ID를 찾아야하기 때문에 많은 작업이 필요합니다.

47
00:03:34,900 --> 00:03:42,030
그리고 어쨌든 나는 지금 그것에 들어가기를 원하지 않지만, 우리가 추가하는 것과 똑같은 코드가 당신이 할 권한이 없다고 말할 것입니다.

48
00:03:42,060 --> 00:03:50,420
그리고 나서 마지막으로 나가서 로그 아웃하면 돌아가서 새로운 코멘트를 추가하려고하면 같은 메시지가 나타납니다.

49
00:03:50,430 --> 00:03:52,030
로그인하려면 로그인해야합니다.

50
00:03:52,050 --> 00:03:55,010
내가 캠프장에 서명하지 않았을 때 캠프장을 만들려고하는 것처럼.

51
00:03:55,260 --> 00:03:55,530
승인.

52
00:03:55,530 --> 00:04:00,340
이것이 바로 최종 목표이며 실제로 우리가이 작업을하기가 쉽습니다.

53
00:04:00,360 --> 00:04:05,580
이 패키지를 사용하면 우리가 할 수있는 일없이 패키지를 만들 수 있습니다.

54
00:04:05,700 --> 00:04:07,520
우리가 올바른 버전을 열 때.

55
00:04:07,740 --> 00:04:12,960
그래서 나는이 11 버전을 위해 새로운 버전을 만들었습니다.

56
00:04:13,440 --> 00:04:23,470
그러므로 11 절을 보시고 모든 것을 깨끗하게하고 예를 들어 봅시다.

57
00:04:24,610 --> 00:04:25,040
승인.

58
00:04:25,110 --> 00:04:26,210
그래서 우리는 여기서 일하게 될 것입니다.

59
00:04:26,280 --> 00:04:30,390
다시 이것은 당신이 따라 다니는 경우를 대비하여 V 11입니다.

60
00:04:30,390 --> 00:04:33,790
내가 할 첫 번째 일은 우리가 사용할 패키지를 보여주는 것입니다.

61
00:04:33,820 --> 00:04:35,400
Kinect 플래시라고합니다.

62
00:04:35,400 --> 00:04:38,080
거기 밖으로 다른 패키지가 이렇게했다.

63
00:04:38,280 --> 00:04:45,090
get home repo를 살펴 본다면 문서는 사실 조금 오래된 것입니다.

64
00:04:45,510 --> 00:04:51,410
우리는 2015 년 초 Express를 사용하고 있습니다.

65
00:04:51,930 --> 00:05:00,090
문서는 X를 가리 키기 위해 Express에 대해 말하며 다음에 X가있는 세 점 X에 대해서도 이야기합니다.

66
00:05:00,180 --> 00:05:29,710
따라서 이러한 지침은 정확히 동일하지 않습니다. Connect 플래시로 돌아 가면 처음 외부 링크 중 일부가 표시됩니다. 4.00을 K'NEX 플래시로 설정했는데 이미 살펴 보았거나 항상 사용할 수 있습니다. 이런 식으로 나중에 표현했다 그리고 당신은 우리가 그 같은 링크를 얻는 것을 볼 수 있습니다. 여기에 자습서가 있습니다. 당신이보기를 원한다면 스택 오버 플로우 포스트가 있습니다.

67
00:05:29,990 --> 00:05:32,910
그래서 나는 이것을 더 일찍했다.

68
00:05:33,080 --> 00:05:37,450
새로운 것이 나오면 코드가 업데이트되고 있다는 것을 알 때 많은 것을해야합니다.

69
00:05:37,550 --> 00:05:42,620
특히 Express 4.0과 같은 것들이 상당히 크게 변경됩니다.

70
00:05:42,680 --> 00:05:48,110
Express의 일부였던 많은 것들이 별도의 패키지로 명시 적으로 옮겨졌습니다.

71
00:05:48,110 --> 00:05:50,280
명명 및 구문 중 일부가 변경되었습니다.

72
00:05:50,430 --> 00:06:03,850
그래서 저는 익스프레스에서 익스프레스로 추가하지 않은 것을 무언가하려고 할 때 종종 훌륭한 일을하기 때문에 훌륭한 검색 자습서를 찾을 수 있기 때문에 항상 그렇게하는 것이라고 말합니다.

73
00:06:03,880 --> 00:06:14,900
2 년 전의 90 %는 동일하지만 10 %는 2 년 전의 Express와 다른 점을 이해하는 것이 매우 중요합니다.

74
00:06:14,900 --> 00:06:15,950
괜찮아.

75
00:06:15,950 --> 00:06:19,110
그래서 우리가하고 싶은 일은이 패키지를 설치하는 것입니다.

76
00:06:19,400 --> 00:06:21,070
따라서 연결 플래시라고합니다.

77
00:06:21,110 --> 00:06:29,260
그래서 우리는 NPM 설치 대쉬 대시 대시 플래시 연결을 원한다.

78
00:06:31,050 --> 00:06:31,700
승인.

79
00:06:31,910 --> 00:06:37,530
이제 그 작업이 완료되었으므로 플래시로 추가합니다.

80
00:06:38,030 --> 00:06:45,030
연결 대시 플래시를 요구하는 플래시 연결보다는 플래시라고 부릅니다.

81
00:06:45,080 --> 00:06:53,320
우리가 거기에 쉼표를 가지고 있는지 확인한 다음, 우리가해야 할 일은 플래시가 응용 프로그램에 사용되도록 알려주는 것입니다.

82
00:06:53,360 --> 00:07:09,700
그래서 우리는 K'NEX 플래시의 내용을 패키지로 저장하고 플래시 변수에 저장했습니다. 그런 변수 앱 실행 플래시를 실행해야합니다.

83
00:07:09,710 --> 00:07:11,500
기술적으로 모든 것이 우리가해야 할 일입니다.

84
00:07:11,510 --> 00:07:27,700
우리는 이제 Connect Flash를 설치했습니다. 다시 돌아가서 문서를 살펴보면 세션에서 쿠키 파서를 사용하여 여기에서 수행하는 다른 구성이 있지만 실제로 이미 우리가하고있는 위치에 이미 설정되어 있습니다.

85
00:07:27,730 --> 00:07:31,210
당신은 어디에서 표현 세션이 필요하며 우리는 비밀을 설정하고 있습니다.

86
00:07:31,220 --> 00:07:37,580
그래서 우리는 이미 Express 세션을 사용하기 위해 앱을 설정했기 때문에 걱정할 필요가 없습니다.

87
00:07:38,070 --> 00:07:44,710
좋아, 이제 우리는 플래시의 내용을 보여주는 모든 단일 페이지에 대해 할 것입니다.

88
00:07:44,810 --> 00:07:46,940
우리는 그 안에있는 메시지를 가져갈 것입니다.

89
00:07:46,940 --> 00:07:54,290
좋지 않거나 좋지 않을 수도 있습니다. 그리고 페이지의 맨 위에 표시하고 헤더 파일에 나타납니다.

90
00:07:54,330 --> 00:07:54,710
E.J ..

91
00:07:54,740 --> 00:08:18,430
예. 오류 또는 성공 메시지 만 표시하는 코드가 있습니다. 그러면 오류 또는 메시지가 필요한 장소를 만날 때 캠프 그라운드 대신 우리 야영지 대신에 로그인하지 않으면 새로운 캠프장을 추가 할 수없는 미들웨어에 로그인되어 있습니다.

92
00:08:18,440 --> 00:08:30,500
우리가 미들웨어에 가서 우리가 보게 될 것이 있다면 로그인 할 필요가있다는 메시지가 나타나기를 원할 것입니다. 또는 로그인하십시오.

93
00:08:30,500 --> 00:08:32,800
그 코드는 바로 여기에 있습니다.

94
00:08:32,900 --> 00:08:38,440
그래서 우리가 리다이렉트하기 전에 우리는 플래시에 뭔가를 추가 할 것입니다.

95
00:08:38,840 --> 00:08:44,860
그래서 마치 실제로 점 플래시를 요구하는 것처럼 보입니다.

96
00:08:45,260 --> 00:08:47,370
그런 다음 키를 제공 할 수 있습니다.

97
00:08:47,720 --> 00:08:50,000
잠시 후에 내가 보여 드리겠습니다.

98
00:08:50,000 --> 00:08:59,300
우리는 성공과 오류를 사용할 것이고, 우리는 그 메시지를 사용하여 경고 메시지가 녹색인지 빨간색인지를 결정할 것입니다.

99
00:08:59,300 --> 00:09:04,550
그래서 그 부분은 지금은 중요하지 않습니다. 그러나이 부분은 우리가 메시지를 전달할 곳에서 중요합니다.

100
00:09:04,760 --> 00:09:09,560
그래서 우리는 먼저 로그인하십시오.

101
00:09:09,590 --> 00:09:12,470
다시 이것은 미들웨어에 로그인 된 내부입니다.

102
00:09:12,740 --> 00:09:16,740
따라서 사용자가 로그인 한 경우 요청이 인증되었는지 확인합니다.

103
00:09:16,800 --> 00:09:19,430
그런 다음 이전에했던 일을 계속하십시오.

104
00:09:20,180 --> 00:09:24,030
그러나 슬래시 로그인으로 리디렉션하기 전에는 그렇지 않습니다.

105
00:09:24,090 --> 00:09:26,390
예, 로그인하여 슬래시로 리디렉션하는지 기억하십시오.

106
00:09:26,390 --> 00:09:29,320
이 줄이 없으면 그냥 계속됩니다.

107
00:09:29,320 --> 00:09:36,740
나는 그 길을 열어야 할 것이다. 그러나 바로 여기에있는 코드와 슬래시 로그온으로 바로 갈 것이다.

108
00:09:36,740 --> 00:09:43,960
그래서 우리는이 코드 플래시를 실행하려고하기 전에 로그인을 렌더링합니다.

109
00:09:44,120 --> 00:09:53,060
그리고이 작업은 기본적으로 수행됩니다. 먼저 로그인하여 플래시에 추가하면 다음에 보일 때까지 표시되지 않습니다.

110
00:09:53,180 --> 00:10:06,540
따라서이 경우 실제로 아무것도 렌더링하지 않고 로그인 만하면됩니다. 플래시가 작동하는 방식은 바로 플래시가 즉시 실행되지 않는다는 점에서 정말 좋습니다.

111
00:10:06,550 --> 00:10:09,650
그것은 단지 작동하거나 다음 페이지에 나타납니다.

112
00:10:09,650 --> 00:10:13,130
리디렉션하기 전에 실제로 그렇게합니다.

113
00:10:13,130 --> 00:10:20,690
따라서이 경우 먼저 로그인 한 다음 슬래시 로그인으로 리디렉션 한 다음 로그 및 양식에 메시지가 표시됩니다.

114
00:10:20,690 --> 00:10:22,470
지금 우리는 그것을 표시하지 않습니다.

115
00:10:22,520 --> 00:10:35,510
다시 말하면이 줄을 추가하는 것만 반복하면 다음 요청에서이 줄을 우리에게 제공하는 기능을 제공합니다.

116
00:10:35,510 --> 00:10:40,570
그래서 우리는 즉시 플래시하지 않고 우리는 아무것도 보이지 않고 있습니다.

117
00:10:40,580 --> 00:10:55,320
이 모든 일은 플래시에서 성공이라고하기보다는 플래시에서이 오류를 호출하는 것이 더 중요하다고 생각합니다. 다음 요청에 대해 먼저 로그인 한 다음 로그온을 슬래시로 리디렉션하십시오.

118
00:10:55,820 --> 00:11:02,610
그래서 우리는 여기서 로그온을 처리해야합니다.

119
00:11:02,990 --> 00:11:06,790
그래서 메시지 전달과 같은 일을 할 수있었습니다.

120
00:11:07,340 --> 00:11:24,330
그리고 물론 모든 것을 시작할 수 있도록 이것을 보여줄 수 있습니다. 만약 우리가 단지 메시지를 잘못 작성했다면 그냥 템플릿에 표시 할 수 있습니다. 그래서 휴즈 로그인 안에 슬래시 로그인을하십시오.

121
00:11:24,540 --> 00:11:31,900
네, 아주 맨 위에는 그냥 메시지를 표시하는 H-1을 가질 수 있습니다.

122
00:11:31,940 --> 00:11:33,650
아주 새로운 것은 없습니다.

123
00:11:33,650 --> 00:11:37,140
그래서 나는 지금 그 모습을 보여줄 것입니다.

124
00:11:37,190 --> 00:11:44,920
서버를 리디렉션하여 슬래시 로그인으로 시작하면 매번 오류가 발생할 때마다이 메시지가 표시됩니다.

125
00:11:44,960 --> 00:11:46,060
당신이 망 쳤어.

126
00:11:46,250 --> 00:11:55,570
여러분이이 시점에서 기대했던 바를 볼 수 있듯이, 로그인 할 때마다 하드 코딩을했기 때문에 여러분이 그것을 망쳤다는 것을 알 수 있습니다.

127
00:11:56,080 --> 00:12:06,370
좋아, 플래시를 사용하면 우리가 할 수있는 일은 이제 메시지가 플래시 요청과 같다고 말하면서 플래시에서 오류를 처리 할 수 ​​있습니다.

128
00:12:06,740 --> 00:12:09,110
그래서 약간 혼란 스럽습니다.

129
00:12:09,530 --> 00:12:16,980
하지만 기본적으로 아이디어는 바로 지금 페이지를 새로 고쳐 서버를 다시 시작하고 플래시에서 오류가 없어야하는 경우입니다.

130
00:12:17,090 --> 00:12:19,120
그래서 우리는 실제로 아무 것도 보지 못합니다.

131
00:12:20,000 --> 00:12:39,310
그런데이 코드를 실행 시키면이 코드가 여기에 표시되고 우리가하는 방식은이 미들웨어가 호출되는 곳에 로그인해야하는 곳에 액세스하려고하면 일어날 일은 플래시 아래에이 코드를 추가하는 것입니다. 값에 대한 주요 오류가 먼저 로그인 한 다음 로그인을하겠습니다.

132
00:12:39,440 --> 00:12:51,230
그런 다음 슬래시 로그온의 내부에 우리가 연결해야하는 많은 것들이있는 플래시 오류까지 메시지 요청의 열쇠로 보내고 있으며 약간 혼란 스럽습니다.

133
00:12:51,350 --> 00:12:53,370
하지만 지금 보여 드리죠.

134
00:12:53,690 --> 00:12:54,740
그래서 다시 시작합니다.

135
00:12:54,740 --> 00:12:58,550
이번에는 실제로 할 필요가 없었지만 아무것도 보지 못했습니다.

136
00:12:58,550 --> 00:13:05,140
이제는 캠프장에 가보고 내가 로그인하지 않아도 새로운 캠프장을 추가하려고합니다.

137
00:13:05,630 --> 00:13:12,330
그리고 지금 나는 그곳에 먼저 없었던 로그인 메시지를받습니다. 그리고 페이지를 새로 고치면 사라집니다.

138
00:13:12,530 --> 00:13:16,740
따라서 Flash를 사용하여 수행 할 수있는 작업은 매우 간단합니다.

139
00:13:16,910 --> 00:13:22,500
그래서 우리는 다음 비디오에서 계속해서 모든 다른 메시지와 스타일을 가지고 이것을 구현합니다.

140
00:13:22,700 --> 00:13:24,860
어떻게 다시 작동하는지 요약 해 보겠습니다.

141
00:13:24,920 --> 00:13:33,500
그래서 우리가 그것이 성공 메시지 이건 오류 메시지 이건간에 메시지를 표시하고자 할 때마다 여기에서이 줄을 사용하게 될 것입니다.

142
00:13:33,650 --> 00:13:34,730
요청 플래시.

143
00:13:34,760 --> 00:13:38,630
그런 다음 리디렉션하기 전에 키와 값을 전달하고이를 수행합니다.

144
00:13:38,630 --> 00:13:41,450
리디렉션 한 후에이 줄을 넣으면 정말 중요합니다.

145
00:13:41,450 --> 00:13:42,680
그것은 작동하지 않습니다.

146
00:13:43,130 --> 00:13:53,630
따라서 리디렉션을하기 전에 템플릿을 직접 처리하고 경로를 처리해야하므로 리다이렉트하기 전에 일부 데이터를 추가 할 수 있어야합니다.

147
00:13:53,630 --> 00:13:55,300
그러면 다음 경로로 이동합니다.

148
00:13:55,460 --> 00:13:59,030
그리고이 데이터는 해당 경로에 대한 모든 단일 요청에서 지속되지 않습니다.

149
00:13:59,030 --> 00:14:00,140
그래서 그것은 한 가지 일입니다.

150
00:14:00,410 --> 00:14:01,860
그래서 플래시라고 불리는 이유입니다.

151
00:14:02,060 --> 00:14:02,560
승인.

152
00:14:02,660 --> 00:14:08,550
그래서 다음 비디오에서는 실제로 이것을 구현할 필요가없는 실제 구현 방법을 보여 드리겠습니다.

153
00:14:08,600 --> 00:14:18,810
우리가 레드와 그린을 넣을 수 있다면 레드와 그린 메시지를 가질 수있는 부트 스트랩으로 스타일을 멋지게 생각할 수있는 모든 템플릿에 메시지를 전달하는 것은 표준 색상입니다.

154
00:14:18,970 --> 00:14:19,180
승인.

155
00:14:19,190 --> 00:14:20,370
그것이 다음 비디오에 있습니다.
