L'essentiel de PhpStorm

Comprendre le plug-in LiveEdit

Testez gratuitement nos 1330 formations

pendant 10 jours !

Tester maintenant Afficher tous les abonnements
Le plug-in LiveEdit permet de rafraîchir automatiquement le navigateur lorsqu'un fichier CSS ou JavaScript est modifié.
03:03

Transcription

Nous allons maintenant voir comment installer et utiliser le Plugin LiveEdit. Le plugin LiveEdit permet lorsque vous modifiez un fichier HTML, GS ou JavaScript d’automatiquement recharger votre navigateur. Pour l’instant cette fonctionalité uniqement disponible sous Chrome puisque il faut installer un Plugin sous Chrome. Donc nous allons commencer par installer le plugin sous PHPStorm Donc je vous invite à aller dans les préférences. Donc toujours 'cmd + ;' sous Mac ou 'Ctrl + Alt + s' sous Windows. Ensuite vous allez dans Plugins, vous allez chercher un nouveau Plugin, vous tapez LiveEdit, vous faites installer, vous faites redémarrer PHPStorm et vous redémarrez. Voilà j’ai bien mon plugin qui vient d’être installé. Ensuite vous allez avoir besoin d’ajouter à Chrome l’extension qui permet de faire LiveEdit puisque il faut faire un lien entre le navigateur et votre PHPStorm. Donc là vous faites ajouter à Chrome, ajouter l’extension. Donc là il a bien été ajouté. Ensuite vous retournez sur PHPStorm. Ici je vais reprendre mon fichier « index.html » que j’avais pris tout à l’heure, je vais copier-coller du code pour vous montrer. Donc là automatiquement ça a bien était transféré puisque j’utilise un serveur distant. Donc ensuite si vous voulez commencer à faire la relation entre le ficher « index.html » et votre navigateur, il suffit de sélectionner du fichier et de faire clic droit « Debug » et le nom du ficher. Donc ici vous voyez qu’il me dit que : « Le débogage de ce navigateur est bien effectué par l'extension que nous venons d'installer juste avant » . Donc ici si par exemple je modifie et je mets du texte en plus, j'enregistre, là vous voyez que ça c'est bien affiché ici. Il y a aussi une chose très intéressante, c'est que vous pouvez en fait mettre des points d'arrêts sur du JavaScript. Donc si j'enregistre, ici j'ai bien mon point d'arrêt qui s'est lancé. Vous voyez qu'ici en fait ça continue de tourner. Donc là ça peut être très intéressant si vous utilisez du JavaScript dans vos applications et vous voulez déboguer efficacement votre code de JavaScript. Donc vous pouvez mettre un deuxième point d'arrêt et vous pouvez ici gérer des points d'arrêts et du coup aller d'une étape à une autre etc. etc. Donc là c'est vraiment un outil pour déboguer efficacement du JavaScript. Et ça vous permet aussi lorsque vous changez un fichier d'automatiquement recharger votre navigateur. Donc là si j’enlève mes deux points d'arrêts par exemple ici ça c'est bien affiché. Donc vous voyez que ce plugin est vraiment très bien fait puisque au moins de deux minutes vous pouvez efficacement mettre un système de rafraichissement automatique de votre navigateur.

L'essentiel de PhpStorm

Prenez en main l’environnement de développement PhpStorm et optimisez votre productivité. Découvrez les outils et l’interface, procédez à l’installation, créez des projets, etc.

1h47 (30 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
PhpStorm PhpStorm 2016.2
Spécial abonnés
Date de parution :28 nov. 2016

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 !