1
00:00:00,350 --> 00:00:03,100
Witamy z powrotem do naszego ostatniego filmu na tym blogu.

2
00:00:03,310 --> 00:00:04,400
Więc musimy się zmienić.

3
00:00:04,400 --> 00:00:05,050
Mamy zamiar zrobić.

4
00:00:05,100 --> 00:00:20,030
Pierwszym z nich jest wprowadzenie środka odkażającego ekspresowych, które wymieniłem, które pomogą nam z tym problemem, gdzie w przypadku wyświetlania HDMI Olafur faktycznie renderowania mu użytkownik może potencjalnie podać szkodliwy skrypt zamiast hack skryptu.

5
00:00:20,130 --> 00:00:30,980
Nie chcemy, aby uruchomić ten kod więc używamy środka odkażającego, aby pomóc nam, że w zasadzie trwa to wejście i usuwa wszystkie skrypty z niego i po prostu daje nam peer wieku go.

6
00:00:31,290 --> 00:00:33,660
A potem my także chcemy projektować strony indeksu trochę.

7
00:00:33,690 --> 00:00:41,730
To wygląda trochę szorstka i ostatnią rzeczą będzie zrobić to mała aktualizacja do spokojnego tabeli Rhodes żeby uczynić go trochę bardziej przydatne dla Ciebie.

8
00:00:41,760 --> 00:00:44,000
Więc zacznijmy się do dezynfekcji.

9
00:00:44,400 --> 00:00:51,350
Więc mam zamiar zainstalować pakiet o nazwie ekspresowe odkażającym kreska kreska kreska.

10
00:00:51,390 --> 00:00:53,430
Zapisać.

11
00:00:54,930 --> 00:00:55,660
OK.

12
00:00:55,710 --> 00:01:12,080
Teraz, kiedy jest to robione w naszej aplikacji tak będziemy wymagać, aby express środka odkażającego wynosi wymaga wyraźnej DESCH środka odkażającego tak po prostu.

13
00:01:12,330 --> 00:01:23,690
A potem musimy powiedzieć naszą aplikację, aby używać go używać aplikacji Express, środka odkażającego, a jedynym wymogiem jest to, że jedzie po wszystkich parsera.

14
00:01:23,730 --> 00:01:25,110
Określ tutaj.

15
00:01:25,270 --> 00:01:25,960
OK.

16
00:01:26,410 --> 00:01:27,730
I to wszystko.

17
00:01:27,750 --> 00:01:34,410
Teraz, aby używać go chcesz to zrobić, aby rozpocząć zamiast są tworzone podczas tworzenia nowego bloga.

18
00:01:34,410 --> 00:01:36,180
Więc to naprawdę stworzyć aktualizacji.

19
00:01:36,180 --> 00:01:39,900
Są dwa miejsca, w których bierzemy danych i zapisywanie do bazy danych.

20
00:01:39,900 --> 00:02:03,770
Za każdym razem chcesz się upewnić, zdezynfekować wejścia i zamiast stworzyć to, co chcemy zdezynfekować jest zwrócić się ciała się dziennik ciała, która jest swego rodzaju bałagan pamiętam zwrócić się ciało, co pochodzi od postaci, co dane jest w żądaniu organ, który w naszym przypadku jest pochodzących z formularza następnie blog właśnie z powodu tej linii tutaj.

21
00:02:04,240 --> 00:02:09,020
Tytuł Blogu obrazu i znaleźć w końcu ciało blogu.

22
00:02:09,270 --> 00:02:11,020
I to jest ten, który nam zależy.

23
00:02:11,280 --> 00:02:13,500
Tak więc mamy do czynienia blogu ciało kropka.

24
00:02:13,590 --> 00:02:18,470
Więc jest to rodzaj długiej długiej nazwie tutaj jednak zwrócić ciała z ciałem blog temp.

25
00:02:18,720 --> 00:02:27,630
I mamy zamiar zmienić go tak, że jest równe prośbą o dezynfekcji i jedziemy do dezynfekcji całą tę rzecz.

