Código

Todo app é código React de verdade, e Code, ao lado de Preview na parte de cima do editor, mostra tudo. Você nunca precisa abri-lo. Ele está lá para quando você quiser ver como algo é feito, apontar para isso ou mudar por conta própria.

O Explorer

À esquerda:

• Search code encontra uma palavra em todos os arquivos.
• Open editors são os arquivos que você abriu, como abas.
• Files é o app inteiro: App.js, as telas e as partes em components, e os dados em lib.
• Images são as imagens que o app usa, com a quantidade delas. Clique em uma para vê-la em tamanho grande: Draw faz marcas em vermelho sobre ela para apontar algo, e Add to chat a envia com a sua próxima mensagem.

O botão no canto superior esquerdo do editor esconde o Explorer, para dar mais espaço.

Aponte o chat para o código

Você não precisa descrever onde as coisas estão.

• Reference file, acima do código, anexa o arquivo inteiro à sua próxima mensagem no chat.
• O + à esquerda de uma linha anexa essa linha. Selecione várias linhas para anexar todas.

Depois disso, uma solicitação curta basta: “isso faz a coisa errada quando a lista está vazia”.

Ache a linha de um elemento

Split view, os dois painéis no canto superior direito, mostra a pré-visualização ao lado do código. Ele está disponível enquanto Code está aberto, em um computador; um celular tem espaço para um painel de cada vez. Ao abri-lo, o chat fica mais estreito para dar lugar, e volta à largura de antes quando você o fecha, então você ainda pode perguntar sobre o que está lendo.

Com Split view ligado, um botão de ponteiro aparece ao lado dele (Click an element to find it in the code). Ligue-o e clicar na pré-visualização deixa de fazer o que o app faria: ele abre o arquivo que cria o elemento, na linha certa. Desligue-o para voltar a usar a pré-visualização normalmente. É o caminho mais rápido de “aquele título” até o código por trás dele, e a linha pode ser anexada à sua próxima mensagem com o + à esquerda dela.

Edite à mão

Em um plano pago, o código é seu para mudar: digite nele, e Auto-save on, na barra do rodapé, significa que ele é salvo conforme você vai escrevendo. A pré-visualização acompanha. Copy code copia o arquivo que você está vendo.

No plano gratuito, o código pode ser lido, pesquisado e apontado, mas não pode ser mudado nem copiado. Upgrade to edit, na mesma barra, avisa isso.