1
00:00:00,450 --> 00:00:01,380
Welkom terug.

2
00:00:01,470 --> 00:00:10,190
In deze video gaan we richten op het verkrijgen van de NAF bar om de banden correct weer te geven, zodat wanneer je niet bent ingelogd zie je alleen inloggen en meld je aan.

3
00:00:10,260 --> 00:00:17,010
Maar als je in je bent aangemeld alleen zien uitloggen en dan kunnen we ook een klein bericht dat zegt aangemeld als weer te geven.

4
00:00:17,160 --> 00:00:21,620
En vervolgens de gebruikersnaam in meerdere in rust ondertekend ondertekend eten wat het is.

5
00:00:21,640 --> 00:00:32,620
het had in eerste instantie dit alles aan het eind van het gedeelte voor de video en ik begon om het te verplaatsen naar een aparte video, zodat ze een beetje meer tijd door te brengen in te gaan op een aantal details en uit te leggen hoe een aantal van deze werken.

6
00:00:32,640 --> 00:00:33,720
Dus laten we beginnen.

7
00:00:33,810 --> 00:00:35,790
En wat ik ga doen is open te stellen Hetter.

8
00:00:35,970 --> 00:00:36,860
Ja.

9
00:00:37,110 --> 00:00:42,510
En hier zijn de drie lijnen die verantwoordelijk zijn voor die drie links hier zijn.

10
00:00:42,510 --> 00:00:47,270
Aanmelden Inschrijven uit te loggen om te verbergen en laat ze op de juiste wijze.

11
00:00:47,280 --> 00:00:49,940
We moeten een aantal eenvoudige E.J. toevoegen esque logica.

12
00:00:50,460 --> 00:00:53,120
We zullen een if-statement dat er iets ziet er als volgt hebben.

13
00:00:53,130 --> 00:00:54,630
Dit is gewoon pseudo-code.

14
00:00:54,630 --> 00:01:06,210
Maar als er geen gebruiker dan zal tonen aanmelden en registreren en dan het andere zal de log koppeling tonen uit.

15
00:01:06,210 --> 00:01:08,100
Nu is dit natuurlijk niet echt javascript.

16
00:01:08,220 --> 00:01:09,320
We moeten aan werken.

17
00:01:09,450 --> 00:01:28,090
Maar wat we zullen doen is langs een variabel net zoals we hier hebben gedaan waar we passeren in camping of we doen het op tijd hier repassing camping weer behalve wij gaan een gebruiker object passeren en dat de gebruiker bevatten informatie over de aangemelde gebruiker of als er geen aangemelde gebruiker.

18
00:01:28,100 --> 00:01:32,960
Het zal leeg ongedefinieerd zijn en we kunnen die gebruiker variabele gebruiken in plaats van onze template.

19
00:01:33,150 --> 00:01:34,490
Dus als het niet gedefinieerd.

20
00:01:34,740 --> 00:01:36,850
We zullen controleren of de gebruiker is gedefinieerd.

21
00:01:36,960 --> 00:01:40,800
Laat deze wijze de log in verbinding te tonen.

22
00:01:40,800 --> 00:01:45,080
Dus laten we beginnen met het uitzoeken hoe kunnen we die gegevens over de gebruiker te krijgen.

23
00:01:45,180 --> 00:01:57,520
En ik zal gewoon beginnen op een van deze routes en ik zal de kampeerterreinen indexpagina die hier nadat ik slash campings, want het is een mooie eenvoudige route en veel van onze code redirects terug om deze route te doen.

24
00:01:58,050 --> 00:02:01,780
En het geheim van dit alles het belangrijkste onderdeel is verzoek direct gebruiker.

25
00:02:02,040 --> 00:02:05,210
Op verzoek dat de gebruiker alle informatie bevat.

26
00:02:05,220 --> 00:02:09,840
Nou niet alles, maar de gebruikersnaam en het ID van de momenteel ingelogde gebruiker.

27
00:02:09,860 --> 00:02:10,920
Dus ik zal je laten zien.

28
00:02:11,100 --> 00:02:19,720
Laten we gewoon een annuleren dat log aanvragen op door de gebruiker en start de server up en dan zal ik refresh gaan.

