​
WebIDE-Vorschau

Die WebIDE-Umgebung ist besonders nützlich für:

  1. Schreiben und Debuggen von Code in verschiedenen Programmiersprachen (Java, JavaScript, Python usw.)
  2. Webentwicklungsprojekte mit Live-Vorschaufunktionen, siehe Erstellen Sie Ihre erste HTML-Seite in WebIDE
  3. Verwalten von Projektdateien und -verzeichnissen über eine intuitive Benutzeroberfläche
  4. Integrierte Terminaloperationen für Befehlszeilenaufgaben

​
Umgebungslayout

Die WebIDE-Oberfläche besteht aus mehreren Schlüsselkomponenten:

  1. Linke Seitenleiste:
    • Dateiexplorer für die Projektnavigation
    • Suchfunktion
    • Quellcodeverwaltung für Git-Operationen
    • Erweiterungsfenster
  2. Editorbereich: Hauptarbeitsbereich für die Codierung
  3. Unteres Bedienfeld: Terminal, Probleme und Ausgabe
  4. Statusleiste: Schneller Zugriff auf Einstellungen und Live-Vorschau
  5. Obere Menüleiste: Datei, Bearbeiten, Ansicht und andere Optionen

​
Terminalzugriff

Sie können das Terminal auf zwei Arten öffnen:

  1. Klicken Sie auf das -Symbol in der linken unteren Ecke und wechseln Sie zur Registerkarte “Terminal”.
  2. Verwenden Sie das obere Menü: Terminal > Neues Terminal

​
HTML-Vorschau

So zeigen Sie Ihre HTML-Datei in der Vorschau an:

  1. Klicken Sie in der WebIDE auf die Schaltfläche “Go Live” in der unteren rechten Ecke.
  2. Eine neue Browser-Registerkarte wird mit Ihrer gerenderten HTML-Seite geöffnet.
  3. Oder Sie können auf die Registerkarte “Web 8080” klicken, um die Vorschau zu öffnen.
  4. Wenn sich Ihr Projekt in einem Unterverzeichnis befindet, können Sie darauf zugreifen, indem Sie auf den Namen des Unterverzeichnisses im Explorer klicken. Dann wird automatisch die Datei index.html in diesem Verzeichnis in der Vorschau angezeigt.
  5. Wenn Ihr Projekt mehrere HTML-Dateien hat, einschließlich index.html, können Sie den Dateinamen an die URL anhängen, um ihn direkt in der Vorschau anzuzeigen. Zum Beispiel https://xxx.labex.io/another-file.html.
  6. Sie können die Vorschau in einer neuen Registerkarte öffnen, indem Sie auf die Schaltfläche “In neuem Tab öffnen” klicken. Dadurch wird die Vorschau in einer neuen Browser-Registerkarte geöffnet.

“Go Live” wird automatisch:

  • Einen Webserver starten
  • Echtzeit-Updates bereitstellen, wenn Sie Ihren Code ändern

Tipps: LabEx VM hostet die Vorschau auf Port 8080. Sie können den Vorschaulink mit anderen teilen, um Ihre Arbeit zu präsentieren. Nachdem Ihre Lab-VM gestoppt wurde, funktioniert der Vorschaulink nicht mehr.

​
Nutzungsszenarien

​
Häufig gestellte Fragen