1
00:00:00,330 --> 00:00:06,050
Bienvenue à nouveau dans ce que vous savez, nous nous concentrons sur l'authentification des utilisateurs où vous commencez à court.

2
00:00:06,120 --> 00:00:14,710
Selon mon expérience, les étudiants sont vraiment excités à apprendre parce qu'ils estiment que cela rend leurs applications légitimes et les rend sensibles et utilisables.

3
00:00:14,760 --> 00:00:18,210
Si vous pouvez vous inscrire, vous pouvez vous connecter et vous pouvez vous déconnecter.

4
00:00:18,690 --> 00:00:21,030
Donc, c'est une chose amusante et excitante à enseigner.

5
00:00:21,270 --> 00:00:27,140
Mais la vérité est que c'est aussi une chose vraiment difficile à enseigner parce que l'authentification est assez compliquée.

6
00:00:27,180 --> 00:00:31,130
Il ya beaucoup de pièces en mouvement qui doivent s'emboîter dans juste la bonne façon de le faire fonctionner.

7
00:00:31,140 --> 00:00:32,490
Beaucoup de grands concepts.

8
00:00:32,670 --> 00:00:34,850
Et honnêtement, c'est beaucoup de code pour le faire fonctionner.

9
00:00:35,130 --> 00:00:41,530
Heureusement pour nous il ya beaucoup de grands outils là-bas qui nous aident à mettre en œuvre l'authentification rapidement et en toute sécurité.

10
00:00:41,550 --> 00:00:45,060
Maintenant, expliquez ce que je veux dire en toute sécurité plus tard dans cette vidéo.

11
00:00:45,060 --> 00:00:53,540
Avant de plonger dans l'explication des outils et du workflow de l'authentification, je veux passer un peu de temps à vous donner un aperçu de mon processus de pensée derrière l'enseignement de l'art.

12
00:00:53,640 --> 00:00:59,120
C'est un de ces sujets que j'ai passé beaucoup de temps à l'enseigner, mais aussi l'enseignement de plusieurs manières différentes.

13
00:00:59,520 --> 00:01:02,960
Lorsque vous enseignez l'authentification des utilisateurs, il ya un choix que vous devez faire.

14
00:01:03,210 --> 00:01:15,660
Et pour moi ce choix allait enseigner l'authentification à partir de zéro n'utilisant aucun outil du tout et s'assurer que les étudiants se concentrer sur les tenants et les aboutissants de chaque concept important et il pourrait prendre cinq six heures.

15
00:01:15,660 --> 00:01:17,790
Il pourrait être beaucoup de leçons beaucoup de vidéos.

16
00:01:17,910 --> 00:01:23,960
Nous pourrions finir par perdre quelques étudiants, mais nous allons nous assurer que tout le monde comprend comment fonctionne l'authentification.

17
00:01:24,120 --> 00:01:38,650
Ou pouvons-nous utiliser certains des outils existants là-bas des outils qui nous aident à ajouter l'authentification des utilisateurs plus rapide plus simple et avec beaucoup moins de lignes de code et tout cela se résume à ce problème est-il plus important pour les étudiants d'avoir une compréhension profonde de la façon dont les choses travail.

18
00:01:38,760 --> 00:01:43,650
Est-ce la priorité ou est-ce une priorité de demander aux élèves de faire des choses rapidement.

19
00:01:43,650 --> 00:01:49,350
Il en va de la compréhension conceptuelle et de la profondeur des connaissances ou est-il de faire des choses.

20
00:01:49,350 --> 00:01:52,230
Évidemment, dans un monde idéal, nous voudrions les deux.

21
00:01:52,230 --> 00:02:00,830
Nous voulons que chacun comprenne les tenants et aboutissants de tout ce que nous enseignons et nous voulons que les étudiants aient des tonnes de connaissances pratiques et puissent faire des choses rapidement.

22
00:02:01,350 --> 00:02:12,900
Dans le passé, j'ai essayé les deux approches de l'enseignement où j'ai commencé en essayant de donner aux étudiants une compréhension profonde de chaque concept et comment tout fonctionnait et s'emboîter avant même de mettre en œuvre quelque chose.

23
00:02:13,290 --> 00:02:19,350
Et puis j'ai aussi fait le contraire où nous essayons juste de faire quelque chose de travail d'abord et puis revenir et parler de comment cela fonctionne.

24
00:02:19,530 --> 00:02:28,260
Et j'ai passé encore plus de temps à réfléchir à la façon dont nous voulons l'aborder dans ce cours vidéo que j'ai enregistré cette manière de la conférence trop de fois j'ai remanié réécrit tout le code.