29
00:02:21,090 --> 00:02:22,310
En we krijgen undefined.

30
00:02:22,410 --> 00:02:25,030
En dat komt omdat er geen aangemelde gebruiker.

31
00:02:25,130 --> 00:02:26,930
Dus vragen dat gebruikers leeg.

32
00:02:26,980 --> 00:02:27,990
Het bestaat niet.

33
00:02:28,290 --> 00:02:41,090
Maar zodra ik inloggen wat paspoort zal doen is het creëren verzoeken die input van de gebruiker de gebruiker gegevens alleen de gebruikersnaam en het ID niet het wachtwoord of allesbehalve gebruikersnaam en ID binnenkant van het verzoek van de gebruiker.

34
00:02:41,460 --> 00:02:52,740
Dus een log in Severus wachtwoord klik aanmelden Laten we gaan kijken zie je dit nu vragen dat de gebruiker.

35
00:02:52,920 --> 00:02:55,470
Het gaat echt nuttig voor ons om in onze templates.

36
00:02:55,530 --> 00:02:57,220
Dus ik ga geschiedde dat door middel van nu.

37
00:02:57,270 --> 00:02:58,180
Zich te ontdoen van dat.

38
00:02:58,350 --> 00:03:05,280
En dan na campings we zullen gewoon moeten een andere variabele Akol huidige gebruiker die gelijk is aan de gebruiker te vragen.

39
00:03:05,460 --> 00:03:10,050
En vervolgens in onze template kunnen we een aantal eenvoudige logica die controleert of er een huidige gebruiker te schrijven.

40
00:03:10,320 --> 00:03:15,620
En vervolgens in onze template kunnen we een aantal zeer eenvoudige logica toe te voegen met behulp van de huidige gebruiker variabele.

41
00:03:15,720 --> 00:03:18,220
Dus laten we slaan en laten we naar die index.

42
00:03:18,290 --> 00:03:18,750
Ja.

43
00:03:18,780 --> 00:03:22,650
Welke is de campings index en gewoon aan de top.

44
00:03:22,800 --> 00:03:32,730
Laten we voeg gewoon een beetje H voor die net uit te printen huidige gebruiker en laten we de server opnieuw.

45
00:03:33,880 --> 00:03:46,590
En als ik nu gaan we zie niets, maar als ik inlog in verschillende opnieuw en opnieuw Ik zie nu de huidige gebruiker.

46
00:03:46,590 --> 00:03:56,850
Dus we nu passeren die gegevens door middel van in onze template, maar eerder dan het te gebruiken in plaats van deze index template we eigenlijk willen gebruiken binnenkant van de navigatiebalk template de header.

47
00:03:57,240 --> 00:04:01,750
En vergeet niet dat we hebben toegang tot een van de variabelen die we via onze template passeren.

48
00:04:01,890 --> 00:04:03,610
Zelfs de binnenkant van Parshall's.

49
00:04:03,690 --> 00:04:08,650
Dus in elk ons ​​gaan we een if-statement toe te voegen en het ziet er net als dit.

50
00:04:08,760 --> 00:04:30,380
Als er geen huidige gebruiker konden we gewoon die vervolgens weer te geven die twee links en dan zullen we ons anders vertoning koppeling hebben het logboek en dan natuurlijk moeten we onze Ejaz-tags.

51
00:04:30,540 --> 00:04:38,430
Dus laten we het doen, dat zijn gelijke niet tekenen, net als dat.

52
00:04:38,430 --> 00:04:47,990
En we zijn bijna klaar, dus we controleren of een huidige gebruiker variabele leeg is vervolgens gaan we deze te laten zien.

53
00:04:48,220 --> 00:04:49,950
Anders zullen we de logout koppeling te tonen.

54
00:04:50,320 --> 00:04:58,210
Maar dit zal alleen werken op dit moment in ieder geval op deze route slash campings, omdat we niet de huidige gebruiker die door op een andere routes.

55
00:04:58,300 --> 00:05:00,140
Maar laten we maar zorg ervoor dat het werkt.

56
00:05:00,310 --> 00:05:04,660
Dus ik zal de app opnieuw te starten als ik de pagina te vernieuwen.

