Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

JavaScript : Le débogage et l'analyse de code

Comprendre le projet de test

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Cette formation repose sur un petit projet en jQuery. Vous apprendrez à utiliser les outils directement avec ce projet.
03:18

Transcription

Bien entendu, si on a envie d’améliorer un code source et puis pourquoi pas, d’introduire des bugs pour pouvoir les résoudre il nous faut quand même un projet test. Alors, voilà le projet qu’on va utiliser, c’est une simple application de « TodoList ». Alors voilà, cette « TodoList » elle est simple, qu’est ce qu’elle va faire ? On va avoir un champ dans laquelle on va pouvoir taper quelque chose, par exemple : « Faire les courses ». Je vais faire « Entrée », ça va ajouter ici « Faire les courses » à la liste. Je vais pouvoir voir ceux qui sont faits, actifs, pas faits ou tout. Et puis si je les clique, à ce moment-là je peux aller voir en fait ce qui est fait ce qui n’est pas fait, etc. Donc dans les actifs évidemment, on a ce qui est ici, les faits, ce sont ceux qui ont été faits. Et c’est un truc très, très simple, vraiment une petite application toute basique qui nous permet, eh bien de sauvegarder en plus, quand je vais recharger la page, si je recharge, c’est sauvegardé dans le « Local Storage » Vous voyez qu’ici on a une utilisation du « Local Storage ». Donc vous pouvez aller voir sur l’onglet « Application » dans votre console de développeur. Et dans le « Local Storage » vous verrez qu’effectivement ça vient sauvegarder en fait les éléments de la « TodoList ». Donc c’est un projet très, très simple. Vous allez voir qu’en plus on peut vider on peut rajouter autant qu’on veut. On va en rajouter comme ça : 1, 2 et puis 3. Ça s’ajoute directement à la « TodoList », on peut tout cocher, on peut vider. On peut vraiment travailler avec cette « TodoList » qui est un tout petit projet mais qui va être très utile pour nous puisqu’il nous faut bien un exemple Au niveau du code réellement vous allez voir que ce n’est pas compliqué non plus. On a ici un fichier qui s’appelle « index.html ». Alors ce fichier va utiliser « handlebars » qui est une librairie. On en reparlera un petit peu plus tard pour faire du « templating ». Il n’y a pas grand-chose dans le code-source. Simplement il y a, voilà, une section ici avec le « todoapp », le « header », les « todos », etc. On a ici le « todo-template » qui est la « template » d’un « todo », tout simplement. Vous voyez que c’est à chaque fois en fait, des « text/x-handlebars-template ». Donc c’est vraiment des « templates » que « handlebars » va utiliser. Et puis ensuite on a ici toute la décoration en fait sur le compteur. Ensuite vous avez quelques scripts qui sont ajoutés. Alors voyez qu’il y a quelques scripts qui ont été rajoutés par « node module ». Donc on a « director », on a « handlebars », « jquery » évidemment puisqu’on va utiliser « jquery ». On a « todomvc-app-css », et « todomvc-common » qui sont simplement des bases que l’on va utiliser et insérer. On a juste simplement deux fichiers css au-dessus, donc « base » et l’« index.css ». Donc tout ça se trouve dans les « node_modules » Et puis enfin, on a ici dans « js », un fichier d’application « app.js ». Alors je suis désolé si vous devez le recopier, c’est vrai qu’il est un petit peu horrible. Alors vous inquiétez pas, on va quand même l'améliorer après puisqu’on va avoir des outils qui vont nous permettre de travailler en fait ce script-là. Si vous travaillez à partir des fichiers d’exercice, je vous conseille eh bien de compiler cette partie-là si elle n’est pas compilée. Sinon vous pouvez utiliser directement le projet comme ça, en l’état. Donc si vous avez besoin de le recopier, vous pouvez simplement le faire de votre côté. Vous pouvez faire une petite « todo application », il n’y a pas de problème, c’est quelque chose de très simple. en tout cas l’idée, étant d’avoir un petit projet qu’on peut tester. Vous pouvez partir sur n’importe quel projet aussi pour cette formation. Vous n’êtes pas obligé de vous baser sur mon projet à moi. Vous pouvez refaire cette formation, pourquoi pas, plus tard aussi avec votre projet à vous, pour essayer de suivre les différentes vidéos et faire exactement la même chose que ce qu’on va faire, sachant qu’on va partir d’exemples très basiques à chaque fois. Et on va expliquer à chaque fois quel outil nous permet de faire quoi. Si vous êtes prêt, on peut y aller. On a vu le projet ensemble et on peut commencer.

JavaScript : Le débogage et l'analyse de code

Prenez en main les techniques et les outils pour améliorer votre code JavaScript. Découvrez Bower, js-beautify, la console de Chrome, les tests unitaires et fonctionnels, etc.

1h29 (26 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
Spécial abonnés
Date de parution :3 mars 2017

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !