1
00:00:00,390 --> 00:00:01,300
お帰りなさい。

2
00:00:01,560 --> 00:00:06,300
 

3
00:00:06,570 --> 00:00:12,150
 

4
00:00:12,150 --> 00:00:18,810
 

5
00:00:18,810 --> 00:00:24,100
このビデオでは、シンプルなアプリケーションを簡単に作成する手順について説明します。ここでの目標は、POST要求の仕組みを示し、投稿要求を聞いているルートを作成してからテストする方法を表現することですそれらを郵便配達員と一緒にしてから別のエクスプレステンプレートに書類を書いて、その書式で私たちのエクスプレスアプリにPOSTリクエストをする方法を見てください。

6
00:00:24,180 --> 00:00:29,010
私が言及したように、私たちは簡単なアプリケーションを一緒に作るつもりです。私は最初から始め、Expressをインストールしてインクルードします。

7
00:00:29,190 --> 00:00:31,380
 

8
00:00:31,380 --> 00:00:34,180
そして、実際のアプリケーション・ロジックに進むつもりです。

9
00:00:34,410 --> 00:00:42,990
 

10
00:00:43,830 --> 00:00:56,310
だから私は今始めて、ちょうど私がポストリクエストデモCDと呼ぶ新しいディレクトリを作って、そこにNPMを走らせて、ちょうど数回エントリーポイントを入れてください。

11
00:00:56,560 --> 00:00:57,310
OK。

12
00:00:57,900 --> 00:00:59,310
そこに行く。

13
00:00:59,310 --> 00:01:07,010
Jasonが今すぐExpress Dash Dash Saveをインストールするというパッケージがあります。

14
00:01:08,580 --> 00:01:14,590
私たちがここにいる間、NPMはEをインストールしましょう。 J. それを保存してください。

15
00:01:15,080 --> 00:01:15,650
OK。

16
00:01:15,870 --> 00:01:17,450
さて、私たちのアプリを作りましょう。

17
00:01:17,510 --> 00:01:18,750
はい。

18
00:01:19,350 --> 00:01:26,020
そしてそれを開き、私たちが必要とする基本的なコードを追加します。

19
00:01:26,190 --> 00:01:34,470
だから私たちはrequireでそれをインポートし、次に実行するapp変数を作成します。

20
00:01:34,470 --> 00:01:45,650
EXPRESSそして我々がここにいる間に、アプリはEjayになるようにエンジンを設定します。それを保存します。

21
00:01:46,050 --> 00:01:52,650
そして、我々はまた、ここではなく、あなたがそれを処理するのではなく、最下位で聴くことができます。

22
00:01:52,660 --> 00:01:55,630
そして私たちはそれを手に入れました。

23
00:01:56,010 --> 00:02:01,750
また、ENFP IPとコールバック機能を処理します。

24
00:02:01,980 --> 00:02:10,110
そして最後に、私はちょうど非常にシンプルなログサーバーを起動します。

25
00:02:10,890 --> 00:02:11,180
OK。

26
00:02:11,190 --> 00:02:12,510
それで私たちはそれをセットアップしました。

27
00:02:12,570 --> 00:02:14,550
 

28
00:02:17,400 --> 00:02:26,850
今度はそのようなブルー​​トルートを作成してみましょう。ちょうどそのようなホームと呼ばれるレストランレンダリング用のテンプレートをレンダリングして保存します。

29
00:02:27,270 --> 00:02:28,460
 

30
00:02:28,530 --> 00:02:30,020
さあ、そのテンプレートを作ってみましょう。

31
00:02:30,120 --> 00:02:37,650
だから私たちは使用されたディレクトリのディレクトリビューを作成する必要があり、あなたのファイルビュースラッシュホームをタッチする必要があります。

32
00:02:37,760 --> 00:02:38,490
はい。

33
00:02:38,760 --> 00:02:47,540
そして、そのファイルを開いて、その中に私たちは単純なH-1を行います。それはちょうどそのようなホームページを示し、私たちはそれが確実に機能するようにします。

34
00:02:48,390 --> 00:02:49,850
 

35
00:02:50,070 --> 00:02:58,350
だからノードApalacheeを実行して、ここでリフレッシュして、ホームページを取得しましょう。

36
00:02:58,790 --> 00:03:05,270
私たちはEjazが含まれているが含まれているExpressを持っているので、私たちは基本的なスケルトンを設定しています。

37
00:03:05,340 --> 00:03:09,260
デフォルトのビューエンジンを設定しました。ルートルートがあります。