26
00:02:29,100 --> 00:02:38,670
Więc bierzemy to, co jest aktualnie równa odkażania go, a następnie zmieniając całą prośbę nora ciała zalogowany ciało dorównać tym.

27
00:02:38,700 --> 00:02:42,230
Więc pozwól mi to wyjaśnić Ci zróbmy Constable bloga.

28
00:02:42,770 --> 00:02:51,510
Zażądać, aby ciało przed i po.

29
00:02:51,510 --> 00:02:53,080
Właśnie tak.

30
00:02:53,520 --> 00:02:59,330
I dodam coś zrobić to trochę łatwiejsze do zobaczenia.

31
00:02:59,340 --> 00:03:00,100
Wspaniały.

32
00:03:00,570 --> 00:03:01,080
OK.

33
00:03:01,140 --> 00:03:02,360
Więc dajmy mu szansę już teraz.

34
00:03:02,400 --> 00:03:08,140
Zacznij świeżym Serwer strony.

35
00:03:08,250 --> 00:03:10,600
Będziemy musieli stworzyć nowy post.

36
00:03:11,340 --> 00:03:24,790
Zróbmy jedną tylko nazwie Demo losowo obrazu i dodajmy w jakiejś dobrej HMO, który chcemy wykorzystać lub wprowadzić, a potem coś złego, który będzie po prostu alert ponownie.

37
00:03:26,680 --> 00:03:28,630
No to jedziemy.

38
00:03:28,680 --> 00:03:35,330
Więc jeśli działa to powinniśmy zobaczyć, że dotąd oba te i po to ma tylko.

39
00:03:35,730 --> 00:03:37,920
Rzućmy okiem na to, co przyjdzie do około.

40
00:03:37,950 --> 00:03:38,620
Idealny.

41
00:03:38,640 --> 00:03:41,610
Widać pierwsze ciało czas jest równa do tego.

42
00:03:41,610 --> 00:03:45,320
Albo mieliśmy znacznika script tam po raz drugi.

43
00:03:45,390 --> 00:03:47,360
Ciało ma tylko H-1.

44
00:03:47,820 --> 00:03:49,830
Więc to wszystko, co mamy zrobić, aby zdezynfekować coś.

45
00:03:50,040 --> 00:03:56,690
A jeśli teraz wyświetlać zrobił idziemy do naszego nowego postu, który ich zdaniem jest to jeden.

46
00:03:56,690 --> 00:03:59,700
Poniżej przyjrzymy.

47
00:03:59,730 --> 00:04:03,350
Jesteśmy widać problem sam, ale nie ma tagu skrypt w ogóle.

48
00:04:03,540 --> 00:04:04,950
Tak, że działa świetnie.

49
00:04:04,950 --> 00:04:14,380
Ostatnią rzeczą, którą chce zrobić, to uruchomić tego samego kodu, ale zrobić to zamiast aktualizacji.

50
00:04:15,180 --> 00:04:21,040
Jesteśmy tam, zanim żądanie aktualizacji up na blogu.

51
00:04:21,390 --> 00:04:23,110
Dobrze zrobił to samo.

52
00:04:23,400 --> 00:04:24,630
A minor No.

53
00:04:24,750 --> 00:04:34,170
To byłby dobry przypadek użycia przez co jest znane jako warstwy pośredniej, która tak naprawdę nie rozmawialiśmy jeszcze o ale to jest coś, że mamy powtarzać dwa razy w dwóch różnych trasach.

54
00:04:34,170 --> 00:04:40,410
Co możemy zrobić, to napisać middleware, który będzie działał ten kod przed tymi dwiema drogami, ale omówimy middleware.

55
00:04:40,440 --> 00:04:45,270
W dalszej części tego kursu pod koniec EXPRESS więc jesteśmy pozostawiając ją, jak to jest teraz.

56
00:04:45,720 --> 00:04:47,270
I to działa dobrze.

