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

2
00:00:01,200 --> 00:00:04,380
それでは残りの残りの部分を手に入れようとしています。

3
00:00:04,470 --> 00:00:09,360
私たちはインデックスを作成し、私はあなたにmanticを追加するために休憩を取った。 e。 ヘッダーとフッターのParshall's。

4
00:00:09,360 --> 00:00:15,330
今私たちは新しいことをやって、このビデオの最後で新しい投稿をクリックするとフォームが表示され、そのフォームに記入して提出するように作成します。

5
00:00:15,330 --> 00:00:19,990
 

6
00:00:20,010 --> 00:00:23,970
それは私を索引ページに連れて行き、別の投稿を見るはずです。

7
00:00:24,000 --> 00:00:25,210
だから始めましょう。

8
00:00:25,530 --> 00:00:30,710
まず、新しいショーを覚えている新しいルートを作成する必要があります。

9
00:00:30,770 --> 00:00:37,110
GETリクエストのスラッシュ犬やスラッシュブログは新しくスラッシュして、フォームを表示します。

10
00:00:37,380 --> 00:00:39,440
だからそこから始めましょう。

11
00:00:40,590 --> 00:00:43,620
私たちのインデックスの後にそれを行い、それをここに追加しましょう。

12
00:00:43,650 --> 00:00:45,670
インデックスは書きました。

13
00:00:45,960 --> 00:00:51,980
今度は新しいルートを作ってみましょう。私も同様に作成します。

14
00:00:52,050 --> 00:01:00,730
だから私たちの新しいルートのために、スラッシュブログを新しくスラッシュにした後は、本当にシンプルです。

15
00:01:00,760 --> 00:01:06,790
私たちがしなければならないことは毎回同じ形式を表現するため、実際には最短のものです。

16
00:01:06,930 --> 00:01:09,280
私たちはデータベースで何かを見る必要はありません。

17
00:01:09,450 --> 00:01:11,730
フォームにデータを送信する必要はありません。

18
00:01:11,730 --> 00:01:16,490
私たちがする必要があるのは、新しいレンダリングだけです。

19
00:01:17,190 --> 00:01:19,110
そして、そのファイルを作成する必要があります。

20
00:01:19,110 --> 00:01:28,340
だからタッチビューは新しいEjayはいC-9ビューは新しいスラッシュをスラッシュします。

21
00:01:29,100 --> 00:01:30,970
OK、簡単に始めましょう。

22
00:01:31,380 --> 00:01:34,150
そして、私たちの皆さんはここで少し意味のあるUIを使用しています。

23
00:01:34,200 --> 00:01:43,400
だから私たちはdivを行うだろうし、このデバイスは、単にクラスUIのメインテキストコンテナセグメントを持っているシンプルになります。

24
00:01:43,400 --> 00:01:44,720
だからそこにはたくさんのものがあります。

25
00:01:44,760 --> 00:01:46,270
私はただちにそれを打ち破ります。

26
00:01:46,530 --> 00:01:54,930
その代わりにヘッダーを追加してUIヘッダーを作成し、この新しいログを呼び出すことができます。

27
00:01:54,930 --> 00:01:58,520
 

28
00:01:59,300 --> 00:02:02,310
これを見ると、成功したことがわかります。

29
00:02:03,030 --> 00:02:04,180
だからアプリケーションを起動します。

30
00:02:04,300 --> 00:02:07,760
ああ、実際に私たちは部分集合も含める必要があります。

31
00:02:07,770 --> 00:02:11,980
それ以外の場合はdiffが表示されますが、セマンティックスタイルは表示されません。

32
00:02:12,150 --> 00:02:22,470
そこで私たちのEjayには、保存用のParshallのスラッシュの下に、ドットスラッシュParshallのスラッシュヘッダーと同じ行が含まれている必要があります。

33
00:02:22,600 --> 00:02:25,410
 

34
00:02:25,950 --> 00:02:29,830
このページを更新し、新しいブログスラッシュに行ってください。

35
00:02:30,840 --> 00:02:32,070
そして私たちには2つの問題があります。

36
00:02:32,070 --> 00:02:34,550
1つはスペースの問題です。