38
00:03:09,690 --> 00:03:14,730
私たちが作ろうとしているアプリは基本的には友達や友達のリストで、あなたが入ってきて、あなたのリストに新しい友達を追加することができます。

39
00:03:14,730 --> 00:03:18,780
 

40
00:03:18,960 --> 00:03:24,510
そして、これは友達や犬、連絡先、犬のいずれかになります。私たちはフォームを使って新しいものを作成できるというリストを持っています。

41
00:03:24,510 --> 00:03:28,610
 

42
00:03:28,800 --> 00:03:37,920
だから、友だちをやるつもりだし、アプリを追加してスラッシュの友達をつくって、友達のリストを表示するテンプレートのページになります。

43
00:03:37,920 --> 00:03:41,410
 

44
00:03:42,990 --> 00:03:48,810
ここでは赤いレンダリングを行う代わりに、友だちと呼ぶだけで、そのテンプレートを作成する必要があります。

45
00:03:48,810 --> 00:03:50,120
 

46
00:03:50,400 --> 00:04:00,430
だから私たちはEjay私たちは、そのようなファイルを開くと、タッチビューをスラッシュフレンドを行うでしょう。

47
00:04:00,790 --> 00:04:10,460
そして、ここには別のH-1を追加します。ちょうどいい友達リストがここに来て、私たちはサーバーが稼動するようにします。

48
00:04:11,250 --> 00:04:12,720
 

49
00:04:12,930 --> 00:04:17,290
私たちが友達をスラッシュに行くなら、友人のリストがここに行くのです。

50
00:04:17,610 --> 00:04:18,270
OK。

51
00:04:18,270 --> 00:04:21,010
だから私たちがやろうとしていることは、友人のリストを表示することです。

52
00:04:21,210 --> 00:04:22,890
そしてそのリストを作成する必要があります。

53
00:04:22,890 --> 00:04:23,970
データが必要です。

54
00:04:24,210 --> 00:04:32,320
 

55
00:04:33,030 --> 00:04:46,080
だから私は友人の名前の配列を作成しようとしています、そして、それは非常に単純な友人の平等だけになるだろうと我々はトニーとジャスティンピエールとリリーのようなここにいくつかの名前を追加します。

56
00:04:46,290 --> 00:04:46,860
OK。

57
00:04:47,140 --> 00:04:52,450
だから私たちは友人の配列を持っているし、私たちは友人のテンプレートにその友人の配列を通過させるつもりです我々はループし、リストアイテムとして各友人を表示します。

58
00:04:52,450 --> 00:04:57,580
 

59
00:04:57,640 --> 00:04:59,220
だから我々はそれを渡す必要があります。

60
00:04:59,300 --> 00:05:02,770
それはオブジェクトであり、私たちは2つのことが必要であることを忘れないでください。

61
00:05:02,770 --> 00:05:09,340
私たちは、私たちが友達と呼ぶだけの見解でそれを見るために使用する名前や財産を与える必要があります。また、私たちもあなたが出発するときに混乱している友達として渡しているデータ。

62
00:05:09,340 --> 00:05:15,040
 

63
00:05:15,040 --> 00:05:15,730
 

64
00:05:15,760 --> 00:05:20,800
しかし、これはあなたが同じ名前を使用する場所で最も頻繁に見られるでしょうが、これはまったく何でもかまいません。

65
00:05:20,800 --> 00:05:21,560
 

66
00:05:21,580 --> 00:05:24,810
そして、これはここの私たちの友人の配列を指しています。

67
00:05:25,150 --> 00:05:31,560
さて、今度は、テンプレート友人学習の天才に行き、私たちのループを追加して、私はそれぞれのために行うつもりです。

68
00:05:31,560 --> 00:05:32,070
 

69
00:05:32,290 --> 00:05:36,690
だから私はEjayなしで大括弧を使わずに正規のJavaScriptを書くだけです。

70
00:05:36,820 --> 00:05:47,380
だから私たちはそれぞれの関数のための友人を持っており、関数はそこでfriendパラメータを取るでしょう。

71
00:05:47,470 --> 00:05:50,760
 

72
00:05:50,920 --> 00:05:59,230
そして、ここではなく、私たちがやることは、私のような友人がいると言っているそれぞれの同盟国を作ることです。

73
00:05:59,610 --> 00:06:05,870
今戻って、等号が必要ないというフレーズを追加してみましょう。これは論理のためだけのことです。