57
00:05:04,750 --> 00:05:05,260
Grote.

58
00:05:05,260 --> 00:05:10,130
Ik zie alleen inloggen en meld je aan en dat is omdat ik niet ingelogd.

59
00:05:10,450 --> 00:05:19,800
Nu als ik op logon klikt zullen we een probleem en dat is dat we de header-bestand en het probeert om de huidige gebruiker te gebruiken, maar we hebben niet de huidige gebruiker passeren.

60
00:05:19,990 --> 00:05:28,930
Dus eigenlijk zal dit gebeuren op elke route die moet nu Ackbar omdat we niet de huidige gebruiker die door behalve op slash Capgras.

61
00:05:29,500 --> 00:05:35,740
Dus wat we willen doen is voorbij huidige gebruiker door middel van in principe deze lijn hier op elke route.

62
00:05:36,040 --> 00:05:41,220
En op een aantal van hen zou het leeg zijn een aantal van hen zal gebruikersgegevens hebben, maar we willen het beschikbaar op elke route.

63
00:05:41,530 --> 00:05:54,210
En er is een gemakkelijke manier om dat te doen waar we niet hoeven te handmatig toegevoegd aan elke route en up-top voor onze routes alleen maar toe te voegen in een nieuwe update gebruik na gebruik en we zullen ons eigen kleine middleware toe te voegen.

64
00:05:54,430 --> 00:05:57,650
Wat de functie die wij leveren aan het zal worden genoemd op elke route.

65
00:05:57,850 --> 00:06:03,420
Dus we gaan om het een functie verzoek reactie en we moeten dat de volgende variabele ook.

66
00:06:04,360 --> 00:06:10,180
En wat we willen doen, is pas dat vragen bij de gebruiker om elke template en er is een gemakkelijke manier om dat te doen.

67
00:06:10,260 --> 00:06:12,930
Sake rez locals.

68
00:06:13,110 --> 00:06:29,040
Huidige gebruiker verzoek gebruiker wat we in rust op lokaal is wat er beschikbaar is in plaats van onze template en dan is de ander echt belangrijk wat je nodig hebt om verder te gaan naar de werkelijke volgende code want dit is een middleware die zal draaien voor elke route.

69
00:06:29,080 --> 00:06:31,570
Als we niet het volgende hebben, zal hij gewoon stoppen.

70
00:06:31,570 --> 00:06:39,430
Niets zal volgend gebeuren dus we moeten naar de volgende om verder te gaan naar die volgende middleware die eigenlijk de route handler in de meeste gevallen zullen zijn.

71
00:06:40,090 --> 00:06:45,580
Dus nu als we proberen dit restart de server Vernieuw de pagina.

72
00:06:45,580 --> 00:06:46,770
Dit zou moeten werken prima.

73
00:06:46,900 --> 00:06:52,150
Als ik ga om in te loggen heb ik nu de log in vorm en ik ben niet het krijgen van een fout.

74
00:06:52,360 --> 00:06:55,330
En ik zie de juiste banden omdat ik niet ingelogd.

75
00:06:55,390 --> 00:07:05,050
Nu, als ik als Sèvres weer Ik zie alleen uitloggen geweldig en probeer dan te klikken op afmelden.

76
00:07:05,710 --> 00:07:06,180
Geweldig.

77
00:07:06,190 --> 00:07:07,180
Dus het werkt.

78
00:07:07,210 --> 00:07:12,360
Het laatste wat ik wilde doen is dat wanneer je bent ingelogd laten we dit nog een keer.

79
00:07:12,810 --> 00:07:16,360
U wilt omhoog zien hier in plaats van in te loggen en meld je aan.

80
00:07:16,370 --> 00:07:20,920
U wilt zien momenteel aangemeld als Zephyrus en dat is vrij gemakkelijk te doen.

81
00:07:21,130 --> 00:07:22,290
In plaats van onze leiding elk.

82
00:07:22,330 --> 00:07:36,200
Ja, we hebben al een huidige gebruiker, dus als er een huidige gebruiker in dit anders we gewoon toe te voegen een andere bondgenoot en dat Ally zal alleen toe te voegen in de tekst.