37
00:02:34,650 --> 00:02:37,540
これを簡単に修正できますが、適切なテンプレートを入手しています。

38
00:02:37,800 --> 00:02:43,980
しかし私は、私たちのアイコンがホームページ上で小さくなっていることが少し奇妙なことに気づいた。

39
00:02:44,010 --> 00:02:47,170
このページは大きく、サイズは小さくなっています。

40
00:02:47,370 --> 00:02:51,760
そして私はこれを雑草のようなものとして見ていました。

41
00:02:51,840 --> 00:02:52,490
私はそれを考え出した。

42
00:02:52,500 --> 00:02:57,540
それは実際に毎回出てきて、それが最初はひどく明白ではないところで、挫折感のあるものの1つですが、私が気づいたことを簡単に説明します。

43
00:02:57,540 --> 00:03:01,990
 

44
00:03:02,160 --> 00:03:04,320
あなたはそれがコンソールで言うことがわかります。

45
00:03:04,320 --> 00:03:11,740
スタイルシートを読み込むのに失敗しましたが、それはC S

46
00:03:11,740 --> 00:03:16,250
Sのスラッシュスタイルのスラッシュアプ​​リで、それを探していました。

47
00:03:16,290 --> 00:03:23,130
ヘッダーファイルで設定したリンクを見て、小さな事を忘れてしまったことに気付きました。

48
00:03:24,020 --> 00:03:25,030
 

49
00:03:25,080 --> 00:03:29,080
あなたが新鮮ならば、それが見つかるのを見るでしょう。

50
00:03:29,310 --> 00:03:31,680
そして、ここではエラーは発生しません。

51
00:03:31,680 --> 00:03:38,640
また、ソースタブを見ると、ブログの内部が見えないことがわかります。以前はスタイルシートの外に目を向けています。

52
00:03:38,640 --> 00:03:41,820
 

53
00:03:41,850 --> 00:03:44,990
そして今、私たちは大規模なコード・アイコンで終わります。

54
00:03:45,390 --> 00:03:51,900
次に、それが現在のコンテンツの一部と重複しているという問題に取り組みましょう。これを修正することは、スタイルシートを設定したので、幸いにも簡単です。

55
00:03:51,990 --> 00:03:54,690
 

56
00:03:54,900 --> 00:04:01,590
私たちがする必要があるのは、コンテナ要素であるこの要素の上端に余白を追加するだけです。

57
00:04:02,250 --> 00:04:04,520
私たちがすることはすべて、その容器の中にあります。

58
00:04:04,710 --> 00:04:14,430
だから、私たちは評価の後にスタイルシートでそれを選択し、ちょうどコンテナを行い、そして私たちがしたいのは、ピクセル数で座るのではなく、マージンを上げることだけです。

59
00:04:14,430 --> 00:04:18,440
 

60
00:04:18,450 --> 00:04:23,280
私はE-Mを使って、より頻繁に見られるようにするつもりです。

61
00:04:23,280 --> 00:04:29,700
私たちは本当にそれほど多くは見ていないし、私たちが検査しているコンテナもnav

62
00:04:29,910 --> 00:04:32,640
barの中にあるという別の問題があるのを見ているだけです。

63
00:04:32,640 --> 00:04:34,640
そこにコンテナがあることを忘れないでください。

64
00:04:34,830 --> 00:04:40,440
だから、私たちは、コンテナでもあり、コンテナでも、セグメントでも、一般のコンテナ以外でもあるコンテナをターゲットにしたいだけです。

65
00:04:40,440 --> 00:04:43,800
 

66
00:04:44,040 --> 00:04:46,060
それはもう一つの簡単な修正です。

67
00:04:46,170 --> 00:04:48,370
私たちは戻ってちょうど私をします。

68
00:04:48,390 --> 00:04:49,520
それは何かを意味します。

69
00:04:49,520 --> 00:04:55,070
私はこれらのクラスを両方ともリフレッシュしていたので、はるかによく見えます。

70
00:04:55,100 --> 00:04:56,170
だから我々はそれを混乱させなかった。

71
00:04:56,210 --> 00:05:02,250
このコンテナのマージンはここでNavの内側にあります。 私たちはちょうどスタイリングのために、ここでこれと今再生したメニューです。

