7 files changed, 629 insertions, 0 deletions
diff --git a/files/fr/outils/webide/diagnostic/index.html b/files/fr/outils/webide/diagnostic/index.html
new file mode 100644
index 0000000000..cb21658ec2
--- /dev/null
+++ b/files/fr/outils/webide/diagnostic/index.html
@@ -0,0 +1,165 @@
+---
+title: WebIDE diagnostic de connexion
+slug: Outils/WebIDE/Diagnostic
+translation_of: Archive/WebIDE/Troubleshooting
+---
+<p>{{ToolsSidebar}}</p>
+
+<h2 id="Se_connecter_à_Firefox_pour_Android_via_USB">Se connecter à Firefox pour Android via USB</h2>
+
+<p>Si vous essayez de vous connecter à une instance de Firefox tournant sous Android que l'instance ne s'affiche pas, voici quelques manipulations que vous pouvez essayer :</p>
+
+<ul>
+ <li>
+  <p>Vérifiez votre version de Firefox : <strong>l'appareil doit avoir Firefox 36 ou plus</strong>. WebIDE ne détectera pas les versions plus anciennes automatiquement, vous avez donc besoin d'activer le suivi de port et de vous connecter au port de l'appareil. Pour cela, suivez les instructions du guide disponible <a class="external external-icon" href="/fr/docs/Tools/Remote_Debugging/Firefox_for_Android">ici</a>.</p>
+ </li>
+ <li>
+  <p>Vérifiez que vous avez activé le débogage distant dans Firefox : ouvrez Firefox pour Android, ouvrez son menu, sélectionnez <code>Paramètres</code>, et cochez la case a cocher située dans <code>Avancé &gt; débogage distant via USB</code>.</p>
+ </li>
+ <li>
+  <p>Vérifiez que le débogage USB est autorisé dans les options de développement de l'appareil.</p>
+ </li>
+ <li>
+  <p>Si vous ne voyez toujours pas votre appareil dans la fenêtre de WebIDE, essayez d'activer/désactiver le débogage distant sur le téléphone :</p>
+
+  <ul>
+   <li>
+    <p>Déconnectez votre appareil et désactivez le débogage distant sur votre téléphone.</p>
+   </li>
+   <li>
+    <p>Reconnectez l'appareil et activez le débogage distant. Cela relance l'instance de débogage du téléphone.</p>
+   </li>
+   <li>
+    <p>Essayez de nouveau de vous connecter avec WebIDE.</p>
+   </li>
+  </ul>
+ </li>
+ <li>
+  <p>Vérifiez le câble USB que vous utilisez :</p>
+
+  <ul>
+   <li>
+    <p> Essayez de débrancher puis de rebrancher votre câble USB.</p>
+   </li>
+   <li>
+    <p>Essayez de brancher votre câble USB sur un autre port USB.</p>
+   </li>
+   <li>
+    <p>Essayez avec un autre câble USB. Les câbles fournis avec les téléphones on tendance à se détériorer rapidement.</p>
+   </li>
+   <li>
+    <p>Essayez avec un câble USB plus court, Il arrive que les câbles USB longs posent des problèmes.</p>
+   </li>
+  </ul>
+ </li>
+ <li>
+  <p>Si vous utilisez Linux :</p>
+
+  <ul>
+   <li>
+    <p>Assurez vous d'avoir ajouté un fichier de règles  <code>udev</code> , comme documenté dans la troisième étape de ce guide pour <a class="external external-icon" href="http://developer.android.com/tools/device.html#setting-up">configurer un appareil Android</a>. <code>l'attribut idVendor</code> à utiliser pour le Geeksphone est "05c6", et <a class="external external-icon" href="http://developer.android.com/tools/device.html#VendorIds">cette page</a> liste les autres valeurs de l'attribut <code>idVendor</code>. Ensuite lancez la commande <code>adb devices</code> afin d'être sûr que votre appareil est bien dans la liste. Si l'appareil apparait en tant que  "no permission", vous avez besoin de redémarrer adb server (e.g. <code>adb kill-server;adb start-server</code>).</p>
+   </li>
+   <li>
+    <p>Si vous utilisez le package <code>android-tools-adb</code> de Debian, ADB Helper force peut être tout serveur ADB existant à se fermer. Ce package désactive les connections TCP au serveur, ce dont ADB Helper a besoin.</p>
+   </li>
+  </ul>
+ </li>
+ <li>
+  <p>Si vous utilisez Mac OS X :</p>
+
+  <ul>
+   <li>
+    <p>Si vous êtes un utilisateur de EasyTether, vous avez besoin de désinstaller ou de désactiver EasyTether : <code>sudo kextunload /System/Library/Extensions/EasyTetherUSBEthernet.kext</code></p>
+   </li>
+  </ul>
+ </li>
+ <li>
+  <p>Si vous utilisez Windows, vérifiez que votre appareil Android est correctement reconnu qu'il utilise le driver Google USB Driver qui est inclus dans le SDK Android.</p>
+ </li>
+</ul>
+
+<h2 id="Connecter_Firefox_pour_Android_via_Wi-Fi">Connecter Firefox pour Android via Wi-Fi</h2>
+
+<ul>
+ <li>
+  <p>Vérifiez vos versions de Firefox : Le débogage Wi-Fi nécessite Firefox 42 ou plus, et Firefox pour Android 42 ou plus sur le téléphone.</p>
+ </li>
+ <li>
+  <p>Les deux versions de Firefox (Android et ordinateur) doivent être connectés au même réseau Wi-Fi.</p>
+
+  <ul>
+   <li>
+    <p>De plus, l'ordinateur ne peut <strong>pas </strong>utiliser une connexion filaire qui redirige vers le réseau Wi-Fi. Les deux Firefox doivent être réellement connectés au Wi-Fi.</p>
+   </li>
+  </ul>
+ </li>
+ <li>
+  <p>Vérifiez que vous avez une application de scan de code barres. Nous recommandons <a href="https://play.google.com/store/apps/details?id=com.google.zxing.client.android">celle-ci</a>.</p>
+ </li>
+ <li>
+  <p>Certains réseaux Wi-Fi peuvent bloquer les paquets utilisés pour la découverte d'appareils réseau. Vérifiez avec votre administrateur réseau que ces actions sont autorisées :</p>
+
+  <ul>
+   <li>
+    <p>L'ordinateur et l'appareil Android doivent pouvoir envoyer des paquets UDP multicast sur les ports 50624-50625 à l'adresse multicast 224.0.0.115</p>
+   </li>
+   <li>
+    <p>Le modem réseau doit supporter les paquets UDP multicast</p>
+   </li>
+   <li>
+    <p>Les modems ne retransmettent pas ces paquets UDP multicast, il est donc nécessaire que les deux appareils communiquent directement avec le modem sans aucune bidouille entre.</p>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Impossible_de_charger_la_liste_des_projets">Impossible de charger la liste des projets</h2>
+
+<p>Si vous ouvrez WebIDE dans une version de Firefox puis passez à une version antérieure de Firefox avec le même profil, il est possible que vous ayez l'erreur  "Unable to load project list" en ouvrant WebIDE dans la version antérieure de Firefox.</p>
+
+<p>Cela peut se produire quand le système de stockage que WebIDE utilise (<a href="/fr/docs/Web/API/IndexedDB_API">IndexedDB</a>) a besoin de déplacer ou restructurer ses fichiers internes pour une version de Firefox plus récente. La liste du projet devient alors inaccessible à la version antérieure de Firefox.</p>
+
+<p>Aucune donnée n'a été perdue, mais vous devez cependant continuez d'utiliser la version récente de Firefox qui a été utilisée avec votre profil pour avoir la liste.</p>
+
+<p>Si vous voulez vraiment utiliser la version antérieure de Firefox, vous pouvez essayez de supprimer uniquement la liste de la façon décrite ci-dessous mais cette façon n'est pas recommandée et il peut en résulter des problèmes additionnels de pertes de données :</p>
+
+<ol>
+ <li>
+  <p>Fermer Firefox</p>
+ </li>
+ <li>
+  <p>Trouver le dossier contenant votre profil Firefox</p>
+ </li>
+ <li>
+  <p>Trouver le dossier <code>storage</code> à l'intérieur du dossier du profil.</p>
+ </li>
+ <li>
+  <p>Dans une partie de cet arbre de fichiers, il devrait y avoir des fichiers et/ou des dossiers qui commencent par <code>4268914080AsptpcPerjo</code> (un nom haché de la base de données)</p>
+ </li>
+ <li>
+  <p>Supprimer les fichiers/dossiers sus-mentionnés</p>
+ </li>
+ <li>
+  <p>Relancer Firefox et WebIDE</p>
+ </li>
+</ol>
+
+<h2 id="Activer_le_logging">Activer le logging</h2>
+
+<p>Vous pouvez activer les messages verbeux (verbose logging) pour obtenir des diagnostiques :</p>
+
+<ol start="1" style="list-style-type: decimal;">
+ <li>
+  <p>Ourvrez <a class="external external-icon" href="http://kb.mozillazine.org/About:config">about:config</a>, et ajoutez une nouvelle préférence nommée<code> extensions.adbhelper@mozilla.org.sdk.console.logLevel</code>, avec pour valeur de chaine de caractères <code>all</code>, et passez  <code>extensions.adbhelper@mozilla.org.debug</code> à <code>true</code>.</p>
+ </li>
+ <li>
+  <p>Dans le <a class="external external-icon" href="/fr/kb/disable-or-remove-add-ons">Manageur des modules complémentaires</a>, désactivez pour réactivez le module complémentaire ADB Helper.</p>
+ </li>
+ <li>
+  <p>Ouvrez la <a href="/fr/docs/Tools/Browser_Console">Console du navigateur </a>et vous verrez que les messages de la console sont préfixés par <code>adb</code>.Si les messages sont du chinois pour vous, <a href="/fr/docs/Tools/WebIDE/Troubleshooting#Get_help">demandez de l'aide</a>.</p>
+ </li>
+</ol>
+
+<h2 id="Obtenir_de_l'aide">Obtenir de l'aide</h2>
+
+<p>Allez dans la salle <a class="external external-icon" href="https://wiki.mozilla.org/DevTools/GetInvolved#Communication">#devtools sur IRC </a> et nous essayerons de vous aider.</p>
diff --git a/files/fr/outils/webide/index.html b/files/fr/outils/webide/index.html
new file mode 100644
index 0000000000..e16ada5740
--- /dev/null
+++ b/files/fr/outils/webide/index.html
@@ -0,0 +1,40 @@
+---
+title: WebIDE
+slug: Outils/WebIDE
+tags:
+  - Apps
+  - Debugging
+  - Firefox OS
+  - Tools
+  - WebIDE
+translation_of: Archive/WebIDE
+---
+<div>{{ToolsSidebar}}</div>
+
+<div class="summary">
+<p>WebIDE permet de connecter les outils de <a href="/fr/docs/Tools">développement de Firefox</a> à certains navigateurs, par exemple Firefox pour Android. Voir la page sur le <a href="/fr/docs/Tools/Remote_Debugging">Débogage distant </a>pour obtenir les instructions sur comment se connecter à un navigateur spécifique.</p>
+</div>
+
+<p>Avec WebIDE, il est possible de <a href="/fr/docs/Tools/WebIDE/Setting_up_runtimes">configurer un ou plusieurs environnements</a>. Un environnement sert à lancer et déboguer une application. Un environnement peut être un appareil Firefox OS connecté à un ordinateur par USB (ou par Wi-Fi depuis Firefox 39), ou bien un Simulateur Firefox OS installé sur l'ordinateur même.</p>
+
+<p>Il est également possible de <a href="/fr/docs/Tools/WebIDE/Creating_and_editing_apps">créer une application, ou d'ouvrir une application existante</a>. Lors de la création d'une nouvelle application, il est possible de partir d'un modèle basique qui inclut la structure des dossiers et un minimum de code pour commencer dans de bonnes conditions. Il existe également des modèles plus complexes qui montrent le fonctionnement des API privilégiés. WebIDE affiche les fichiers d'une application sous forme d'arbre et, vous pouvez éditer et sauvegarder ces fichiers en utilisant l'éditeur de texte inclut (<a href="http://codemirror.net/" title="http://codemirror.net/">CodeMiror</a>). Bien entendu, vous n'êtes pas obligé d'utiliser l'éditeur fournit, vous pouvez très bien développer votre application dans votre éditeur préféré en dehors de WebIDE, et utiliser celui-ci uniquement pour le débug.</p>
+
+<p>Enfin, il est possible <a href="/fr/docs/Tools/WebIDE/Running_and_debugging_apps">d'installer une application dans un des environnements et de la lancer</a>. Il est alors possible d'utiliser les outils de développement classiques (<a href="/fr/docs/Tools/Page_Inspector">l'Inspecteur</a>, <a href="/fr/docs/Tools/Web_Console">la Console Web</a>, <a href="/fr/docs/Tools/Debugger">le Débogueur</a> etc...) pour examiner et modifier l'application lancée.</p>
+
+<hr>
+<dl>
+ <dt><a href="/fr/docs/Tools/WebIDE/Opening_WebIDE">Ouvrir WebIDE</a></dt>
+ <dd>Comment ouvrir WebIDE depuis Firefox.</dd>
+ <dt><a href="/fr/docs/Tools/WebIDE/Setting_up_runtimes">Créer et configurer des environnements</a></dt>
+ <dd>Comment se connecter à un environnement dans lequel il est possible d'installer des applications. Dans les environnements on trouve : les appareils Firefox OS, Le Simulateur Firefox OS et Firefox pour Android.</dd>
+ <dt><a href="/fr/docs/Tools/WebIDE/Creating_and_editing_apps">Créer et éditer des applications</a></dt>
+ <dd>Comment créer, ouvrir et développer des applications en utilisant WebIDE.</dd>
+ <dt><a href="/fr/docs/Tools/WebIDE/Running_and_debugging_apps">Le menu environement</a></dt>
+ <dd>Une fois qu'un environement, il est possible d'utiliser ces informations pour obtenir des informations sur sur l'envrionement et ses applications, modifier des paramètres, et prendre une capture d'écran.</dd>
+ <dt><a href="/fr/docs/Tools/WebIDE/Running_and_debugging_apps">Lancer et déboguer des applications</a></dt>
+ <dd>Comment installer des applications dans un environnement et les déboguer en utilisant les outils de développement de Firefox.</dd>
+ <dt><a href="/fr/docs/Tools/WebIDE/Working_with_Cordova_apps_in_WebIDE">Travailler avec des applications Cordova dans WebIDE</a></dt>
+ <dd>Depuis Firefox 39, il est possible d'éditer et de déboguer des applications Cordova en utilisant WebIDE.</dd>
+ <dt><a href="/fr/docs/Tools/WebIDE/Troubleshooting">Dépannage</a></dt>
+ <dd>Aide pour les problèmes avec WebIDE, notamment les problèmes de connection aux environnements.</dd>
+</dl>
diff --git a/files/fr/outils/webide/mise_en_place_des_environnements/index.html b/files/fr/outils/webide/mise_en_place_des_environnements/index.html
new file mode 100644
index 0000000000..1777202efb
--- /dev/null
+++ b/files/fr/outils/webide/mise_en_place_des_environnements/index.html
@@ -0,0 +1,131 @@
+---
+title: Mise en place des environnements
+slug: Outils/WebIDE/Mise_en_place_des_environnements
+translation_of: Archive/WebIDE/Setting_up_runtimes
+---
+<div>{{ToolsSidebar}}</div><p>Un environnement vous permet d'exécuter et de déboguer des applications. Un environnement peut être :</p>
+
+<ul>
+ <li>Une autre instance de Firefox (Bureau ou Android).</li>
+ <li>Un appareil ou un simulateur Firefox OS.</li>
+ <li>Un autre navigateur (Google Chrome ou Safari par exemple), sur ordinateur ou téléphone.</li>
+</ul>
+
+<p>Dans WebIDE, le panneau latéral permet de gérer les environnements :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12149/webide-right-sidebar.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;"></p>
+
+<p>Dans ce panneau, les environnements sont groupés en quatre types :</p>
+
+<dl>
+ <dt><a href="#usb">PÉRIPHÉRIQUES USB</a></dt>
+ <dd>Les périphériques Firefox OS connectés via USB. À partir de Firefox 36, cela permet aussi de se connecter à <a href="/fr/docs/Outils/Débogage_distant/Debugging_Firefox_for_Android_with_WebIDE">Firefox pour Android via USB</a>.</dd>
+ <dt><a href="#wifi">PÉRIPHÉRIQUES WI-FI</a></dt>
+ <dd>Les périphériques Firefox OS connectés en Wi-Fi. <em>À partir de Firefox 39.</em></dd>
+ <dt><a href="#simu">SIMULATEURS</a></dt>
+ <dd>Les instances de simulateur Firefox OS que vous avez installé.</dd>
+ <dt><a href="#autres">AUTRES</a></dt>
+ <dd>Des environnements distants qui peuvent se connecter à WebIDE à partir d'un hôte et port arbitraire. Si vous avez l'extension <a href="/fr/docs/Outils/Firefox_Tools_Adapter">Valence</a> installée, cette section listera aussi les <a href="#valence">environnements additionnels activés.</a></dd>
+</dl>
+
+<p>Le reste de cette section décrit comment ajouter des environnements.</p>
+
+<h2 id="Connecter_un_périphérique_Firefox_OS">Connecter un périphérique Firefox OS</h2>
+
+<p>Si vous possédez une version assez récente de Firefox et de Firefox OS, vous pouvez <a href="#wifi">connecter le périphérique Firefox OS en Wi-Fi</a>. Sinon, vous pouvez vous connecter en USB.</p>
+
+<ul>
+ <li id="Connecting_over_USB"><a href="/fr/docs/Tools/Remote_Debugging/Debugging_Firefox_OS_over_USB">Comment se connecter via USB</a></li>
+ <li><a href="/fr/docs/Tools/Remote_Debugging/Debugging_Firefox_OS_over_Wifi">Comment se connecter via WiFi</a></li>
+</ul>
+
+<h2 id="Se_connecter_à_Firefox_pour_Android">Se connecter à Firefox pour Android</h2>
+
+<p>Les appareils Android, connectés par USB et qui utilisent Firefox pour Android apparaissent comme environnements sous « Périphériques USB ».  Depuis Firefox 42, il est possible de connecter Firefox Android via WiFi.</p>
+
+<ul>
+ <li id="Connecting_over_USB"><a href="/fr/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_with_WebIDE">Comment se connecter via USB</a></li>
+ <li><a href="/fr/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_over_Wifi">Comment se connecter via WiFi</a></li>
+</ul>
+
+<h2 id="Ajouter_un_simulateur"><a id="simu" name="simu">Ajouter un simulateur</a></h2>
+
+<p>Le <a href="/fr/docs/Outils/Simulateur_Firefox_OS">simulateur Firefox OS</a> est une version des couches supérieures de Firefox OS qui simule un appareil Firefox OS mais qui fonctionne sur un ordinateur de bureau. Il est lancé dans une fenêtre de la même taille qu'un appareil Firefox OS et contient les éléments d'interface utilisateur et les applications natives. Il permet également de simuler certaines API utilisées par les appareils Firefox OS.</p>
+
+<p>Cela signifie que, dans la plupart des cas, il n'est pas nécessaire d'avoir un appareil physique pour déboguer une application.</p>
+
+<p>Le simulateur ne fait pas partie intégrante de Firefox mais peut être téléchargé comme <a href="/fr/Modules_complémentaires">module complémentaire</a>. Si vous cliquez sur « Installer le simulateur » dans la liste déroulante pour les environnements, vous serez envoyés vers une page qui vous permet d'installer les simulateurs correspondants aux différentes versions de Firefox OS.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12151/webide-extra-components.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;"></p>
+
+<p>Vous pouvez installer autant de simulateurs que vous le souhaitez. Cependant, il faudra parfois être armé de patience car le téléchargement peut durer quelques minutes.</p>
+
+<div class="note">
+<p>Attention, pour lancer un simulateur Firefox OS 2.6 ou plus, il faut avoir Firefox 45 ou plus.</p>
+</div>
+
+<p>Une fois que le(s) simulateur(s) est installé, vous pouvez fermer cette fenêtre et les simulateurs apparaîtront dans la liste des environnements disponibles :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12153/webide-installed-simulators.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;"></p>
+
+<p> </p>
+
+<p>Pour plus d'informations sur le simulateur, voir <a href="/fr/docs/Outils/Simulateur_Firefox_OS">l'article détaillé sur cet outil</a>.</p>
+
+<h3 id="Configurer_les_simulateurs">Configurer les simulateurs</h3>
+
+<div class="note">
+<p>Nouveau dans Firefox 42</p>
+</div>
+
+<p>Depuis Firefox 42, à côté de chaque simulateur listé dans el panneau latéral, il y a une icône en forme d'engrenage :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11321/webide-settings.png" style="display: block; height: 50px; margin-left: auto; margin-right: auto; width: 364px;"></p>
+
+<p>Cliquer dessus ouvrir un écran permettant de configurer le simulateur :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12155/webide-simulator-options.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;">Il est possible de :</p>
+
+<ul>
+ <li>Le renommer</li>
+ <li>Pointer vers un <a href="https://developer.mozilla.org/en-US/Firefox_OS/Building_the_Firefox_OS_simulator">build Desktop B2G custom</a></li>
+ <li>Pointer vers un profil Gaia custom</li>
+ <li>Simuler un appareil spécifique avec une taille d'écran spécifique.</li>
+</ul>
+
+<h2 id="Autres_environnements"><a id="autres" name="autres">Autres environnements</a></h2>
+
+<h3 id="Environnement_distant"><a id="remote run" name="remote run">Environnement distant</a></h3>
+
+<p>Avec un environnement distant, il est possible d'utiliser un nom d'hôte et un port arbitraires pour se connecter à l'appareil.</p>
+
+<p>En réalité, les appareils Firefox OS et Android se connectent à l'ordinateur grâce à un programme appelé Android Debug Bridge (<a href="http://developer.android.com/tools/help/adb.html">ADB</a>). Par défaut, WebIDE utilise un module complémentaire appelé ADB Helper, cela simplifie le processus d'installation et de redirection des ports pour que l'appareil puisse dialoguer avec l'ordinateur..</p>
+
+<p>Dans la plupart des cas, cette solution est la plus pratique. Cependant, on peut parfois vouloir utiliser ADB en dehors de WebIDE. Par exemple, on peut vouloir utiliser ADB directement depuis la ligne de commandes. Dans ce cas, on connectera l'appareil en définissant un nom et un port et en utilisant la commande <a href="http://developer.android.com/tools/help/adb.html#forwardports"><code>adb forward</code></a> (par exemple <code>adb forward tcp:6000 localfilesystem:/data/local/debugger-socket</code>).<br>
+ <br>
+ Si, ensuite, vous souhaitez connecter WebIDE avec cet appareil, il faut : <a href="https://support.mozilla.org/en-US/kb/disable-or-remove-add-ons#w_how-to-disable-extensions-and-themes">désactiver le module complémentaire ADB Helper</a> et effectuer la connexion WebIDE en utilisant l'option « Environnement distant » puis en saisissant l'hôte et le port utilisés avant avec <code>adb forward</code> (par exemple : <code>localhost:6000</code>).</p>
+
+<p>Avant Firefox 36, ADB Helper ne permettait pas de connecter Firefox pour Android, aussi, si vous souhaitez utiliser WebIDE pour vous connecter à Firefox pour Android, vous aurez besoin de paramétrer une redirection de port et d'utiliser un environnement sur mesure. <a href="/fr/docs/Outils/Débogage_distant/Firefox_for_Android">En savoir plus sur la connexion de Firefox pour Android via ADB avec une version antérieure à Firefox 36</a>.</p>
+
+<h3 id="Environnements_disponibles_avec_Valence"><a id="valence" name="valence">Environnements disponibles avec Valence</a></h3>
+
+<p>Si vous avez installé le module complémentaire <a href="/fr/docs/Outils/Firefox_Tools_Adapter">Valence</a>, vous verrez trois environnements supplémentaires :</p>
+
+<ul>
+ <li>Chrome sur Android</li>
+ <li>Safari sur iOS</li>
+ <li>Chrome Desktop</li>
+</ul>
+
+<p>Pour les instructions relatives à ses environnements, voir les éléments respectifs sur la page sur <a href="/fr/docs/Outils/Débogage_distant">le débogage à distance</a>.</p>
+
+<h2 id="Sélectionner_un_environnement">Sélectionner un environnement</h2>
+
+<p>Une fois que vous avez paramétré un environnement, vous pouvez le sélectionner grâce au menu « Sélectionner l'environnement ».</p>
+
+<ul>
+ <li>Si vous sélectionnez un simulateur, WebIDE démarrera le simulateur</li>
+ <li>Si vous sélectionnez un appareil Firefox OS, WebIDE se connectera à l'appareil. Sur l'appareil, vous aurez une boîte de dialogues pour demander confirmation, validez pour accepter la connexion avec « OK ».</li>
+</ul>
+
+<p>Cliquez sur le bouton « Lancer » au milieu de la barre d'outils de WebIDE, cela permettra d'<a href="/fr/docs/Tools/WebIDE/Running_and_debugging_apps">installer de lancer l'application</a> dans l'environnement sélectionné.</p>
diff --git a/files/fr/outils/webide/monitor/index.html b/files/fr/outils/webide/monitor/index.html
new file mode 100644
index 0000000000..0059e01205
--- /dev/null
+++ b/files/fr/outils/webide/monitor/index.html
@@ -0,0 +1,162 @@
+---
+title: Monitor
+slug: Outils/WebIDE/Monitor
+translation_of: Archive/WebIDE/Monitor
+---
+<div>{{ToolsSidebar}}</div><div class="warning">
+<p><span style="color: #000000;">Le Moniteur WebIDE a été supprimé dans panel Firefox 60+. Ce panneau n'était utilisé que pour feu Firefox OS (puisses-tu reposer en paix).</span></p>
+</div>
+
+<div class="summary">
+<p>Le Moniteur WebIDE est un outil de visualisation de données génériques fait pour aider à vérifier les performances des applications et appareils<a href="/fr/Firefox_OS"> Firefox OS</a>.</p>
+</div>
+
+<p><img alt="The WebIDE Monitor" src="https://thefiletree.com/jan/shots/monitor/monitor.png" style="height: 464px; width: 800px;"></p>
+
+<p>Le Moniteur peut afficher des graphiques interactifs en temps réel.</p>
+
+<h2 id="Graphiques_disponibles">Graphiques disponibles</h2>
+
+<p>Le Moniteur dispose de plusieurs types de graphiques différents, ceux-ci s'affichent dès que le WebIDE est connecté à un runtime Firefox OS.</p>
+
+<h3 id="Unique_Set_Size">Unique Set Size</h3>
+
+<p><img alt="Unique Set Size" src="https://thefiletree.com/jan/shots/monitor/uniquesetsize.png" style="height: 310px; width: 879px;"></p>
+
+<p>Ce graphique affiche l'impact de l'utilisation mémoire de tous les processus Firefox OS. Si vous êtes intéressés par la consommation mémoire d'une application Firefox OS, lancez celle-ci et la mémoire privée utilisée par ses processus sera affiché ici.</p>
+
+<h2 id="Afficher_vos_propres_données">Afficher vos propres données</h2>
+
+<p>Il est relativement simple d'afficher n'importe quel type de données dans le Moniteur, car il accepte des mises à jour peu structurées depuis un grand nombre de sources différentes.</p>
+
+<h3 id="Depuis_un_appareil_Firefox_OS">Depuis un appareil Firefox OS</h3>
+
+<p>Il est possible d'envoyer des données depuis un appareil connecté en envoyant des notifications d'observation (observer notifications).</p>
+
+<p>Note: Si vous voulez faire ceci sur une <a href="https://developer.mozilla.org/Marketplace/Options/Packaged_apps#Certified_app" title="Certified app">application certifiée</a>, suivez <a href="https://developer.mozilla.org/docs/Tools/WebIDE#Debugging_certified_apps" title="Debugging certified apps">ces instructions.</a></p>
+
+<pre><code>Services.obs.notifyObservers(null, 'devtools-monitor-update', data);</code></pre>
+
+<p>Il est passible d'envoyer des données depuis n'importe quel code JS ayant les privilèges chrome. Voici un exemple concret qui mesure le temps d'exécution de code JavaScript :</p>
+
+<h4 id="JavaScript">JavaScript</h4>
+
+<pre class="brush: js">const Services = require('Services');
+
+var start = Date.now();
+// code to benchmark
+var stop = Date.now();
+
+var data = { graph: 'Performance', myFeature: stop-start, time: stop };
+Services.obs.notifyObservers(null, 'devtools-monitor-update', JSON.stringify(data));</pre>
+
+<h4 id="C">C++</h4>
+
+<pre class="brush: cpp">observerService-&gt;NotifyObservers(nullptr, "devtools-monitor-update", data);</pre>
+
+<p>Il est possible d'envoyer des données depuis n'importe ou dans Gecko. Voici un exemple concret mesurant le temps d'exécution d'un code :</p>
+
+<pre class="brush: cpp">#include &lt;time.h&gt;
+#include "nsPrintfCString.h"
+#include "nsIObserverService.h"
+
+clock_t start = clock();
+// code to benchmark
+clock_t stop = clock();
+double time = (double)(stop - start) / (CLOCKS_PER_SEC / 1000);
+
+nsCOMPtr&lt;nsIObserverService&gt; observerService = services::GetObserverService();
+if (observerService) {
+  nsPrintfCString str("{\"graph\":\"Performance\",\"myFeature\":%f}", time);
+  nsAutoString data = NS_ConvertUTF8toUTF16(str);
+  observerService-&gt;NotifyObservers(nullptr, "devtools-monitor-update", data.get());
+}</pre>
+
+<h3 id="Depuis_votre_ordinateur">Depuis votre ordinateur</h3>
+
+<p>Il est facile d'envoyer des données au Moniteur en passant par un serveur WebSockets. Cela peut être utile si vous concevez une extension de Firefox, comme un outil de ligne de commande ou un service web.</p>
+
+<p>Par défaut, le Moniteur écoute les serveurs tournant sur le port 9000 de votre ordinateur. Il est possible de changer ce port en mettant à jour la préférence <code>devtools.webide.monitorWebSocketURL</code>.</p>
+
+<p>Il est même possible de lui faire accepter des données depuis votre réseau local ou depuis n'importe ou sur internet.</p>
+
+<h4 id="Node.js">Node.js</h4>
+
+<pre class="brush: js">TODO</pre>
+
+<h4 id="Python">Python</h4>
+
+<pre class="brush: python">TODO</pre>
+
+<h3 id="Formats_supportés">Formats supportés</h3>
+
+<p>Le Moniteur accepte des données sous la forme d'objets JSON qui ressemblent généralement à ceci :</p>
+
+<pre class="brush: json">{
+  "graph": "myGraph",
+  "curve": "myCurve",
+  "value": 42,
+  "time": 1234567890
+}</pre>
+
+<p>Ce format est fait pour être très flexible. Si un graphique ou une courbe n'est pas défini, elle sera créée automatiquement.</p>
+
+<h4 id="Noms_arbitraires">Noms arbitraires</h4>
+
+<p>Les données non reconnues seront considérées comme un nom de courbe et sa valeur.</p>
+
+<p>Le plus petit paquet de données que vous pouvez envoyer ressemble à ceci :</p>
+
+<pre class="brush: json">{ "myCurve": 42 }</pre>
+
+<p>Cela ajoutera un point de donnée à "myCurve" dans le graph sans nom. Le paramètre <code>time</code> manquant sera automatiquement celui du moment ou le paquet est reçu.</p>
+
+<p>Pour plus de précession, il est recommandé de toujours spécifier un a <code>timestamp</code> pour vos données :</p>
+
+<pre class="brush: json">{
+  "current": 60,
+  "voltage": 500,
+  "time": 1234567890
+}</pre>
+
+<h4 id="Valeurs_Multiples">Valeurs Multiples</h4>
+
+<p>Dans une seule mise à jour, il est possible d'envoyer des données pour plusieurs courbes :</p>
+
+<pre class="brush: json">{
+  "graph": "myGraph",
+  "myCurve1": 50,
+  "myCurve2": 300,
+  "myCurve3": 9000,
+  "time": 1234567890
+}</pre>
+
+<p>Ou plusieurs points pour une même courbe :</p>
+
+<pre class="brush: json">{
+  "graph": "myGraph",
+  "curve": "myCurve",
+  "values": [
+    { "time": 1234567890, "value": 42 },
+    { "time": 1234567981, "value": 51 }
+  ]
+}</pre>
+
+<h4 id="Mises_à_jour_multiples">Mises à jour multiples</h4>
+
+<p>Il est également possible d'envoyer plusieurs mises a jour de données dans un tableau :</p>
+
+<pre class="brush: json">[
+  { "graph": "Memory", "time": 1234567890, "System": 2600, "My App": 1000 },
+  { "graph": "Power", "time": 1234567890, "current": 60, "voltage": 500 }
+]</pre>
+
+<h4 id="Évènements_ponctuels">Évènements ponctuels</h4>
+
+<p>Pour marquer des évènements spéciaux dans un graph avec une barre verticale, il faut ajouter une clé <code>event</code> dans la mise à jour :</p>
+
+<pre class="brush: json">{
+  "graph": "myGraph",
+  "event": "myEvent",
+  "time": 1234567980
+}</pre>
diff --git a/files/fr/outils/webide/opening_webide/index.html b/files/fr/outils/webide/opening_webide/index.html
new file mode 100644
index 0000000000..c73e890c30
--- /dev/null
+++ b/files/fr/outils/webide/opening_webide/index.html
@@ -0,0 +1,32 @@
+---
+title: Ouvrir WebIDE
+slug: Outils/WebIDE/Opening_WebIDE
+tags:
+  - WebIDE
+  - opening
+translation_of: Archive/WebIDE/Opening_WebIDE
+---
+<div>{{ToolsSidebar}}</div><p>Il y a trois moyens d'ouvrir WebIDE :</p>
+
+<ul>
+ <li>Dans le menu "Développement" <em>(qui est un sous menu du menu "Outils" sous OS X)</em>, cliquer sur <em>"</em>WebIDE".</li>
+ <li>Utiliser le raccourci clavier <kbd>Maj</kbd>+<kbd>F8</kbd>.</li>
+ <li>Cliquer sur l’icône dédié à cet outils dans la barre d'outils de Firefox. Cette icône est présente par défaut dans<a href="/fr/Firefox/Developer_Edition"> Firefox Developer Edition</a>. Pour les autres versions de Firefox supérieures à la <a href="/fr/Firefox/Releases/36">version 36</a>, l'icone est présente après avoir ouvert WebIDE pour la première fois :</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/9437/webide-icon.png" style="display: block; margin-left: auto; margin-right: auto; width: 897px;"></p>
+
+<p>Voici à quoi ressemble WebIDE :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12147/webide.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;">La liste déroulante à gauche nommée "Ouvrir une application" permet d'ouvrir des applications existantes ou d'en créer des nouvelles.<br>
+ La liste déroulante sur la droite nommée "Sélectionner l’environnement" permet de sélectionner un environnement ou d'un ajouter un nouveau.</p>
+
+<p>Les boutons au milieu servent (de gauche à droite) à : lancer, arrêter et déboguer l'application. Ils sont activés uniquement lorsqu'une application est ouvert et qu'un environnement est sélectionné.</p>
+
+<p>Il est possible de changer la taille de la police dans WebIDE avec les raccourcis claviers standard (sous OS X, remplacez <kbd>ctrl</kbd> par <kbd>cmd</kbd>):</p>
+
+<ul>
+ <li><kbd>Ctrl</kbd> + <kbd>+</kbd> augmente la taille de la police.</li>
+ <li><kbd>Ctrl</kbd> + <kbd>-</kbd> diminue la taille de la police.</li>
+ <li><kbd>Ctrl</kbd> + <kbd>0</kbd> restaure la taille par défaut de la police.</li>
+</ul>
diff --git a/files/fr/outils/webide/the_runtime_menu/index.html b/files/fr/outils/webide/the_runtime_menu/index.html
new file mode 100644
index 0000000000..5f6067761e
--- /dev/null
+++ b/files/fr/outils/webide/the_runtime_menu/index.html
@@ -0,0 +1,53 @@
+---
+title: Le menu environements
+slug: Outils/WebIDE/The_runtime_menu
+translation_of: Archive/WebIDE/The_runtime_menu
+---
+<div>{{ToolsSidebar}}</div><p>Une fois qu'un environnement est sélectionné, il est possible d'accéder aux options de l'environnement :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12161/webide-runtime-settings.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;">Cela sert à :</p>
+
+<ul>
+ <li><a href="/fr/docs/Tools/WebIDE/The_runtime_menu#Runtime_info">voir les informations sur l'environnement</a></li>
+ <li><a href="/fr/docs/Tools/WebIDE/The_runtime_menu#Permissions_table">voir un tableau des permissions de l'application</a></li>
+ <li><a href="/fr/docs/Tools/WebIDE/The_runtime_menu#Device_preferences">voir et éditer les préférences de l'appareil</a></li>
+ <li><a href="/fr/docs/Tools/WebIDE/The_runtime_menu#Device_settings">voit et éditer les paramètres de l'appareil</a></li>
+ <li><a href="/fr/docs/Tools/WebIDE/The_runtime_menu#Screenshot">prendre une capture d'écran</a></li>
+ <li>déconnecter depuis l'environnement</li>
+</ul>
+
+<h2 id="Informations_de_l'environnement">Informations de l'environnement</h2>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12163/webide-runtime-info.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;"></p>
+
+<h2 id="Tableau_des_permissions">Tableau des permissions</h2>
+
+<p>Un tableau résumant les <a href="/fr/Apps/Build/App_permissions">permissions de l'application</a> pour l'environnement sélectionné, indiquant pour chaque API et chaque <a href="/fr/Marketplace/Options/Packaged_apps#Types_of_packaged_apps"> type d'application</a> laquelle est autorisée (✓), refusée (✗) ou bien si l'avis de l'utilisateur est demandé (!).</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12165/webide-permissions-table.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 1013px;"></p>
+
+<h2 id="Preferences_de_l'appareil">Preferences de l'appareil</h2>
+
+<p>Un tableau listant les préférences qui peuvent être éditées et sont disponibles dans dans l'environnement via le <a href="/fr/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIPrefService">service Preferences</a>. Il s'agit de valeurs de configurations de plateforme qui exposent le même jeu de donée que la page about:config de Firefox, mais pour l'appareil.</p>
+
+<p>Parce que ces préférences sont très sensibles en terme de sécurité, il est nécessaire de désactiver l'option de <a href="/fr/docs/Tools/WebIDE/Running_and_debugging_apps#Unrestricted_app_debugging_(including_certified_apps.2C_main_process.2C_etc.)">restrictions des privilèges des outils de développements</a> avant de pouvoir les modifier.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12167/webide-device-preferences.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 1013px;"></p>
+
+<h2 id="Paramètres_de_l'appareil">Paramètres de l'appareil</h2>
+
+<div class="note">
+<p>Nouveau dans Firefox OS 2.5.</p>
+</div>
+
+<p>Un tableau listant et permettant l'édition des paramètres qui peuvent être contrôlés dans l'application de paramétrage de Firefox OS. La plupart des choses sur l'appareil ont une interface pour changer le paramètre, telles que le volume et l'alarme qui se trouvent dans les paramètres de l'appareil.</p>
+
+<p>Ces paramètres sont moins sensibles et peuvent être modifiés sans avoir besoin de privilèges spéciaux.</p>
+
+<p>Pour pouvoir utiliser cette fonctionnalité, vous devez avoir Firefox 38 ou plus récent, et vous connecter à un Firefox OS 2.5 ou plus récent.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12169/webide-device-settings.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 1013px;"></p>
+
+<h2 id="Screenshot"><strong>Screenshot</strong></h2>
+
+<p>Une commande pour prendre une capture d'écran de l'environnement.</p>
diff --git a/files/fr/outils/webide/working_with_cordova_apps_in_webide/index.html b/files/fr/outils/webide/working_with_cordova_apps_in_webide/index.html
new file mode 100644
index 0000000000..bd444b8959
--- /dev/null
+++ b/files/fr/outils/webide/working_with_cordova_apps_in_webide/index.html
@@ -0,0 +1,46 @@
+---
+title: Travailler avec des applications Cordova dans WebIDE
+slug: Outils/WebIDE/Working_with_Cordova_apps_in_WebIDE
+translation_of: Archive/WebIDE/Working_with_Cordova_apps_in_WebIDE
+---
+<div>{{ToolsSidebar}}</div><div class="geckoVersionNote">
+<p>Nouveau dans Firefox 39.</p>
+</div>
+
+<p><a href="http://cordova.apache.org/">Apache Cordova</a> permet d'écrire des application en utilisant HTML, JavaScript, et CSS, et ensuite de générer des applications natives pour les plate-formes mobiles tels que iOS ou Android. Avec Cordova, <a href="/fr/Apps/Tools_and_frameworks/Cordova_support_for_Firefox_OS">vous pouvez également générer une version de votre application pour Firefox OS.</a></p>
+
+<p>Depuis Firefox 39, WebIDE supporte directement les applications Cordova : Cela signifie que vous pouvez éditer des applications Cordova dans WebIDE, et WebIDE s'occupe de générer la version Firefox OS tout seul.</p>
+
+<p>Pour commencer, il faut créer une application Cordova de façon classique :</p>
+
+<ul>
+ <li>Installer Cordova :
+  <pre class="brush: bash"><code>npm install -g cordova</code></pre>
+ </li>
+</ul>
+
+<ul>
+ <li>Créer une application Cordova :
+  <pre class="brush: bash"><code>cordova create my-app</code></pre>
+ </li>
+</ul>
+
+<ul>
+ <li>Ajouter Firefox OS comme plate-forme cible pour votre application :
+  <pre class="brush: bash">cd my-app
+cordova platform add firefoxos</pre>
+ </li>
+</ul>
+
+<div class="note">
+<p>Sur Windows, il est possible d'ouvrir une invite de commande directement dans un dossier en faisant <kbd>Maj</kbd> + <kbd>clic droit</kbd> sur le dossier voulu puis sélectionner "Ouvrir une fenêtre commandes ici"</p>
+</div>
+
+<p>Il faut ensuite :</p>
+
+<ul>
+ <li><a href="/fr/docs/Tools/WebIDE/Opening_WebIDE">Ouvrir WebIDE.</a></li>
+ <li>Sélectionner <a href="/fr/docs/Tools/WebIDE/Creating_and_editing_apps#Open_a_packaged_app">"Ouvrir une application empaquetée"</a>, puis sélectionner le dossier contenant le fichier <code>config.xml</code> de l'application.</li>
+</ul>
+
+<p>Il est maintenant possible d'éditer l'application en tant qu'application Cordova, et lorsque <a href="/fr/docs/Tools/WebIDE/Running_and_debugging_apps#Running_apps">l'application est lancée</a>, WebIDE se charge tout seul de générer la version Firefox OS. WebIDE régénère également l’application lorsque des changements qui affectent le <a href="/fr/Apps/Build/Manifest">manifeste</a> de l'application, afin de pouvoir effecteur la <a href="/fr/docs/Tools/WebIDE/Creating_and_editing_apps#Manifest_validation">validation de manifeste</a>.</p>