57
00:04:47,520 --> 00:04:52,840
Że będzie zdezynfekować zarówno czas podczas aktualizacji ktoś stworzyć następne.

58
00:04:52,860 --> 00:04:55,300
Skupmy się na lub indeks, który E.J ..

59
00:04:55,320 --> 00:04:56,050
Tak.

60
00:04:56,060 --> 00:04:57,800
Dlatego wymaga trochę pracy.

61
00:04:57,850 --> 00:04:59,380
Wygląda na to teraz.

62
00:04:59,760 --> 00:05:03,160
Zacznijmy usuwając kilka rzeczy.

63
00:05:03,600 --> 00:05:08,400
I to był jeden z tych stanowisk, które miałem wcześniej utworzonych dodaliśmy środka odkażającego w.

64
00:05:08,440 --> 00:05:18,120
I Aby usunąć niektóre z nich te, które nie mają obrazów tak, że możemy skończyć z czymś łatwiejsze do stylu, w którym możemy rzeczywiście zobaczyć obrazy.

65
00:05:18,570 --> 00:05:25,370
OK, więc mamy to co chcemy zrobić, to centrum im start i mam zamiar używać dużo kodu, które już zostały użyte.

66
00:05:25,600 --> 00:05:42,800
Więc zamiast indeksu mamy nagłówek, który jest dobry, ale potem mamy zamiar umieścić wszystko wewnątrz div i to div będzie mieć klasę równą UI główny kontener tekstu, który jest to, co daje nam, że skoncentrowany pojemnik.

67
00:05:43,060 --> 00:05:45,730
A potem wewnątrz będzie mieć naszą div.

68
00:05:46,060 --> 00:05:52,690
I to jest w zasadzie recyklingu z ostatniego małej linii w ostatniej odrobinie pisaliśmy na formach i na stronie pokazu.

69
00:05:52,720 --> 00:05:58,890
Więc klasa równa Ci ogromny nagłówek, a następnie będziemy po prostu umieścić zestaw stronie indeksu.

70
00:05:58,930 --> 00:06:03,990
Załóżmy, wystarczy umieścić go odpocząć blogu.

71
00:06:04,390 --> 00:06:05,710
Właśnie tak.

72
00:06:05,830 --> 00:06:09,700
A potem, kiedy mamy to zrobione dobrze dodałem kolejny div.

73
00:06:09,700 --> 00:06:23,770
Ten będzie miał nasz segment w nim, które daje ten UI górną dołączony odcinek, który daje tylko tę małą linię w oknie, a następnie wewnątrz nie będą przelotowego.

74
00:06:24,010 --> 00:06:43,940
I ruszyliśmy jeszcze jedną linię zanim nawet dostać się do pętli, która jest div z klasą UI podzielonych przedmiotów, a następnie dla każdej pozycji jedziemy wewnątrz was dzieli przedmioty i dostajemy automatyczny dzielnik umieścić między nimi.

75
00:06:44,170 --> 00:06:49,120
Więc mamy zamiar skopiować ten kod do tego jesteś podzielony przedmiotów.

76
00:06:49,120 --> 00:06:53,700
Co musimy dokonać pewnych zmian.

77
00:06:53,710 --> 00:06:58,470
Pierwszym z nich jest po prostu w długach, ale nie jesteśmy po prostu będzie wydrukować wnętrze.

78
00:06:58,510 --> 00:07:21,620
Mamy zamiar stworzyć div class równą pozycję, a następnie wewnątrz elementu mamy pierwsze zdjęcie, a obraz trafi zamiast div z klasą równej obrazu, a my umieścić, że tam, i że będzie wspomóc ograniczanie rozmiar obrazu, więc nie dostać te gigantyczne obrazy objęciem całego ekranu więcej.

79
00:07:21,990 --> 00:07:29,780
OK, tak samo obraz umieścić obraz w środku, to potrzebujemy innego div class równą zawartości.

80
00:07:30,220 --> 00:07:32,470
I to jest, gdy położę się kilku rzeczy.