72
00:05:02,270 --> 00:05:02,930
 

73
00:05:02,930 --> 00:05:05,050
さて、フォームを動作させましょう。

74
00:05:05,150 --> 00:05:16,700
だから私たちの新しいパパの代わりに私たちが形成したいと私たちのフォームは、このような種類のようなそれはスラッシュログに行く我々は私たちの安らかなルートを見て忘れて、あなたが見ることができるフラッシュドッグは、役職。

75
00:05:18,020 --> 00:05:25,940
 

76
00:05:25,940 --> 00:05:28,460
 

77
00:05:29,120 --> 00:05:37,760
 

78
00:05:37,760 --> 00:05:45,170
 

79
00:05:45,170 --> 00:05:52,090
だから、このフォームは、メソッドが投稿されているスラッシュログに行く必要がありますし、フォームの中にいくつかの入力が必要な場合は、最初のものはちょうどそのようなテキストになり、閉じるテキストを入力し、ブログタイトル次にtitleと等しいプレースホルダ。

80
00:05:52,850 --> 00:06:00,550
そして、我々はタイトルがイメージのためにそれをするのではなく、その例外を複製するでしょう。

81
00:06:01,350 --> 00:06:07,430
 

82
00:06:07,430 --> 00:06:10,750
 

83
00:06:13,340 --> 00:06:19,940
そしてこれはいくつかのビデオからの投稿要求に座ってレビューしてから、私たちがbodyと呼んでいるコンテンツに対して同じことを行い、ログポストをプレースホルダーとしてここに入れます。

84
00:06:19,940 --> 00:06:27,050
さて、私たちはそれをしてから、それを提出する方法が必要なので、それは入力の種類が同じように提出し、私たちが得るものを保存して参照してください。

85
00:06:29,480 --> 00:06:35,680
 

86
00:06:35,770 --> 00:06:38,230
ここに私たちのフォームは実際にスタイルがとられていません。

87
00:06:38,300 --> 00:06:39,600
私たちはすぐにそれに着きます。

88
00:06:39,740 --> 00:06:46,550
しかし、私たちが提出すればうまくいくはずです。私たちはブログをスラッシュに投稿できないというエラーが出てくるはずです。

89
00:06:47,060 --> 00:06:49,660
これは、作成ルートが存在しないためです。

90
00:06:50,150 --> 00:06:53,960
それでは、今度は犬をポストとしてスラッシュしましょう。

91
00:06:54,110 --> 00:07:05,870
そのため、ルート作成のコメントの下で実際にはyesの代わりに、アプリの投稿スラッシュのブログやColbackを行います。

92
00:07:07,700 --> 00:07:13,160
完璧で、ここで実際には新しいブログを作成する必要があります。

93
00:07:13,160 --> 00:07:22,710
そこで、ブログを作成してからリダイレクトを実行する2つのステップがあり、現在はインデックスにリダイレクトされます。

94
00:07:23,780 --> 00:07:30,220
したがって、ブログを作成するには、ブログ作成が必要で、最初にデータが必要です。

95
00:07:30,230 --> 00:07:31,990
だから、まだ動作しません。

96
00:07:32,060 --> 00:07:34,140
もう一つはコールバックです。

97
00:07:34,580 --> 00:07:38,450
だから私たちのコールバックは、私たちがエラーを持って開始することができます。

98
00:07:38,510 --> 00:07:47,360
そして、それがうまくいくなら、私たちは新しいブログを持ち、私たちが通過しているデータはポストリクエストのビデオから覚えています。

99
00:07:47,360 --> 00:07:54,200
 

100
00:07:54,740 --> 00:07:55,600
 

101
00:07:55,610 --> 00:07:58,890
すべてがブログとグループの中にあります。

102
00:07:58,940 --> 00:08:05,120
ですから、ボディーダンプブログをリクエストすると、自動的にタイトルイメージとボディーが作成されます。

103
00:08:05,120 --> 00:08:10,160
我々はそれが完了したときにそれが新しいブログを作成するそのデータを取る8月最初の引数を体の打撃を要求する。

104
00:08:10,160 --> 00:08:10,530
 

105
00:08:10,530 --> 00:08:11,950
このコールバックを引き起こします。