25
00:02:28,260 --> 00:02:33,120
C'est une question que je veux obtenir parce que c'est vraiment important et que beaucoup d'étudiants attendent avec impatience.

26
00:02:33,480 --> 00:02:39,660
Donc ce que j'ai décidé de faire est d'avoir deux unités dans cette première unité sur l'authentification que vous regardez actuellement.

27
00:02:39,660 --> 00:02:43,040
Je vais commencer par vous donner un aperçu très rapide.

28
00:02:43,260 --> 00:02:46,740
Pas du tout en profondeur, mais juste un aperçu rapide de la façon dont fonctionne l'authentification.

29
00:02:46,860 --> 00:02:52,300
Et puis nous allons utiliser ces outils dont j'ai parlé qui facilitent notre vie et rendre le code plus court.

30
00:02:52,320 --> 00:02:53,730
Nous allons les utiliser tout de suite.

31
00:02:53,970 --> 00:02:59,450
Et l'accent est mis sur juste faire quelque chose qui a à la fois une occasion et puis une des unités facultatives.

32
00:02:59,460 --> 00:03:15,620
À la fin de ce cours va être une véritable plongée profonde dans l'authentification où nous allons effectivement mettre en œuvre notre propre authentification utilisateur à partir de zéro où nous n'utiliserons aucun des outils et je vais vous montrer maintenant l'objectif Est d'avoir le meilleur des deux mondes va commencer par faire quelque chose.

33
00:03:15,750 --> 00:03:21,970
Et je ne vais pas breeze sur tous les concepts, mais je ne vais pas vous passer une heure plus parler de la façon dont les choses fonctionnent.

34
00:03:22,170 --> 00:03:31,470
D'accord, maintenant que nous avons sorti de la façon dont cette grande discussion idéologique ici je veux maintenant présenter les outils que nous allons utiliser afin que nous allons utiliser quelque chose appelé passeport.

35
00:03:31,500 --> 00:03:32,320
Oui.

36
00:03:32,610 --> 00:03:39,430
Et nous ne l'utilisons pas seulement parce que c'est quelque chose qui rendra notre vie plus facile rendre notre code plus court rendre cette mise en œuvre plus rapide.

37
00:03:39,720 --> 00:03:42,620
Mais c'est aussi quelque chose qui est utilisé beaucoup dans le monde réel.

38
00:03:42,750 --> 00:03:47,410
Beaucoup d'applications utilisent le passeport J.S. Pour mettre en œuvre leur authentification.

39
00:03:47,700 --> 00:03:49,320
Alors laissez-moi vous montrer la page d'accueil ici.

40
00:03:49,560 --> 00:04:05,200
Il s'agit de Passport Chaiya bégayé et voir le petit slogan dit simple authentification discret pour pas de passeport J US est l'authentification middleware pour nœud extrêmement flexible et modulaire passeport peut être discret tombé dans n'importe quelle application web express.

41
00:04:05,280 --> 00:04:12,210
Un ensemble complet de stratégies de soutien à l'authentification en utilisant un nom d'utilisateur et un mot de passe Facebook Twitter et plus encore.

42
00:04:12,210 --> 00:04:16,280
Et puis vous pouvez voir ici il ya effectivement plus de 300 stratégies différentes.

43
00:04:16,440 --> 00:04:36,300
Ainsi, la stratégie se réfère à différents types d'authentification différentes façons d'authentifier les gens que ce soit par le biais de l'utilisateur ayant un type d'e-mail et un mot de passe authentification traditionnelle ou si c'est grâce à un service comme Facebook ou Twitter que vous avez probablement déjà vu sur un site ou un Application où il vous demande de vous connecter via Google ou Twitter ou Facebook.

44
00:04:36,390 --> 00:04:45,220
Et il ya des tonnes de plus que nous pouvons effectivement voir tous et nous pouvons rechercher à travers eux, il ya des choses comme Fitbit, vous pouvez vous connecter par Fitbit.

45
00:04:45,440 --> 00:04:49,450
Nous avons Spotify Reddit tumblr Google plus.

46
00:04:49,700 --> 00:04:53,630
Mais de loin les plus populaires vont être Facebook Twitter et Google.

47
00:04:53,620 --> 00:05:00,620
Et puis aussi ce qui est connu comme l'authentification locale qui est ce que nous allons commencer par ici qui est juste nom d'utilisateur ou e-mail et mot de passe.

48
00:05:00,620 --> 00:05:01,170
D'ACCORD.

49
00:05:01,370 --> 00:05:03,900
C'est donc l'outil de base que nous allons utiliser le passeport.