83
00:07:37,300 --> 00:07:41,300
Laten we niet aangemeld als.

84
00:07:41,760 --> 00:07:46,050
En dan hebben we gewoon te interpreteren of voegen we in met elkaar als tags.

85
00:07:46,060 --> 00:07:54,250
Huidige gebruiker dot gebruikersnaam en op te slaan opnieuw opstarten en laten we zien hoe dit eruit ziet.

86
00:07:54,250 --> 00:07:57,810
We zouden moeten het een beetje refresh stylen.

87
00:07:58,000 --> 00:08:01,030
Laten we liggen weer.

88
00:08:05,860 --> 00:08:07,570
Aangemeld als Severus.

89
00:08:07,660 --> 00:08:09,430
En ja, we willen stijl die.

90
00:08:09,430 --> 00:08:20,970
Dus laten we het een anker-tag, zoals de anderen en we zullen gewoon niet geven het een H ref, zodat je kunt krijgen vinger tag Atra is gelijk aan alleen het hekje.

91
00:08:21,040 --> 00:08:25,780
Het is misschien zinvol voor dit daadwerkelijk een link naar de profielpagina hoewel die we niet hoeven te zijn.

92
00:08:25,780 --> 00:08:31,470
Maar als we profielpagina's hadden kon je hierop klikt en het zou u naar uw profiel, maar dit is prima voor nu.

93
00:08:31,780 --> 00:08:34,070
Zo zal uitloggen die weg moeten gaan.

94
00:08:34,150 --> 00:08:36,330
Laten we proberen te registreren en te zien hoe dat werkt.

95
00:08:36,580 --> 00:08:42,000
Dus zal ik me aanmelden als mevrouw paars en het wachtwoord wordt paars.

96
00:08:42,010 --> 00:08:49,730
Registreren en opnieuw raken aangemeld als mevrouw paars en kunnen we uit te loggen en laten we gewoon dubbel te controleren alles.

97
00:08:49,790 --> 00:09:00,120
Dat als ik probeer en voeg een nieuwe opmerking die ik er toegang toe hebben, maar als ik me afmeld en ik probeer en doen wat ik niet kan.

98
00:09:00,130 --> 00:09:01,550
Hij vroeg me eerst in te loggen.

99
00:09:01,870 --> 00:09:05,690
OK dus we officieel klaar met de basis van het toevoegen van auth aan Joachim.

100
00:09:05,950 --> 00:09:09,660
Laten we eens een moment om de nieuwe dingen die we zagen in deze les te herzien.

101
00:09:09,790 --> 00:09:46,960
In het bijzonder het gebruik van het verzoek van de gebruiker, die we hier recht te zetten verzoeken dat de gebruiker ofwel leeg zal zijn als er niemand aangemeld of het zal de gebruikersnaam bevat de ID van de huidige gebruiker, zodat we met behulp van een na gebruik, die deze functie zal een beroep doen op elke wrap, dus het is een leuke manier op te drogen of code, waar we niet hoefden te gaan en doe dit op elke route en kunnen we eigenlijk te ontdoen van het nu omdat we er op doorreis gebruiken of na 8 jaar en dan de andere is dat in onze template we gewoon het schrijven van een eenvoudige IF statement en het combineren van die logica met elkaar TM kan echt krachtig zijn.

102
00:09:46,960 --> 00:09:48,320
We kunnen laten zien en deze knoppen te verbergen.

103
00:09:48,340 --> 00:09:50,580
We kunnen laten zien wie er momenteel ingelogd.

104
00:09:50,830 --> 00:09:52,090
Echt belangrijke dingen.

105
00:09:52,420 --> 00:09:54,900
OK dus dat was een beetje een marathon zeker.

106
00:09:54,910 --> 00:09:57,730
Vijf verschillende secties, maar we kregen het aan het werk.

107
00:09:57,760 --> 00:09:59,400
We hebben de gebruiker modellen eerste.

108
00:09:59,560 --> 00:10:11,180
We hebben de Sign-Up registratieformulieren en routes en log vervolgens in en dan is het uit te loggen en dan eindelijk werkten we aan de navigatiebalk en het tonen en verbergen van verbindingen en de weergave van de momenteel ingelogde gebruiker.