1 00:00:00,200 --> 00:00:01,200 Witam ponownie. 2 00:00:01,200 --> 00:00:04,380 Więc teraz mamy zamiar odebrać z resztą naszych spokojny trasach. 3 00:00:04,470 --> 00:00:09,360 Zrobiliśmy indeks i zrobiliśmy sobie przerwę, aby dodać do Mantic Ci tj nagłówka i stopki Parshall jest. 4 00:00:09,360 --> 00:00:19,990 Teraz mamy zamiar zrobić nowe i tworzyć tak, że do końca tego filmu, po kliknięciu na nowym stanowisku powinien widzę formularz, a następnie mogę iść do tej formie wypełnić go, a następnie uderzył kliknij. 5 00:00:20,010 --> 00:00:23,970 To zajmie mi powrót do strony indeksu i powinny widzę innego posta. 6 00:00:24,000 --> 00:00:25,210 Więc zacznijmy. 7 00:00:25,530 --> 00:00:30,710 Pierwszą rzeczą, jaką musimy zrobić, to stworzyć nową trasę, która pokazuje jak zapamiętania nowych postaci. 8 00:00:30,770 --> 00:00:37,110 Jest to żądanie GET ukośnik psy lub ukośnik ukośnik blogi nowe i to tylko pokazuje formę. 9 00:00:37,380 --> 00:00:39,440 Warto więc nie zacząć. 10 00:00:40,590 --> 00:00:43,620 Zrobimy to po naszym indeksie, a dodajmy, że tutaj. 11 00:00:43,650 --> 00:00:45,670 Główna napisał. 12 00:00:45,960 --> 00:00:51,980 Teraz zróbmy nową trasę i dodam w tworzenie jak również. 13 00:00:52,050 --> 00:01:00,730 Więc dla naszej nowej trasie i po otrzymuję blogi slash slash nowe i nowa jest to naprawdę proste. 14 00:01:00,760 --> 00:01:06,790 To najkrótsza bo naprawdę wszystko, co musimy zrobić, to uczynić taką samą formę za każdym razem. 15 00:01:06,930 --> 00:01:09,280 Nie musimy szukać czegokolwiek w bazie danych. 16 00:01:09,450 --> 00:01:11,730 Nie trzeba wysyłać żadnych danych do formularza. 17 00:01:11,730 --> 00:01:16,490 Wszystko, co musimy zrobić, to czyni nowe. 18 00:01:17,190 --> 00:01:19,110 A potem musimy sprawić, aby ten plik oczywiście. 19 00:01:19,110 --> 00:01:28,340 Więc dotknij poglądy slash nowe Ejay Tak C-9 odsłon slash nowe. 20 00:01:29,100 --> 00:01:30,970 OK, zacznijmy proste. 21 00:01:31,380 --> 00:01:34,150 A wszystko z nas używa tutaj trochę semantycznej UI. 22 00:01:34,200 --> 00:01:43,400 Więc zrobimy div, a urządzenie to będzie proste, po prostu ma tekstu głównego segmentu kontenera klasy UI. 23 00:01:43,400 --> 00:01:44,720 Więc jest dużo rzeczy tam. 24 00:01:44,760 --> 00:01:46,270 będę rozbicie go na chwilę. 25 00:01:46,530 --> 00:01:58,520 I wtedy zamiast tego dodajmy w nagłówku do zrobienia, że ​​możemy zrobić UI ogromny nagłówek i niech po prostu nazywają ten nowy dziennik. 26 00:01:59,300 --> 00:02:02,310 A jeśli widzimy to będziemy wiedzieli, że nam się udało. 27 00:02:03,030 --> 00:02:04,180 Więc uruchomić aplikację w górę. 28 00:02:04,300 --> 00:02:07,760 No i rzeczywiście musimy to nasze partials też. 29 00:02:07,770 --> 00:02:11,980 W przeciwnym wypadku zobaczymy diff ale my nie możemy nie będzie widać żadnych stylów semantycznych. 30 00:02:12,150 --> 00:02:25,410 Więc musimy nasz Ejay s to kropka slash nagłówka slash samej linii Parshall pod adresem kreską dole Parshall za oszczędzać. 31 00:02:25,950 --> 00:02:29,830 Odśwież stronę i przejść do bloga slash nowe. 32 00:02:30,840 --> 00:02:32,070 I mamy dwa problemy. 33 00:02:32,070 --> 00:02:34,550 Pierwszym z nich jest kwestia odstępy. 34 00:02:34,650 --> 00:02:37,540 Możemy ustalić, że dość łatwo, ale jesteśmy coraz odpowiedni szablon. 35 00:02:37,800 --> 00:02:44,000 Ale zauważyłem coś trochę dziwne, która jest, że nasza ikona wróciła do bycia małym na stronie głównej. 36 00:02:44,010 --> 00:02:47,170 To duża na tej stronie jest mały. 37 00:02:47,370 --> 00:02:51,760 I spędziłem trochę czasu, patrząc na to, jak rodzaj błędu chwastów. 38 00:02:51,840 --> 00:02:52,490 Rozgryzłem to. 39 00:02:52,500 --> 00:03:01,990 To naprawdę jedna z tych frustrujących te, które, które pojawiają się co jakiś czas, w którym nie jest strasznie oczywiste na początku, ale będę cię przez chwilę, co zauważyłem. 40 00:03:02,160 --> 00:03:04,320 Widać, że mówi w konsoli. 41 00:03:04,320 --> 00:03:16,250 Nie udało się załadować stylów opt out C S S ale szukałem jej w sashed blogi slash slash arkusze stylów aplikację C S i że nie tam, gdzie powinien szukać. 42 00:03:16,290 --> 00:03:25,030 I tak spojrzał na link, który założyliśmy w pliku nagłówka i zauważyłem zapomniałem jedną małą rzeczą ukośnikiem. 43 00:03:25,080 --> 00:03:29,080 Więc jeśli są świeże Teraz zobaczysz, że go znajdzie. 44 00:03:29,310 --> 00:03:31,680 I nie mamy tu błąd. 45 00:03:31,680 --> 00:03:41,820 A jeśli spojrzał w zakładce źródła Można zobaczyć, że to nie wygląda wewnątrz blogów, które to co to jest za wcześniej teraz wygląda poza arkuszy stylów. 46 00:03:41,850 --> 00:03:44,990 A teraz możemy skończyć z tym większą ikoną kod w nie. 47 00:03:45,390 --> 00:03:54,690 Dalej niech rozwiązać problem obecnie zachodzą na resztę naszego forum i mocowania jest to na szczęście bardzo łatwe teraz, że mamy, że arkusz stylów skonfigurować. 48 00:03:54,900 --> 00:04:01,590 Wszystko, co musimy zrobić, to dodać trochę marginesu na szczyt tego elementu, który jest elementem kontenera. 49 00:04:02,250 --> 00:04:04,520 Wszystko co robimy będzie wewnątrz tego kontenera. 50 00:04:04,710 --> 00:04:18,440 Będziemy więc zaznaczyć, że w naszym arkuszu stylów po ocenić, a my po prostu zrobić pojemnik, a następnie wszystko, co chcesz zrobić, to margines w góry, a nie siedzi w liczbie pikseli. 51 00:04:18,450 --> 00:04:23,280 Mam zamiar używać e-M, jak również tak, że widać go częściej. 52 00:04:23,280 --> 00:04:32,640 Tak naprawdę nie widziałem go dużo i po prostu zobaczyć, mamy inny problem, który jest, że pojemnik sprawdzimy również wewnątrz pasku nawigacyjnym. 53 00:04:32,640 --> 00:04:34,640 Pamiętaj, mamy tam pojemnik. 54 00:04:34,830 --> 00:04:43,800 Więc my tylko chcemy kierować rzeczy, które są pojemniki, które również są głównym lub pojemniki, które są również segmentu lub coś innego niż tylko ogólnych pojemników. 55 00:04:44,040 --> 00:04:46,060 Więc to już inna łatwo naprawić. 56 00:04:46,170 --> 00:04:48,370 Będziemy wracać i po prostu zrób mi. 57 00:04:48,390 --> 00:04:49,520 Więc to coś znaczy. 58 00:04:49,520 --> 00:04:55,070 Miałem obie te klasy teraz odświeżyć i wygląda o wiele lepiej. 59 00:04:55,100 --> 00:04:56,170 Więc nie zadzieraj z nim. 60 00:04:56,210 --> 00:05:02,930 Marginesy tego kontenera tutaj wewnątrz NAV. menu po prostu grać z tego tu i teraz do stylizacji. 61 00:05:02,930 --> 00:05:05,050 Teraz przejdźmy forma do pracy. 62 00:05:05,150 --> 00:05:28,460 Więc zamiast naszego nowego tatusia tak chcemy tworzyć i nasza forma jest trochę jak ta, gdzie to idzie ciąć kłody które jeśli zapomniałeś patrzymy na naszych spokojny tras i widać stworzenie jest lampa psy tak samo jak indeks w postaci stanowisko. 63 00:05:29,120 --> 00:05:52,090 Dlatego ta forma musi iść ciąć kłody, gdzie metoda jest po, a następnie wewnątrz formularza chcesz kilka wejść pierwsza będzie tylko typ równa tekst ot tak i wpisując ścisłej tekst i nadać mu nazwę równą blog tytuł a następnie zastępczy to równa tytule. 64 00:05:52,850 --> 00:06:00,550 A potem będziemy powielać ten wyjątek, a nie tytuł zrobi to za obraz. 65 00:06:01,350 --> 00:06:19,940 I to powinien być przegląd z siedzącej na żądania POST z kilku filmów, które wykraczają a potem zrobimy to samo dla treści, które nazwaliśmy ciało i po prostu umieścić go zalogować postu idzie tu jako zastępczy. 66 00:06:19,940 --> 00:06:35,680 Dobrze więc, że mamy zrobić, a następnie musimy znaleźć sposób, aby przedstawić to tak będzie to robić typ wejścia równa się złożyć tak po prostu, a następnie zapisać i zobaczyć, co mamy. 67 00:06:35,770 --> 00:06:38,230 Oto nasz formularz nie naprawdę stylem. 68 00:06:38,300 --> 00:06:39,600 Dojdziemy do tego szybko. 69 00:06:39,740 --> 00:06:46,820 Ale to powinno działać dobrze, jeśli poddamy powinniśmy się błąd, który mówi, nie może rozpoczynać ciąć blogów. 70 00:06:47,060 --> 00:06:49,660 To dlatego, że nasz stworzyć trasa nie istnieje. 71 00:06:50,150 --> 00:06:53,960 Więc zróbmy to teraz slash psy jako post. 72 00:06:54,110 --> 00:07:07,260 Zamiast więc faktycznie tak pod Tworzenie komentarza trasie zrobimy aplikacja publikować blogi ukośnik lub Colback. 73 00:07:07,700 --> 00:07:13,160 Idealny i tu rzeczywiście trzeba utworzyć ten nowy blog. 74 00:07:13,160 --> 00:07:22,710 Mamy więc dwa etapy tworzenia bloga następnie uruchomić przekierowanie i będziemy przekierowywać do indeksu teraz. 75 00:07:23,780 --> 00:07:30,220 Tak więc, aby stworzyć bloga, musimy blog tworzenia i pierwszą rzeczą jest dane. 76 00:07:30,230 --> 00:07:31,990 Tak, że nie będzie działać jeszcze. 77 00:07:32,060 --> 00:07:34,140 A druga sprawa to oddzwonienie. 78 00:07:34,580 --> 00:07:38,450 Więc nasz oddzwaniania możemy zacząć mamy błąd. 79 00:07:38,510 --> 00:07:55,600 A potem, jeśli to działa będziemy mieli nowy blog i dane, które mamy przechodzącego przez pamiętam z filmu na żądania POST to wszystko wewnątrz wniosek dot kropką ciała i co nazwaliśmy nasz formularz w naszym formularzu. 80 00:07:55,610 --> 00:07:58,890 Wszystko jest wewnątrz bloga i grupy i razem. 81 00:07:58,940 --> 00:08:05,120 Jeśli więc po prostu zwrócić się zrzutu body bloga automatycznie ma tytuł obrazu i ciało. 82 00:08:05,120 --> 00:08:10,530 Dajemy zażądać ciosem ciała sierpnia pierwszy argument potrzebny, że dane tworzy nowy blog, kiedy to zrobić. 83 00:08:10,530 --> 00:08:11,950 Przyczyna tego zwrotnego. 84 00:08:12,140 --> 00:08:14,760 I robimy standardowego, jeżeli błąd. 85 00:08:15,030 --> 00:08:35,870 Zróbmy Załóżmy, zamiast liczyć na temat rejestrowania niech czynią nowy formularz ponownie indziej zrobimy przekierowanie rez ciąć kłody i powinniśmy zobaczyć nowy blog pojawi się tam. 86 00:08:36,020 --> 00:08:43,410 Jeśli to działało przejdźmy ten komentarz i zobaczmy, co się stanie, jeśli damy mu szansę. 87 00:08:43,520 --> 00:08:44,660 Więc będziemy oszczędzać. 88 00:08:44,870 --> 00:08:57,460 Musimy ponownie uruchomić serwer i przejść całą drogę z powrotem do korzeni zrobić kopię tego obrazu URL tak mamy obraz lub tytuł blogu do. 89 00:08:57,620 --> 00:09:00,230 Oto nasz wizerunek w naszym blogu. 90 00:09:00,350 --> 00:09:03,740 Zatwierdź i działa idealnie. 91 00:09:03,800 --> 00:09:12,020 I widać mamy tytuł obrazu bardzo krótki wpis na blogu ciało w naszej daty utworzenia jest również wyświetlać. 92 00:09:12,170 --> 00:09:12,860 Wspaniale. 93 00:09:13,010 --> 00:09:19,790 Tak więc, aby podsumować to wszystko do tras nowych i tworzenie nowych jest ukośnik, co nazwa modelu jest. 94 00:09:19,790 --> 00:09:24,910 Psy w naszym przypadku są rzeczywiście blogi slash i masz żądań. 95 00:09:24,920 --> 00:09:32,580 To pokazuje formę tworzenia się psy flash, podobnie jak indeks był wyjątkiem, że to żądania POST. 96 00:09:32,600 --> 00:09:35,350 I w tym miejscu nowa forma wysyła dane. 97 00:09:35,430 --> 00:09:39,080 Aby dodać do bazy danych stworzyć nowego psa, a następnie przekierowuje z powrotem. 98 00:09:39,080 --> 00:09:44,660 To nie musi być indeks większość czasu to faktycznie pokazać stronę, która będzie można zobaczyć w następnym filmie. 99 00:09:45,140 --> 00:09:47,550 Niech szybko projektować naszą aplikację. 100 00:09:47,580 --> 00:09:49,820 Zróbmy formularza. 101 00:09:50,570 --> 00:10:10,070 Więc używać semantycznej pierwszą rzeczą my zrobić, to dać nasz formularz klasę równą formę interfejsu użytkownika, a następnie wewnątrz tej postaci każdy z tych wejść będą w div i div będzie mieć klasę równe pola. 102 00:10:10,550 --> 00:10:13,330 A następnie zastanowić się, jak etykiety, w którym jeszcze nie ma. 103 00:10:13,730 --> 00:10:19,860 I pierwsza etykieta będzie tytuł i potem będziemy się nasz tytuł i umieścić go tam. 104 00:10:20,390 --> 00:10:21,450 Idealny. 105 00:10:21,470 --> 00:10:24,630 A potem zrobimy to jeszcze kilka razy. 106 00:10:24,770 --> 00:10:47,470 Musimy jeden z nich dla obrazu zmienić etykietę powiedzieć obrazu, a następnie jedna zmiana chcę zrobić jest to, że zamiast tworzyć nasz blog wejście tak chcę, aby jej pole tekstowe, w którym użytkownik może wpisać trochę więcej tekstu jak rzeczywiste blogu. 107 00:10:48,050 --> 00:11:06,560 Oraz ustalenie, że zamiast podejmowania tego wejście mamy zamiar mieć div Chrisfield jeszcze w etykiecie, a my po prostu nazwać blogu treści, ale zamiast tego wejścia mamy zamiar dodać tag polu tekstowym, które widzieliśmy wcześnie, ale tak naprawdę nie używany dużo. 108 00:11:06,830 --> 00:11:10,280 I to jest trochę inaczej niż wejść wciąż nadać mu nazwę. 109 00:11:10,400 --> 00:11:24,830 Więc ciało nadal blog, a potem zapisać, ale nie dajemy mu rodzaj tekstu, ponieważ nie jest to wejście to własny oznaczony znacznikiem, który ma otwór i znacznik zamykający i zachowuje się trochę inaczej, jak również. 110 00:11:24,830 --> 00:11:26,130 Gdy mamy je dodać. 111 00:11:26,270 --> 00:11:30,650 Więc widzimy, że za chwilę, aby pozbyć się tego i wtedy będziemy projektować nasz przycisk. 112 00:11:30,650 --> 00:11:32,540 Przyjrzymy się temu, co mamy teraz. 113 00:11:32,740 --> 00:11:36,610 Wygląda to dość dobre, z wyjątkiem przycisku może być stylizowany trochę ładniejszy. 114 00:11:36,790 --> 00:11:43,800 I jeśli podciągnąć semantycznej UI i przejdź przycisku istnieje sposób więcej przycisków w semantyczne niż w startowej. 115 00:11:43,910 --> 00:11:51,780 Tak różne typy, ale także wiele kolorów podstawowe przyciski i następnie odwrócone przyciski oraz. 116 00:11:52,310 --> 00:12:04,890 Więc wybrać jeden z nich, który chcesz i kiedy iść z ulubionych zróbmy fioletowe fioletowy i jeśli spojrzeć na kodzie źródłowym wszystko, co potrzebne jest klasa równa Ciebie. 117 00:12:05,250 --> 00:12:07,950 Kolor przycisku podstawowe. 118 00:12:08,480 --> 00:12:12,780 I choć to zrobić będę wyjaśniać, dlaczego to się nazywa semantyczne UI. 119 00:12:12,920 --> 00:12:44,590 A głównym powodem jest to, że w przeciwieństwie do bootstrap gdzie mamy tego rodzaju dziwne żargon ETN ETN rozdzielczej LGBT i domyślnie rozdzielczej np które niechętnie Bootstrap naprawdę nie przewracając go ale powodem, że sematic został utworzony był w odpowiedzi na tego rodzaju znaczników gdzie zamiast możemy mieć UI naruszają przycisk podstawową lub mogę zrobić UI Violet odwrócony przycisk. 120 00:12:45,050 --> 00:12:46,820 Zatem podstawowym teraz jest w porządku. 121 00:12:47,060 --> 00:12:48,050 I to jest wszystko, co potrzeba. 122 00:12:48,050 --> 00:12:49,630 Bardzo prosta. 123 00:12:49,760 --> 00:12:51,530 Nie dlatego, że jest to mniej znaków. 124 00:12:51,560 --> 00:12:52,840 Tu nie chodzi o bycie krótszy. 125 00:12:53,030 --> 00:12:58,340 Chodzi o bycie znaczącym gdzie można łatwo patrzeć na to i zrozumieć, co to znaczy. 126 00:12:58,340 --> 00:13:01,420 Jeśli więc teraz wrócić i odświeżyć. 127 00:13:01,690 --> 00:13:06,900 Mam ten przycisk i jeśli chcemy, aby było duże to naprawdę proste. 128 00:13:06,930 --> 00:13:09,050 Wszystko, co musisz zrobić, to wpisać duże. 129 00:13:09,050 --> 00:13:16,910 Więc nie muszę robić BT i pędzić Elgie prostu wielki odświeżenia i uzyskać większy przycisk i to wszystko. 130 00:13:16,910 --> 00:13:18,740 Warto więc przetestować go ponownie. 131 00:13:18,740 --> 00:13:26,770 Znaczy używam samo pogrubienie argumentować dobrze niech po prostu nazwać to mój nowy pies. 132 00:13:27,980 --> 00:13:32,350 Więcej blog Contac złożyć i działa dobrze. 133 00:13:32,420 --> 00:13:33,110 Wspaniały. 134 00:13:33,110 --> 00:13:41,480 Dobrze więc objęły indeks omówiliśmy Nowe i tworzenia i pokazałem wam odrobinę semantyczne Można uzyskać formularze i przyciski w następnym filmie.