How Does the MEAN Stack Work?

- : Sur ce, jetons un coup d'œil à la vue d'ensemble. A quoi ressemble la pile MEAN dans ce cours ou en général, pas seulement dans ce cours ? Nous avons le côté client, et le côté serveur, c'est important. Le côté client est ce que l'utilisateur voit. La page web telle qu'elle s'exécute dans le navigateur. Le côté serveur se trouve sur un serveur que nous déployons, où nous exécutons notre logique commerciale et auquel l'utilisateur n'a qu'un accès indirect. Nous verrons comment cet accès fonctionne dans une seconde. Donc, sur le client, nous utilisons Angular, qui est un framework JavaScript. Nous utilisons donc aussi JavaScript de manière implicite et nous l'utilisons pour construire cette interface utilisateur. Du côté du serveur, nous utilisons Node Express et MongoDB. Node Express pour la logique et MongoDB comme base de données. Comme je l'ai dit, vous ne voulez pas vous y connecter directement depuis Angular. Maintenant, côté client, Angular est responsable de l'interface utilisateur, donc pour la présentation, c'est une application à page unique, comme je l'ai expliqué dans les dernières conférences et cette application à page unique peut être rendue par notre Node Backend. Nous pouvons donc avoir une route, qui renvoie essentiellement cette page HTML unique, mais elle peut aussi être totalement découplée de cette route et être servie à partir d'un hôte totalement différent, un hôte statique comme AWS Free, par exemple. Maintenant, sur l'application nodale, nous avons notre logique métier de base, en particulier la logique qui ne doit pas être exposée au client, pour des raisons de sécurité ou de performance. Nous avons notre stockage de données persistantes, donc cette base de données, et nous y plaçons également notre logique d'authentification, par exemple, elle fait bien sûr partie de notre logique métier. Je veux juste insister sur ce point ici. La logique par laquelle nous décidons si un courriel et un mot de passe sont valides se déroule sur le serveur, car elle peut être facilement manipulée sur le client, mais pas tellement sur le serveur. Comment relier les deux pièces alors ? Eh bien, nous échangeons des demandes et des réponses et ces demandes et réponses sont envoyées en coulisse, ce que l'on appelle des demandes AJAX. Vous en avez peut-être déjà entendu parler, et nous utilisons exactement le même modèle dans Angular. Il s'agit de requêtes qui peuvent être envoyées sans que nous ayons besoin de recharger la page, ce qui est bien sûr exactement ce que nous voulons. Ils se permettent que le type de données que nous échangeons ne soit pas du HTML, car nous ne voulons jamais de code HTML. Nous faisons toute cette logique de présentation et de re-rendu avec Angular. Au lieu de cela, nous obtenons ce que l'on appelle des données JSON. Il s'agit d'un format de données très efficace pour coder des données, comme une liste de messages. Et vous verrez à quoi cela ressemble dans ce cours. C'est la vue d'ensemble, c'est ainsi que fonctionne le MEAN state, et c'est exactement ce que nous allons mettre en œuvre dans ce cours. Avec cela, je dirais qu'il y a assez de mots, commençons à mettre en place l'environnement de développement de base, nous allons travailler dans ce cours et commencer à construire notre application MEAN stack.