81
00:07:32,470 --> 00:07:53,430
Pierwszy z nich to tytuł i zamiast dokonywania H-2 z tytułem rzeczywiście i zrobić tag kotwicy i lub tag kotwicy będzie miał klasę równą Hetter ale też ref równą strony które przedstawiają i Riskin kopię, która jesteś tutaj, podobnie jak to, co już masz.

82
00:07:53,440 --> 00:08:04,470
Więc czytaj więcej odnośnik więc powodu Robimy to tak, że możemy skończyć z naszym nagłówku każdego bloga mogę kliknąć na nim, aby przejść do strony pokaż lub kliknij na czytaj więcej.

83
00:08:04,880 --> 00:08:07,410
Upewnijmy się, że mamy mały błąd składni.

84
00:08:07,450 --> 00:08:11,450
Jesteśmy brakujących nasz zamykający cudzysłów tu dla Atra japonki.

85
00:08:12,670 --> 00:08:13,630
OK.

86
00:08:13,960 --> 00:08:18,520
Atra jest strona pokaż, a następnie w nawiasie mamy tytuł bloga.

87
00:08:18,520 --> 00:08:19,860
To trochę bałaganu.

88
00:08:19,930 --> 00:08:35,530
Następnie po tym dodamy w div z klasą równej Metta który jest tylko miejsce dla nas, aby umieścić tu informacje o tym konkretnym punkcie, który w naszym przypadku będzie tylko przęsło z datą, które już mamy.

89
00:08:36,040 --> 00:08:51,890
Ale mam zamiar sformatować tę datę, jak również tak blogu kropkę utworzony najświeższe ciąg, który już widział na stronie pokazu, a następnie zamykamy, że nie żyje wtedy będziemy mieć div class równą opisem.

90
00:08:52,210 --> 00:08:55,280
I w tym miejscu umieścimy tę zawartość.

91
00:08:55,690 --> 00:08:58,230
Rzeczywista ciało blogu.

92
00:08:58,600 --> 00:09:08,160
I zamiast robić znak równości będę go zmienić z powrotem na desce rozdzielczej, czy nie zmienić go z powrotem, ale będziemy go zmienić na Dasht dzięki czemu otrzymujemy rzeczywisty wiek naszego forum, który jest teraz oczyszczone.

93
00:09:08,380 --> 00:09:24,430
Wreszcie mam div klasycznej do dodatkowych i zamiast tego wprowadzi przycisk, aby przeczytać więcej i sprawi, że znacznik zakotwiczenia i mam zamiar skopiować tag już mamy i zmienić go tylko trochę.

94
00:09:24,430 --> 00:09:30,710
Więc nie musimy klasyczny już do nagłówka, ale chcemy, a nie to duży przycisk.

95
00:09:30,970 --> 00:09:35,280
Więc płynął podstawowe.

96
00:09:35,470 --> 00:09:38,410
Wybierz swój kolor zrób Violet ponownie.

97
00:09:39,370 --> 00:09:42,190
I możemy to zrobić trochę.

98
00:09:42,190 --> 00:09:44,630
To na pewno ma wiele do zobaczenia.

99
00:09:44,950 --> 00:09:48,090
Warto więc umieścić to postawmy to się tylko trochę.

100
00:09:48,160 --> 00:10:07,360
Więc po otwarciu tutaj następnie ustawić znacznik zakotwiczenia Musimy Czytaj więcej i dodamy na ikonę ikonę podwójnej strzałki, która będzie tylko mała strzałka po więcej.

101
00:10:07,380 --> 00:10:09,040
OK maraton tam.

102
00:10:09,070 --> 00:10:10,680
Dużo rzeczy dodaliśmy w.

103
00:10:10,750 --> 00:10:20,470
Wystarczy upewnić się, że wszystko jest OK, a patrząc na pewno wystarczy spojrzeć na kod rozwiązanie, jeśli nie chcesz, aby wziąć to od podstaw.

104
00:10:20,710 --> 00:10:25,360
Zobaczmy jak to wygląda bo nie ma żadnych błędów składniowych.