74
00:06:06,280 --> 00:06:09,800
私たちは、これらの2つの行に何も現れたくありません。

75
00:06:09,970 --> 00:06:16,330
だから私たちはこれを行い、もし私たちが救われ、リフレッシュされれば、私は、そのリストのすべての友人の友人がいて、それを試してみましょう。

76
00:06:16,330 --> 00:06:21,640
 

77
00:06:21,880 --> 00:06:26,890
ページをリフレッシュすると、友達がいるという5つのリスト項目が表示されます。

78
00:06:27,530 --> 00:06:32,130
さて、私たちはもう一度戻ってきます。ちょうど私が友人に実際に友達の名前を印刷させてくれると言っているのではなくて。

79
00:06:32,140 --> 00:06:32,690
 

80
00:06:32,950 --> 00:06:39,110
今回は、評価された値をチーム自体に追加したいので、等号が必要です。

81
00:06:39,250 --> 00:06:40,620
 

82
00:06:40,750 --> 00:06:47,570
私たちは、それが私たちのそれぞれのためにここから来ている友人の価値に取って代わられることを望みます。

83
00:06:47,740 --> 00:06:49,140
もう一度これは何でもよい。

84
00:06:49,140 --> 00:06:50,620
私たちが望むものをxとします。

85
00:06:50,720 --> 00:06:54,010
ここにXを置くとうまくいくでしょう。

86
00:06:54,430 --> 00:07:01,300
だから私はちょうどリフレッシュし、私たちは5人の友人を取得し、Xはひどい変数名であるため、多くの場合、サーバーを再起動するような友人に戻ってくるので、

87
00:07:01,300 --> 00:07:07,090
 

88
00:07:07,120 --> 00:07:10,690
もう一度、あなたは何も変わらないと見ることができます。

89
00:07:10,690 --> 00:07:12,910
OK、私たちはこの友達のリストを持っています。

90
00:07:13,060 --> 00:07:16,880
ここでは、ポストルートの設定について話します。

91
00:07:17,110 --> 00:07:22,840
最終的にはこのページの一番下にフォームがあり、そのフォームに名前を入力して送信ボタンを押すと、新しい友達がリストに追加されます。

92
00:07:22,840 --> 00:07:27,760
 

93
00:07:27,790 --> 00:07:33,340
新しい名前をFriends配列に追加し、このテンプレートをもう一度レンダリングして、新たに追加した友人のための新しい箇条書きと新しいリストアイテムを追加します。

94
00:07:33,340 --> 00:07:37,250
 

95
00:07:37,390 --> 00:07:43,000
 

96
00:07:43,000 --> 00:07:47,770
ポストロードを設定することから始め、データを送信しているときに何かにデータを追加しているときに投稿ストロートを使用することを覚えておいてください。新しいコメントを作成したり、新しい投稿を作成したり、この場合は新しい友だちに投稿ルートを作成したりしています。

97
00:07:47,770 --> 00:07:53,800
 

98
00:07:54,540 --> 00:07:55,400
 

99
00:07:55,420 --> 00:07:59,390
唯一の選択肢ではありませんが、最も理にかなっているのは何ですか？

100
00:07:59,530 --> 00:08:02,120
今のところそれを唯一の選択肢として扱います。

101
00:08:02,140 --> 00:08:08,260
だからそれは情報を取得するためのもので、ポストは新しいデータを送信するためのものであり、何らかの形でサーバー側で使用されるものです。

102
00:08:08,260 --> 00:08:10,810
 

103
00:08:11,140 --> 00:08:18,790
そして、私たちが書く必要があるのはポストポストで、ルートの名前はそれをちょうどそのような友だちと呼びましょう。それはリクエストとレスポンスで同じように見えます。

104
00:08:18,790 --> 00:08:26,290
 

105
00:08:26,410 --> 00:08:31,770
そして私たちはちょうど休憩を行います。私たちはちょうどRESドットを送信するテンプレートを作成しません。

106
00:08:32,080 --> 00:08:41,040
あなたはそのようなポストルートに達しました。

107
00:08:41,080 --> 00:08:46,930
それでは、郵便配達員を使って友人を投稿要求として追加することができたら、これを引き出すことができるかどうかを見てみましょう。

108
00:08:47,950 --> 00:08:55,090
だから私はこのURLを取って、これを郵便配達員にコピーし、どこにリクエストしたいのですか。