106
00:08:12,140 --> 00:08:14,760
エラーの場合は標準を行います。

107
00:08:15,030 --> 00:08:26,510
ログをカウントする代わりにlet'sを実行しましょう。新しいフォームをもう一度レンダリングしてください。それ以外の場合、rezリダイレクトをスラッシュログに行い、そこに新しいブログが表示されるはずです。

108
00:08:26,840 --> 00:08:27,620
 

109
00:08:30,110 --> 00:08:35,870
 

110
00:08:36,020 --> 00:08:43,410
それがうまくいけば、このコメントを移動して、ショットを付けたらどうなるか見てみましょう。

111
00:08:43,520 --> 00:08:44,660
だから私たちは救うでしょう。

112
00:08:44,870 --> 00:08:52,540
サーバーを再起動してルートに戻って、この画像URLのコピーを作成して、ブログ投稿の画像またはタイトルを取得する必要があります。

113
00:08:52,540 --> 00:08:57,460
 

114
00:08:57,620 --> 00:09:00,230
ここに私たちのブログ記事の私たちのイメージです。

115
00:09:00,350 --> 00:09:03,740
送信し、それは完璧に動作します。

116
00:09:03,800 --> 00:09:11,330
そしてあなたは私たちがタイトルを持っているのを見ることができます。

117
00:09:11,330 --> 00:09:12,020
 

118
00:09:12,170 --> 00:09:12,860
素晴らしい。

119
00:09:13,010 --> 00:09:19,790
だから、そのすべてを新しいルートにまとめると、モデルの名前が何であれ、新しいものがスラッシュになります。

120
00:09:19,790 --> 00:09:24,910
私たちの場合の犬は実際にはブログのスラッシュとあなたがリクエストを取得します。

121
00:09:24,920 --> 00:09:32,580
それは、それがポストリクエストであることを除いて、インデックスが作成したものと同じように、create createという形を示しています。

122
00:09:32,600 --> 00:09:35,350
それが新しいフォームがデータを送信する場所です。

123
00:09:35,430 --> 00:09:39,080
新しい犬を作成するデータベースに追加するには、それは戻ってリダイレクトされます。

124
00:09:39,080 --> 00:09:43,820
それは、次のビデオに表示されるページを実際に表示するためのインデックスのほとんどである必要はありません。

125
00:09:43,820 --> 00:09:44,660
 

126
00:09:45,140 --> 00:09:47,550
アプリケーションをすばやくスタイルアップしましょう。

127
00:09:47,580 --> 00:09:49,820
フォームを作ろう。

128
00:09:50,570 --> 00:10:02,000
私たちが行うセマンティックなものを使用するには、フォームにUIフォームと等しいクラスを与え、フォームの中にこれらの入力のそれぞれがdivにあり、そのdivがフィールドと等しいクラスを持つようにします。

129
00:10:02,000 --> 00:10:10,070
 

130
00:10:10,550 --> 00:10:13,330
そして、私たちがまだ持っていないラベルを作る方法を見てください。

131
00:10:13,730 --> 00:10:19,860
そして、最初のラベルはタイトルになります、そして、我々はタイトルを取ってそこに置くでしょう。

132
00:10:20,390 --> 00:10:21,450
完璧。

133
00:10:21,470 --> 00:10:24,630
それから、もう一度やります。

134
00:10:24,770 --> 00:10:32,120
 

135
00:10:34,840 --> 00:10:42,770
 

136
00:10:42,770 --> 00:10:47,470
私たちは、イメージの変更にはイメージの変更が必要で、イメージの変更が必要な変更は、私たちのブログにこのような入力をするのではなく、ユーザーがもう少しテキストを入力できるテキスト領域にしたい実際のブログ記事のように。

137
00:10:48,050 --> 00:10:54,920
 

138
00:10:54,920 --> 00:11:03,140
 

139
00:11:03,140 --> 00:11:06,560
これを入力するのではなく、私たちはまだChrisfieldをラベルに入れようとしています。ブログの内容と呼ぶだけですが、この入力ではなく、私たちが見たテキストエリアタグを追加します早い段階で、私たちは本当にあまり使わなかった。

140
00:11:06,830 --> 00:11:10,280
そしてそれは我々がまだそれに名前をつける入力と少し違う。

