---
title: Conhecendo a IDE
slug: low-code/conhecendo-a-ide
docTags: 
createdAt: 2024-03-04T15:52:39.245Z
---

![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/VsSLNDjKOV8nFI8d0b3SF_.blob)

## Menu Superior

![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/8sD4wzM6oocAtTO__SnoJ_.blob)

### Salvar Tela

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/UZ83O82_hFNwvdsxwsoGz_.blob" size="36" width="220" height="124" position="center" showCaption="false"}

- Para salvar seu trabalho existem duas opções, salvar apenas a tela que está selecionada ou salvar o projeto como um todo.

:::hint{type="warning"}
**Atenção: **Ao salvar o projeto tenha certeza de que não há mudanças não salvas em outras telas realizadas por outra pessoa, caso selecione essa opção pode ocasionar na perda do trabalho desenvolvido 
:::

### Desenho

- Na opção de desenho é onde a tela será construída, onde pode visualizar e editar o que tem na mesma.

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/aWdD--OUfaoevsmDQ6nve_.blob" size="52" width="459" height="893" position="center" showCaption="false"}

Na opção de desenho é onde a tela será construída, onde pode visualizar e editar o que tem na mesma. 

### Visualizar

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/B60w871FtSnN0JKqz-hEa_.blob" size="50" width="449" height="915" position="center" showCaption="false"}

- A opção de visualizar é onde se testa o projeto.

:::hint{type="warning"}
A**tenção:**

Caso haja algum erro, uma tela será exibida com a mensagem: `"Something went wrong"`. Nesse caso, é necessário revisar o código.
:::

### Esquerda

![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/p9LVImwP1DqdOpIXhXaVN_.blob)

- Essa opção serve para esconder ou mostrar a barra lateral esquerda.

### Direita

![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/Gn40XmtAWSjDWNNaaH1hC_.blob)

- Essa opção serve para esconder ou mostrar a barra lateral direita.

### Ajuda

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/_LikMQ3OTB8aLGl73c7wK_.blob" size="14" width="70" height="62" position="center" showCaption="false"}

## Menu Lateral Esquerdo

### Ícones Superiores

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/joI_OnLG4XApIOuL_2Q_u_.blob" size="38" width="189" height="35" position="center" showCaption="false"}

### Telas e Elementos

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/o-B_RnnEUF_tm2aE8rZX1_.blob" size="32" width="191" height="896" position="center" showCaption="false"}

- Essa opção serve para mostrar as telas dos projetos e seus elementos.

### Componentes

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/-P373F84-P3fffyTFQnMt_.blob" size="48" width="190" height="891" position="center" showCaption="false"}

- Essa opção serve para mostrar os componentes.

## Menu Lateral Direito

### Ícones Superiores

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/zXuq2sDW_DZpQ9FRByTml_.blob" size="30" width="182" height="33" position="center" showCaption="false"}

### Propriedades e Estilos

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/YMcjjNfUBjkrJGXOqDjyn_.blob" size="50" width="349" height="895" position="center" showCaption="false"}

Utilizado para mostras as propriedades do elemento/tela, e sua estilização.

### Eventos

::Image[]{src="https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/UNZQRcMcVqggT1j70phjx_.blob" size="46" width="347" height="897" position="center" showCaption="false"}

Utilizado para adicionar o código do elemento ou tela.