105
00:10:27,310 --> 00:10:30,570
To albo idziemy właśnie to, czego szukasz.

106
00:10:30,580 --> 00:10:37,570
Więc jesteśmy obcinania pierwszych 100 znaków w tym lub tyle znaków, ile jest w tym poście.

107
00:10:37,570 --> 00:10:43,560
W tym przypadku bardzo krótkie kliknięcie czytaj więcej prac link przeniesie nas do strony pokazu.

108
00:10:43,690 --> 00:10:47,760
możemy edytować wrócić.

109
00:10:47,760 --> 00:10:49,170
Mamy tu swoje obrazy.

110
00:10:49,210 --> 00:10:57,910
Po podzielić linie mamy Hetter mamy ten segment dzieje wokół wszystkiego i skończymy bardzo dużo.

111
00:10:58,210 --> 00:11:04,060
Więc znowu nie masz ochoty na pewno nie masz ochoty trzeba znać wszystkich tych klas.

112
00:11:04,060 --> 00:11:04,940
I niby właśnie zrobił.

113
00:11:05,140 --> 00:11:06,090
Wiesz dał je do Ciebie.

114
00:11:06,130 --> 00:11:07,380
Szybki styl ogień.

115
00:11:07,510 --> 00:11:10,660
Bo nie chodzi o to, że uczysz się wszystko.

116
00:11:11,080 --> 00:11:14,670
Ale jeśli chcesz dowiedzieć się więcej i pójść do semantycznej dashi dlaczego Dotcom.

117
00:11:14,690 --> 00:11:17,200
Jest wiele świetnych tutoriali i zasobów.

118
00:11:17,260 --> 00:11:21,270
To nie jest jeszcze tak szeroko stosowany jako bootstrap ale zdecydowanie rośnie.

119
00:11:21,400 --> 00:11:24,770
Zauważyłem dużo moich studentów byłoby go znaleźć na własną rękę.

120
00:11:24,880 --> 00:11:37,430
Podczas gdy w przeszłości chciałbym go wprowadzić do nich po Bluechip w większości dwóch ostatnich klasach I uczy studentów bardzo szybko zakochał się w niej bez mnie kiedykolwiek przedstawiający go do nich i skończyło się to nad bootstrap.

121
00:11:37,630 --> 00:11:40,800
Większość studentów, ale całkowicie do Ciebie.

122
00:11:40,880 --> 00:11:45,300
I cieszył się nimi obydwoma a bootstrap jest zdecydowanie bardziej popularny teraz.

123
00:11:45,340 --> 00:11:50,780
OK, tak więc ostatnią rzeczą, jaką możemy zrobić, to wymienić byłaby naszym stole tylko odrobinę.

124
00:11:50,920 --> 00:11:57,140
I wszystko co chcę zrobić, to dodać w ostatniej kolumnie dla metody mangusty, która odpowiada każdemu z nich.

125
00:11:57,400 --> 00:12:03,510
Więc znaleźć, id znaleźć o 80 find aktualizacja przez ID dodaj usuń i tak dalej.

126
00:12:03,860 --> 00:12:06,100
Będę szybki przegląd jak działają tabele.

127
00:12:06,110 --> 00:12:24,540
Więc tu jest wykres, który z wiekiem ilość musimy dodać w innym TH, a my po prostu nazwać to metoda mangusta i otwórzmy się na podglądzie podgląd gotowania i przenieść go do dna tutaj.

128
00:12:24,750 --> 00:12:27,150
Jest nasz stół lub nową th.

129
00:12:27,460 --> 00:12:36,450
A potem do indeksu dodamy telewizor w metodzie mangusty tam dla psa powinien być psem znaleźć.

130
00:12:36,880 --> 00:12:38,230
Proszę bardzo.

131
00:12:38,230 --> 00:12:43,400
Następna w kolejce mamy nowe, które w rzeczywistości nie posiada metody mnisich w ogóle.