141
00:11:10,400 --> 00:11:19,280
だからまだブログのボディとそれから私たちは保存しますが、それは入力ではないので、それは一種のテキストを与えません。それは、開始タグと終了タグを持つそれ自身の指定されたタグであり、少し違った振る舞いをします。

142
00:11:19,280 --> 00:11:24,590
 

143
00:11:24,830 --> 00:11:26,130
私たちはそれを追加するとき。

144
00:11:26,270 --> 00:11:30,650
だから私たちはすぐにそれを取り除くことを見てから、私たちはボタンをスタイルするでしょう。

145
00:11:30,650 --> 00:11:32,540
今私たちが何を持っているかを見てみましょう。

146
00:11:32,740 --> 00:11:36,610
ボタンが少しスタイリッシュになることができることを除けば、かなり良いように見えます。

147
00:11:36,790 --> 00:11:43,670
私がセマンティックUIをプルアップしてボタンに行くと、ブートストラップよりもセマンティックでボタンが多くなります。

148
00:11:43,910 --> 00:11:51,780
色々なタイプがありますが、基本的なボタンと反転ボタンもたくさんあります。

149
00:11:52,310 --> 00:12:00,680
だから、あなたが好きなものを選んでください。お気に入りのものは紫色になります。ソースコードを見れば、あなたに必要なものはすべてあなたに匹敵します。

150
00:12:00,680 --> 00:12:04,890
 

151
00:12:05,250 --> 00:12:07,950
色の基本ボタン。

152
00:12:08,480 --> 00:12:12,780
私がこれをしている間に、セマンティックUIと呼ばれる理由を説明します。

153
00:12:12,920 --> 00:12:21,910
そして主な理由は、ブートストラップとは違って、この種の奇妙な専門用語ETN

154
00:12:21,910 --> 00:12:28,880
 

155
00:12:28,880 --> 00:12:40,470
ETNダッシュLGBTとダッシュデフォルトとは異なり、私はブートストラップを本当にノックアウトしていませんが、セマティックが作成された理由は代わりにこの種のマークアップ私たちは、基本的なボタンに違反するUIを持つことができますまたは私はUIのバイオレット反転ボタンを行うことができます。

156
00:12:41,150 --> 00:12:44,590
 

157
00:12:45,050 --> 00:12:46,820
今のところ基本的なことは大丈夫です。

158
00:12:47,060 --> 00:12:48,050
そして、それがすべてです。

159
00:12:48,050 --> 00:12:49,630
非常に簡単です。

160
00:12:49,760 --> 00:12:51,530
キャラクターがそれほど少ないわけではありません。

161
00:12:51,560 --> 00:12:52,840
それは短くすることではありません。

162
00:12:53,030 --> 00:12:58,340
それは、あなたが簡単にこれを見て、それが何を意味するのかを理解することができる意味があります。

163
00:12:58,340 --> 00:13:01,420
私たちが今戻ってリフレッシュするならば。

164
00:13:01,690 --> 00:13:06,900
私はそのボタンを持っています。もしそれを大きくしたいのなら、それは本当に簡単です。

165
00:13:06,930 --> 00:13:09,050
私がしなければならないことは大きくタイプすることです。

166
00:13:09,050 --> 00:13:16,910
だから私はBTをする必要はありませんし、Elgieを大胆にリフレッシュして、より大きなボタンを手に入れることができます。

167
00:13:16,910 --> 00:13:18,740
だからもう一度試してみましょう。

168
00:13:18,740 --> 00:13:26,770
私は同じ大胆な議論を使って、私の新しい犬と呼んでいます。

169
00:13:27,980 --> 00:13:32,350
より多くのブログContac提出し、それは正常に動作します。

170
00:13:32,420 --> 00:13:33,110
すばらしいです。

171
00:13:33,110 --> 00:13:38,240
大丈夫ですので、私たちがカバーしたインデックスをカバーしています。新しく作成して、私はあなたに意味の小さなビットを示しました。次のビデオにフォームとボタンが表示されるかもしれません。

172
00:13:38,240 --> 00:13:41,480
 

173
00:13:41,510 --> 00:13:42,650
ショーページで作業します