> ## Documentation Index
> Fetch the complete documentation index at: https://support.labex.io/llms.txt
> Use this file to discover all available pages before exploring further.
# Interface WebIDE da VM LabEx
> O WebIDE LabEx fornece um ambiente de desenvolvimento moderno, semelhante ao VS Code, para tarefas de codificação. Construído no Ubuntu 22.04, ele oferece uma interface familiar para escrever, compilar e executar código em várias linguagens de programação.
## Visualização do WebIDE
O ambiente WebIDE é particularmente útil para:
1. Escrever e depurar código em várias linguagens de programação (Java, JavaScript, Python, etc.)
2. Projetos de desenvolvimento web com recursos de visualização ao vivo, consulte [Crie Sua Primeira Página HTML no WebIDE
](https://labex.io/tutorials/html-create-your-first-html-page-in-webide-451041)
3. Gerenciar arquivos e diretórios de projetos por meio de uma interface intuitiva
4. Operações de terminal integradas para tarefas de linha de comando
## Layout do Ambiente
A interface WebIDE consiste em vários componentes principais:
1. Barra Lateral Esquerda:
* Explorador de arquivos para navegação no projeto
* Funcionalidade de pesquisa
* Controle de origem para operações Git
* Painel de extensões
2. Área do Editor: Principal espaço de trabalho de codificação
3. Painel Inferior: Terminal, problemas e saída
4. Barra de Status: Acesso rápido às configurações e visualização ao vivo
5. Barra de Menu Superior: Arquivo, Editar, Exibir e outras opções
## Acesso ao Terminal
Você pode abrir o terminal de duas maneiras:
1. Clique no ícone no canto inferior esquerdo e mude para a aba Terminal;
2. Use o menu superior: Terminal > Novo Terminal
## Visualizar HTML
Para visualizar seu arquivo HTML:
1. No WebIDE, clique no botão "Go Live" no canto inferior direito.
2. Uma nova aba do navegador será aberta com sua página HTML renderizada.
3. Ou, você pode clicar na aba "Web 8080" para abrir a visualização.
4. Se seu projeto estiver em um subdiretório, você pode acessá-lo clicando no nome do subdiretório no explorador, então ele visualizará automaticamente o arquivo `index.html` nesse diretório.
5. Se seu projeto tiver vários arquivos HTML, incluindo `index.html`, você pode anexar o nome do arquivo à URL para visualizá-lo diretamente. Por exemplo, `https://xxx.labex.io/another-file.html`.
6. Você pode abrir a visualização em uma nova aba clicando no botão "Abrir em Nova Aba". Ele abrirá a visualização em uma nova aba do navegador.
"Go Live" irá automaticamente:
* Iniciar um servidor web
* Fornecer atualizações em tempo real conforme você modifica seu código
> Dicas: A VM LabEx hospeda a visualização na porta 8080. Você pode compartilhar o link da visualização com outras pessoas para mostrar seu trabalho. Depois que sua VM do laboratório for interrompida, o link da visualização não funcionará mais.
## Cenários de Uso
Este é um laboratório Java de exemplo que demonstra como escrever, compilar e
executar um programa Java simples usando o WebIDE LabEx.
Trabalhando com projetos Java no WebIDE:
1. Crie um novo arquivo Java via o explorador
2. Escreva seu código Java com destaque de sintaxe
3. Compile e execute no terminal:
```bash theme={null}
javac MyClass.java
java MyClass
```
4. Visualize erros de compilação e avisos em tempo real
Este é um laboratório HTML de exemplo que demonstra como criar uma página web
simples usando o WebIDE LabEx.
Para tarefas de desenvolvimento frontend:
1. Crie arquivos HTML, CSS e JavaScript
2. Clique no botão "Go Live" no canto inferior direito
3. Acesse sua página web através de:
* Aba Web 8080 no topo da VM LabEx
* Crie novas abas de visualização de porta usando o botão +
Observação: Seu projeto é implantado automaticamente em uma URL pública no servidor LabEx, tornando-o acessível através das abas Web.
Este é um desafio Python de exemplo que demonstra como processar nomes de
astronautas usando o WebIDE LabEx.
Para programação Python:
1. Crie um arquivo Python no explorador
2. Escreva seu código Python com:
* Destaque de sintaxe
* Conclusão de código
* Detecção de erros
3. Execute seu script no terminal:
```bash theme={null}
python3 script.py
```
4. Use o depurador integrado para execução passo a passo
## Perguntas Frequentes
A VM LabEx implanta automaticamente seus projetos web:
1. Porta padrão 8080:
* Clique na aba "Web 8080" no topo da VM LabEx
* Sua aplicação estará acessível através de uma URL pública
2. Portas personalizadas:
* Clique no botão + para criar novas abas de visualização de porta
* Cada porta recebe sua própria URL pública
* Útil para executar vários serviços (por exemplo, frontend e backend)
Observação: Ao contrário do desenvolvimento local, você não acessa o localhost diretamente, pois o LabEx é executado na nuvem.
Atalhos comuns no WebIDE:
* **Operações de Arquivo**
* Novo Arquivo: Ctrl+N
* Salvar: Ctrl+S
* Encontrar: Ctrl+F
* Substituir: Ctrl+H
* **Controles do Painel**
* Alternar Barra Lateral: Ctrl+B
* Alternar Terminal: Ctrl+\`
* Paleta de Comandos: Ctrl+Shift+P
* **Recursos do Editor**
* Multi-cursor: Alt+Clique
* Selecionar Todas as Ocorrências: Ctrl+Shift+L
* Formatar Documento: Shift+Alt+F
Sim, você pode instalar ferramentas adicionais usando o gerenciador de pacotes do Ubuntu:
```bash theme={null}
sudo apt update
sudo apt install package-name
```
Para gerenciadores de pacotes específicos da linguagem:
* Node.js/npm:
```bash theme={null}
npm install package-name
```
* Python/pip:
```bash theme={null}
pip install package-name
```
Lembre-se que as instalações são temporárias e serão redefinidas quando sua sessão terminar.
O WebIDE oferece várias maneiras de gerenciar arquivos:
1. **Upload de Arquivos:**
* Arraste e solte arquivos no explorador
* Use o upload/download após clicar com o botão direito no explorador
2. **Download de Arquivos:**
* Clique com o botão direito no arquivo no explorador
* Selecione "Download"
3. **Copiar/Colar:**
* O conteúdo do texto pode ser copiado diretamente entre sua máquina local e o WebIDE
* Arquivos binários devem usar os recursos de upload/download
Lembre-se que todos os arquivos são temporários e serão perdidos quando sua sessão terminar.