132
00:12:43,450 --> 00:12:50,890
Więc zamiast pozostawiać go puste ja po prostu umieścić w pliku, który robi to uczynić formularz.

133
00:12:51,130 --> 00:12:59,330
Następnie mamy tworzyć i tworzyć zrobi psa dot tworzenia.

134
00:13:01,150 --> 00:13:12,040
I jeszcze jedna bardzo fajna funkcja, jeśli można to zrobić podgląd życie jest jako MIDI edycji przyszedł zauważyłem, że pokazuje mi, gdy jestem wybierając na dole, która jest dość chłodno.

135
00:13:12,190 --> 00:13:15,920
Więc nie trzeba nawet otwierać inspektora i po prostu zobaczyć na żywo.

136
00:13:16,120 --> 00:13:21,900
A jeśli coś zmienić je aktualizować na żywo, jak również bez konieczności zapisywania lub odśwież stronę.

137
00:13:22,420 --> 00:13:22,820
OK.

138
00:13:22,930 --> 00:13:31,900
Tak więc mamy pokaz, który robi psa, który znaleźć przez ID to mamy go.

139
00:13:32,260 --> 00:13:35,400
Który również ma psa dostać grzywną przez ID.

140
00:13:35,710 --> 00:13:49,880
Musimy znaleźć psa, który mamy do edycji i to w formie, a następnie zmiana ma psa, który trimed przez ID i aktualizacji długa.

141
00:13:50,360 --> 00:14:00,830
A jest on także dość długo pies może znaleźć przez ID i usunąć każdy iść.

142
00:14:01,300 --> 00:14:02,300
Spójrzmy.

143
00:14:02,620 --> 00:14:04,250
Oto nasz stół.

144
00:14:04,380 --> 00:14:23,150
Wygląda na to, że przypadkowo usunięte jedna z płyt tutaj który ma wyświetlać co zmiana ma więc zmiana ma na celu zaktualizowanie pies stuper drażniącymi psa następnie przekierować gdzieś.

145
00:14:24,150 --> 00:14:24,860
W porządku.

146
00:14:25,150 --> 00:14:26,430
Teraz powinniśmy wrócić do normy.

147
00:14:26,480 --> 00:14:28,220
Oto nasz stół.

148
00:14:28,210 --> 00:14:31,740
Tak więc jedynym, który nie ma żadnych metod Mongoose w ogóle.

149
00:14:31,960 --> 00:14:37,390
To będzie nowa, bo nowa nie jest znalezienie czegokolwiek w bazie danych to nie dodając niczego.

150
00:14:37,570 --> 00:14:40,090
To po prostu sprawia nam formularz.

151
00:14:40,210 --> 00:14:40,570
Wspaniały.

152
00:14:40,570 --> 00:14:44,580
Więc mam nadzieję, że jest to przydatne dla Ciebie w przyszłości może odnosić się do tej tabeli.

153
00:14:44,870 --> 00:14:50,290
Będę odsyłając do niego z pewnością obejmuje wiele ważnych informacji, które będziemy używać dużo.

154
00:14:50,290 --> 00:14:50,860
W porządku.

155
00:14:50,980 --> 00:14:56,280
Tak więc zakończyć to teraz mamy przejść do niektórych bardziej ciekawego niektórych bardziej skomplikowanych aplikacji.

156
00:14:56,360 --> 00:14:59,980
Zauważyłem, że był trochę Ameryki na pokryte dużo.

157
00:15:00,040 --> 00:15:01,710
To zawsze jest trudne do wykonania.

158
00:15:01,710 --> 00:15:03,870
Ciekawe, bo po prostu dużo informacji.

159
00:15:03,880 --> 00:15:12,380
Ale, ale ważne jest, aby mieć, że wiarygodność móc tworzyć odczytu aktualizacji i usuwania podmiot zajmuje dużo tajemnicy.

160
00:15:12,380 --> 00:15:12,810
W porządku.

161
00:15:12,900 --> 00:15:13,920
Do zobaczenia w przyszłym roku.
