Aperçu de WebIDE

L’environnement WebIDE est particulièrement utile pour :

  1. Écrire et déboguer du code dans divers langages de programmation (Java, JavaScript, Python, etc.)
  2. Projets de développement Web avec des capacités d’aperçu en direct, voir Créez votre première page HTML dans WebIDE
  3. Gestion des fichiers et des répertoires de projet via une interface intuitive
  4. Opérations de terminal intégrées pour les tâches en ligne de commande

Disposition de l’environnement

L’interface WebIDE se compose de plusieurs composants clés :

  1. Barre latérale gauche :
    • Explorateur de fichiers pour la navigation dans le projet
    • Fonction de recherche
    • Contrôle de source pour les opérations Git
    • Panneau des extensions
  2. Zone de l’éditeur : Espace de travail de codage principal
  3. Panneau inférieur : Terminal, problèmes et sortie
  4. Barre d’état : Accès rapide aux paramètres et à l’aperçu en direct
  5. Barre de menu supérieure : Fichier, Modifier, Afficher et autres options

Accès au terminal

Vous pouvez ouvrir le terminal de deux manières :

  1. Cliquez sur l’icône dans le coin inférieur gauche et passez à l’onglet Terminal ;
  2. Utilisez le menu supérieur : Terminal > Nouveau terminal

Aperçu HTML

Pour prévisualiser votre fichier HTML :

  1. Dans le WebIDE, cliquez sur le bouton “Go Live” dans le coin inférieur droit.
  2. Un nouvel onglet de navigateur s’ouvrira avec votre page HTML rendue.
  3. Ou, vous pouvez cliquer sur l’onglet “Web 8080” pour ouvrir l’aperçu.
  4. Si votre projet se trouve dans un sous-répertoire, vous pouvez y accéder en cliquant sur le nom du sous-répertoire dans l’explorateur, puis il prévisualisera automatiquement le fichier index.html dans ce répertoire.
  5. Si votre projet contient plusieurs fichiers HTML, y compris index.html, vous pouvez ajouter le nom du fichier à l’URL pour le prévisualiser directement. Par exemple, https://xxx.labex.io/another-file.html.
  6. Vous pouvez ouvrir l’aperçu dans un nouvel onglet en cliquant sur le bouton “Ouvrir dans un nouvel onglet”. Il ouvrira l’aperçu dans un nouvel onglet de navigateur.

“Go Live” va automatiquement :

  • Démarrer un serveur web
  • Fournir des mises à jour en temps réel au fur et à mesure que vous modifiez votre code

Conseils : LabEx VM héberge l’aperçu sur le port 8080. Vous pouvez partager le lien d’aperçu avec d’autres personnes pour présenter votre travail. Une fois votre lab vm arrêté, le lien d’aperçu ne fonctionnera plus.

Scénarios d’utilisation

Questions fréquemment posées