50
00:05:03,940 --> 00:05:07,660
Oui, il sera une aide énorme dans notre mise en œuvre de l'utilisateur.

51
00:05:08,060 --> 00:05:12,960
Mais nous allons également utiliser un autre paquet appelé Passport local que j'ai ici.

52
00:05:13,190 --> 00:05:17,280
Et c'est l'un de ces schémas ou stratégies d'authentification.

53
00:05:17,360 --> 00:05:30,700
Donc, il ya un passeport Facebook un passeport Twitter passeport Google et passeport local et 300 plus différentes stratégies passeport local est pour le nom d'utilisateur et mot de passe qui est ce que nous allons faire pour commencer.

54
00:05:30,890 --> 00:05:42,290
Mais ce qui est vraiment super sur le passeport, c'est que plus tard dans ce cours, nous pouvons aller ajouter Facebook ou Twitter et nous pouvons garder locaux ainsi et nous pouvons avoir trois 5 10 façons différentes de se connecter à notre application.

55
00:05:42,320 --> 00:05:48,500
Habituellement, vous voulez le garder assez limité, mais nous pouvons avoir autant que nous voulons en utilisant Passeport et nom de passeport.

56
00:05:48,530 --> 00:05:52,490
Il s'agit de fournir ce point d'entrée dans toutes sortes de destinations.

57
00:05:52,870 --> 00:05:58,240
OK et il ya un autre paquet que nous allons utiliser qui est appelé passeport mongoose locale.

58
00:05:58,520 --> 00:06:09,660
Donc, j'ai le hub get ouvert pour cela et le passeport Mongoose locale est un autre paquet qui va juste nous aider à mettre en œuvre l'authentification avec passeport et il est spécialement fait pour fonctionner avec la mangouste.

59
00:06:09,830 --> 00:06:11,450
Nous n'avons donc pas à l'utiliser.

60
00:06:11,540 --> 00:06:19,430
Nous pourrions s'en tirer avec juste en utilisant Passport local le passeport local Mongoose va nous aider à le rendre encore plus rapide et le rendre plus simple pour nous.

61
00:06:19,520 --> 00:06:25,760
Et puis, bien sûr, dans la section optionnelle off from scratch, nous allons créer de l'art à partir de zéro sans aucun de ces outils.

62
00:06:25,980 --> 00:06:26,470
D'ACCORD.

63
00:06:26,570 --> 00:06:28,290
Ce sont donc les trois principaux outils.

64
00:06:28,340 --> 00:06:34,420
Maintenant, je vais vous donner une démo rapide de ce que nous allons faire à l'avance que je vais vous prévenir que ce n'est pas très excitant visuellement.

65
00:06:34,520 --> 00:06:36,020
Je n'ai pas le style du tout.

66
00:06:36,020 --> 00:06:39,840
Mais nous allons vous ajouter Seraph au camp yo et nous allons être de style que.

67
00:06:40,000 --> 00:06:42,940
Mais pour l'instant, c'est une mise en œuvre barebone que je veux vous montrer.

68
00:06:43,220 --> 00:06:45,870
Nous avons donc commencé sur cette page d'accueil et nous avons trois boutons.

69
00:06:46,120 --> 00:06:53,930
Connectez-vous enregistrer et se déconnecter et il ya un secret secret de page slash que vous pouvez uniquement voir si vous êtes connecté.

70
00:06:53,960 --> 00:07:06,510
Donc, si j'essaie d'y aller en ce moment, je ne suis pas connecté et cela me ramène à la barre oblique d'un journal et il me montre le formulaire de connexion donc je vais m'inscrire et je vais vous montrer que nous pouvons ensuite aller à La page secrète.

71
00:07:06,830 --> 00:07:17,410
Donc nom d'utilisateur je vais faire rouillé quatre ou cinq six et mot de passe sera juste mot de passe et puis je vais m'inscrire.

72
00:07:18,350 --> 00:07:21,030
Et il me faut couper le secret que je peux maintenant visiter.

73
00:07:21,290 --> 00:07:28,040
Et sur la page secrète j'ai une photo horriblement embarrassante de ma cellule de ma septième ou huitième année quand j'ai eu mon premier ordinateur portable.

74
00:07:28,040 --> 00:07:28,900
Tout simplement terrible.

75
00:07:29,090 --> 00:07:33,180
Donc, c'est slash secret secret pour une raison évidente.

76
00:07:33,200 --> 00:07:42,670
Et maintenant, si je vais me déconnecter je ne peux plus aller à slash secret, il me redirige vers la barre oblique de connexion et je peux aussi me connecter ici.