109
00:08:55,090 --> 00:09:00,880
私たちは、取得リクエストとしてsoshの友達をやるだけで、5人の友達とそれぞれのチームを戻すことができます。

110
00:09:00,880 --> 00:09:02,270
 

111
00:09:02,270 --> 00:09:08,970
しかし、今度は投稿リクエストを作成し、友だちを追加するようにしています。

112
00:09:09,550 --> 00:09:15,130
そして今私達がポストリクエストを送ると、私たちはメッセージを得ることができない友人を追加して投稿することができ、それは愚かな理由のためです。

113
00:09:15,400 --> 00:09:18,490
新しいルートを追加するたびにサーバーを再起動する必要があります。

114
00:09:18,850 --> 00:09:22,770
そして今私達が戻って要求をもう一度送ると私たちはメッセージを受け取ります。

115
00:09:22,930 --> 00:09:24,740
あなたは投稿経路に到達しました。

116
00:09:24,820 --> 00:09:29,380
だから私たちはポストリクエストで送信しています。フォームを使うのではなく、郵便配達でやっていますが、それはまったく同じ考えです。

117
00:09:29,380 --> 00:09:31,010
 

118
00:09:31,030 --> 00:09:32,130
同じように動作します。

119
00:09:32,170 --> 00:09:36,650
私たちは投稿リクエストを送信し、このコードはここで実行されています。

120
00:09:36,710 --> 00:09:42,300
それで、私たちがやりたい次のことは、その投稿リクエストを送信するフォームを使用することです。

121
00:09:42,430 --> 00:09:48,960
だから私は友人に行くつもりです各ページを研究し、フォームの多くの底にこのフォームは、そのルートに提出する。

122
00:09:48,970 --> 00:09:51,320
 

123
00:09:51,670 --> 00:09:54,390
したがって、2つの重要な属性があることを忘れないでください

124
00:09:54,440 --> 00:09:57,900
行動があり、それから方法があります。

125
00:09:58,540 --> 00:09:59,790
それでは、メソッドから始めましょう。

126
00:09:59,920 --> 00:10:06,780
私たちは投稿要求を送信したいと思います、あなたはスラッシュと友人であるあなた全体です。

127
00:10:07,420 --> 00:10:10,700
そしてもう一度これはこのレートと一致する必要があります。

128
00:10:10,990 --> 00:10:13,440
友人を投稿として追加する。

129
00:10:13,910 --> 00:10:14,620
大丈夫。

130
00:10:14,620 --> 00:10:22,330
そして、ここでは、1つの入力タイプがテキストと等しくなるようにします。次に、名前または何かを置くプレースホルダが必要です。

131
00:10:22,330 --> 00:10:25,880
 

132
00:10:25,900 --> 00:10:31,540
これは単なるプレースホルダーのテキストです。最後にボタンを追加すると、私は新しい友達を作り、それを保存すると言うでしょう。

133
00:10:32,260 --> 00:10:37,180
 

134
00:10:37,890 --> 00:10:40,320
そして、これは今私たちのための形を作り出します。

135
00:10:40,690 --> 00:10:46,930
私がサーバを再起動して私が戻ってきて、ページをリフレッシュすると、ここにフォームがあり、それを調べると、アクションを持つ2つの属性があり、ADD

136
00:10:46,930 --> 00:10:54,430
friendメソッドがポストで、1つの入力があります。

137
00:10:54,430 --> 00:10:55,090
 

138
00:10:55,420 --> 00:11:00,150
私がここに何かを入力すると、私は今日ボブという名前の新しい友達を作り、彼らはクリックします。

139
00:11:00,160 --> 00:11:02,500
私は新しい友達を作った。

140
00:11:02,770 --> 00:11:04,560
あなたは私たちがその反応を得ているのを見ることができます。

141
00:11:04,570 --> 00:11:09,070
あなたはポストルートに達しました。これは、ポストリクエストを送信しており、適切な場所に送信していることを意味します。

142
00:11:09,070 --> 00:11:09,980
 

143
00:11:10,030 --> 00:11:14,140
友達を追加するが、そのルートでは何もしない。

144
00:11:14,140 --> 00:11:19,570
このメッセージに返信する以外に、実際にやりたいことは、ボブを取りたいフォームからデータを取得することです。

145
00:11:19,920 --> 00:11:21,240
 

146
00:11:21,430 --> 00:11:25,990
そして、友人の配列に追加して、このページに戻って、Bobを新しい箇条書きの点として見ることができるようにしたい

147
00:11:26,080 --> 00:11:28,060