77
00:07:42,710 --> 00:08:00,620
Donc, je vais utiliser Rusti quatre cinq six avec le mot de passe correct qui est juste mot de passe et je m'inscris ou se connecter et il me ramène à un tel secret et je peux aller à la page d'accueil et de retour à slash secret parce que je reste connecté.

78
00:08:00,620 --> 00:08:06,880
Donc, la façon dont cela fonctionne le concept-clé que tout dépend de quelque chose est appelé sessions.

79
00:08:07,030 --> 00:08:09,680
Je vais vous donner un résumé rapide des séances.

80
00:08:09,830 --> 00:08:22,660
Fondamentalement, c'est GTP est censé être un protocole sans état qui signifie que lorsque vous envoyez des demandes de ces demandes sont des choses un temps et ils ne contiennent pas d'informations sur votre historique ou les demandes précédentes que vous avez fait.

81
00:08:22,730 --> 00:08:24,020
Ils ne sont pas liés ensemble.

82
00:08:24,050 --> 00:08:32,690
Une demande n'a pas un état, il est juste une transaction unique qui rendrait vraiment difficile de mettre en œuvre l'utilisateur hors parce que je veux être en mesure de rester connecté.

83
00:08:32,930 --> 00:08:41,280
Je veux que le serveur sache que Rustie 4 ou 5 6 est toujours connecté et la façon dont nous le faisons est en utilisant des sessions et ce que les sessions feront.

84
00:08:41,360 --> 00:08:44,750
Ils sont juste un moyen de rendre HTP pas apatride.

85
00:08:44,750 --> 00:09:00,480
Il ya un moyen de fournir l'état de sorte que quand chaque demande que je fais sur cette application lorsque je suis connecté lorsque quelqu'un est connecté, il ya un peu d'informations sur cet utilisateur qui est enregistré dans cette demande qui est envoyée au serveur et c'est Pas réellement le mot de passe utilisateur de l'ensemble du nom d'utilisateur.

86
00:09:00,620 --> 00:09:05,320
Mais c'est un peu d'information et il est encodé et il est essentiellement fait pour être un secret.

87
00:09:05,450 --> 00:09:18,250
Et puis il obtient à mon serveur et puis le passeport va voir cela et il sera traduit en quelque chose qu'il comprend essentiellement crack le code ou non chiffré et il utilisera ces informations pour dire si quelqu'un est connecté ou non.

88
00:09:18,470 --> 00:09:21,350
Donc, cela aura plus de sens une fois que nous ajouterons la mise en œuvre.

89
00:09:21,350 --> 00:09:26,460
Mais le concept clé est que les sessions nous permettent d'avoir l'état dans nos demandes HTP.

90
00:09:26,620 --> 00:09:27,730
Je peux donc envoyer des données.

91
00:09:27,770 --> 00:09:36,260
Je peux retourner à la page d'accueil, il sait toujours que je suis connecté en tant que Rustie 4 5 6 et je peux retourner au secret sans aucun problème.

92
00:09:36,590 --> 00:09:44,210
Et c'est parce que chaque fois que je fais une demande, j'envoie un petit morceau d'information qui dit que c'est Rustie quatre cinq six qui est connecté.

93
00:09:44,210 --> 00:09:48,620
Et puis, dès que je me déconnecte, cette information est partie.

94
00:09:49,120 --> 00:09:57,540
Alors maintenant, quand je vais à slash secret, j'ai une logique qui dit si il n'y a pas d'utilisateur dans la session, alors ne laissez pas cette personne aller à un tel secret.

95
00:09:57,620 --> 00:09:59,370
Rediriger les pour slash logon.

96
00:09:59,670 --> 00:09:59,940
D'ACCORD.

97
00:09:59,960 --> 00:10:09,440
Nous allons donc examiner plus en détail cette question dans la prochaine vidéo lorsque nous créerons cette application simple et que nous mettrons en place des sessions pour obtenir de l'aide sur nos sessions.

98
00:10:09,430 --> 00:10:14,220
Nous allons utiliser un paquet appelé session Express qui apparaîtra dans la prochaine vidéo aussi.

99
00:10:14,750 --> 00:10:16,870
OK, c'est tout ce que je veux présenter pour l'instant.

100
00:10:16,880 --> 00:10:32,970
Donc, nous allons utiliser Passport J comme le schéma local avec le module ou le paquet de mangouste local de passeport qui nous aidera à implémenter l'authentification des utilisateurs assez rapidement et relativement sans douleur et nous allons l'obtenir dans la prochaine vidéo dans un Simple application.

101
00:10:33,080 --> 00:10:38,530
Et puis une fois que nous avons ce travail, nous allons retourner au camp et mettre en œuvre l'authentification des utilisateurs.